@charset "utf-8";
@import url("/css/pages.css");
/* reform.css */
/*PC first*/
/*##### PC #####*/
.content_title .content_title_img{
	background: url(/shared/content_title/reform_img.jpg) no-repeat left top;
}
.mainBox{
	overflow: hidden;
}

/* --- reformBox --- */
.reformBox{
	width: 960px;
	/* width: 1200px; */
    margin: 0 auto;
}
	.reformHeadBox{
		/*
		width:800px;
		margin:0 auto;
		display: -webkit-flex;
	    -js-display: flex;
	    display: -ms-flexbox;
	    display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		height: 350px;
		*/
	}
		.reformHeadBox .headTxtBox{
			/*
			background: #404040;
			width: 520px;
			height:230px;
			padding: 50px 40px 0 40px;
			*/
		}
			.headTxtBox h3{
				padding-bottom: 20px;
				text-align:center;
			}
			.headTxtBox p.headLineTxt{
				color: #111;
				font-size: 15px;
			    font-size: 1.5rem;
				line-height: 2.0;
				text-align:center;
			}

		.reformHeadBox ul.headNavi{
			display: -webkit-flex;
		    -js-display: flex;
		    display: -ms-flexbox;
		    display: flex;
			flex-wrap: wrap;
			justify-content: center;
			padding: 28px 0 0 0;
		}
			ul.headNavi li{
				font-size: 17px;
			    font-size: 1.7rem;
				margin-right: 30px;
				position: relative;
			}

			ul.headNavi li:last-child{
				margin-right: 0;
			}
				ul.headNavi li a{
					border: 2px solid #A02814;
					background: #fff;
					color: #A02814;
					display:block;
					height:38px;
					border-radius:19px;
					line-height:34px;
					text-align:center;
					width:200px;
					position:relative;
					box-sizing:border-box;
				}

				/*
				ul.headNavi li a:before{
					content:"";
					display:block;
					width:200px;
					height:38px;
					background: #A02814;
					border-radius:19px;
					position:absolute;
					top:0;
					left:0;
				}
				*/
				/*
				ul.headNavi li a::before{
					position: absolute;
					content: "";
					box-sizing: border-box;
					width: 22px;
					height: 22px;
					border: 2px solid #505050;
					-webkit-border-radius: 50%;
					border-radius: 50%;
					vertical-align: middle;
					top: -3px;
					left: -28px;
				}
				ul.headNavi li a::after{
					position: absolute;
					content: "";
					top: 1px;
				    left: -22px;
				    width: 8px;
				    height: 8px;
					border-top: 2px solid #505050;
					border-right: 2px solid #505050;
					-webkit-transform: rotate(135deg);
					transform: rotate(135deg);
					vertical-align: middle;
				}
				ul.headNavi li a:hover{
					color: #9d0733;
				}
				ul.headNavi li a:hover::before{
					border: 2px solid #9d0733;
				}
				ul.headNavi li a:hover::after{
					border-top: 2px solid #9d0733;
					border-right: 2px solid #9d0733;
				}
				*/

	.reformIntroductionBox{
		padding: 74px 0 50px;
		width: 90.625%;
		margin: 0 auto;
		/* padding: 74px 180px 50px 150px; */
	}
		.reformIntroductionBox > h4{

		}
			.reformIntroductionBox > h4 img{
				padding-bottom: 10px;
				border-bottom: 3px solid #212121;
			}
		.reformIntroductionBox ul.introPointBox{
			display: -webkit-flex;
		    -js-display: flex;
		    display: -ms-flexbox;
		    display: flex;
			flex-wrap: wrap;
			align-items: flex-end;
			padding: 5px 0 34px;
			font-size: 15px;
			font-size: 1.5rem;
		}
			ul.introPointBox li:first-child{
				margin-right: auto;
			}

		.reformIntroductionBox ul.introSelectBox{
			display: -webkit-flex;
		    -js-display: flex;
		    display: -ms-flexbox;
		    display: flex;
			flex-wrap: wrap;
			justify-content: flex-end;
		}
			ul.introSelectBox li{

			}
			ul.introSelectBox li:first-child{
				margin-right: 60px;
			}
				ul.introSelectBox li a{
					display: block;
				}
				ul.introSelectBox li a img{
					opacity: 1.0;
					-webkit-transition: all 0.25s ease;
					-moz-transition: all 0.25s ease;
					-o-transition: all 0.25s ease;
				    transition: all 0.25s ease;
				}
				ul.introSelectBox li a:hover img{
					opacity: 0.7;
				}
				ul.introSelectBox li a:hover p{
					color: #a02814;
					text-decoration: underline;
				}
				ul.introSelectBox li a:hover p::after{
					border-top: 2px solid #a02814;
					border-right: 2px solid #a02814;
				}
				ul.introSelectBox li img{
					padding-bottom: 30px;
				}
				ul.introSelectBox li p{
					position: relative;
					/* display: block; */
					font-size: 21px;
					font-size: 2.1rem;
					color: #212121;
				}
				ul.introSelectBox li p::before{
					content: "";
					border-left: 5px solid #a02814;
					/* height: 40px; */
					padding: 8px 0;
					margin-right: 15px;
				}
				ul.introSelectBox li p::after{
					position: absolute;
					content: "";
					top: 3px;
				    right: 10px;
				    width: 12px;
				    height: 12px;
					border-top: 2px solid #bfbfbf;
					border-right: 2px solid #bfbfbf;
					-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
					vertical-align: middle;
				}

	.reformFaqBox{
		background: #f1f1f1;
		margin: 0px -500%;
		padding: 0px 500%;
	}
		.reformFaqBox .faqBox{
			padding: 84px 0 74px;
			width: 93.75%;
			margin: 0 auto;
			/* padding: 84px 150px 74px; */
		}
			.faqBox > h4{

			}
				.faqBox > h4 img{
					padding-bottom: 10px;
					border-bottom: 3px solid #212121;
				}
			.faqBox ul.faqPointBox{
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				align-items: flex-end;
				padding: 5px 0 34px;
				font-size: 15px;
				font-size: 1.5rem;
			}
				ul.faqPointBox li{
					margin-right: 30px;
				}
				ul.faqPointBox li:first-child{
					margin-right: auto;
				}

			.faqBox dl.questionBox{
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				padding-bottom: 55px;
			}
				dl.questionBox dt{
					width: 60px;
					box-sizing: border-box;

				}
				dl.questionBox dd{
					box-sizing: border-box;
					width: 840px;
					height: 59px;
					padding-top: 1px;
					background: #ffffff;
				}
				dl.questionBox dd:nth-child(2){
					font-size: 19px;
					font-size: 1.9rem;
					line-height: 58px;
					padding-left: 30px;
				}
				dl.questionBox dd.answer{
					font-size: 16px;
					font-size: 1.6rem;
					color: #a02814;
					line-height: 58px;
					padding-left: 20px;
					position: relative;
					cursor :pointer;
				}
				dl.questionBox dd.answer.open::after{
					position: absolute;
					content: "";
					top: 25px;
				    right: 25px;
				    width: 12px;
				    height: 12px;
					border-top: 2px solid #bfbfbf;
					border-right: 2px solid #bfbfbf;
					-webkit-transform: rotate(-45deg);
					transform: rotate(-45deg);
				}
				dl.questionBox dd.answer.close::after{
					position: absolute;
					content: "";
					top: 25px;
				    right: 25px;
				    width: 12px;
				    height: 12px;
					border-top: 2px solid #a02814;
					border-right: 2px solid #a02814;
					-webkit-transform: rotate(135deg);
					transform: rotate(135deg);
				}
				dl.questionBox dd.comment{
					display: none;
					background: none;
					height: auto;
					padding: 30px 10px 0 80px;
					line-height: 2;
					width: 100%;
				}

	.reformFlowBox{
		padding: 93px 0 0;
		width: 93.75%;
		margin: 0 auto;
		/* padding: 93px 150px 0; */
	}
		.reformFlowBox > h4{

		}
			.reformFlowBox > h4 img{
				padding-bottom: 10px;
				border-bottom: 3px solid #212121;
			}
		.reformFlowBox ul.flowPointBox{
			display: -webkit-flex;
			-js-display: flex;
			display: -ms-flexbox;
			display: flex;
			flex-wrap: wrap;
			align-items: flex-end;
			padding: 5px 0 10px;
			font-size: 15px;
			font-size: 1.5rem;
		}
			ul.flowPointBox li{
				margin-right: 25px;
			}
			ul.flowPointBox li:first-child{
				margin-right: auto;
			}
		.reformFlowBox > p.flowPointComments{
			padding-bottom: 34px;
			font-size: 15px;
			font-size: 1.5rem;
		}
		.reformFlowBox .flowBox{

		}
		.reformFlowBox .flowBox:nth-child(4){
			padding-bottom: 90px;
			background: url(/shared/reform/reform_flow_arrow001.png) center bottom no-repeat;
		}
			.flowBox .headBox{
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				align-items: baseline;
				padding-bottom: 15px;
			}
				.headBox > h5{
					font-size: 24px;
					font-size: 2.4rem;
					font-weight: bold;
					padding-right: 28px;
				}
				.headBox > p{
					font-size: 16px;
					font-size: 1.6rem;
					color: #a02814;
				}
			.flowBox:last-child .headBox > p{
				color: #007d19;
			}


			.flowBox .procedureBox{
				box-sizing: border-box;
				border: 8px solid #f1f1f1;
				padding: 12px 22px;
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
			}
				.procedureBox dl{
					box-sizing: border-box;
					width: 50%;
				}
				.procedureBox dl:nth-child(odd){
					border-right: 2px dotted #818181;
				}
				.procedureBox dl:nth-child(-n + 2){
					border-bottom: 2px dotted #818181;
				}

					.procedureBox dl > dt{
						box-sizing: border-box;
						padding: 0 10px;
					}
						.procedureBox dl > dt > ul{
							display: -webkit-flex;
							-js-display: flex;
							display: -ms-flexbox;
							display: flex;
							flex-wrap: wrap;
							align-items: center;
							border-bottom: 1px solid #212121;
						}
							.procedureBox dl > dt > ul > li{
								font-size: 22px;
								font-size: 2.2rem;
							}
					.procedureBox dl > dd{
						box-sizing: border-box;
						padding: 15px 20px 0;
						font-size: 15px;
						font-size: 1.5rem;
						line-height: 1.33;
						display: flex;
					}
					.procedureBox dl > dd::before{
						content: '◆';
					}
					.procedureBox dl > dd:last-child{
						padding: 15px 20px 20px;
					}
