@charset "utf-8";

/* レイアウト */
.mvArea {
	position: relative;
	height:736px;
	background-size: cover;
	background-position: center;
}
@media screen and (max-width:640px) {
	.mvArea {
		height:100vw;
	}
}
.mvArea img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.comTitle01 .top {
	margin-top:-175px;
	background-color:rgba(0,0,0,0.7);
}
.comTitle01 .bottom {
	background-image:none;
}
@media screen and (max-width:640px) {
	.comTitle01 .top {
		margin-top:-24vw;
	}
}


.point {
	padding-top:72px;
}
.point .pointTop {
	text-align:center;
	font-size:0;
}
.point .pointTop h2,
.point .pointTop h1 {
	max-width:246px;
	display:block;
	margin:0 auto -120px;
	position:relative;
	z-index: 1;
}
@media screen and (max-width:1200px) {
	.point .pointTop .in {
		padding:0;
		width:100%;
	}
	.point .pointTop .in .txt {
		width:90%;
		margin:0 auto;
	}
	.point .pointTop h2,
	.point .pointTop h1 {
		width:18%;
		margin-bottom:-9%;
	}
}
.point .pointTop h2 img,
.point .pointTop h1 img {
	max-width:100%;
	height:auto;
}
.point .pointTop figure {
	width:100%;
	max-height:700px;
	height:42vw;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	position: relative;
}
.point .pointTop figure img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.point .pointTop .txtWrap {
	padding:95px 0 45px;
	background-position:center;
	background-repeat:no-repeat;
}
.point.point1 .pointTop .txtWrap {
	background-image:url(../img/point01_txt_bg.png);
	background-size:792px 190px;
}
.point.point2 .pointTop .txtWrap {
	background-image:url(../img/point02_txt_bg.png);
	background-size:844px 235px;
}
.point.point3 .pointTop .txtWrap {
	background-image:url(../img/point03_txt_bg.png);
	background-size:905px 230px;
}
.point .pointTop .txtWrap .copy {
	margin-bottom:38px;
}
.point .pointTop .txtWrap .txt {
	font-size:14px;
	font-size:1.4rem;
	letter-spacing:0.05em;
	line-height:25px;
	line-height:2.5rem;
}
@media screen and (max-width:960px) {
	.point .pointTop .txtWrap {
		background-image:none;
	}
}
@media screen and (max-width:640px) {
	.point {
		padding-top:8%;
	}
	.point + .point {
		margin-top: 15%;
	}
	.point .pointTop h2,
	.point .pointTop h1 {
		margin-bottom:-15%;
		width: 30%;
	}
	.point .pointTop figure {
		height: 192px;
		height:60vw;
	}
	.point .pointTop .txtWrap {
		padding:8% 0 5%;
	}
	.point .pointTop .txtWrap .copy {
		margin-bottom:5%;
	}
	.point .pointTop .txtWrap .copy img {
		height: 38px;
		height:12vw;
		width:auto;
	}
	.point .pointTop .txtWrap .txt {
		text-align:left;
		font-size: .9rem;
		line-height: 1.7rem;
	}
}
.point .pointBottom {
	padding:50px 0 100px;
	font-size:0;
	text-align:center;
	background-color:#e7e2e0;
}
.point .pointBottom ul {
}
.point .pointBottom ul li {
	background-color:#F4EFED;
	display:inline-block;
	padding:30px 30px 100px 30px;
	width:30.6%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	vertical-align:top;
	position: relative;
}
.point .pointBottom ul li.nolink {
	padding-bottom: 30px;
}
@media screen and (max-width:1200px) {
	.point .pointBottom ul li {
		padding:2% 2% 100px;
	}
}
.point .pointBottom ul li + li {
	margin-left:4.1%;
}
.point .pointBottom ul li figure {
	position: relative;
	margin-bottom:30px;
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	width:100%;
	height:16vw;
	max-height:270px;
}
.point .pointBottom ul li figure img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.point .pointBottom ul li .txtWrap {
}
.point .pointBottom ul li .txtWrap .copy {
	margin-bottom:22px;
}
.point .pointBottom ul li .txtWrap .copy img {
	max-height:89px;
	height:6vw;
	width:auto;
}
.point .pointBottom ul li .txtWrap .txt {
	min-height:75px;
	font-size:14px;
	font-size:1.4rem;
	line-height:25px;
	line-height:2.5rem;
	text-align:left;
}
.point .pointBottom ul li .txtWrap .comBtn01 {
	margin-top:20px;
	position: absolute;
	bottom: 30px;
	left: 40px;
	right: 40px;
	max-width:100%;
}
.point .pointBottom .bottomLink {
	margin-top:40px;
}
.point .pointBottom .bottomLink .comBtn01 {
	width: 300px;
	max-width: 100%;
}

