@charset "utf-8";

main {
	background: #fff;
}

.clearfix:after {
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	line-height: 0;
	*zoom: 1;
}
main .wrapper * {
	box-sizing: content-box;
}

main p {
	margin: 0;
}

@media screen and (min-width: 768px) {
	
	/*=====================================
	　　▼▼▼ コンテンツ
	=====================================*/
	#contents {
		padding: 20px 0 0;
		overflow: hidden;
	}
	#contents .inner {
		margin: 0 auto;
		width: 970px;
		clear: both;
		overflow: hidden;
	}
	
	.wrapper {
		width: 100%;
		min-width: 970px;
	}
	
	/*===================================== 
	　　▼▼▼ ヘッダー
	=====================================*/
	#flow_header {
		width: 970px;
		margin: 0 auto;
		}
		#flow_header .headline {
			margin: 0 0 20px;
		}
		#flow_header .ico_list {
			position: relative;
			margin: 0 0 20px;
		}
		#flow_header .ico_list img {
			margin: 0 10px 0 0;
		}
		#flow_header .ico_list .customer {
			float: right;
			margin: 5px 0 0;
			font-weight: bold;
		}
		#flow_header .desc {
			margin: 0 0 10px;
			font-size: 18px;
			font-weight: bold;
		}
		#flow_header .caution {
			margin: 0 0 15px;
			float: right;
			font-size: 14px;
			font-weight: bold;
		}
		
		
	
	/*===================================== 
	　　▼▼▼ リフォームの流れ
	=====================================*/
	#flow_cont {
		
		}
		#flow_cont .inner {
			margin-bottom: 15px;
		}
		#flow_cont .step_list {
			margin-left: -30px;
			margin-bottom: 15px;
			background: url(../img/reform_flow/bg_step.png) no-repeat 30px 0;
		}
		#flow_cont .step_list a {
			float: left;
			margin: 0 0 0 30px;
		}
		#flow_cont .step_list a.pager-active img { visibility:hidden;}
		#flow_cont .step_list a#step01 { background: url(../img/reform_flow/btn_step01-on.png) no-repeat;}
		#flow_cont .step_list a#step02 { background: url(../img/reform_flow/btn_step02-on.png) no-repeat;}
		#flow_cont .step_list a#step03 { background: url(../img/reform_flow/btn_step03-on.png) no-repeat;}
		#flow_cont .step_list a#step04 { background: url(../img/reform_flow/btn_step04-on.png) no-repeat;}
		#flow_cont .step_list a#step05 { background: url(../img/reform_flow/btn_step05-on.png) no-repeat;}
		#flow_cont .step_list a#step06 { background: url(../img/reform_flow/btn_step06-on.png) no-repeat;}
		#flow_cont .step_list a#step07 { background: url(../img/reform_flow/btn_step07-on.png) no-repeat;}
		#flow_cont .step_list a#step08 { background: url(../img/reform_flow/btn_step08-on.png) no-repeat;}
		#flow_cont .step_list a#step09 { background: url(../img/reform_flow/btn_step09-on.png) no-repeat;}
		#flow_cont .step_list a#step10 { background: url(../img/reform_flow/btn_step10-on.png) no-repeat;}
		
		
		#flow_cont .slide_cont {
			position: relative;
			margin: 0 0 60px;
			background: #f6f7f8 url(../img/reform_flow/bg_border.png) repeat-x top;
			}
			#flow_cont .slide_cont .inner {
				width: 1050px;
			}
			#flow_cont .slide_cont #slide_flow {
				position: relative;
				width: 980px;
				margin: 0 auto;
			}
			#flow_cont .slide_cont #slide_flow li {
				position: relative;
				width: 920px;
				height: 280px;
				margin: 0 auto;
				padding: 70px 30px 40px;
			}
			#flow_cont .slide_cont #slide_flow li img {}
			#flow_cont .slide_cont #slide_flow li .txt_col {
				float: left;
				width: 425px;
			}
			#flow_cont .slide_cont #slide_flow li .txt_col.full {
				width: 890px;
			}
			#flow_cont .slide_cont #slide_flow li .txt_col .heading {
				margin: 0 0 20px;
			}
			#flow_cont .slide_cont #slide_flow li .txt_col .comment {
				font-size: 18px;
				line-height: 1.3;
			}
			#flow_cont .slide_cont #slide_flow li .img_col {
				float: right;
				width: 455px;
			}
			#flow_cont .slide_cont #slide_flow li#step01_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 26px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step02_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 126px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step03_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 226px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step04_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 326px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step05_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 426px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step06_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 526px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step07_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 626px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step08_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 726px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step09_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 826px 0;
			}
			#flow_cont .slide_cont #slide_flow li#step10_col {
				background: url(../img/reform_flow/ico_arrow.png) no-repeat 926px 0;
			}
			#flow_cont .slide_cont #slide_flow li .ico {
				position: absolute;
				top: 35px;
				right: 25px;
			}
			
			
		/* スライドコンテンツ */
		.slide_cont .bx-window {
			width: 1050px !important;
		}
		.slide_cont .bx-prev {
			position: absolute;
			top: 190px;
			left: 0px;
			width: 22px;
			height: 45px;
			text-indent: -9999px;
			background: url(../img/reform_flow/ico_arrow_l.png) no-repeat 0 0;
			}
		.slide_cont .bx-next {
			position: absolute;
			top: 190px;
			left: 1028px;
			width: 22px;
			height: 45px;
			text-indent: -9999px;
			background: url(../img/reform_flow/ico_arrow_r.png) no-repeat 0 0;
		}
		.slide_cont .bx-pager {
			display: none;
		}
			
		
	/*===================================== 
	　　▼▼▼ リフォームのご相談
	=====================================*/
	#consul_cont {
		width: 920px;
		margin: 0 auto 40px;
		padding: 20px 25px 25px;
		background: url(../../../common/img/bg_frame_consul.png) no-repeat top;
		}
		#consul_cont .heading {
			text-align: center;	
		}
		#consul_cont .bnr01 {
			margin-top: -15px;
			margin-bottom: 15px;
		}
		#consul_cont .bnr_list {
		}
		#consul_cont .bnr_list li {
			float: left;
		}
		#consul_cont .bnr_list li.bnr02 {
			margin-right: 10px;
		}
		#consul_cont .bnr_list li.bnr03 {
			margin-bottom: 10px;
		}
		#consul_cont .bnr_list li.bnr04 {
			
		}
	
}


	
@media screen and (max-width: 767px) {
	#wrapper{
		position: relative;
		width: 100%;
		margin: 0 auto;
		/* border-top: 6px solid #1fb9f0; */
		color: #434343;
		font-size:1.4rem;
	}

	/* タイトルタイプ */
