﻿@charset "UTF-8";

/* リフォーム */
.page_title{background-image:url(../../reform/img/page_title.jpg);}

.main h3{background:#f39d5a;}
.main h4{border-bottom:solid 2px #f39d5a; margin:40px 0 10px;}

.reform_list{
	padding-top:40px;
	overflow:hidden;
	padding-left:1%;
	width:100%;
}
.reform_list dl{
	width:24%;
	margin:0 1% 0 0;
	float:left;
	border-radius:8px ;
	-moz-border-radius:8px ;
	-webkit-border-radius:8px ;
	padding:2px;
}
.reform01{background:#9f805b;}
.reform02{background:#30a397;}
.reform03{background:#e0b235;}
.reform04{background:#2d88c8;}

.reform_list dt{
	color:#fff;
	text-align:center;
	font-size:20px;
	padding:10px 4px 6px;
}
.reform_list dd{
	background:#fff;
	padding:12px;
	border-radius:0 0 6px 6px ;
	-moz-border-radius:0 0 6px 6px ;
	-webkit-border-radius:0 0 6px 6px ;
	font-size:18px;
	text-align:center;
}
.reform_list dd p{
	font-size:16px;
	padding:10px 0 0 0;
}

.flow{
	border:solid 1px #ccc;
	margin:40px 1% 0;
	background:#fff;
	border-radius:8px ;
	-moz-border-radius:8px ;
	-webkit-border-radius:8px ;
}
.flow dt{
	background:#f5f5f5;
	padding:16px 16px 12px;
	text-align:center;
	font-size:20px;
	font-weight:bold;
	border-radius:8px 8px 0 0;
	-moz-border-radius:8px 8px 0 0;
	-webkit-border-radius:8px 8px 0 0;
}
.flow dd{
	padding:60px 0 60px 120px;
	overflow:hidden;
}
.flow dd img{
	width:50%;
	float:left;
}

.reform_btn{
	padding-top:30px;
	overflow:hidden;
	padding-left:1%;
}
.reform_btn li{
	width:19%;
	margin-right:1%;
	float:left;
}
.reform_btn a{
	display:block;
	border-radius:20px ;
	-moz-border-radius:20px ;
	-webkit-border-radius:20px ;
	text-align:center;
	font-size:18px;
	color:#fff;
	text-decoration:none;
	line-height:40px;
	transition:.3s;
}

.btn_01{
	background:#de1565;
	border:solid 2px #de1565;
}
.btn_02{
	background:#ff5800;
	border:solid 2px #ff5800;
}
.btn_03{
	background:#0099ff;
	border:solid 2px #0099ff;
}
.btn_04{
	background:#00d158;
	border:solid 2px #00d158;
}
.btn_05{
	background:#009d62;
	border:solid 2px #009d62;
}

.btn_01:hover{
	background:#fff;
	color:#de1565;
}
.btn_02:hover{
	background:#fff;
	color:#ff5800;
}
.btn_03:hover{
	background:#fff;
	color:#0099ff;
}
.btn_04:hover{
	background:#fff;
	color:#00d158;
}
.btn_05:hover{
	background:#fff;
	color:#009d62;
}

.reform_contact{
	display:block;
	border-radius:20px ;
	-moz-border-radius:20px ;
	-webkit-border-radius:20px ;
	text-align:center;
	font-size:18px;
	color:#fff;
	text-decoration:none;
	padding:12px 0 10px;
	transition:.3s;
	background:#e94290;
	border:solid 2px #e94290;
	width:40%;
	margin:60px auto 0;
}
.reform_contact:hover{
	background:#fff;
	color:#e94290;
}



/*リフォーム施工事例*/
.reform_box_2line{
	width:66%;
	margin:0 auto;
	overflow:hidden;
}
.reform_box_2line .reform_box{
	width:50%;
	padding:20px;
	float:left;
}
.reform_box_3line{
	width:99%;
	margin:0 auto;
	overflow:hidden;
}
.reform_box_3line .reform_box{
	width:33%;
	padding:20px;
	float:left;
}
.main .main_box p.title_bofore{
	margin:0;
	padding:0;
	line-height:1;
	color:#999;
	font-size:24px;
}
.main .main_box p.title_after{
	margin:0;
	padding:0;
	line-height:1;
	color:#f19218;
	font-size:24px;
}
.reform_box_2line .reform_box p,
.reform_box_3line .reform_box p{
	padding-top:6px;
}


.reform_image{
	display:block;
	margin:0 auto;
	width:980px;
}

.reform_point{
	background:url(../../reform/img/point_back.jpg);
	padding:0 30px 30px;
	width:980px;
	margin:40px auto 0;
	border-radius:8px ;
	-moz-border-radius:8px ;
	-webkit-border-radius:8px ;
}
.reform_point dt{
	padding:16px;
	text-align:center;
}
.reform_point dt img{
	max-width:360px;
}
.reform_point dd{
	background:#fff;
	border-radius:6px ;
	-moz-border-radius:6px ;
	-webkit-border-radius:6px ;
	padding:30px;
	color:#5f432b;
}

.reform_memo{
	width:800px;
	margin:60px auto 0;
	color:#5f432b;
	overflow:hidden;
}
.reform_memo dt{
	line-height:44px;
	font-size:26px;
	padding:0 0 0 44px;
	background:url(../../reform/img/memo.jpg) left top no-repeat;
	border-bottom:solid 4px #cec2b6;
}

.reform_memo dd{
	float:left;
	margin-top:20px;
	font-size:14px;
}

.reform02_02{width:523px; margin-right:16px;}
.reform02_03{width:257px;}

.reform_table{
	width:800px;
	margin:40px auto 60px;
}
.reform_table th,
.reform_table td{
	border-collapse: collapse;
    border:1px solid #e7d5c7;
	color:#5f432b;
	padding:18px 18px 15px;
}
.reform_table th{
	background:#f8f1eb;
	width:25%;
}



/* ▼768px以下の場合に適用（iPad portrait以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 768px) {

.reform_list{
	padding-top:20px;
	padding-left:0;
}
.reform_list dl{
	width:90%;
	margin:10px auto 0;
	float:none;
	padding:2px;
}

.reform_list dt{
	font-size:18px;
}

.flow{
	margin:30px 1% 0;
}
.flow dt{
	font-size:18px;
}
.flow dd{
	padding:30px 0;
	text-align:center;
}
.flow dd img{
	width:92%;
	float:none;
	margin:10px 0 0 0;
}

.reform_btn{
	padding-top:0;
	padding-left:0;
}
.reform_btn li{
	width:90%;
	margin:10px auto 0;
	float:none;
}
.reform_btn a{
	font-size:16px;
}
.reform_contact{
	width:90%;
	}

/*リフォーム施工事例*/
.reform_box_2line,
.reform_box_3line{
	width:96%;
}
.reform_box_2line .reform_box,
.reform_box_3line .reform_box{
	width:90%;
	padding:0 0 10px 0;
	float:none;
	margin:0 auto;
}
.main .main_box p.title_bofore{
	margin:0;
	padding:0;
	line-height:1;
	color:#999;
	font-size:24px;
}
.main .main_box p.title_after{
	margin:0;
	padding:0;
	line-height:1;
	color:#f19218;
	font-size:24px;
}
.reform_box_2line .reform_box p,
.reform_box_3line .reform_box p{padding-top:6px;}

	

.reform_point{
	padding:0 15px 15px;
	width:100%;
}
.reform_point dt{
	padding:16px;
	text-align:center;
}

.reform_point dd{
	padding:20px;
}

.reform_memo{
	width:100%;
	margin:40px auto 0;
}
.reform_memo dt{
	line-height:32px;
	font-size:18px;
	padding:0 0 0 30px;
	background-size:24px;
}

.reform_memo dd{
	float:none;
	text-align:center;
}

.reform02_02{max-width:100%; margin-right:0;}
.reform02_03{max-width:100%;}

.reform_table{
	width:100%;
}
.reform_table th,
.reform_table td{
	padding:10px 10px 7px;
	display:block;
}
.reform_table th{
	width:100%;
}

	
	
}