@charset "utf-8";
/* server_consultation CSS Document */

#header {
	width: 100%;
	height: 70px;
	background: #fff;
	position: fixed; /*位置固定*/
	z-index: 999;
	border-bottom: 2px #019bba solid;
	/*top:calc(0% - 0px/2);
    left:calc(50% - 1200px/2);*/
	/*top: 0;
	left: 50%;
	transform: translate(-50%, 0%);*/	
}

#headerInner {
	width: 1100px; height: 50px;
	margin: 0 auto;
	margin-top: 10px;
	margin-bottom: 10px;
	/*padding: 0 50px;*/
}

#headerInner #logo{width: auto; height: 50px; float: left; margin-top: 6px;}
#headerBox{ width: 410px; float: right;}
#headerInq{float: left; padding-right: 6px; line-height: 185%;}
#headerTel{ margin-top: 6px; float: right; line-height: 185%;}

	
#mainImg{
	width: 100%; height: 500px; /*height: 532px*/ padding-top: 50px;
	/*margin-bottom: 20px;*/
	background: url(/lp/server_consultation/images/main_img_bg.png) repeat;
	}
	
h1{
  text-align:center;
  color: white;
  text-shadow:
    -2px -2px 0 #1797aa,
    2px -2px 0 #1797aa,
    -2px 2px 0 #1797aa,
    2px 2px 0 #1797aa;
}

#mainImg h1{position: relative; top: -130px;}

#mainImglist{
	width: 800px; height: auto; margin: 0 auto;
	position: relative; top: -90px; left: 30px; /*left:calc(50% - 800px/2);*/}


#mainImglistw1000{
	width: 1000px; height: auto; margin: 0 auto;
	position: relative; top: -120px; left: 70px;}
	
#mainImglist li,#mainImglistw1000 li{
	width: auto; height: 35px; float: left; 
	font-size: 20px; font-weight: bold; color: #fb4202;
	padding: 3px 28px 0 28px; background: #fff; margin-right: 10px; margin-bottom:10px;}
	

#toplistw1100{
	width: 1100px; height: auto; margin: 0 auto;
	position: relative; top: -30px;}
	
/*アンカー位置調整(ヘッダー分)*/
a.anchor{
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}
a.anchor02{
    display: block;
    padding-top: 90px;
    margin-top: -90px;
}
	
.balloon{
	position: relative; top: -60px;
	display: block;
	}
	
#checkList{ padding: 0px 10px 0 80px; float:left;}
#checkList li{font-size: 24px; font-weight: bold; line-height: 220%; height: 100%; border-bottom:#FFCC33 3px solid; padding-top: 10px;}
ul#checkList li a{ background: url(/lp/server_consultation/images/indent_non.png) no-repeat 0 0;
	padding-left: 50px; display: block;}
ul#checkList li a:hover{ background:url(/lp/server_consultation/images/indent_check_ov.png) no-repeat 0 0;
	padding-left: 50px; display: block;}


/*お問い合わせボタン*/

.inqBox{width: 980px; height: auto; margin: 0 auto; padding-left: 85px; /*margin-bottom: 30px;*/}
.inq_free{ float: left; padding: 0 25px 0 5px;}
.inq_btn{margin-bottom: 20px; float: left;}
.staff{ margin-top: -50px; float: right; padding-right: 30px;}

.troubled_innre{padding: 0px 30px}
.troubled_innre01{padding: 0px 0 0 60px}
.troubled_innre02{padding: 0px 150px}

.h3_tite{font-size: 26px; padding: 0 25px; font-weight:bold; letter-spacing: 0.1em;}
.h3_emphasis{font-size: 40px !important;}

.troubled li{font-size: 20px; font-weight: bold; line-height: 200%; height: 100%;
	background: url(/lp/server_consultation/images/white_face.png) no-repeat 0 5px;
	padding-left: 40px; display: block;}
	
.troubled_blue li{font-size: 20px; font-weight: bold; line-height: 200%; height: 100%;
	background: url(/lp/server_consultation/images/blue_face.png) no-repeat 0 5px;
	padding-left: 40px; display: block;}
	
.troubled_smile li{font-size: 24px; font-weight: bold; line-height: 200%; height: 100%;
	background: url(/lp/server_consultation/images/smile_face.png) no-repeat 0 5px;
	padding-left: 50px; display: block;}

.troubled_leftBox{ float:left; width: 850px; height:auto;}	
	
.troubled_img{padding-left: 50px; margin: 20px 0 20px 0; float:right;}
.troubled_img02{padding-left: 30px; float:right;}
.troubled_img03{padding-right: 50px; float:right;}

/*TOPに戻るボタン*/
html {
    scroll-behavior: smooth;
}
.page_top {
    height: 50px;
    width: 50px;
    position: fixed;
    right: 20px;
    bottom: 90px;
    background: #fff;
    border: solid 2px #1066be;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid #1066be;
    border-right: 3px solid #1066be;
    transform: translateY(20%) rotate(-45deg);
}

/*TOPに戻るボタン マウスオーバーカラー*/
@media (hover: hover) and (pointer: fine) {
    .page_top:hover, .page_top:hover .pagetop__arrow {
        border-color: #fb6a13;
    }
}