/* --- //reformBox --- */

/* --- reformPhotoBox --- */
.reformPhotoBox{
	width: 1200px;
    margin: 0 auto;
}
	.reformPhotoBox > .photoHeadBox{
		width: 970px;
		margin: 0 auto;
		padding: 0 0 60px;
	}
		.reformPhotoBox > .photoHeadBox h3{

		}
			.photoHeadBox > h3 img{
				padding-bottom: 10px;
				border-bottom: 3px solid #212121;
			}
	.reformPhotoBox > .photoBox{
		width: 970px;
		margin: 0 auto;
		display: -webkit-flex;
		-js-display: flex;
		display: -ms-flexbox;
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 50px;
		align-items: flex-start;
		justify-content: space-between;
	}
		.reformPhotoBox > .photoBox h4{
			font-size: 24px;
		    font-size: 2.4rem;
		    font-weight: bold;
			width: 100%;
			padding-bottom: 20px;
		}
			.photoBox > .beforeBox{
				box-sizing: border-box;
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				padding: 21px 20px;
			    border: 2px solid #f1f1f1;
				width: 47%;
				justify-content: center;
			}
				.beforeBox h5 {
					font-size: 18px;
				    font-size: 1.8rem;
					padding-bottom: 10px;
					color: #001669;
					width: 100%;
					text-align: center;
				}
				.beforeBox h5::after{
					content: '〜Before〜';
					color: #3f6ee6;
					padding-left: 10px;
				}
				.beforeBox img {

				}
				.beforeBox img:nth-child(n+4){
					padding-top: 10px;
				}
				.beforeBox img:nth-child(even){
					padding-right: 10px;
				}
			.photoBox > .afterBox{
				box-sizing: border-box;
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				padding: 20px;
			    border: 3px solid #ffe373;
				width: 48%;
				justify-content: center;
				background: #fbfbfb;
			}
				.afterBox h5 {
					font-size: 18px;
				    font-size: 1.8rem;
					padding-bottom: 10px;
					/* color: #e6be4b; */
					/* color: #d03638; */
					color: #333333;
					width: 100%;
					text-align: center;
				}
				/* .afterBox h5::before{
					font-family: FontAwesome;
				    content: "\f0b1";
					padding-right: 5px;

				} */
				.afterBox h5::after{
					font-family: FontAwesome;
					content: '〜After〜';
					/* color: #e6be4b; */
					color: #ed4747;
					padding-left: 10px;
				}
				.afterBox img {

				}
				.afterBox img:nth-child(n+4){
					padding-top: 10px;
				}
				.afterBox img:nth-child(even){
					padding-right: 10px;
				}
			.photoBox > .afterBoxWide{
				box-sizing: border-box;
				display: -webkit-flex;
				-js-display: flex;
				display: -ms-flexbox;
				display: flex;
				flex-wrap: wrap;
				padding: 20px 30px;
				border: 3px solid #ffe373;
				justify-content:space-between;
				background: #fbfbfb;
			}
			.photoBox > .afterBoxWide::before{
				content:"";
			    display:block;
			    width: 200px;
			    height:0;
			    order:1;
			}
			.photoBox > .afterBoxWide::after{
				content:"";
				display:block;
				width: 200px;
				height:0;
			}
				.afterBoxWide h5 {
					font-size: 18px;
					font-size: 1.8rem;
					/* color: #e6be4b; */
					/* color: #d03638; */
					color: #333333;
					width: 100%;
					text-align: center;
				}
				.afterBoxWide h5::after{
					content: '〜After〜';
					/* color: #e6be4b; */
					color: #ed4747;
					padding-left: 10px;
				}
				.afterBoxWide img {
					padding-top: 10px;
					/* margin-right: auto; */
				}
				/* .afterBoxWide img:nth-child(5n){
					margin-right: 0;
				} */

			.photoBox > .arrowBox{
				/* width: 8%; */
				box-sizing: border-box;
				margin: auto 20px auto 10px;
			}
				.arrowBox > .arrow{
					position:relative;
					height:16px;
					width:16px;
					background-color:#ffe373;
				}
				.arrowBox > .arrow::before{
					position:absolute;
					content:"";
					border:solid 16px transparent;
					border-left:solid 16px #ffe373;
					top:-8px;
					left:12px;
				}
