@charset "UTF-8";

.pageContainer
{
	padding-right: 2rem;
}

.sectionTitle, .subSectionTitle
{
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	position: relative;
	display: block;
	max-width: 850px;
	font-size: 1.3em;
	margin-bottom: 1.5em;
	letter-spacing: 0.05em;
	line-height: 1.5;
}
.pageContainer .sectionTitle:after
{
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	bottom: -2px;
	border-bottom: 2px solid rgb(230, 0, 18);
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;	
}
.pageContainer.end .sectionTitle:after
{
	width: 100%;
}

.subTitle
{
	position: relative; 
	box-sizing: border-box;
	height: 3rem;
	width: 100%;
	background-repeat: no-repeat;
	background-size: contain;
	margin-bottom: 1rem;
}
.svg .subTitle._1{background-image: url(../_img/reiSubTitle_1.svg)}
.svg .subTitle._2{background-image: url(../_img/reiSubTitle_2.svg)}
.svg .subTitle._3{background-image: url(../_img/reiSubTitle_3.svg)}

/**********************************************************************/
/******************************** Copy *******************************/
/**********************************************************************/

#copy
{
	position: relative;
	margin-top: 7rem;
	padding-top: 10rem;
	z-index: -9999px;
}

#copy .title
{
	width: 530px;
	background-position: 0% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}
#copy .title:before
{
	content: "";
	text-indent: -9999px;
	position: relative;
	display: block;
	padding-top: 16.5%;
}
.svg #copy .title{background-image: url(../_img/reiTitle.svg);}
.no-svg #copy .title{background-image: url(../_img/reiTitle.png);}

#copy.pageContainer{margin-bottom: 4rem;}

/*********************************************************************/
/**************************** subSelector *****************************/
/*********************************************************************/

#subSelector .title
{
	width: 1.7rem;
	position:relative;
	margin-top: 3rem;
	background-size: cover;
}
#subSelector .title:before
{
	content: "Renovation";
	text-indent: -9999px;
	position: relative;
	display: block;
	padding-top: 1500%;
}

.svg #subSelector .title{background-image: url(../_img/reiSideTitle.svg);}
.no-svg #subSelector .title{background-image: url(../_img/reiSideTitle.png);}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// Concept ////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#concept .description
{
	box-sizing: border-box;
	position: relative;
	max-width: 850px;
}

#concept .description div
{
	margin-bottom: 2rem;
}

/*//////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////// 実績 /////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/


.reiProjects{margin: 5rem 0;}

.reiSliderWrapper
{
	position: relative;
	margin-top: 1rem;
	margin-bottom: 0rem;
	width: 100%;
	position: relative;
	max-width: 850px;
	box-sizing: border-box;	
	padding: 0 50px;
}

#reiSlider
{
	width: 100%;
}

#reiSlider .photoTrim
{
	width: 100%;

}

#reiSlider
{
	position: relative;
	z-index: 0;
}

#reiSlider .bannerSlideContainer
{
	position: relative;
	width: 100%;

}

#reiSlider .bannerChildren
{
	position: relative;
	float: left;

	width: 100%;

	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:nowrap;
	-moz-flex-wrap:nowrap;
	-ms-flex-wrap:nowrap;
	flex-wrap:nowrap;
	
/*	-webkit-align-items: center;
	align-items: center;*/
}

#reiSlider .bannerChildren .textWrapper
{
	flex: 1;
	position: relative;
	padding-left: 1rem;
	padding-right: .5rem;
	line-height: 1.7;
	font-size: .9em;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
}
#reiSlider .bannerChildren .textWrapper .children{width: 100%;}
#reiSlider .bannerChildren .textWrapper h5, #reiSlider .bannerChildren .textWrapper span.list-1
{
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
}
#reiSlider .bannerChildren .textWrapper h5{font-size: 1em; margin-bottom: .5rem;}


#reiSlider .bannerChildren .photoWrapper
{
	position: relative;
	padding: 0 1rem;

	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	
	-webkit-flex-wrap:nowrap;
	-moz-flex-wrap:nowrap;
	-ms-flex-wrap:nowrap;
	flex-wrap:nowrap;
}

#reiSlider .bannerChildren img{height: 180px; display: block; margin-left: .1rem;}

#reiSlider .sumnailWrapper
{
	box-sizing: border-box;
	margin: 0 auto;
	padding: 2em 1em;
}

