@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap');

/***************************************************************************

home_last.css

****************************************************************************/

.home .pageContents_wrap{
	overflow-x: hidden;
}

.price_wrap .container--btn--cv{
	padding: 0;
	margin: 0;
}
.price_wrap .container--btn--cv .btn--cv.gold{
	border: 1px solid #fff;
	margin: 1em 0;
	padding: 0;
	width: 400px;
	max-width: 400px;
}

.home .pageFooter__cvBtn.btn--cv.gold{
	 /*background-color: #665042;
    border: 1px solid #665042;*/
	 background: rgb(9,72,187);
background: linear-gradient(180deg, rgba(9,72,187,1) 0%, rgba(0,35,96,1) 66%, rgba(0,19,87,1) 100%); 
	border: none;
}
.home .pageFooter__cvBtn.btn--cv.gold:hover {
   /* background-color: #fff; */
	background: rgb(9,72,187);
background: linear-gradient(0deg, rgba(9,72,187,1) 0%, rgba(0,35,96,1) 66%, rgba(0,19,87,1) 100%); 
    color: #fff; /*#665042*/
}


@media screen and (max-width: 768px) {
.home .pageHeader{
	background-color: transparent;
}
.home .cv--top .navi--cv{
	display: none;
}
.home .menu__btn{
	background-color: transparent;
}
.home .pageHeader__logo .sp{
	display: none;
}
.home .pageHeader__logo .sp.only_home{
	display: block
}
}





/* modal-video *********************************/
.modal-video-body{
  max-width: 1280px; 
}
.modal-video{
  background-color: rgba(0,0,0,0.8);
}
  
  

/* ani_wrap *********************************/
.ani_wrap{
	position: relative;
	width: 100%;
	padding-top: 48%;
	overflow: hidden;
	background-color: #000;
}
.ani_wrap object{
	position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden;
}
.ani_wrap .pc{}
.ani_wrap .sp{ display: none;}


@media screen and (max-width: 768px) {
.ani_wrap{
	padding-top: 160%; /*132%*/
	margin-top: -56px;
}
.ani_wrap .pc{ display: none;}
.ani_wrap .sp{ display: block;}

}



/* hd_last *********************************/
.hd_last{
}
.hd_last img{
	vertical-align: top;
}

.hd_last .pc{}
.hd_last .sp{ display: none;}


@media screen and (max-width: 768px) {
.hd_last{
	margin-top: -56px;
}
.hd_last .pc{ display: none;}
.hd_last .sp{ display: block;}
}


/* h1〜 *************************/
h1.h1_teiki{
	font-size: 22px;
	font-size: clamp(16px, 2.2vw, 22px);
	text-align: center;
	margin-bottom: 1.5em;
}

h2.h2_concept{
	text-align: center;
}
h2.h2_concept .en{
	font-family: 'EB Garamond', serif;
	font-weight: 400;
	font-size: 21px;
	font-size: clamp(15px, 2.1vw, 21px);
	color: #fff;
}
h2.h2_concept .jp{
	display: block;
	width: 80%; /*16%*/
	max-width: 1000px;
	margin: 3% auto 1%;	
}

h3.h3_concept{
	font-size: 28px;
	font-size: clamp(20px, 2.8vw, 28px);
	text-align: center;
	color: #fff;
	letter-spacing: 0.5em;
	margin-bottom: 2em;
}

h4.h4_movie{
	font-size: 24px;
	font-size: clamp(18px, 2.5vw, 24px);
	text-align: center;
	color: #fff;
	margin-bottom: 1em;
}
h4.h4_movie .en{
	display: block;
	font-family: 'EB Garamond', serif;
	font-weight: 400;
	font-size: 16px;
	font-size: clamp(12px, 1.6vw, 16px);
}

h4.h4_cts{
	font-size: 36px;
	font-size: clamp(22px, 3.6vw, 36px);
	color: #e8e8e8;
	padding: 0.8em 0 0.5em;
}
h5.h5_cts{
	width: 70%;
	max-width: 400px;
	margin: 0 auto;
}
h5.h5_cts img{
	vertical-align: top;
}

h5.h5_info{
	position: relative;
	font-family: 'EB Garamond', serif;
	font-weight: 400;
	font-size: 18px;
	font-size: clamp(16px, 1.8vw, 18px);
	text-align: center;
	color: #fff;
	margin-bottom: 1em;
}
h5.h5_info:before,
h5.h5_info:after{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: calc(50% - 70px);
	height: 1px;
	background-color: rgba(255,255,255,0.3); /* #4b4b4b */
}
h5.h5_info:after{
	left: auto;
	right: 0;
}