/* --- //reformPhotoBox --- */


/*リフォーム写真リスト*/
.reform_ba_box{
	width:920px;
	margin:0 auto 50px auto;
}

	.reform_ba_box > .box_header{
		text-align:center;
		margin-bottom:40px;
	}

		.reform_ba_box > .box_header > h3{
			display: inline-block;
			border-bottom: 2px solid #a6250f;
			padding: 0 10px 5px 10px;
			font-size:1.5em;
		}

	.reform_ba_box > .box_inner{}

		.reform_photo_list{}

		.reform_photo_list.reform_after_box{
			background:#fff09e;
			border-radius:0 0 10px 10px;
		}

			.reform_photo_list .box_header{
				text-align:center;
				margin-bottom:30px;
				position:relative;
			}

				.reform_photo_list .box_header:before{
					content:"";
					display:block;
					width:95%;
					height:0;
					border-bottom:1px dotted #555;
					position:absolute;
					top:0;
					bottom:0;
					left:0;
					right:0;
					margin:auto;
					z-index:0;
				}

				.reform_photo_list .box_header h4{
					font-size:1.3em;
					display:inline-block;
					position:relative;
					z-index:1;
					padding:0 20px;
					font-weight:bold;
					letter-spacing:0.2em;
				}

				.reform_photo_list .box_header h4:after{
						display:block;
						font-size:1.1em;
						padding-top:3px;
						letter-spacing:0.1em;
						font-family:"Times New Roman", Times, serif;
						color:#aaa;
						font-style:italic;
				}

				.reform_photo_list.reform_before_box .box_header h4{
					background:#fff;
				}

					.reform_photo_list.reform_before_box .box_header h4:after{
						content:"Before";
					}

				.reform_photo_list.reform_after_box .box_header h4{
					background:#fff09e;
				}

					.reform_photo_list.reform_after_box .box_header h4:after{
						content:"After";
					}

			.reform_photo_list .box_inner{}

				.reform_photo_list .box_inner ul{
					display:flex;
					flex-wrap:wrap;
					width:900px;
					margin:0 auto;
				}

				.reform_photo_list .box_inner ul li{
					position:relative;
					margin:0 15px 20px 0;
					padding-left:10px;
					width:200px;
				}

				.reform_photo_list .box_inner ul li:nth-child(4n){
					margin:0 0 20px 0;
				}

				.reform_photo_list .box_inner ul li img{
					position:relative;
					z-index:0;
				}

				.reform_photo_list .box_inner ul li span{
					position:absolute;
					z-index:1;
					top:10px;
					left:0;
					background:rgba(255,255,255,0.9);
					display:inline-block;
					padding:5px 5px 3px 5px;
					box-shadow:-2px 2px 0 0 rgba(0,0,0,0.5);
				}

	.reform_ba_box > .box_inner .arr{
		margin:50px auto 0 auto;
	}

		.reform_ba_box > .box_inner .arr p{
			background:#fff09e;
			text-align:center;
			font-size:1.6em;
			padding:50px 0 30px 0;
			letter-spacing:0.2em;
			position:relative;
			border-radius:10px 10px 0 0;
			color:#a6250f;
			font-weight:bold;
		}

			.reform_ba_box > .box_inner .arr p:before{
				content:"";
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 30px 30px 0 30px;
				border-color: #fff transparent transparent transparent;
				position:absolute;
				top:0;
				left:0;
				right:0;
				margin:auto;
			}


