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

/*************************************************************************************************************************
* デフォルト：640px以下用の記述
*************************************************************************************************************************/
body{ background: #f1f4f8; }

/* subMain */
.subMain{ padding-bottom: 60px;}
.subMain > div:before{ background: url("/feature/sitejet//img/main_img01.png") no-repeat; background-size: cover; width: 378px; height: 256px; top: 50%; right: 0; transform: translate(0, -50%); }

.subMain .subTxt p{ font-weight: bold;}
.subMain .btn-area{ max-width: 400px; margin-top: 26px; font-family:"Hiragino Sans", sans-serif;}
.subMain .btn-area > span{ display: table; margin: 0 auto 8px; padding: 0 26px; position: relative; font-size: 18px; font-weight: 700; color: #FFFB00;}
.subMain .btn-area > span::before,
.subMain .btn-area > span::after{ content: ""; display: block; background: url("/cdn/img/submain_txt.svg") no-repeat center /contain; width: 20px; height: 18px; position: absolute; top: 8px;}
.subMain .btn-area > span::before{ left: 0; transform: scale(-1,1);}
.subMain .btn-area > span::after{ right: 0;}
.subMain .btn-area > span > span{ font-size: 16px;}
.subMain .yellow_btn{ background: url("/cdn/img/submain_arrow.svg") no-repeat right 30px center /9px auto; background-color: #FBB500; width: 100%; max-width: 400px; height: 58px; padding: 0 10px; font-size: 20px; font-weight: 700; color: white; line-height: 58px; border-bottom: #FB8700 4px solid; border-radius: 0; transition: all 0.3s ease-in-out 0s;}
.subMain .yellow_btn:hover{ background-color: #FFC224;}
@media print, screen and (max-width:641px) {
	.subMain .btn-area > span{ font-size: 16px; }
	.subMain .btn-area > span > span{ font-size: 14px;}
	.subMain .btn-area > span::before,
	.subMain .btn-area > span::after{ top: 4px;}
	.subMain .yellow_btn{ height: 48px; font-size: 16px; line-height: 48px;}
}

#labor .floatBox img{ width: 260px; margin:-10px auto 0!important; }
#feature{ background: white; }
#feature .itemList ul{ display: flex; justify-content: center; flex-wrap: wrap;}
#feature .itemList li{ float: none;}
#feature .itemList li img{ margin-bottom: 12px;}


/*************************************************************************************************************************
* 641px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:641px) {
	.offer .secTit{ font-size: 26px;}
	#feature .itemList li img{ height: 68px; margin-bottom: 16px;}
}


/*************************************************************************************************************************
* 980px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:980px){
	#labor .floatBox{ padding-right: 20px!important;}
	#labor .floatBox .txt{ width: 70%!important;}
	#labor .floatBox img{ width: 28%!important; max-width: 300px; margin-top: 60px!important; }
}