h5.h5_info span{
	position: relative;
	z-index: 1;
	/*background-color: #fff;*/
	padding: 0 1em;
}

p.info_ttl{
	font-size: 26px;
	font-size: clamp(20px, 2.6vw, 26px);
	font-feature-settings: "palt" 1;
	font-weight: 600;
	color: #e8e8e8;
	text-align: center;
	margin: 0 0 0.5em;
}

.info_box p.date{
	font-family: 'EB Garamond', serif;
	font-size: 15px;
	font-size: clamp(12px, 1.5vw, 15px);
	text-align: center;
	margin-bottom: 0.8em;
}
.info_box p.para{
	text-align: center;
}

.clr_fff{
	color: #fff;
}
.clr_e8e8e8{
	color: #e8e8e8;
}


@media screen and (max-width: 768px) {
h3.h3_concept{
	letter-spacing: 0.3em;
	padding: 0 10px;
}
.info_box p.para{
	text-align: justify;
}
}



/* price_wrap *************************/
.price_wrap{
	/*background-color: #7bb0a9;*/
	  background: rgb(117,91,61);
background: linear-gradient(90deg, rgba(117,91,61,1) 0%, rgba(190,148,97,1) 35%, rgba(190,148,97,1) 65%, rgba(117,91,61,1) 100%); 
}
.price_inner{
	padding: 1.5em 0 1em; /*1em 0*/
}
.price_ttl_box{
	width: 100%;
	max-width: 1000px; /*800px*/
	padding: 1.5em 0;
	margin: 1em auto;
	border-top: 1px solid rgba(255,255,255,0.7);
	border-bottom: 1px solid rgba(255,255,255,0.7);

}
p.p_price{
	font-size: 24px;
	font-size: clamp(16px, 2.4vw, 24px); /*clamp(18px, 2.4vw, 24px)*/
	color: #fff;
	text-align: center;
	vertical-align: baseline;
}
p.p_price.shadow{ text-shadow: 0 0 8px rgba(0,0,0,0.7);}

p.p_price .big{
	font-size: 150%;
}
p.p_price.small,
p.p_price .small{
	font-size: 18px;
	font-size: clamp(15px, 1.8vw, 18px);
	line-height: 1.6em;
	margin: 0.4em 0;
}

p.p_cap{
	font-size: 14px;
	font-size: clamp(12px, 1.4vw, 14px);
	line-height: 1.6em;
	color: #fff;
	margin: 1em 0 0;
}
p.p_price .supText{
	font-size: 50%;
	top: 2em;
}


.price_inner .resp_autowrap{
	vertical-align: baseline;
}


.final_box{
	margin-top: 3%;
	padding: 3% 2%;
	background-color: rgba(0,0,0,0.15);
}



/* last_sell_box *************************/
dl.last_sell_box{
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	font-size: 24px;
	font-size: clamp(16px, 2.2vw, 24px);
	line-height: 1.8em;
	color: #fff;
	margin: 0 auto 1em;
}

dl.last_sell_box dt{
	display: flex;
	justify-content: center;
	width: 5em;
	text-align: center;
	background-color: rgba(0,0,0,0.3);
}
dl.last_sell_box dd{
	width: calc(100% - 6em);
	text-shadow: 0 0 8px rgba(0,0,0,0.7);
}
dl.last_sell_box dd .big{
	font-size: 150%;
}
dl.last_sell_box dd .small{
	display: block;
	font-size: 80%;
	line-height: 1.5em;
}
dl.last_sell_box dt span{
	align-self: center;
}


@media screen and (max-width: 767px) {
dl.last_sell_box dt{
	width: 100%;
	margin-bottom: 0.5em;
}
dl.last_sell_box dd{
	width: 100%;
}
}



/* bn_suumo_2025expart *************************/
.bn_suumo_2025expart{
	width: 100%;
	max-width: 500px; /*600px*/
	margin: 0 auto;
	padding: 1em 0;
}
.bn_suumo_2025expart a{
	transition: all .3s linear;
}
.bn_suumo_2025expart a:hover{
	opacity: 0.8;
}



/* list_bn *************************/
.list_bn{
	width: 100%;
	max-width: 1030px;
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	margin: 0 auto;
	padding: 2em 0 1em;
}
.list_bn li{
	width: 49%;
	max-width: 500px;
}
.list_bn li a{
	transition: all .3s linear;
}

.list_bn li a:hover{
	opacity: 0.8;
}

.list_bn li:last-child{
	margin-top: 2%;
}


@media screen and (max-width: 767px) {
.list_bn li{
	width: 100%;
	margin: 10px auto 0;
}
.list_bn li:first-child{
	margin-top: 10px; /*btn_youtube*/
}
}





