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

/*@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@font-face {
	font-family: 'Noto Serif Japanese';
	font-style: normal;
	font-weight: 400;
	src: url(/common/font/NotoSerifCJKjp-Regular.woff) format('woff');
}
@font-face {
	font-family: 'Noto Serif Japanese';
	font-style: normal;
	font-weight: 700;
	src: url(/common/font/NotoSerifCJKjp-Bold.woff) format('woff');
}
body * {
	font-family: "Noto Sans JP", sans-serif;
	font-display:swap;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
*/
a{ text-decoration:none; transition:all .3s;}
a:hover{ text-decoration:none; opacity:0.6;}

.secBox > .sectionInner{ max-width:1000px; width:100%; margin:0 auto;}
.commonBtn a{ display:block;}
.bg_dot{
	padding:5em;
	margin:auto;
	background-image:radial-gradient(#005873 10%, transparent 10%);
	background-size:15px 15px;
}
.bg_diagonal{ position:relative;}
.bg_diagonal:before{
	content:"";
    position:absolute;
    width:100%;
    height:100%;
    left:0;
	right:0;
	bottom:0;
	background-color:#ccc;
    background-image:-webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #fff), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #fff),color-stop(.75, #fff), color-stop(.75, transparent),to(transparent));
    -webkit-background-size:7px;
	background-image:linear-gradient( -45deg, #ccc 25%, #fff 25%, #fff 50%, #ccc 50%, #ccc 75%, #fff 75%, #fff);
	background-size:7px 7px;
	background-attachment:fixed;
	z-index:-1;
	opacity:0.4;
}
.spNone{ display:block;}
.pcNone{ display:none;}
@keyframes horizontal{
	0% {transform:rotate(10deg);}
	100% {transform:rotate(-10deg);}
}

/*-----------------------------------------------------------------
header
-----------------------------------------------------------------*/
header{width: 100%;background: #fff;border-bottom: 2px solid;}
#headerAreaInner{ padding:1.5em 0; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end;}
#headerAreaInner h1{ position:relative;}
#headerAreaInner h1 a{ padding:0 1.5em 0 0; border-right:1px solid #999; display:inline-block;}
#headerAreaInner h1 span{ width:9em; text-align:center; font-size:175%; font-weight:bold;   margin:0.3em 0.5em; vertical-align:bottom; display:inline-block; line-height:1em; position:relative;}
#headerAreaInner{ position:sticky; top:0; z-index:999;/* background:#fff !important; *//* box-shadow:0 2px 10px #999; */ padding-bottom:0;}
#headerAreaInner{padding: 1em 0;width: 1000px;}
#headerAreaInner h1{ margin:0;}

#headerNavi{max-width: 479px; width:100%;}
#headerNavi li{width: 31%;}
#headerNavi li:first-child{width: 35%;}
#headerNavi .txtBtn{ font-weight:bold;text-align: center;}
#headerNavi .txtBtnLink{
	display: inline-block;
	text-decoration: none;
	padding:0.5em 0;
	background: #F80026;
	color: #FFF;
	border-bottom: solid 3px #B50400;
	border-radius:7px;
	line-height:1em;
	width: 100%;
}
#headerNavi .txtBtnLink:hover{ background: #FF7122;	border-bottom: solid 3px #BF551A;}
#headerNavi .txtBtnLink:active{
	-ms-transform: translateY(3px);
	-webkit-transform: translateY(3px);
	transform: translateY(3px);			/*下に動く*/
	border-bottom: none;				/*線を消す*/
}
/*-----------------------------------------------------------------
firstView
-----------------------------------------------------------------*/
#firstView{ border-bottom:3px solid #f40026; position:relative;}
#firstView:before{
	content:"";
	opacity:0.5;
	background:url(/lp/imaikeru/images/img_worldmap.png) no-repeat center/100%;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	width:100%;
	height:100%;
	z-index:-1;
}
#firstView{width:100%; margin:0 auto; padding:2em 0;}
#firstView h2{ font-size:3em; text-align:center; position:relative; padding-top:90px; line-height:1.4em; /*color:#f40026;*/}
#firstView h2 span{ font-size:0.5em; font-weight:500; display:block; line-height:1.2em;}
#firstView h2 img{ vertical-align:text-top; margin:0 5px 0 0;}
#firstView h2:before{
	content:"";
	width:80px;
	height:80px;
	position:absolute;
	top:0;
	left:0;
	right:0;
	margin:auto;
	background:url(/common_images/icon_price.png) no-repeat center/cover;
}