/*//リフォーム写真リスト*/

/* --- backPageBtnBox --- */
.backPageBtnBox{
	width: 970px;
	margin: 0 auto;
}
	.backPageBtnBox ul{
		display: -webkit-flex;
		-js-display: flex;
		display: -ms-flexbox;
		display: flex;
		flex-wrap: wrap;
	}
		.backPageBtnBox ul li{
			width: 33%;
		}
			.backPageBtnBox ul li a{
				color: #808080;
				display: block;
			}
			.backPageBtnBox ul li a:hover{
				color: #a02814;
			}
				.backPageBtnBox > ul > li:nth-child(1) a::before{
					font-family: FontAwesome;
				    content: "\f104\f104";
					font-size: 16px;
				    font-size: 1.6rem;
					color: #808080;
					padding-right: 5px;
				}
				.backPageBtnBox > ul > li:nth-child(1) a:hover::before{
					color: #a02814;
				}
/* --- //backPageBtnBox --- */

/* --- contactBox --- */
.contents .contactBox{
    width: 960px;
	margin: 60px auto 0;
	padding-top: 50px;
	border-top: 1px solid #9e9e9e;
}
    .contents .contactBox h3{
        width: 100%;
        text-align: center;
        padding-bottom: 50px;
    }

    .contents .contactBox > .box_inner{
        display: -webkit-flex;
        -js-display: flex;
        display: -ms-flexbox;
        display: flex;
        flex-wrap:wrap;
        justify-content:space-between;
        width:920px;
        margin:0 auto;
    }

    .contents .contactBox > .box_inner .contactPhoneBox{
        width:560px;
    }

        .contents .contactBox > .box_inner .contactPhoneBox p{
            font-size:1.3em;
			margin: 10px 0 50px;
            /* margin-bottom:20px; */
        }

        .contents .contactBox > .box_inner .contactPhoneBox > ul{}

        .contents .contactBox > .box_inner .contactPhoneBox > ul > li{
            margin-bottom:28px;
        }

        .contents .contactBox > .box_inner .contactPhoneBox > ul > li:last-child{
            margin-bottom:0;
        }

            .contents .contactBox > .box_inner .contactPhoneBox > ul > li > ul{}

            .contents .contactBox > .box_inner .contactPhoneBox > ul > li > ul > li{
                display:inline-block;
            }

            .contents .contactBox > .box_inner .contactPhoneBox > ul > li > ul > li:last-child{
                margin-left:20px;
            }

    .contents .contactBox ul.contactLinkBox{
        width: 300px;
    }
        .contents .contactBox ul.contactLinkBox li{
            padding-bottom: 14px;
        }
        .contents .contactBox ul.contactLinkBox li:last-child{
            padding-bottom: 0;
        }
        .contents .contactBox ul.contactLinkBox li a:hover{
            filter:alpha(opacity=70);
            -moz-opacity: 0.7;
            opacity: 0.7;
        }
