@charset "utf-8";

/*--------------------------------------------*/
/*ヘッダーイメージ設定*/
#header_img {
	margin-top:0;
	background-color:#d3ddef;
}
#header_img p{
	margin:0 auto;
	width:1200px;
}

@media screen and (max-width:1199px){
#header_img p{
	width:100%;
}

}


/*--------------------------------------------*/
/*メインコンテンツ*/
#main {
	margin:0 100px 20px;
}


/*セクション*/
.main_in{	
	margin:0 30px;
}


#main h2 {
	font-size: 180%;
	background-color: #bb414a;	/*背景色*/
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f29ca0), to(#bb414a));
background-image: -webkit-linear-gradient(#f29ca0 20%, #bb414a 90%);
background-image: linear-gradient(#f29ca0 20%, #bb414a 90%);/*背景色*/
	color:#fff;
	padding:13px 20px 11px;
	border-radius:20px;
	margin:20px 0;
}


.lead{
	font-size:129%;
	line-height:1.7;
}

.chap1 {
	float:left;
	width:65%;
	border-bottom:1px #999 solid;
	margin:40px 0 20px;
}
.chap1 p{
	border-top:1px #999 solid;
	line-height:1.5;
	font-size:140%;
	padding:15px 10px 10px 50px;
	position:relative;
}

.chap1 img{
	position:absolute;
	top:16px;
	left:15px;
}
.c_01{
	float:right;
}

/*ご利用までの流れ--------------------------------*/
.step_img{
	float:right;
	margin-top:30px;
}

.step_r{
	width:60%;
	float:right;
	clear:right;
}
.step_l{
	width:60%;
	float:right;
	margin-right:100px;
	clear:right;
}


.step_p{
	margin:20px 20px 7px 100px;
	font-size:108%;
	line-height:2em;
}

#main h4{
	background-color: #485583;
	padding:10px 0 7px 100px;
	color:#FFFFFF;
	font-size:160%;
	margin-top:20px;
	position:relative;
}

#main h4 img{
	position:absolute;
	top:-10px;
	left:10px;
}

/*料金表組----------------------------*/
.fee_lead{
	text-align:center;
	font-size:180%;
	line-height:1.8em;
	margin:20px 0;
}
.fee_lead span{
	color:#ea5504;
	font-size:150%;
}

.fee_table{
	width:100%;
	font-size:140%;
}
.fee_table th{
	background-color:#666;
	color:#FFFFFF;
	text-align:center;
	padding: 5px 0 3px;
	border-top:solid #999 1px;
	border-right:dotted #fff 1px;
}

.fee_table td{
	
	line-height:1.3em;
	padding: 10px 0 7px;
	padding-left:15px;
	border-top:solid #999 1px;
	border-bottom:solid #999 1px;
	border-right:solid #999 1px;
}
.fee_table td:last-child{
	text-align:center;
	border-right:none;
	font-weight:bold;
	color:#ea5504;
	font-size:150%;
}
.caption{
	margin:10px 0;
	font-size:90%;
}



/*タブレット*/
@media screen and (min-width:600px) and (max-width:1199px){


#main {
	width:auto;
	margin:0 20px 20px;
}

.main_in{	
	width: auto;	
	margin:0 20px;
}

#main h2 {
	padding:10px 20px 8px;
	font-size: 160%;
}
.lead{
	font-size:110%;
	line-height:1.7;
}

.chap1 {
	float:left;
	width:70%;
	border-bottom:1px #999 solid;
	margin:25px 0 20px;
}
.chap1 p{
	border-top:1px #999 solid;
	line-height:1.5;
	font-size:120%;
	padding:10px 10px 10px 50px;
	position:relative;
}

.chap1 img{
	position:absolute;
	top:12px;
	left:15px;
}
.c_01{
	width:25%;
}
/*ご利用までの流れ--------------------------------*/

#main h4{
	padding:10px 0 7px 90px;
	font-size:140%;
	margin-top:20px;
}