@media screen and (max-width:960px) {
}
@media screen and (max-width:640px) {
	.point .pointBottom {
		padding:5% 0 8%;
	}
	.point .pointBottom ul {
	}
	.point .pointBottom ul li {
		padding:5%;
		width:100%;
	}
	.point .pointBottom ul li figure {
		margin-bottom:7%;
		height:50vw;
	}
	.point .pointBottom ul li + li {
		margin:8% 0 0 0;
	}
	.point .pointBottom ul li > .txtWrap {
	}
	.point .pointBottom ul li > .txtWrap .copy {
		margin-bottom:5%;
	}
	.point .pointBottom ul li > .txtWrap .copy img {
		height: 58px;
		height:18vw;
	}
	.point .pointBottom ul li > .txtWrap .txt {
		font-size: .9rem;
		line-height: 1.7rem;
	}
	.point .pointBottom ul li > .txtWrap .comBtn01 {
		margin-top:5%;
		position: static;
		width: 100%;
	}
	.point .pointBottom .bottomLink .comBtn01 {
		max-width:90%;
	}
}



.conceptKiyomizu .top {
	position: relative;
	background-size: cover;
	padding: 100px 50px;
	text-align: center;
	font-family: serif;
	background-position:30%;
	color: #fff;
	font-size:0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.conceptKiyomizu .top .bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.conceptKiyomizu .top .comBoxLine {
	position: relative;
	margin:0 auto;
	max-width:640px;
	background:none;
}
.conceptKiyomizu .top .comBoxLine .in {
	padding:0 50px;
	height:230px;
	white-space:nowrap;
}
.conceptKiyomizu .top .comBoxLine .in:before {
	content:"";
	display:inline-block;
	height:100%;
	width:0;
	vertical-align:middle;
}
.conceptKiyomizu .top .comBoxLine .in h2 {
	display:inline-block;
	vertical-align:middle;
	white-space:normal;
}
.conceptKiyomizu .top .comBoxLine .in h2 img {
	padding:5px 0;
}
@media screen and (max-width:640px) {
	.conceptKiyomizu .top {
		padding:10% 5%;
	}
	.conceptKiyomizu .top .comBoxLine {
	}
	.conceptKiyomizu .top .comBoxLine .in {
		padding:0;
		height:30vw;
	}
	.conceptKiyomizu .top .comBoxLine .in h1 {
	}
	.conceptKiyomizu .top .comBoxLine .in h1 img {
		height: 26px;
		height:5vw;
		width:auto;
	}
}
.conceptKiyomizu .bottom h1 {
	text-align: center;
	padding-top: 75px;
	color: #c1a97b;
	font-size: 0;
	font-family: serif;
	padding-bottom: 30px;
}

.conceptKiyomizu .bottom ul {
	font-size:0;
	padding: 0 0 75px 0;
	text-align: center;
}

.conceptKiyomizu .bottom ul li {
	display: inline-block;
	width:11.6%;
}
.conceptKiyomizu .bottom ul li a {
	-webkit-transition:0.3s;
	-o-transition:0.3s;
	transition:0.3s;
	display:block;
}
.no-touchevents .conceptKiyomizu .bottom ul li a:hover {
	-webkit-filter:brightness(120%);
	-o-filter:brightness(120%);
	filter:brightness(120%);
	opacity:0.8;
}
.conceptKiyomizu .bottom ul li + li {
	margin-left:6.08%;
}

.conceptKiyomizu .bottom ul li figure {
	width:100%;
	margin-bottom:20px;
	padding-bottom:100%;
	border-radius:50%;
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	overflow:hidden;
	position:relative;
}
.conceptKiyomizu .bottom ul li figure:after {
	content:"";
	display:block;
	margin:auto;
	width:100%;
	height:100%;
	border-radius:50%;
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	opacity:0;
	-webkit-transition:opacity 0.3s;
	-o-transition:opacity 0.3s;
	transition:opacity 0.3s;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
.no-touchevents .conceptKiyomizu .bottom ul li a:hover figure:after {
	opacity:1;
}
.conceptKiyomizu .bottom ul .kiyo01 figure {
	background-image:url(../img/kiyomizu_01.png);
}
.conceptKiyomizu .bottom ul .kiyo02 figure {
	background-image:url(../img/kiyomizu_02.png);
}
.conceptKiyomizu .bottom ul .kiyo03 figure {
	background-image:url(../img/kiyomizu_03.png);
}
.conceptKiyomizu .bottom ul .kiyo04 figure {
	background-image:url(../img/kiyomizu_04.png);
}
.conceptKiyomizu .bottom ul .kiyo05 figure {
	background-image:url(../img/kiyomizu_05.png);
}
.conceptKiyomizu .bottom ul .kiyo06 figure {
	background-image:url(../img/kiyomizu_06.png);
}
.conceptKiyomizu .bottom ul .kiyo01 figure {
}

.conceptKiyomizu .bottom ul li p img {
	max-width:100%;
	height:auto;
}

.conceptKiyomizu .bottom ul li p {
	font-size: 16px;
	font-size: 1.6rem;
	font-family: serif;
}

@media screen and (max-width:640px) {

	.conceptKiyomizu .bottom ul li p img {
		width: auto;
		height: 32px;
		height: 10vw;
	}
	.conceptKiyomizu .bottom h1 {
		padding:10% 0 8%;
	}
	.conceptKiyomizu .bottom h1 img {
		width: auto;
		height: 30px;
		height: 9.5vw;
	}
	.conceptKiyomizu .bottom ul li {
		margin-top:4%;
		width:48%;
	}
	.conceptKiyomizu .bottom ul li + li {
		margin-left:0;
		margin-bottom: 6%;
	}
	.conceptKiyomizu .bottom ul li:nth-child(2n+2) {
		margin-left:4%;
	}
	.conceptKiyomizu .bottom ul li:nth-child(-n+2) {
		margin-top:0;
	}

}

.mincho {font-family: source-han-serif-japanese,serif;}
.comTitle01 .bottom .copy.mincho {font-size: 24px;text-align: center;font-weight: 700;line-height: 1.7;}
.point .pointTop .txtWrap .copy.mincho {font-size: 24px;text-align: center;font-weight: 700;line-height: 1.7;color: #7e6606;}
.point .pointBottom ul li .txtWrap .copy.mincho {font-size: 20px;text-align: center;font-weight: 700;line-height: 1.7;color: #7e6606;}
.conceptKiyomizu .top .comBoxLine .in h2 {font-size: 24px;text-align: center;font-weight: 700;line-height: 1.7;color: #FFFFFF;}

@media screen and (max-width:640px) {
	.comTitle01 .bottom .copy.mincho {font-size: 4vw;text-align: center;font-weight: 700;line-height: 1.7;letter-spacing: 0.05em;}
	.point .pointTop .txtWrap .copy.mincho {font-size: 4.4vw;text-align: center;font-weight: 700;line-height: 1.7;color: #7e6606;letter-spacing: 0.05em;}
	.point .pointBottom ul li .txtWrap .copy.mincho {font-size: 4vw;text-align: center;font-weight: 700;line-height: 1.7;color: #7e6606;letter-spacing: 0.05em;}
	.conceptKiyomizu .top .comBoxLine .in h2 {font-size: 4.4vw;text-align: center;font-weight: 700;line-height: 1.7;color: #FFFFFF;letter-spacing: 0.05em;}
}