/* --- //contactBox --- */

@media screen and (max-width:480px){
/*##### SP #####*/
.content_title .content_title_img {
	background-size: contain !important;
	background-position: left center !important;
}

	/* --- reformBox --- */
	.reformBox{
		width: 100%;
	}
		.reformHeadBox{
			/* display: none; */
			height: auto;
			padding-bottom: 30px;
		}
			.reformHeadBox > img {
				width: 100%;
				height: auto;
			}
			.reformHeadBox .headTxtBox{
				width: 100%;
				height: auto;
				padding: 20px 0px;
			}
				.headTxtBox h3{
					text-align: center;
				}
					.headTxtBox h3 img{
						max-width:100%;
						height:auto;
					}
				.headTxtBox p.headLineTxt{
					padding: 0 10px;
					text-align:left;
				}

			.reformHeadBox ul.headNavi{

			}
				ul.headNavi li{
					margin-right:0;
					font-size:4vw;
					padding:0 1vw;
					box-sizing:border-box;
				}

				ul.headNavi li.hn_intro,
				ul.headNavi li.hn_faq{
					width:25%;
				}

				ul.headNavi li.hn_flow{
					width:50%;
				}

				ul.headNavi li:last-child{

				}
					ul.headNavi li a{
						width:auto;
					}
					ul.headNavi li a::before{

					}
					ul.headNavi li a::after{

					}
					ul.headNavi li a:hover{

					}
					ul.headNavi li a:hover::before{

					}
					ul.headNavi li a:hover::after{

					}

		.reformIntroductionBox{
			padding: 0 0 50px 0;
		}
			.reformIntroductionBox > h4{
				width: 80%;
				margin: 0 auto 10px auto;
			}
				.reformIntroductionBox > h4 img{
					width: 100%;
					height: auto;
				}
			.reformIntroductionBox ul.introPointBox{
				padding: 10px 0 34px;
			}
				ul.introPointBox li:first-child{
					line-height: 1.334;
				}
				ul.introPointBox li:last-child{
					display: none;
				}
			.reformIntroductionBox ul.introSelectBox{
				justify-content: center;
			}
				ul.introSelectBox li{

				}
				ul.introSelectBox li:first-child{
					margin-right: 0;
					padding-bottom: 40px;
				}
					ul.introSelectBox li a{
					}
					ul.introSelectBox li a img{
						width: 100%;
						height: auto;
					}
					ul.introSelectBox li a:hover img{

					}
					ul.introSelectBox li a:hover p{

					}
					ul.introSelectBox li a:hover p::after{

					}
					ul.introSelectBox li img{
					}
					ul.introSelectBox li p{

					}
					ul.introSelectBox li p::before{

					}
					ul.introSelectBox li p::after{

					}

		.reformFaqBox{
			margin: 0px;
		    padding: 0px;
		}
			.reformFaqBox .faqBox{
				padding: 30px 0 30px;
			}
				.faqBox > h4{
				    text-align: center;
					border-bottom: 3px solid #212121;
					width:70%;
					margin:0 auto;
				}
					.faqBox > h4 img{
						max-width:100%;
						height:auto;
						border-bottom: 0;
					}
				.faqBox ul.faqPointBox{
					padding: 10px 0 34px;
				}
					ul.faqPointBox li{
					}
					ul.faqPointBox li:first-child{
						margin: 0 auto;
					}
					ul.faqPointBox li:last-child{
						display: none;
					}

				.faqBox dl.questionBox{
					padding-bottom: 30px;
				}
				.faqBox dl.questionBox:last-child{
					padding-bottom: 0px
				}
					dl.questionBox dt{
						width:17%;
						margin-bottom:2px;
					}
						dl.questionBox dt img{
							max-width:100%;
							height:auto;
						}

					dl.questionBox dd{
						width: 100%;
						border-right: 1px solid #f1f1f1;
						padding: 5px;
					}
					dl.questionBox dd:nth-child(2){
						padding-left: 5px;
						width: 83%;
						font-size: 15px;
					    font-size: 1.5rem;
					    line-height: 1.5;
						box-sizing:border-box;
						margin-bottom:2px;
					}
					dl.questionBox dd.answer{
						padding-left: 5px;
						width: 83%;
						font-size: 14px;
					    font-size: 1.4rem;
						line-height: 1.6;
					}
					dl.questionBox dd.answer.open::after{
						right: 10px;
						top: 30px;

						/* right: 140px;
					    top: 40px; */
					}
					dl.questionBox dd.answer.close::after{
						right: 10px;
						/* right: 140px;
					    top: 40px; */
					}
					dl.questionBox dd.comment{
						padding: 10px;
					}

		.reformFlowBox{
			padding: 30px 0 0;
		}
			.reformFlowBox > h4{
				text-align: center;
				border-bottom: 3px solid #212121;
				width:80%;
				margin:0 auto 10px auto;
			}
				.reformFlowBox > h4 img{
					border-bottom: 0;
				}
			.reformFlowBox ul.flowPointBox{
				padding: 10px 0 10px;
			}
				ul.flowPointBox li{
				}
				ul.flowPointBox li:first-child{
					line-height: 1.33;
				}
				ul.flowPointBox li:last-child{
					display: none;
				}
			.reformFlowBox > p.flowPointComments{

			}
			.reformFlowBox .flowBox{

			}
			.reformFlowBox .flowBox:nth-child(4){
				margin-bottom: 10px;
			}
				.flowBox .headBox{
					justify-content: center;
				}
					.headBox > h5{

					}
					.headBox > p{

					}
				.flowBox:last-child .headBox > p{

				}


				.flowBox .procedureBox{
					padding: 10px 0px;
				}
					.procedureBox dl{
					}
					.procedureBox dl:nth-child(odd){
					}
					.procedureBox dl:nth-child(-n + 2){
					}

						.procedureBox dl > dt{
						}
							.procedureBox dl > dt > ul{

							}
								.procedureBox dl > dt > ul > li{
									width: 100%;
									text-align: center;
								}
								.procedureBox dl > dt > ul > li img{

								}
						.procedureBox dl > dd{
							padding: 10px 10px 0;
						}
						.procedureBox dl > dd::before{

						}
						.procedureBox dl > dd:last-child{
							padding: 10px 10px 20px;
						}
	/* --- //reformBox --- */

	/* --- reformPhotoBox --- */
	.reformPhotoBox{
		width: auto;
	}
		.reformPhotoBox > .photoHeadBox{
			width: auto;
		}
			.reformPhotoBox > .photoHeadBox h3{

			}
				.photoHeadBox > h3 img{
					width: 100%;
				    height: auto;
				}
		.reformPhotoBox > .photoBox{
			width: auto;
			justify-content:center;
		}
			.reformPhotoBox > .photoBox h4{

			}
				.photoBox > .beforeBox{
					width: 100%;
					padding: 10px;
				}
					.beforeBox h5 {
						width: 100%;
					}
					.beforeBox h5::after{

					}
					.beforeBox img {
						width: 46%;
					    height: 46%;
					}
					.beforeBox img:nth-child(n+4){

					}
					.beforeBox img:nth-child(even){

					}
					.beforeBox img:last-child{
						padding-right: 0;
					}
				.photoBox > .afterBox{
					width: 100%;
				    padding: 10px;
				}
					.afterBox h5 {
						width: 100%;
					}
					.afterBox h5::after{

					}
					.afterBox img {
						width: 46%;
					    height: 46%;
					}
					.afterBox img:nth-child(n+4){
					}
					.afterBox img:nth-child(even){
					}
					.afterBox img:last-child{
						padding-right: 0;
					}
				.photoBox > .afterBoxWide{
				    padding: 10px;
					justify-content: center;
				}
				.photoBox > .afterBoxWide::before{

				}
				.photoBox > .afterBoxWide::after{

				}
					.afterBoxWide h5 {

					}
					.afterBoxWide h5::after{

					}
					.afterBoxWide img {
						width: 46%;
					    height: 46%;
					}
					.afterBoxWide img:nth-child(even){
						padding-right: 10px;
					}
					.afterBoxWide img:last-child{
						padding-right: 0;
					}
				.photoBox > .arrowBox{
					margin: 20px auto 20px;
				}
					.arrowBox > .arrow{

					}
					.arrowBox > .arrow::before{
						content: 'none';
						position:absolute;
						content:"";
						border:solid 16px transparent;
						border-top: solid 16px #ffe373;
					    top: 8px;
					    left: -8px;

					}
	/* --- //reformPhotoBox --- */

	/*リフォーム写真リスト*/
	.reform_ba_box{
		width:auto;
	}

		.reform_ba_box > .box_header > h3{
			font-size:5vw;
			line-height:normal;
		}

		.reform_photo_list .box_header h4{
			font-size:5vw;
		}

			.reform_photo_list .box_header h4:after{
				font-size:4vw;
			}

		.reform_photo_list .box_inner ul{
			width:auto;
			padding-left:5px;
		}

			.reform_photo_list .box_inner ul li{
				width:50%;
				margin:0 0 15px 0;
				padding:0 10px;
				box-sizing:border-box;
			}

			.reform_photo_list .box_inner ul li:nth-child(4n){
				margin:0 0 15px 0;
			}

				.reform_photo_list .box_inner ul li img{
					max-width:100%;
					height:auto;
				}


		.reform_ba_box > .box_inner .arr{
			margin:20px auto 0 auto;
		}

			.reform_ba_box > .box_inner .arr p{
				font-size:6vw;
				padding:50px 0 20px 0;
				letter-spacing:0;
			}

	/*//リフォーム写真リスト*/

	/* --- backPageBtnBox --- */
	.backPageBtnBox{

	}
		.backPageBtnBox ul{

		}
			.backPageBtnBox ul li{

			}
				.backPageBtnBox ul li a{

				}
				.backPageBtnBox ul li a:hover{

				}
					.backPageBtnBox > ul > li:nth-child(1) a::before{

					}
					.backPageBtnBox > ul > li:nth-child(1) a:hover::before{

					}
	/* --- //backPageBtnBox --- */

	/* --- contactBox --- */
	.contents .contactBox{
		width:auto;
	}

	.contents .contactBox h3{
		padding-bottom:20px;
	}

	.contents .contactBox > .box_inner{
		width:auto;
	}

	.contents .contactBox > .box_inner .contactPhoneBox p{
		font-size:1.1em;
		line-height:1.4em;
		margin-bottom:10px;
	}

	.contents .contactBox > .box_inner .contactPhoneBox > ul{
		text-align:center;
	}

	.contents .contactBox > .box_inner .contactPhoneBox > ul > li{
		margin-bottom:20px;
	}

	.contents .contactBox > .box_inner .contactPhoneBox > ul > li > ul > li:last-child{
		margin:5px 0 0 0;
	}

	.contents .contactBox ul.contactLinkBox{
		width:100%;
		text-align:center;
		margin-top:20px;
	}
	/* --- //contactBox --- */

}