@charset "UTF-8";
#topimgBox{
	width:100%;
	height:auto;
	z-index: 0;
	position: relative;

}
#topimg{
	width:100%;
	height:auto;
}
#topimg_right{
	width:60%;
	height:100%;
	position:absolute;
	margin-left:40%;
	text-align:center;
}

#catchCopy_main{
	width:100%;
	font-size:250%;
	color:#fff;
	font-weight:bold;
	margin-top:10%;
}
#catchCopy_sub{
	width:100%;
	font-size:180%;
	color:#444;
}
#top_btn_createHP{
	width:100%;
	margin-top:20px;
}
.stepText{
	font-size:160%;
	color:#333;
	font-weight:bold;
}
.stepImgBox{
	width:100%;
	height:auto;
	text-align:center;
}
.stepCommentBox{
	width:100%;
	height:auto;
	padding:10px 5px;
	font-size:120%;
	color:#333;
	text-align:center;
}
.startBtnText{ font-size:150%;}
.meritTitle{
	font-size:150%;
	color:#333;
	font-weight:bold;
}
.meritComment{
	font-size:120%;
	color:#333;
}
.meritBox{
	background-repeat: no-repeat;
	background-position: center center;
	padding-right:20px;
	padding-left:20px;
	height:180px;
}

/* CASE TAB -----*/
@media screen and (min-width:481px) and (max-width:800px) {
#catchCopy_main{ font-size:150%; }
#catchCopy_sub{ font-size:120%; }
.startBtnText{ font-size:120%;}
.meritTitle{ font-size:110%;}
.meritComment{ font-size:110%;}
}
/* CASE SP -----*/
@media screen and (max-width:480px) {
#catchCopy_main{ font-size:110%; }
#catchCopy_sub{ font-size:100%; }
.startBtnText{ font-size:100%;}
.meritTitle{ font-size:130%;}
.meritComment,.stepCommentBox{ font-size:110%;}
}