#main h4 img{
	top:-20px;
	left:5px;
	width:18%;
}


.step_img{
	float:right;
	margin-top:20px;
	width:35%;
}

.step_r{
	width:55%;
}
.step_l{
	width:55%;
	margin-right:5%;
}
.step_p{
	margin:20px 15px 7px 15px;
	font-size:108%;
	line-height:2em;
}


/*料金表組----------------------------*/
.fee_lead{
	text-align:center;
	font-size:2.5vw;
	line-height:1.5em;
	margin:5px 0;
}
.fee_lead span{
	color:#ea5504;
	font-size:150%;
}
}


/*スマホ*/
@media screen and (max-width:599px){

#main {
	width:auto;
	margin:0 10px 10px;
}

.main_in{	
	width: auto;	/*メインコンテンツ幅*/
	padding:5px 0 15px;
	margin: 0 10px;
}

#main h2 {
	padding:7px 15px 0px;
	font-size: 125%;
	overflow:hidden;
}
.lead{
	font-size:110%;
	line-height:1.5;
}

.chap1 {
	width:auto;
	border-bottom:1px #999 solid;
	margin:10px 0 10px;
}
.chap1 p{
	border-top:1px #999 solid;
	line-height:1.5;
	font-size:110%;
	padding:10px 0 5px 30px;
	position:relative;
}

.chap1 img{
	position:absolute;
	top:10px;
	left:0px;
}
.c_01{
	display:none;
}

/*ご利用までの流れ--------------------------------*/
#main h4{
	padding:7px 0 5px 80px;
	color:#FFFFFF;
	font-size:130%;
	margin-top:20px;
	position:relative;
}

#main h4 img{
	position:absolute;
	width:17%;
	top:-18px;
	left:10px;
}


.step_img{
	float:none;
	width:56%;
	margin:0 22%;
}

.step_r{
	width:100%;
	float:none;
}
.step_l{
	width:100%;
	float:none;
	margin-right:0px;
}

.step_p{
	margin:15px 0 7px 10px;
	font-size:100%;
	line-height:1.5em;
}

/*料金表組----------------------------*/
.fee_lead{
	text-align:center;
	font-size:130%;
	line-height:1.5em;
	margin:-10px 0 10px;
}
.fee_lead span{
	color:#ea5504;
	font-size:150%;
}
.fee_table{
	font-size:100%;
}
}




/*ニュース・新着情報---------------------------------*/
#news {
	margin:30px 30px 30px;
	background-color: #f2f2f2;	/*背景色*/
	border:10px solid #ccc;
	width: auto;
}

#news h3 {
	background-color: #dcdddd;	/*背景色*/
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e1e2e2));
	background-image: -webkit-linear-gradient(#fff 40%, #e1e2e2 90%);
	background-image: linear-gradient(#fff 40%, #e1e2e2 90%);
	border-bottom: solid 1px #666;
	padding: 10px 20px;	
	font-size: 120%;
}
#news h2 a:link { text-decoration:none; color:#333; }
#news h2 a:visited { text-decoration:none; color:#333; }
#news h2 a:hover { text-decoration:none; color:#333; }
#news h2 a:active { text-decoration:none; color:#333; }

.ifra{
	width:100%;
	padding:0 30px;
	height:250px;
}



@media screen and (min-width:481px) and (max-width:989px){

#news {
	margin:20px 15px 0;
	width: auto;
}
.ifra{
	padding:0px;
}
}

@media screen and (min-width:380px) and (max-width:480px){
#main{
	float: none;
	width: auto;
	margin-bottom:20px;
}

/*ブロック全体の設定*/
#news {
	margin:20px 10px 0;
	width: auto;
	padding-bottom:15px;
}
.ifra{
	padding:0px;
}
}

@media screen and (max-width:379px){
#main{
	float: none;
	width: auto;
	margin-bottom:20px;
}

/*ブロック全体の設定*/
#news {
	margin:20px 10px 0;
	width: auto;
	padding-bottom:15px;
}
.ifra{
	padding:0px;
}
}