.ttl_type01 {
	padding: 9px 7px;
	background: #007ac7;
	color: #fff;
	font-size: 2.57rem;
	line-height: 1.3em;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W6", HiraKakuPro-W6, "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
}


	/* main_section
------------------------------------------------ */
#main_section {
	margin: 0 0 23px;
	}
	#main_section .heading {
		padding: 7px;
		background: #007ac7;
	}
	#main_section .inner {
		margin: 12px;
	}
	#main_section .lead_txt {
		margin: 0 0 12px;
	}
	#main_section .lead_txt .color01 {
		color: #ffa300;
	}
	#main_section .ico {
		margin: 0 0 12px;
	}
	#main_section .caution {
		margin: 0 0 12px;
	}
	
	#main_section .step_list {}
	#main_section .step_list li {
		margin: 0 0 6px;
		padding: 0 0 23px;
		background: url(../img/reform_flow/sp/ico_arrow01.png) no-repeat bottom / 24px;
	}
	#main_section .step_list li:last-child {
		background: none;
	}
	#main_section .step_list li .col {
		border-radius: 3px;
	}
	#main_section .step_list li .heading {
		padding: 12px;
		background: #127cc4;
		border-radius: 3px 3px 0 0;
		color: #fff;
		font-size: 1.75rem;
		vertical-align: middle;
		line-height: 1;
	}
	#main_section .step_list li .heading .label {
		margin: 0 17px 0 0;
		font-size: 1.4rem;
	}
	#main_section .step_list li .heading .ico {
		float: right;
		display: inline-block;
		margin-top: -3px;
		padding: 3px 10px;
		background: #ffa300;
		border-radius: 3px;
		font-size: 1.4rem;
	}
	#main_section .step_list li .block {
		padding: 9px;
		border: 2px solid #e6e6e6;
		border-top: none;
		border-radius: 0 0 3px 3px;
	}
	#main_section .step_list li .txt {}
	#main_section .step_list li .img {
		float: right;
		margin: 0 0 0 9px;
		width: 106px;
	}

}