#reiSlider .sumnailWrapper ul
{
	width: 100%;
/*	text-align: center;*/
}

#reiSlider .sumnailWrapper ul li
{
	box-sizing: border-box;
	cursor: pointer;
	width: 3em;
	height: 3em;
	display: inline-block;
	margin: 0 .1em;
	border-radius: 50%;
	background-size: cover;
	background-color: white;
	
	border: .1em solid rgb(200, 200, 200);
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
}
#reiSlider .sumnailWrapper ul li.now
{
	border-color: rgb(230, 0, 18);
}

.reiProjects .linkBtGray
{
	text-decoration: none;
	margin-top: 2rem;
	display: block;
	cursor: pointer;
	position:relative;
	box-sizing: border-box;
	display: inline-block;
	color: rgba(150, 150, 150,1);
	border: 2px solid;
	border-radius: 0rem;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
}

.reiProjects .linkBtGray p
{
	display: block; 
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	text-align: center;
	font-size: 1em;
	padding: .25rem 2rem;
}

.reiProjects .linkBtGray:hover
{
	color: rgba(255, 255, 255,1);
	background-color: rgba(150, 150, 150,1);
	border-color: rgba(150, 150, 150,1);
}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// Seminar ////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#seminar
{
	position: relative;
}

.seminarTitle
{
	font-size: 1.2em;
	padding-left: 1.5em;
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	position: relative;
	margin-bottom: 1em;
	line-height: 1.5;
}
.seminarTitle:before
{
	content: "";
	display: block;
	left:  0;
	position: absolute;
	margin-top: .25em;
	width: 1em;
	height: 1em;
	box-sizing: border-box;
	border: 2px solid rgb(230, 0, 18);
	border-radius: 50%;
}

#seminar .seminarContents
{
	box-sizing: border-box;
	position: relative;
	max-width: 850px;
	margin-top: 5rem;
}
#seminar .seminarContents._1{margin-top: 3rem;}

.seminarContents ul br{display: none;}

.seminarContents li
{
	list-style: none;
	padding-left: 1.2em;
	position: relative;
}
.seminarContents li:before
{
	content: "";
	display: block;
	left:  0;
	position: absolute;
	top: .5em;
	width: 1em;
	height: 1em;
	box-sizing: border-box;
	border: 1px solid;
	border-radius: 50%;
}

.seminarContents .info{margin-top: 1rem;}
.seminarContents .info p span
{
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
}

#seminar .date
{
	margin-top: 1rem;
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	display: inline-block;
	border-bottom: 1px solid rgb(230, 0, 18);
}

.caution{font-size: .8rem;}
.red{color: rgb(230, 0, 18);}

#sendDate
{
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	box-sizing: border-box;
	padding: .5rem 0;
	text-align: center;
	border-style:solid;
	border-color: rgb(200, 200, 200);
	border-width: 1px 0;
	font-size: .8rem;
	margin-top: 2rem;
/*	width: 20rem;*/
}
#sendDate span:last-child
{
	margin-left: .5rem;
}

#seminar input, #seminar textarea, #typeArea, select
{
	font-size: 16px;
	background-color: rgb(255, 255, 255);
	padding:.5em;
	border: 1px solid rgb(200, 200, 200);
	box-sizing: border-box;
}

#seminar input:focus, #seminar textarea:focus, #typeArea:focus
{
	outline: 0;
	background-color: rgb(250,250,250);
	border-color: rgb(150, 150, 150);
}

#seminar textarea{height:10rem;}

#seminar .contactParts{margin:2em 0;}

#typeArea{width: 20em;}

#seminar #privacyArea{display:inline; width: auto; margin-right: .5rem; margin-top: 2rem;}
#seminar .statement{box-sizing: border-box; margin:1em 0; border:1px solid rgb(200, 200, 200); height:250px; overflow: auto; clear: both;}
#seminar .statement div{padding: 1em; font-size: .9rem;}
#seminar .statement div .head{text-align: center; border-bottom: 1px solid; margin-bottom: 1em;}

#seminarSend, .reforma_back
{
	margin-top: 2rem;
	cursor: pointer;
	position:relative;
	box-sizing: border-box;
	display: inline-block;
	color: rgba(150, 150, 150,1);
	border: 2px solid;
	border-radius: 0rem;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
}

