@charset "UTF-8";
/* CSS Document */

a, a:hover, a:active, a:focus {
    text-decoration:none !important
}

img {
    max-width: 100%;
    max-height:100%
}

.wrapper {
    max-width: 1000px;
    margin: auto;
    width:90%
}

.wrapper1200 {
    max-width: 1200px;
    margin: auto;
    width:90%
}

.wrapper1240 {
    max-width: 1240px;
    margin: auto;
    width:90%
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

.mincho{font-family: "Noto Serif JP","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
/*flexbox*/
.flex{display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap:wrap;}
.flex--start{/*左寄せ*/justify-content: flex-start;-webkit-justify-content: flex-start;}
.flex--center{/*中央寄せ*/justify-content: center;-webkit-justify-content: center;}
.flex--end{/*右寄せ*/justify-content: flex-end;-webkit-justify-content: flex-end;}
.flex--bet{/*残り余白の均等割り*/justify-content: space-between;-webkit-justify-content: space-between;}
.flex--around{/*左右余白 ＋ 均等割り*/justify-content: space-around;-webkit-justify-content: space-around;}
.flex--between{/*両端揃え*/
	-webkit-box-pack:justify;  -ms-flex-pack:justify;  justify-content:space-between;}
/*col*/
.col1{width:100%;}.col2{width:48%;}.col3{width:30%;}.col4{width:25%;}.col5{width:18.4%;}.col6{width:15%;}.col3_2{width: 68%}
.vaC{align-items: center;}.vaB{align-items: flex-end;}
.sp {display: none;}
.pc {display: block;}
.inner--base{max-width: 1200px;margin: auto}

#header-menu1 .coming a{opacity: 0.5; pointer-events:none;}
#header-nav > ul > li > a{ font-size: 100%; }

.lead02 {
    font-size: 1.2rem;
    line-height: 2.0;
}

@media screen and (max-width: 810px) {/*スマホ設定*/
.sp {display: block!important;}
.pc {display: none!important;}
.inner--base{width: 96%}
}
@media screen and (max-width: 810px) {
    .seller li {
        width:88%
    }
}

@media screen and (max-width: 810px) {
    .seller:last-child li {
        margin-bottom:-20px
    }
}




/* ページタイトル・パンくず・ノート */
.page-ttl {
    padding: 0.6em;
    /* background-color: #C6BF8A; */
    color: #000;
    text-align: center;
    font-family: 'Noto Serif JP', serif;
    font-size: 28px;
    line-height: 1.5;
    font-weight: normal;
    letter-spacing: 0.2em;
}
.page-ttl span {
    font-family: 'Cinzel', serif;
    display: block;
    font-size: 70%;
    letter-spacing: 0.2em;
}

.title-area {
    /* background: url(../images/concept/title-area.jpg) no-repeat center center; */
    background-size: cover;
    display: flex;
    align-items: center;
    /* height: 110px; */
    background-color: #C6BF8A;
}

#pankuzu {
    margin:20px 0
}

#pankuzu .wrapper {
    max-width:1240px
}

#pankuzu .pankuzu-list {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    font-family: "Noto Sans JP", sans-serif
}

#pankuzu .pankuzu-list li {
    font-size: 12px;
    color: #333;
    list-style: none;
    margin:0 5px
}

#pankuzu .pankuzu-list li a {
    color: #46a0a5;
    position:relative
}

#pankuzu .pankuzu-list li a::before {
    position: absolute;
    content: "";
    border-bottom: 1px solid #46a0a5;
    bottom: 0;
    width:100%
}
.note-box {
    text-align: left;
    width: 100%;
    margin: 60px 0 0;
    padding-bottom: 60px;
    font-size: 0.8rem;
}

@media screen and (max-width: 810px) {
#pankuzu {display: none}
/* .title-area {margin-bottom: 30px;} */
.page-ttl {
        font-size: 4.8vw;
        font-size: clamp(17px, 4.8vw, 19px);
    }
}




/* トップページ */


