﻿@charset "utf-8";
html,body{height:100%;}
#wrap{
     width:100%;
     position:relative;
     min-height:100%;
}
.m-topx1{margin-top:12px !important;}
.m-topx2{margin-top:24px !important;}
.m-topx3{margin-top:36px;}
.u-w100p{width:100%;}
/* ------------------------------------------------ヘッダー */
header{
	width:100%;
	height:80px;
	line-height:80px;
	background:#3c8dbc;
}
#head_wrap{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
	width:1000px;
}
#head_wrap #left_logo{
	background:url(../images/hotbiz8_logo.png) no-repeat;
	display:inline-block;
	vertical-align:middle;
	overflow:hidden;
	box-sizing:border-box;
}
#head_wrap #left_logo a{
	display:block;
	height:52px;
	font-size:0;
	width:351px;
	padding-bottom:0;
}
#right_text{
	color:#fff;
	float:right;
	font-size:22px;
	display:flex;
	align-items:center;
	justify-content:space-between;
}

#right_text p{
	margin-right:2em;
}
	/* start_guide */

#start_guide  a{
	position:relative;
	display:block;
	z-index:1;
	padding:0.8rem 0.6rem 0.7rem 2.1rem;
	background:#60B4BC;
	border-bottom:2px solid #4d626c;
	border-radius:5px;
	color:#fff;
	text-align:center;
	line-height:1.2;
	font-weight:bold;
	text-decoration:none;
	text-shadow:1px 2px 0px #62A1CB;
	transition:background 0.5s, color 0.5s;
	font-size:16px;
}
#start_guide a span{
	font-size:14px;
}

#start_guide a:hover{
	transition:background 0.5s, color 0.5s;
	background:#628DE3;
}

#start_guide a::after{
	position:absolute;
	content:'';
	top:50%;
	left:0.3rem;
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	width:24px;
	height:24px;
	background:url(../images/firstguide_link_icon.svg) no-repeat;
	background-size:contain;
}

/* ------------------------------------------------全体 */
#main{
	overflow:hidden;
	margin-left:auto;
	margin-right:auto;
	width:1000px;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	padding-top:20px;
	padding-bottom:65px;
}

/* ------------------------------------------------左メニュー */
.fixed{
    position:fixed;
    top:20px;/*固定させたい位置*/
}

.left_wrap{
	margin-left:15px;
	width:250px;
	float:left;
}
.left_wrap #menu_head{
	background:#4d626c;
	color:#fff;
	padding-top:3px;
	text-indent:8px;
	font-size:15px;
}
.left_wrap ul.menu{
	background:#fff;
	border:1px solid #4d626c;
}

.left_wrap ul.menu li{
	font-size:13px;
}
.left_wrap ul.menu li + li{
	border-top:1px solid #aaa;
}
.left_wrap ul.menu li.category_on{
	background:#ccc;
}

.left_wrap ul.menu li img{
	width:12px;
	vertical-align:middle;
	background:#aaa;
	border:2px solid #aaa;
}

.left_wrap ul.menu li a{
	color:#666;
	display:block;
	height:20px;
	line-height:20px;
	text-indent:8px;
	text-decoration:none;
}
.left_wrap ul.menu li.category_on a{
	color:#000;
}
.left_wrap ul.menu li a:hover{
	background:#A6B0B5;

}
.left_wrap ul.menu li ul li{
	background:#fff;
	border:none;
	border-top:#ddd 1px solid ;
}
.left_wrap ul.menu li ul li a{
	width:248px;
	height:16px;
	line-height:16px;
	text-indent:3em;
	position:relative;
	display:block;
	color:#999;
	font-size:12px;
	text-decoration:none;
}
.left_wrap ul.menu li ul li.li_on{
	background:#ccc;
}
.left_wrap ul.menu li ul li.li_in a{
	color:#444;
	text-indent:4em;
}
.left_wrap ul.menu li ul li.li_in02 a{
	color:#444;
	text-indent:5em;
}

/* ------------------------------------------------右コンテンツ */
.right_wrap{
	margin-right:15px;
	margin-bottom:20px;
	width:700px;
	float:right;
}
.right_wrap h1{
	border-bottom:3px solid #3c8dbc;
	color:#3c8dbc;
	font-size:24px;
	text-indent:5px;
	width:700px;
}

.right_wrap h1 img{
	width:24px;
	vertical-align:top;
	padding:6px 6px 0 0;
}

.right_wrap h2{
	background:#eee;
	margin-top:16px;
	border-left:5px solid #3c8dbc;
	color:#000;
	font-size:18px;
	margin-left:auto;
	margin-right:auto;
	text-indent:5px;
	width:680px;
}

.right_wrap h3{
	background:#eee;
	border-left:5px solid #acc;
	font-weight:bold;
	margin-top:32px;
	font-size:14px;
	color:#444;
	margin-left:auto;
	margin-right:auto;
	text-indent:5px;
	width:680px;
}

.right_wrap p{
	font-size:14px;
	margin-top:12px;
	margin-left:auto;
	margin-right:auto;
}

.right_wrap p img{
	vertical-align:middle;
}

.right_wrap .img_space{
	width:680px;
	margin-top:12px;
	margin-left:auto;
	margin-right:auto;
	padding:5px;
	box-sizing:border-box;
}

.right_wrap .img_space img{
	border:1px solid #000;
	padding:5px;
	box-sizing:border-box;
}

.right_wrap table.list_area{
	margin-left:auto;
	margin-right:auto;
	margin-top:12px;
	padding:2px;
	box-sizing:border-box;
}