/* teiki *************************/
.teiki_wrap{
}
.teiki_ttl{
	width: 100%;
	max-width: 900px; /*800px*/
	margin: 0 auto;
}
.teiki_ttl .pc{ }
.teiki_ttl .sp{ display: none;}

@media screen and (max-width: 768px) {
.teiki_ttl{
	max-width: 400px;
}
.teiki_ttl .pc{ display: none;}
.teiki_ttl .sp{ display: block;}
}


/* point *************************/
.point{
	width: 100%;
	max-width: 944px;
	margin: 20px auto 0;
}
.point .pc{}
.point .sp{ display: none;}

@media screen and (max-width: 640px) {
.point .pc{ display: none;}
.point .sp{ display: block;}
}




/* information *************************/
.information {
    padding-bottom: 5%;
}
.info_box{
	margin: 5% auto;
	padding-bottom: 2em;
	width: 100%;
	max-width: 1000px;
	/*border-bottom: 1px solid rgba(255,255,255,0.3);*/ /*#4b4b4b*/
}
.information__heading{
	margin-bottom: 20px;
}
.information__announce{
	margin: 0;
}
.bg--info{
	 background: rgb(9,72,187);
background: linear-gradient(180deg, rgba(9,72,187,1) 0%, rgba(0,35,96,1) 66%, rgba(0,19,87,1) 100%); 
}

.info_inner{
	/*padding-bottom: 3em;*/
}

.block_box{
	padding-top: 3em;
}
.wabi_box{
	/*margin-bottom: 3em;*/
	padding: 0 0 3em; /* 3em 0 → 3em 0 0*/
}
.wabi_box p.para{
	/*text-align: left;*/
}

.reception_box{
	padding: 2em;
	background-color: rgba(0,0,0,0.5); /*rgba(190,148,97,0.1)*/
}
.reception_box.second{
	margin-top: 3em;
}

.reception_box p.para{
	text-align: justify;
}
.reception_box p.cap14{
	font-size: 14px;
	margin: 0.5em 0 0;
}
.reception_box p.cap{
	font-size: 12px;
	margin: 1.5em 0 0;
}


@media screen and (max-width: 768px) {
.information {
    padding-bottom: 8%;
}
.info_box{
	margin: 12% auto;
}
.reception_box{
	padding: 1.2em;
}
.reception_box p.cap14{
	font-size: 11px;
}
.reception_box p.cap{
	font-size: 10px;
}

.wabi_box .resp_autowrap{
	display: inline;
}
}



/* float_wabi *************************/
.float_wabi{
	width: 100%;
	max-width: 720px;
	margin: 1em auto 0;
	font-size: 16px;
	font-size: clamp(14px, 1.6vw, 16px);
	color: #e8e8e8;
	border-collapse: collapse;
	border-top: 1px solid #ccc;
}
.float_wabi tr{
	border-bottom: 1px solid #ccc;
}
.float_wabi th{
	width: 10em;
	padding: 1.2em 0;
}
.float_wabi td{
	padding: 1.2em 0;
}


@media screen and (max-width: 768px) {
.float_wabi th{
	display: block;
	width: auto;
	padding: 1.2em 0 0.5em;
}
.float_wabi td{
	display: block;
	padding: 0 0 1.2em;
}
}



/* story_wrap *********************************/
.story_wrap{
	position: relative;
	padding: 25% 0 10px;
	background: #c6e3fe url("../img/story/bg_story.jpg") top left/100% auto no-repeat;
}

.story_wrap p.cap{
	text-align: right;
	padding-right: 1em;
}


/* @2x Images (Pixel Ratio of 1.25+) */
@media only screen and (-o-min-device-pixel-ratio: 5/4),
only screen and (-webkit-min-device-pixel-ratio: 1.25),
only screen and (min-device-pixel-ratio: 1.25),
only screen and (min-resolution: 1.25dppx) {
.story_wrap{
	background-image: url("../img/story/bg_story@2x.jpg");
}
}



/* story_catch *********************************/
.story_catch{
	position: absolute;
	z-index: 1;
	top: 3%;
	left: -10px;
	width: 16%;
	opacity: 54%;
}

@media screen and (min-width: 1340px) {
.story_catch{
	width: 10%;
}
}




/* story_box *********************************/
.story_box{
	width: 100%;
	max-width: 1700px;
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	margin: 0 auto 7%;
}

.story_box li{
	width: 90%;
	max-width: 1200px;
	padding-top: 5%;
}
.story_box li.story02{
	margin-left: auto;
}
.story_box li.story03{
	margin-left: auto;
	margin-right: auto;
}

.story_box li p{
	font-size: 24px;
	font-size: clamp(14px, 2.4vw, 24px);
	text-align: right;
	color: #000;
	padding-right: 2em;
}