/*-----------------------------------------------------------------
パンくずリスト
-----------------------------------------------------------------*/
#breadcList{ border-bottom:1px solid #ccc; padding:0.8em;}
#breadcList ol{ max-width:1000px; width:100%; margin:0 auto;}
#breadcList li{ font-size:75%; position:relative; color:#999; padding:0 1.5em 0 0.5em;}
#breadcList li:first-child{ padding-left:1.5em;}
#breadcList li:first-child:before{
	content:"";
	width:12px;
	height:12px;
	position:absolute;
	left:0;
	margin:auto;
	background:url(/common_images/icon_breadclist_home.png) no-repeat center/cover;
}
#breadcList li:not(:last-child):after{ content:"＞"; position:absolute; top:0; bottom:0; right:0; margin:auto;}
#breadcList li a{ color:#f40026;}


/*-----------------------------------------------------------------
コンテンツ
-----------------------------------------------------------------*/

#estimateSec{ padding:0 0 4em;}
#estimateInpost{ border:15px solid #eee; margin:3em auto;}
#estimateInpost > .textBox{ padding:3em 1em 0;}
#estimateInpost > .textBox p{ text-align:center;}
#estimateInpost > .textBox p strong{ display:block; color:#ED1E79; font-size:137.5%; line-height:1.4em;}