/* MV用 */
:root {
	--winheight: calc(100vh - 238px);
}
.jsMainVisual {
	height: var(--winheight);
	overflow: hidden;
	background-color: #000;
	position: relative;
}
.jsMainVisual .mainImg {
	position: relative;
	opacity: 0;
	transition: opacity 1s 1s,transform 12s 2s;
}
.jsMainVisual.active .mainImg {
	opacity: 1;
	transform: translateY(calc(-100% + (var(--winheight) + 27%)));
}
.jsMainVisual .bg {
	margin-top: -367px;
	margin-left: -72px;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: 2490px;
}
.jsMainVisual .bg img {
	width: 100%;
	transform: translateY(-7.7rem);
}
.jsMainVisual .light {
	width: 960px;
	margin-left: -160px;
	position: absolute;
	left: 50%;
	bottom: 915px;
	transform: translateX(-50%);
	z-index: 1;
}
.jsMainVisual .tree {
	margin-left: -72px;
	position: absolute;
	left: 50%;
	bottom: 124px;
	transform: translateX(-50%);
	width: 2490px;
	z-index: 5;
}
.jsMainVisual .tree img {
	max-width: 100%;
}
.jsMainVisual .textBox {
	position: absolute;
	max-width: 1600px;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	padding-left: 5%;
}
.jsMainVisual .textBox .textImg {
	width: 84px;
	position: absolute;
	right: 23.6%;
	top: 15%;
	height: 57%;
	opacity: 0;
	transition: all 1s 8s;
	z-index: 2;
}
.jsMainVisual.active .textBox .textImg {
	opacity: 1;
}
.jsMainVisual .textBox .textImg img {
	max-height: 100%;
}
.jsMainVisual .titleImg {
	padding-top: 1.4%;
	height: 100%;
	max-width: 763px;
	width: 48%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	opacity: 0;
	transition: all 1s 9s;
	position: relative;
	z-index: 1;
}
.jsMainVisual.active .titleImg {
	opacity: 1;
}
.jsMainVisual .titleImg img {
	max-width: 100%;
	max-height: 100%;
}
.jsMainVisual .mvTxt01 {
	width: 14px;
	position: absolute;
	left: 26.5%;
	bottom: 28%;
	opacity: 0;
}
.jsMainVisual .mvTxt02 {
	width: 50px;
	position: absolute;
	left: 5%;
	bottom: 8%;
	opacity: 0;
}
.jsMainVisual .mvTxt03 {
	position: absolute;
	right: 5.2%;
	bottom: 27%;
	width: 96px;
	opacity: 0;
}
.jsMainVisual.active .mvTxt01,
.jsMainVisual.active .mvTxt02,
.jsMainVisual.active .mvTxt03 {
	opacity: 1;
	transition: all 1s 9s;
}
#appeal-area {
	background-color: #000;
}
#appeal-area .textImg01 {
	/* padding: 32px 0; */
	width: 69%;
	/* max-width: 1039px; */
	margin: 0 auto;
}
#appeal-area .textImg02 img {
	margin: 0 auto;
	max-width: 1122px;
	width: 70%;
}
#appeal-area .textImg02 {
	/* background: url(../../images/top/mv_point_bg.png) left top / cover; */
	background: #806c3d;
    background: linear-gradient(90deg, rgba(128, 108, 61, 1) 0%, rgba(166, 139, 83, 1) 31%, rgba(201, 172, 99, 1) 50%, rgba(166, 139, 83, 1) 66%, rgba(156, 143, 81, 1) 100%);
}
@media screen and (max-width: 1150px) {
	.jsMainVisual .textBox .textImg {
		right: 10.6%;
	}
	.jsMainVisual .mvTxt03 {
		bottom: 24%;
	}
}
@media screen and (max-width: 810px) {
	.jsMainVisual .sp {
		display: block !important;
	}
	:root {
		--winheight: calc(100vh - 218px);
	}
	.jsMainVisual {
		height: var(--winheight);
		position: relative;
	}
	.jsMainVisual.active .mainImg {
		transform: translateY(calc(-100% + (var(--winheight) + 10%)));
	}
	.jsMainVisual .bg {
		margin: 0;
		max-width: 850px;
		width: 155.5%;
	}
	.jsMainVisual .bird {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: 0;
		z-index: 10;
		max-width: 850px;
		width: 155.5%;
	}
	.jsMainVisual .bird img {
		display: block;
		margin-left: -34px;
		width: 100%;
	}
	.jsMainVisual::before {
		position: absolute;
		left: 0;
		top: calc(var(--winheight) - 37.5vh);
		width: 100%;
		height: 37.5vh;
		background: url(../../images/top/mv_cover.png) left top / cover;
		content: '';
		z-index: 1;
		transition: opacity 3s 2s,visibility 3s 2s;
		opacity: 1;
	}
	.jsMainVisual.active::before {
		opacity: 0;
		visibility: hidden;
	}
	.jsMainVisual .tree {
		margin-left: 0;
		max-width: 850px;
		width: 155.5%;
		bottom: 0;
	}
	.jsMainVisual .tree img {
		margin-left: -34px;
	}
	.jsMainVisual .textBox {
		padding-left: 0;
		left: 0;
		transform: translateX(0);
		max-width: inherit;
	}
	.jsMainVisual .textBox .textImg {
		width: 36px;
		right: 14%;
		height: auto;
		top: auto;
		bottom: 15.5%;
	}
	.jsMainVisual .titleImg {
		padding: 0 0 7% 11px;
		max-width: 300px;
		align-items: flex-end;
	}
	.jsMainVisual .light {
		margin-left: -20px;
		bottom: 8.5%;
		max-width: 510px;
		width: 100%;
	}
	.jsMainVisual .lightUnder {
		margin-left: -20px;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		bottom: 10%;
		max-width: 510px;
		width: 100%;
	}
	.jsMainVisual .bg img {
		transform: translateY(0);
		margin-left: -34px;
	}
	.jsMainVisual .mvTxt01 {
		top: auto;
		max-width: 12px;
		width: 2%;
		bottom: 32%;
	}
	.jsMainVisual .mvTxt02 {
		width: 30px;
		left: auto;
		right: 4%;
	}
	#appeal-area .textImg01 {
		padding: 30px 0;
		width: 86%;
	}
	#appeal-area .textImg02 {
		padding: 30px 0;
		margin: 0 auto;
	}
	#appeal-area .textImg02 img {
		width: 82%;
	}
}
@media screen and (max-width: 810px) and (min-width: 780px) {
	.jsMainVisual .bg img {
		margin-left: 0;
	}
	.jsMainVisual .bird img {
		margin-left: 0;
	}
	.jsMainVisual .tree img {
		margin-left: 0;
	}
}
@media screen and (max-height: 700px) {
	:root {
		--winheight: calc(100vh - 218px);
	}
	.jsMainVisual.active::before {
		top: calc(var(--winheight) - 25vh);
		height: 25vh;
	}
}