.story_box li.story02 p{
	padding-bottom: 1em;
}
.story_box li.story03 p{
	text-align: center;
	padding-right: 0;
}
.story_box li p .L1{
	display: block;
	padding-right: 5em;
}



@media screen and (max-width: 767px) {
.story_box{
	margin-bottom: 12%;
}
.story_box li{
	width: 100%;
}
}


@media screen and (max-width: 500px) {
.story_box li p .L1{
	padding-right: 2em;
}
}

@media screen and (max-width: 350px) {
.story_box li p .L1 .resp_autowrap{
	display: block;
	padding-right: 2em;
}
}




/* pageContents_wrap *************************/
.pageContents_wrap{
	width: 100%;
	padding: 0;
	margin: 0 auto; /*8% auto*/
}


/* concept *************************/
.concept_wrap{
	background: url("../img/bg_concept_2nd.jpg") bottom center no-repeat;
	background-size: cover;
	padding: 8% 0 10px;
}

/* @2x Images (Pixel Ratio of 1.25+) */
@media only screen and (-o-min-device-pixel-ratio: 5/4),
only screen and (-webkit-min-device-pixel-ratio: 1.25),
only screen and (min-device-pixel-ratio: 1.25),
only screen and (min-resolution: 1.25dppx) {
.concept_wrap{
	background-image: url("../img/bg_concept_2nd@2x.jpg");
}
}

.concept_box{
	position: relative;
}

.concept_wrap .txt{
	width: 90%;
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 65%;
}
.concept_wrap .txt p{
	font-size: 18px;
	font-size: clamp(14px, 1.8vw, 18px);
	letter-spacing: 0.1em;
	text-align: center;
	line-height: 2.6em;
	color: #fff;
}
p.concept_cap{
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
	padding: 0 10px;
	font-size: 1.0rem;
	font-size: 10px;
	color: #fff;
	text-align: right;
}





/* concept_movie *************************/
.concept_movie_wrap{
	padding: 8% 0;
	 background: rgb(8,35,221);
background: linear-gradient(180deg, rgba(8,35,221,1) 0%, rgba(19,58,227,1) 53%, rgba(31,74,233,1) 100%); 
}
.concept_movie{
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.concept_movie_box{
	width: 100%;
	max-width: 1000px; /*540px*/
	margin: 0 auto;
}
.btn_youtube{
	cursor: pointer;
	transition: all .3s linear;
}
.btn_youtube:hover{
	opacity: 0.7;
}



/* list_pageContents *************************/
.list_pageContents{
	margin-bottom: 80px;
}

.list_pageContents li{
	text-align: center;
	/*margin-top: 8%;*/
	padding: 8% 0;
	 background: rgb(9,72,187);
background: linear-gradient(180deg, rgba(9,72,187,1) 0%, rgba(0,35,96,1) 66%, rgba(0,19,87,1) 100%); 
}
.list_pageContents li .inner{
	width: 100%;
	max-width: 1500px;
	margin: 0 auto 0;
}

.list_pageContents li p{
	text-align: center;
}

.list_pageContents li .photo{
	width: 80%;
}
.list_pageContents li .photo.w100{
	width: 100%;
}
.list_pageContents li.reverse .photo{
	margin-left: auto;
}

.list_pageContents li .photo figure{
	position: relative;
}
.list_pageContents li .photo figure figcaption{
	position: absolute;
	bottom: 10px;
	left: 10px;
	text-align: left;
	font-size: 10px;
	color: #fff;
}
.list_pageContents li.reverse .photo figure figcaption{
	left: auto;
	right: 10px;
	text-align: right;
}

.list_pageContents li .photo .pc{}
.list_pageContents li .photo .sp{ display: none;}


@media screen and (max-width: 768px) {
.list_pageContents li .photo{
	width: 100%;
}
.list_pageContents li .photo .pc{ display: none;}
.list_pageContents li .photo .sp{ display: block;}
}




/* btn_cts *************************/
.btn_cts{
	width: 80%;
	max-width: 600px;
	margin: 40px auto 0;
	line-height: 0;
	background-color: #000;
}
.btn_cts a{
	display: block;
	transition: all .3s linear;
	
}
.btn_cts a:hover{
	opacity: 0.7;
	box-shadow: 2px 2px 8px rgba(0,0,0,0.5);
}

@media screen and (max-width: 768px) {
.btn_cts{
	margin-top: 20px;
}
}




/* reservation_table *************************/
.container--col2.reservation_table{
	margin-bottom: 5%;
}
.container--col2.reservation_table .col{
	margin-bottom: 0;
}
.container--col2.reservation_table p.cap{
	margin-top: 10px;
}