.declarationBox{ background:rgba(255,255,255,0.8); max-width:750px; width:100%; padding:1.5em; border:6px solid #e50012; margin:2em auto;}
.declarationBox dt{ max-width:360px; width:100%; padding:0 10px 0 0; color:#e50012; font-size:125%; text-align:center; border-right:1px solid #e50012;}
.declarationBox dt img{ margin-top:5px;}
.declarationBox dd{ max-width:calc(100% - 420px); width:100%; font-size:112.5%; margin:auto;}
.declarationBox dd strong{ color:#e50012; font-size:150%; line-height:1.4em;}




/* 見積もり選択 */
.selectBox{ max-width:700px; margin:0 auto; padding:1em 2em 2em;}
.selectBox .selectItem{ font-size:150%; border-bottom:1px dashed #ccc; padding:1.5em 0;}
.selectBox .selectItem dt{ font-weight:500; line-height:1em; margin:0 0 0.5em; padding:5px 0 5px 10px; border-left:6px solid #f40026;}
.selectBox .selectItem dt span{ font-size:67.5%; font-weight:normal; color:#666;}
.selectBox .selectItem dd select{ max-width:45%; width:100%; padding:0.5em; font-size:87.5%; border-radius:5px; border:1px solid #aaa; margin:0 1em 0 0; cursor:pointer;}
.selectBox #step01-wh{ display:none;}
.selectBox #step01-wh.active{ display:block;}
.selectBox #step01-wh dt a{ color:#f40026; font-weight:500; margin:0; display:block;}
.selectBox #step01-wh dd .radioBtn{
	width:100%;
	font-size:75%;
	font-weight:500;
	margin:0.5em 1.5em 0.5em 0;
	position:relative;
}
.selectBox #step01-wh dd .radioBtn label{ display:block; background:rgba(244,0,38,0.1); border-radius:50px; line-height:1.2em; padding:1em 1em 1em 2.5em; cursor:pointer;}
.selectBox #step01-wh dd .radioBtn input{ width:1.5em; height:1.5em; position:absolute; top:0; bottom:0; left:1em; margin:auto;}
.selectBox #step01-wh dd .radioBtn input:checked + label{ background-color:#ED1E79; color:#fff;}
.selectBox #step03 dd select{ margin-right:2%;}
.selectBox #step04 dd select{ margin-right:2%;}
.selectBox .selectItem #select_school{ max-width:100%;}
.selectBox #executionBtn{
	max-width:300px;
	width:90%;
	display:block;
	margin:1.5em auto;
	text-align:center;
	font-size:175%;
	padding:0.5em 2em;
	border-radius:100px;
	border:none;
	cursor:pointer;
	background-color:#16B2BE;
	color:#fff;
	box-shadow:0 0 6px #666;
	-webkit-appearance:none;
	transition:opacity .3s;
}
.selectBox #executionBtn:hover{ opacity:0.6;}
/*.selectBox #executionBtn a{ color:#fff; display:block;}*/




/* 見積もり結果表示 */
#resultDisplayBox{}
#resultDisplayBox .boxInner{ display:none; width:100%; margin:0 auto; overflow:hidden; position:relative;}
#resultDisplayBox .boxInner:before{
	content: "";
    position: absolute;
    width: 0;
    height: 0;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    border-width: 40px 60px 0 60px;
    z-index: 1;
}
#resultDisplayBox .boxInner.active{ display:block;}
#resultDisplayBox .boxInner > .bg_diagonal{ padding:4em;}
#resultDisplayBox h3{ font-size:200%; margin:0 0 0.5em; position:relative; padding-left:40px;}
#resultDisplayBox h3:before{
	content:"";
	width:32px;
	height:40px;
	position:absolute;
	left:0;
	margin:auto;
	background:url(/common_images/icon_estimate.png) no-repeat center/cover;
	opacity:0.8;
}
#resultDisplayBox h3 #totalPrice{ font-weight:500; text-align:right; margin:0 0.5em; line-height:1em; display:inline-block; float:right;}
#resultDisplayBox h3 #totalPrice strong{ font-size:150%; margin:0 0 0 10px;}
#resultDisplayBox #estimateResult{ margin:1em auto 0; padding:2em; background-color:#fff; position:relative; -webkit-filter:drop-shadow(0 0 3px rgba(0,0,0,0.6)); border-radius:20px;}
#resultDisplayBox .boxInner > p.tar{ font-size:112.5%; font-weight:500; margin:0;}
#resultDisplayBox #estimateResult .resultBox{ max-width:500px; width:45%; padding:1em;}
#resultDisplayBox #estimateResult .resultBox > ul{ margin:0 0 2em;}
#resultDisplayBox #estimateResult .resultBox > ul > li{ border-bottom:1px solid #ccc; padding:0.5em 0; position:relative;}
#resultDisplayBox #estimateResult .resultBox li.freeItem *{ color:#ED1E79;}
#resultDisplayBox #estimateResult .resultBox li .set_program{ text-align:right;}
#resultDisplayBox #estimateResult .resultBox li .set_price{ font-size:125%; text-align:right;}
#resultDisplayBox #estimateResult #selectedItemBox #estimateBreakdown{ margin-bottom:2em;}
#resultDisplayBox #estimateResult #selectedItemBox dt{ font-size:75%; font-weight:500; margin-top:1.2em;}
#resultDisplayBox #estimateResult #selectedItemBox dd{ margin:0.2em 0 0; padding:0.8em; font-size:87.5%; border-radius:5px;}
#resultDisplayBox #estimateResult #selectedItemBox dd li:not(:last-child){ margin:0 1em 0 0;}
#resultDisplayBox #estimateResult #selectedItemBox dd.attenDd{ padding:0; margin:0.5em 0 0 0.7em; font-size:75%; color:#666;}
#resultDisplayBox #estimateResult #selectedItemBox p{ line-height:1.6em; margin:0;}
#resultDisplayBox #estimateResult #selectedItemBox p strong{ font-weight:normal; margin:1.5em 0; display:block;}
#resultDisplayBox #estimateResult #breakdownItemBox li{ padding-left:1.2em;}
#resultDisplayBox #estimateResult #breakdownItemBox li:before{ content:"■"; color:#999; position:absolute; left:0; font-size:75%;}
#resultDisplayBox #estimateResult #breakdownItemBox li span{ max-width:240px;}
#resultDisplayBox #estimateResult #breakdownItemBox p{ margin:0 0 1em; text-align:right;}
#resultDisplayBox #estimateResult #breakdownItemBox p a:hover{ border-color:#f40026; color:#f40026; opacity:1;}
#resultDisplayBox #estimateBreakdown .includeList{ display:none; background:rgba(255,123,165,0.2);}
#resultDisplayBox #estimateBreakdown .includeList.active{ display:block;}
#resultDisplayBox #estimateBreakdown .not_includeList{ background-color:#ddd;}


/* お問い合わせ誘導 */
#contactList{ /*background-color:#fffae7;*/ padding:3em 2em 2em 2em; text-align:center;}
#contactList p{ text-align:center; margin:0 auto -0.4em auto; font-size:112.5%;}
#contactList p strong{ display:block; color:#ED1E79;}
#contactList p.requestP{ font-size:125%; text-align:center;}
#contactList ul{ margin:0 auto 2em;}
.nextBtn{
	width:100%;
	margin:2em auto 0;
	padding:1.5em 0;
	color:#fff;
	font-size:137.5%;
	display:block;
	border:none;
	background:none;
	background-color:#E63582;
	background-image:url(../images/btn_contents07.png);
	background-size:auto 40%;
	background-position:90% 50%;
	background-repeat:no-repeat;
	border-radius:10px;
	box-shadow:0 0 6px #333;
	cursor:pointer;
	position:relative;
	transition:opacity .3s;
	-webkit-appearance:none;
}
.nextBtn strong{ font-size:150%; font-weight:normal; display:block;}
.nextBtn:before{
	content:"";
	width: calc(100% - 12px);
    height: calc(100% - 12px);
    border: 2px solid #fff;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 7px;
    margin: auto;
	opacity:0.8;
}
.nextBtn:hover{ opacity:0.6;}

/* キャンペーンバナー設置 */
#campaignBox{ margin:3em auto 1em;}
#campaignBox p{ margin:0 auto; font-size:125%; font-weight:500;}
#campaignBox a.spNone img{ width:100%;}


/*-----------------------------------------------------------------
footer
-----------------------------------------------------------------*/
footer{ background-color:#666;}
footer #footerInner{ max-width:1000px; width:100%; margin:0 auto; padding:1em;}
footer #footerInner p{ color:#fff;}