/* アクセスページ */

#access .map_area {
	margin-bottom: 80px;
}
#access .link-btn {
    width: 320px !important;
    margin: 0 20px;
}
@media screen and (max-width: 810px) {
	#access .map_area {
		margin-bottom: 30px;
	}
	#access .btn_area {
		gap: 20px;
	}

}



/* コンセプトページ */

.concept--lead {
    background: #000;
	background: #000 url(../images/concept/concept_bg01.webp) no-repeat center/cover;
}

.concept--lead h2 {
    padding: 60px 20px;
    line-height: 2.4;
    text-align: right;
	color: #fff;
}
.shape{
	float: left;
	width: min(44vw, 500px);
	height: auto;
	margin: 24px 32px 16px 0;

	/* 実画像を回り込み対象にする */
	shape-outside: margin-box;
}

.concept_map {
    background: #000;
	background: #000 url(../images/concept/concept_bg02.webp) no-repeat center/cover;
}
.map-img {
    padding-top: 40px;
}
.concept_map-txt {
    margin-top: 30px;
    font-size: 1.0rem;
    line-height: 2.0;
}

@media screen and (max-width: 810px) {
	.concept--lead {
		background: #000;
		background: #000 url(../images/concept/concept_bg01_sp.webp) no-repeat center/contain;
	}
	.shape{
		float: none;
		width: 80%;
	}



}



/* ロケーション */

.location_area,  .life-infoWrap, .life-info{
    background: #000;
    color: #fff;
}
#location .lead02 {
	margin: 60px auto;
}
.life-infoWrap {
    padding: 60px 0 0;
}
.life-info h2 {
    width: 30%;
    padding: 60px 0 20px;
}
.life-information h4 {
    margin-top: 60px;
    padding-bottom: 30px;
}

.life-information h4{margin-top: 60px;padding-bottom: 30px;}
.location_area h4 {
	color: #afa462;
    font-size: 1.4rem;
    text-align: left;
    margin: 20px 0 12px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.location_area h4::after {
    content: '';
	display: block;
	width: 100%;
	height: 1px;
	background: #fff;
}

.location-li-item {font-size: 1rem;}

.location-li > div:last-child .location-li-item:last-child {margin-bottom: 0;}
.location-li-item-header {font-size:116%;letter-spacing:.2em;margin:0 0 15px;color: #ef8200;}

.location-li-item > p {margin: 0 0 5px;font-size: 85%;}
.location-li-item ul {list-style-type:none;margin:0;padding:0;}
.location-li-item ul li {position:relative;margin-bottom:10px;line-height:1.5;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between;-webkit-align-items:flex-end;-ms-align-items:flex-end;align-items:flex-end;font-size: 85%;}
.location-li-item ul li:last-child {margin-bottom: 0;}
.location-li-item ul li span {position:relative;z-index:1;display:inline-block;padding-right:10px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:100%;text-align: left;}
.location-li-item ul li > span:first-child {width: calc(100% - 12.5em);position: relative;overflow: hidden;}
.location-li-item ul li.subItem > span:first-child {padding-left: 1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.location-li-item ul li > span:first-child::after {content: '\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65';display: inline-block;position: absolute;margin: 0 5px;color: #666;}
.location-li-item ul li > span:last-child {position:absolute;padding-right:0;right:0;width:12em;white-space:nowrap;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between;-webkit-align-items:space-between;-ms-align-items:flex-end;align-items:flex-end;bottom: 0;}
.location-li-item ul li span i {font-style: normal;display: inline-block;}
.location-li-item ul li p{width: 100%;padding: 0;margin: 0;line-height: 1.8;padding-left: 16px;text-align: left;}
.location-box .note-box{text-align: left;width: 100%;margin: 0;}


@media screen and (max-width: 810px) {
.life-information{padding-bottom: 40px;}
.life-information h3{width: 80%;margin: 30px auto 0;}
.life-information h4{margin-top: 30px;}
.life-information h4 img{height: 30px;object-fit: cover;}
.life-information .col2{width: 100%;}
.location-li-item ul li{font-size: 11px!important;}
.location-li {
    flex-direction: column;
}
.location-li  .col2{width: 100%;}

}