#seminarSend:after{content: "SEND";}

#seminarSend:after, .reforma_back p
{
	display: block; 
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	text-align: center;
	letter-spacing: .5rem;
	font-size: 1rem;
	padding: .25rem 5rem;
}

#seminarSend:hover, .reforma_back:hover
{
	color: rgba(255, 255, 255,1);
	background-color: rgba(150, 150, 150,1);
	border-color: rgba(150, 150, 150,1);
}

label{margin-right:1em; margin-bottom: 1rem; min-width: 5em; display:block;}

#seminar input{width: 20rem;}
#seminar textarea{box-sizing: border-box; width: 100%;}


#aboutRei .seminarContents
{
	box-sizing: border-box;
	position: relative;
	max-width: 850px;
	margin-top: 5rem;
}

.seminarContents .portrait
{
	width: 150px;
	height: 200px;
	margin-right: 1rem;
	background-color: rgb(200, 200, 200);
	float: left;
}

.seminarContents .seminarPhoto
{
	width: 100%;
	max-width: 650px;
	position: relative;
	background-image: url(../_img/reiAbout.jpg);
	background-size: contain;
}
.seminarContents .seminarPhoto:before
{
	content:"";
	display: block;
	position: relative;
	padding-top: 70%;
}

.seminarContents .profile
{
	width: 650px;
	float: none;
}
.seminarContents .profile .name
{
	font-family: "見出ゴMB31","MidashiGoPro-MB31", "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo, "メイリオ","ＭＳ Ｐゴシック";
	font-weight: bold;
	font-size: 1.1em;
	margin-bottom: .5em;
}

/*//////////////////////////////////////////////////////////////////////////////////
///////////////////////////////// MEDIA SCREEN /////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/


@media screen and (max-width: 1100px)
{
	.seminarContents .portrait
	{
		margin-bottom: 1rem;
		float: none;
	}
	
	.seminarContents .profile
	{
		width: 100%;
		float: none;
	}
}

@media screen and (max-width: 950px)
{
	#reiSlider .bannerChildren
	{
		-webkit-flex-wrap:wrap;
		-moz-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		-webkit-align-items: unset;
		align-items: unset;
	}
	#reiSlider .bannerChildren .photoWrapper
	{
		width: 100%;
		margin-bottom: 1rem;
		-webkit-flex-wrap:wrap;
		-moz-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		-webkit-align-items: flex-end;
		align-items: flex-end;
	}
	#reiSlider .bannerChildren .textWrapper
	{
		width: 100%;
		-webkit-align-items: flex-start;
		align-items: flex-start;
	}
	
}

@media screen and (min-width: 650px)
{
	.reiSliderWrapper
	{
/*		min-width: 750px;*/
	}
	#seminar #seminarFormWrapper
	{
		width: 600px;
	}
}

@media screen and (max-width: 650px)
{
	#copy
	{
		margin-top: 7rem;
		padding-top: 8rem;
	}
	#copy .title{width: 100%;}
	.svg #copy .title{background-image: url(../_img/reiTitle_v.svg);}
	.no-svg #copy .title{background-image: url(../_img/reiTitle_v.png);}
	#copy.pageContainer{margin-bottom: 3rem;}
	
	.subTitle
	{
		position: relative; 
		box-sizing: border-box;
		width: 100%;
		background-repeat: no-repeat;
		background-size: contain;
		margin-bottom: 1em;
	}
	.subTitle:before
	{
		content:"";
		display: block;
		position: relative;
		padding-top: 11%;
	}
	.svg .subTitle._1{background-image: url(../_img/reiSubTitle_1_v.svg)}
	.svg .subTitle._2{background-image: url(../_img/reiSubTitle_2_v.svg)}
	.svg .subTitle._3{background-image: url(../_img/reiSubTitle_3_v.svg)}
	
	.reiSliderWrapper{padding: 0 1em;}

	#reiSlider .bannerChildren img{height: 120px;}
	
	#seminar #formContainer
	{
		width: auto;
	}
	
	.sectionTitle, .subSectionTitle{font-size: 1.3em;}
	.sectionTitle br, .subSectionTitle br{display: none;}
	.sectionTitle span, .subSectionTitle span{display: block;}
	
	#seminar input, #typeArea, #seminar textarea{width: 100%;}
	#seminar .statement{width: 100%; height: 200px;}
}