span.red{
	color:#f00;
	font-size:12px;
}

span.black{
	color:#303030;
	font-weight:bolder;
}
.center{
	text-align:center;
}
.right{
	text-align:right;
}
.bold{
	font-weight:bold;
}

.attention{
	margin:8px 0 24px;
	padding:8px 12px;
	background:#eee;
	border-radius:4px;
}
.attention p{
	margin:0;
}

.list{
	margin-top:8px;
	font-size:14px;
}
.list_item{
	margin-top:4px;
}
.list-disc .list_item{
	position:relative;
	padding-left:14px;
}
.list-disc .list_item:before{
	content:"";
	display:block;
	position:absolute;
	top:8px;
	left:2px;
	width:6px;
	height:6px;
	background:#333;
	border-radius:50%;
}

/* ------------------------------------------------hotbiz8_help_admin/ */
.right_wrap table.help_list_area{
	border:1px solid #bbb;
	margin-left:auto;
	margin-right:auto;
	margin-top:12px;
	padding:2px;
	box-sizing:border-box;
}

.right_wrap table.help_list_area th{
	border-right:1px solid #aaa;
	border-bottom:1px solid #aaa;
	text-align:left;
	padding:0px 12px;
	background:#dfdfdf;
	font-weight:normal;
	font-size:14px;
	box-sizing:border-box;
	white-space:nowrap;
	vertical-align:middle;
}
.right_wrap table.help_list_area th.image{
	text-align:center;
	vertical-align:middle;
}

.right_wrap table.help_list_area th.image img{
	margin:3px auto;
	vertical-align:middle;
}

.right_wrap table.help_list_area td{
	border-right:1px solid #aaa;
	border-bottom:1px solid #aaa;
	font-size:14px;
	vertical-align:middle;
	box-sizing:border-box;
	padding:2px 6px;
	margin-bottom:2px;
}
.right_wrap table.help_list_area tr{
	border:1px solid #aaa;
	border-top:0px;
	background:#eee;
}

.right_wrap table.help_list_area td.title{
	text-align:left;
}
.right_wrap table.help_list_area th.title{
	text-align:left;
}

td.item_blanc{
	background:#fff;
	height:30px;
	border-left:1px solid #fff;
	border-right:1px solid #fff;
}

th.item_title{
	text-align:center;
	padding:10px 0px;
	font-weight:bold;
}
th.item_title span{
	display:inline-block;
	text-align:left;
}

td.timecard{
	text-align:left;
	background:#dfdfdf;
	white-space:nowrap;
	box-sizing:border-box;
}
td.timecard span{
	display:block;
}

/* ------------------------------------------------home_function_menu */
.right_wrap  table.list_area th.menuicon{
	width:30px;
	height:40px;
	text-align:center;
	background:#313F46;
	box-sizing:border-box;
}

.right_wrap  table.list_area th.menuicon img{
	vertical-align:middle;
	width:32px;
}

/* ------------------------------------------------message_syozai.html */
span.bold{
	font-weight:bold;
}

/* ------------------------------------------------freeaddress */
ul.setting_listmenu{
	display:flex;
	list-style:none;
	padding-left:0;
	text-align:center;
	flex-wrap:wrap;
}
ul.setting_listmenu li{
	margin:0.25em 0.3em;
}
ul.setting_listmenu li a{
	border-radius:3px;
	font-size:14px;
	white-space:nowrap;
	display:block;
	background:#3c8dbc;
	color:#fff;
	padding:0.33em;
	text-decoration:none;
	position:relative;
	padding-right:2em;
}
ul.setting_listmenu li a:hover{
	opacity:0.7;
}

ul.setting_listmenu li a:after{
	content:"";
	position:absolute;
	top:0.72em;
	right:0.25em;
	border-top:12px solid #fff;
	border-left:8px solid transparent;
	border-right:8px solid transparent;
}
.table_dl > dl{
	display:flex;
}
.table_dl > dl dt{
	display:table-cell;
	padding:0.6em 0.35em;
	font-size:14px;
	border-bottom:#fff 2px solid;
}
.table_dl > dl dt.line{
	background:#ddd;
	width:100%;
}
.table_dl > dl dt.line img{
	display:block;
	margin:0 auto;
	border:1px solid #000;
	outline:2px solid #fff;
}
.table_dl > dl dt.ttl{
	text-align:right;
	white-space:nowrap;
}
.table_dl > dl dt.ttl:only-child{
	width:100%;
	margin-top:24px;
	padding:0.6em;
	background:#4d626c;
	border:0;
	border-radius:4px;
	color:#fff;
	text-align:left;
	white-space:normal;
}
.table_dl > dl dt span{
	font-weight:bold;
}
.table_dl > dl hr{
	border-bottom:#fff 2px solid;
}
.table_dl > dl dd{
	padding:0.6em 0.35em;
}

/* ------------------------------------------------パンくず */
#pankuzu{
	margin-top:6px;
	overflow:hidden;
}
#pankuzu ul li{
	font-size:13px;
	float:left;
}
#pankuzu ul li:after{
	content:">";
	margin-left:3px;
	margin-right:3px;
}
#pankuzu ul li:last-child:after{
	content:"";
	margin-right:0;
}
#pankuzu ul li a{
	text-decoration:none;
}

/* ------------------------------------------------フッター */
footer{
	color:#fff;
	font-size:14px;
	width:100%;
	height:45px;
	line-height:45px;
	background:#3c8dbc;
	overflow:hidden;
	text-align:center;
	position:absolute;
	bottom:0;
}

/* ------------------------------------------------btn_top */
#btnTop a img{
    width:50px;
}
