@charset "utf-8";

.for-pc{display:block;}
.for-sp{display:none;}

/* box align
=========================================================*/
/* float box
=========================================================*/
.fright{float:right;}
.fleft{float:left;}
.frobject,.flobject{
	display:block;
	width:auto;
	height:auto;
	line-height:1;
	margin-bottom:15px;
}
.frobject{margin-left:15px;}
.flobject{margin-right:15px;}

.photo02{
	width:500px;
	margin:0 auto;
}
.photo02 div{
	text-align:center;
}

.capt{line-height:1.4;}

.float-no{
	float:none;
}

.clr-no{
	clear:none !important;
}

/* 4. margin & padding
=========================================================*/
.m0{margin:0 !important;}
.m5{margin:5px;}
.m10{margin:10px;}
.m15{margin:15px;}
.m20{margin:20px;}
.m30{margin:30px;}

.mt0{margin-top:0 !important;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt25{margin-top:25px;}
.mt30{margin-top:30px;}

.mr0{margin-right:0 !important;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.mr15{margin-right:15px;}
.mr20{margin-right:20px;}

.mb0{margin-bottom:0 !important;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb25{margin-bottom:25px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}

.ml0{margin-left:0 !important;}
.ml3{margin-left:3px;}
.ml5{margin-left:5px;}
.ml10{margin-left:10px;}
.ml15{margin-left:15px}
.ml20{margin-left:20px;}

/* box padding
---------------------------------------------------------*/
.p0{padding:0 !important;}
.p5{padding:5px;}
.p10{padding:10px;}
.p15{padding:15px;}
.p20{padding:20px;}

.pt0{padding-top:0 !important;}
.pt5{padding-top:5px;}
.pt10{padding-top:10px;}
.pt15{padding-top:15px;}
.pt20{padding-top:20px;}

.pr0{padding-right:0 !important;}
.pr5{padding-right:5px;}
.pr10{padding-right:10px;}
.pr15{padding-right:15px;}
.pr20{padding-right:20px;}

.pb0{padding-bottom:0 !important;}
.pb5{padding-bottom:5px;}
.pb10{padding-bottom:10px;}
.pb15{padding-bottom:15px;}
.pb20{padding-bottom:20px;}
.pb200{padding-bottom:200px;}

.pl0{padding-left:0 !important;}
.pl5{padding-left:5px;}
.pl10{padding-left:10px;}
.pl15{padding-left:15px}
.pl20{padding-left:20px;}

/* font size
---------------------------------------------------------*/
.f70{ font-size:70%;}
.f80{ font-size:80%;}
.f90{ font-size:90%;}
.f110{ font-size:110%;}
.f120{ font-size:120%;}
.f130{ font-size:130%;}


.tcenter{
	text-align:center;
}
.tleft{
	text-align:left;
}
.tright{
	text-align:right;
}

.tcenter a img:hover,
.tleft a img:hover,
.tright a img:hover{
	opacity: 0.6;
	filter: alpha(opacity=60);
	-ms-filter: alpha(opacity=60);
}

.valign-top{
	vertical-align:top !important;
}
.valign-middle{
	vertical-align:middle !important;
}
.valign-bottom{
	vertical-align:bottom !important;
}

.font_underRed{
	color:#C00;
	border-bottom:3px double #C00;
	
}

.forBg_note{
		background-color:#FFFBF0;
		padding:3px 10px;
}

.movie-youtube{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie-youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.step01{
	font-size:110%;
}
.step-box-lbox{
	float:left;
}
.step-box-rbox{
	float:right;
}
.step-box-lbox .step-box{
	/*width:300px;*/
	width:98%;
	margin-right:2%;
	
}
.step-box-rbox .step-box{
	/*width:300px;*/
	width:98%;
	margin-left:2%;
}
.step-box-lbox .arrow,
.step-box-rbox .arrow{
	margin-bottom:0 !important;
}
.step-box{
	margin:0 auto;
	width:580px;
}
.step-box img{
	margin-top:20px;
}

.box-red .step-tit{
	background-color:#FBA5A5 !important;
}
.box-blue .step-tit{
	background-color:#91D2ED !important;
}
.box-yellow .step-tit{
	background-color:#FFCC71 !important;
}

.step-tit{
	text-align:center;
	margin-bottom:0 !important;
	color:#fff;
	font-weight:normal;
	font-size:115%;
	line-height:1.4 !important;

	border-radius:5px;
	background-color:#93CA76;
	padding:10px;
	box-sizing: border-box;
	text-shadow: 1px 1px 1px #888; 
}
.step-body{
	text-align:left;
	color:#444;
	line-height:1.6;
	margin-bottom:0 !important;
	margin-top:10px !important;
	font-size:92%;
}
.arrow{
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
}
.arrow{
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
}

.b{
	font-weight:bold !important;
}

.c-red{
	color:#F00 !important;
}
.c-blue{
	color:#00F !important;
}

.pc{
	display:inline;
}

.sp{
	display:none;
}


/* clfix clr
---------------------------------------------------------*/

.clfix:after{
	content:"."; 
	display:block; 
	visibility:hidden; 
	clear:both; 
	height:0;
}

.clfix{display:inline-block;}
/* Hides from IE-mac \*/
* html .clfix{height:1%;}
.clfix{display: block;}
/* End hide from IE-mac */

.clr{clear:both !important;}


@media only screen and (max-width: 768px) {

.for-pc{display:none;}
.for-sp{display:block;}

.w100{
	width:100% !important;
}

.fright, .fleft{
	float:none;
	text-align:center;
	margin-left:0;
	padding-right:0;
}

.center img,
.tcenter img{
	/*width:100%;*/
	width:300px;
	height:auto;
	margin:0;
}

.center img.icon,
.tcenter img.icon{
	width:36px;
	height:auto;
}

table .tcenter img{
	width:100%;
	height:auto;
	margin:0;
}

.figure_placement .definition_bd{
	width:100% !important;
	height:auto;
}

.respon-img{
	width:100% !important;
	height:auto !important;
}

.step-box{
	width:100%;
	margin:0;
}

.step-box-lbox .step-box{
}
.step-box-rbox .step-box{
}

.fmap img{
	width:100%;
	height:auto;
}

.photo02{
	width:100%;
	margin-top:10px;
}
	
}

@media only screen and (max-width: 480px) {
.pc{
	display:none;
}

.sp{
	display:inline;
}


}
@media only screen and (max-width: 320px) {
.center img,
.tcenter img{
	width:100%;
}
}