@charset "UTF-8";
/* ============================================================
   style_sd.css … スマホ用（max-width:800px）※このファイル単独で完結（style.css と独立）
   配色/フォント/装飾画像はこのファイル冒頭の :root で管理。
   ============================================================ */

/* ★デザイントークン（黒を基調とした大人イメージ）※スマホ専用・独立管理 */
:root{
  --color-text:#efe9df;
  --color-plan-btn:#a98f5e;
  --color-slide1-bg:#100f0d;
  --color-access-link:#a98f5e;
  --font-main:'Zen Old Mincho', serif;
  --font-accent:'Cormorant Garamond', serif;
  --bg-all:none;
  --bg-leaf:none;
  --bg-page:#0f0f0d;
}

html { font-size: 62.5%; }
body {
  color: var(--color-text);
  width:100%;
  margin:0 auto;
  padding:0;
  text-align:left;
  font-size: 1.6rem;
  line-height:1.6;
  font-family: var(--font-main);
  font-weight: 400;
}
h1,h2,h3,h4 {
  text-align: left;
  width: 100%;
  display: block;
  font-weight: bold;
  margin: 0;
  padding:0;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
a{text-decoration: none;}
p{margin:0;}

/* For modern browsers */
.cf:before,
.cf:after {
  content: " ";
  display: table;
}

.cf:after { clear: both; }

/* other */
.mainbody{ width: 100%; margin: 0 auto;}
.contents_wrpper {
  background: var(--bg-page);
  width: 100%;
  margin: 0 auto;
}
.serif {/*font-family: 'Vollkorn', serif;*/
  font-family: 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', '游明朝 Medium', 'YuMincho Medium', '游明朝', YuMincho, 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;}
.serif2 {
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", YuMincho, "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", serif;
}
.tategaki {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}


/* フェードイン */

.fade01 { animation: fade 3.5s; animation-fill-mode: forwards; opacity: 1; }
.fade02 { animation: fade 1.5s; animation-fill-mode: forwards; opacity: 1; }
.list-mv01 { opacity: 0; }
.mv01 { opacity: 1.0; }
.move02 { animation: bottom-to-top 2s; animation-fill-mode: forwards; opacity: 1; }
img.zoom { transform: scale(1.11); }

/* fade */
@keyframes fade {
	0% { opacity: 0; }
	20% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes bottom-to-top {
	0% { opacity: 0; transform: translateY(50px); }
	100% { opacity: 1; transform: translateY(0); }
}
@keyframes blur-txt {
  0% {
    -webkit-filter: blur(10px);
    filter: blur(10px);
    opacity: 0;
    perspective: 1000;
    -webkit-perspective: 1000;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
  100% {
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
    perspective: 1000;
    -webkit-perspective: 1000;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
}

.animation-delay02 { -webkit-animation-delay: .2s !important; animation-delay: .2s !important; }
.animation-delay04 { -webkit-animation-delay: .4s !important; animation-delay: .4s !important; }
.animation-delay08 { -webkit-animation-delay: .8s !important; animation-delay: .8s !important; }
.animation-delay12 { -webkit-animation-delay: 1.2s !important; animation-delay: 1.2s !important; }
.animation-delay16 { -webkit-animation-delay: 1.6s !important; animation-delay: 1.6s !important; }
.animation-delay20 { -webkit-animation-delay: 2.0s !important; animation-delay: 2.0s !important; }


/*見出し*/
h2.midashi {
  margin: 0;
  letter-spacing: 3px;
  line-height: 1;
  width: auto;
  padding: 20px 5px 0;
  border-top: 2px solid #fff;
}
h2.midashi .main {
  font-weight: 500;
  font-size: 1.9rem;
  padding: 0;
  display: block;
  margin-right: 10px;
  line-height: 1.8;
}
h2.midashi .sub {
    display: block;
    font-size: 1.5rem;
    padding: 0;
    font-weight: 400;
}


/* ----------------- head ------------------ */

#header {
  width: 100%;
  height: 100vh;
}

/* タイトル */
#top_ttl{
  width: 95px;
  height: 335px;
  text-align: center;
  margin: auto;
  position: absolute;
  z-index: 9999;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  top: 0;
  left: 0;
  bottom: 0;
  right: 00;
  font-weight: normal;
  font-size: 2.3rem;
  color: #fff;
  letter-spacing: 4px;
}
#top_ttl a { -webkit-transition: all .3s; transition: all .3s; }
#top_ttl a:hover {opacity: 0.8;}
#top_ttl .logo_hotel { display: block; width: 45px; height: 214px; }
#top_ttl span { text-align: right; }

/* ナビゲーション */
#navi {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  position: absolute;
  z-index: 9999;
  display: flex;
  justify-content: space-between;
}
#navi .logo_ikyu{
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 999;
  width: 80px;
  height: auto;
}
#navi .logo_ikyu a{ -webkit-transition: all .3s; transition: all .3s; }
#navi .logo_ikyu a:hover {opacity: 0.8;}

#navi ul.menu { display: none; }
#navi ul.menu li.link { padding: 0 10px; position: relative; z-index: 1; }
#navi ul.menu li.link a {
  color: #fff;
  padding: 0;
  text-decoration: none;
  -webkit-transition: all .3s;
  transition: all .3s;
}
#navi ul.menu li.link a::before{
  position: absolute;
  z-index: 1;
  content: "";
  border-left: 1px solid #fff;
  height: 8px;
  width: 1px;
  top: -25px;
  left: 50%;
  -webkit-transition: all .3s;
  transition: all .3s;
}
#navi ul.menu li.link a:hover {opacity: 0.6;}
#navi ul.menu li.link a:hover::before{ top: -20px; }

/*swiper*/
#header .ss-slider {
  top: 0;
  left: 0;
  margin: 0;
  width: 100%;
  height: 100vh;
	z-index: 1;
}
#header .ss-slider .swiper-slide {
	position: relative;
	z-index: 999;
  width: 100%;
}

/*swiper1枚目設定*/
#header .ss-slider .swiper-slide.swiper-slide-00 {
	display: flex;
	align-content: center;
	flex-direction: column;
	justify-content: center;
	text-align: center;
  background: var(--color-slide1-bg);
}


/*fadeデフォルト*/
#header .fade { opacity: 0; }

/*swiper縮小*/
#header .ss-slider .swiper-slide-active .slide-img,
#header .ss-slider .swiper-slide-duplicate-active .slide-img,
#header .ss-slider .swiper-slide-prev .slide-img {
	animation: zoomDown 10s linear 0s 1 normal both;
}

_:lang(x)::-ms-backdrop,#header .ss-slider .swiper-slide-active .slide-img,
_:lang(x)::-ms-backdrop,#header .ss-slider .swiper-slide-duplicate-active .slide-img,
_:lang(x)::-ms-backdrop,#header .ss-slider .swiper-slide-prev .slide-img {
	animation-play-state : paused;
}

@keyframes zoomDown {
	0% { transform: scale(1.1); }
	100% { transform: scale(1); }
}
#header .ss-slider .slide-img {
	width: 100%;
	height: 100vh;
  background: #000;
}
#header .ss-slider .slide-img img {
	width: 100%;
	height: 100vh;
	object-fit: cover;
	object-position: 50% 50%;
  opacity: 0.8;
}

/*画像位置の個別調整（案件ごとに調整）*/
#header .ss-slider .swiper-slide.swiper-slide-02 img { object-position: 50% 100% !important; }
#header .ss-slider .swiper-slide.swiper-slide-03 img{ object-position: 50% 80% !important; }
#header .ss-slider .swiper-slide.swiper-slide-04 img { object-position: 50% 20% !important; }
#header .ss-slider .swiper-slide.swiper-slide-05 img { object-position: 50% 20% !important; }

/*画像明るさ*/
#header .ss-slider .swiper-slide:after{
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.2);
  content: "";
  top: 0;
  left: 0;
}
#navi, #top_ttl{ opacity: 0; }


/* ----------------- about ------------------ */

#about {
  width: 100%;
  margin: 0 auto 0;
  padding: 80px 0;
  letter-spacing: 1px;
  position: relative;
  z-index: 1;
}
#about:before {
  position: absolute;
  z-index: 2;
  content: "";
  background: var(--bg-leaf) no-repeat right top;
  background-size: 80%;
  opacity: 0.9;
  left: 75px;
  top: -60px;
  width: 220px;
  height: 290px;
}
#about .lead { width: auto; margin: 0 auto; }
#about .lead h2 {
  margin: 0;
  letter-spacing: 5px;
  line-height: 1;
  width: auto;
  padding: 20px 5px 0;
  border-top: 2px solid var(--color-text);
}
#about .lead h2 .name {
  font-weight: 500;
  font-size: 2.2rem;
  padding: 0;
  display: block;
}
#about .lead h2 .area {
  display: block;
  /* 画面幅で暴れないよう下限・上限を設定 */
  font-size: clamp(13px, 3.6vw, 15px);
  padding: 0;
  font-weight: 300;
  margin-right: 10px;
}
#about .lead .txt {
  /* 画面幅で文字が大きくなりすぎて縦書きブロックが横にはみ出すのを防ぐ */
  font-size: clamp(13px, 3.6vw, 15px);
  line-height: 1.8;
  letter-spacing: 2px;
  margin-bottom: 0px;
  margin-top: 60px;
  margin-right: 15px;
  height: 340px;
}
#about .lead .txt br{display: none;}

#about .lead .btn { width: 100%; text-align: right; }
#about .lead .btn a {
  display: inline-block;
  width: 180px;
  color: #fff;
  text-align: left;
  font-size: 1.4rem;
  border-bottom: 1px solid #fff;
  line-height: 3;
  padding-left: 20px;
  position: relative;
  z-index: 1;
  margin-bottom: 10px;
}
#about .lead .btn a:after {
  display: block;
  position: absolute;
  z-index: 2;
  top: calc(50% - 3px);
  right: 5px;
  width: 5px;
  height: 5px;
  border-color: #fff;
  border-style: solid;
  border-width: 1px 1px 0 0;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transition: all .3s;
}

#about .fade {opacity: 0;}

@media screen and (max-width: 1600px) and (min-width: 1px) {

}

/* ----------------- topics ------------------ */

#topics {
  width: 100%;
  padding: 0;
  margin: 0;
}
#topics .topics_in{
  width: 100%;
  padding: 80px 0;
}
#topics .topics_in .midsahi .main {
  font-weight: 500;
  font-size: 1.8rem;
  padding: 0;
  display: block;
  margin-right: 12px;
}
/* ■トピックス背景画像（件数ぶん nth-of-type を用意） */
#topics .topics_in:nth-of-type(1) {
  background: url(https://www.img-ikyu.com/contents/dg/special/2026/00003286/image/tpc01_01.jpg?auto=compress,format&fit=crop&lossless=0)  no-repeat 90% 100%;
  background-size: auto 100%;
}
#topics .topics_in:nth-of-type(2) {
  background: url(https://www.img-ikyu.com/contents/dg/special/2026/00003286/image/tpc02_01.jpg?auto=compress,format&fit=crop&lossless=0)  no-repeat 90% 100%;
  background-size: auto 100%;
}
#topics .topics_in:nth-of-type(3) {
  background: url(https://www.img-ikyu.com/contents/dg/special/2026/00003286/image/tpc03_01.jpg?auto=compress,format&fit=crop&lossless=0)  no-repeat 90% 100%;
  background-size: auto 100%;
}
#topics .topics_in .txt {
  width: auto;
  margin: 0 auto;
  color: #fff;
  text-shadow: 0 0 8px #000;
}
#topics .topics_in .txt .lead {
/* 画面幅で文字が大きくなりすぎて縦書きブロックが横にはみ出すのを防ぐ */
font-size: clamp(13px, 3.6vw, 15px);
line-height: 1.8;
letter-spacing: 3px;
margin-bottom: 0px;
margin-top: 30px;
margin-right: 15px;
height: 390px;
}
#topics .topics_in .txt .lead br { display: none; }
#topics h2.midashi .sub { padding-right: 10px; }
#topics h2.midashi .sub i {
  font-family: var(--font-accent);
  font-style: normal;
  writing-mode: horizontal-tb;
  font-size: 1.2em;
  letter-spacing: 0;
  margin-top: 6px;
}
#topics .bottom-to-top,#topics .fade {opacity: 0;}

/* ----------------- plan ------------------ */

#spplan {
  width: calc(100% - 10%);
  margin: 50px 5% 0;
  padding: 20px 5% 0;
  overflow: hidden;
  background: rgba(255,255,255,0.6);
}
#spplan .ex { width: 100%; margin: 0 auto 30px; font-size: 1.1rem; color: #666; }
#spplan .plan_wp { width: 100%; margin: 0 auto 30px; position: relative; z-index: 2; }
#spplan .plan {
  width: 100%;
  margin: 0;
  text-align: center;
  letter-spacing: 4px;
  display: flex;
  flex-flow: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
#spplan .plan .ttl {
  width: auto;
  margin: 0 auto 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* スマホでは縦書きだと縦に長くなるため横書きにする */
  writing-mode: horizontal-tb;
  -ms-writing-mode: lr-tb;
  letter-spacing: 0;
}
/* 横書き時は字間を詰める(子要素の指定も上書き) */
#spplan .plan .ttl,
#spplan .plan .ttl * { letter-spacing: 0; }
/* スマホでは説明文の改行(br)を無効にして自動折り返しにする(タイトルの改行は残す) */
#spplan .plan .ttl p br { display: none; }
#spplan .plan .ttl .midashi { border-top: none; }
#spplan .plan .ttl .midashi .main {font-size: 2rem; line-height: 1.6; font-weight: 600; margin-right: 10px; margin-bottom: 0; display: inline-block;}
#spplan .plan .ttl .midashi .sub i {
  font-family: var(--font-accent);
  font-style: normal;
  writing-mode: horizontal-tb;
  font-size: 1.2em;
  letter-spacing: 0;
  margin-top: 6px;
  -webkit-writing-mode: horizontal-tb;
  -ms-writing-mode: horizontal-tb;
}
#spplan .plan .ttl .midashi strong {
  font-weight: 400;
  font-size: 1.4rem;
  letter-spacing: 0.1em;
  padding: 8px 3px;
  display: inline-block;
  background: #fff;
  border: 1px solid #dbdbdb;
  border-radius: 3px;
  line-height: 1;
  margin-right: 10px;
  backface-visibility: hidden;
}

#spplan .plan_wp .plan h3 { font-size: 1.8rem; margin: 0 10px 0 0; padding-top: 25px; width: auto; }
#spplan .plan_wp .plan p { margin-right: 10px; font-size: 1.4rem; padding-top: 12px; text-align: left; width: auto; }
#spplan .plan_wp .img { width: 100%; margin: 0 auto 20px; }
#spplan .plan_wp .img img {width: 100%;}
.reverse{ flex-flow: row-reverse; }
#spplan .plan_wp.reverse .plan .ttl { width: 100%; }

#spplan .plan_wp:nth-of-type(1):before {
  position: absolute;
  z-index: -1;
  content: "";
  background: var(--bg-leaf) no-repeat right top;
  background-size: 100%;
  opacity: 0.9;
  left: calc(50% + 630px);
  top: -300px;
  width: 246px;
  height: 296px;
}
#spplan .plan_wp:nth-of-type(2):before {
  position: absolute;
  z-index: -1;
  content: "";
  background: var(--bg-leaf) no-repeat right top;
  background-size: 100%;
  opacity: 0.9;
  right: calc(50% + 570px);
  top: -250px;
  width: 246px;
  height: 296px;
}
#spplan .plan_wp:nth-of-type(2) .img,
#spplan .plan_wp:nth-of-type(3) .img{
  display: flex;
  align-items: center;
  justify-content: center;
}
#spplan .plan_wp:nth-of-type(3):before {
  position: absolute;
  z-index: -1;
  content: "";
  background: var(--bg-leaf) no-repeat right top;
  background-size: 100%;
  opacity: 0.9;
  left: calc(50% + 630px);
  top: 0;
  width: 246px;
  height: 296px;
}
#spplan .plan_wp .swiper-wrapper {height: auto !important;}

a.plan_rate{
  width: 100%;
  display: block;
  margin: 0;
  padding: 15px 0;
  border: 1px solid var(--color-plan-btn);
  text-align: center;
  color: #fff !important;
  background-color: var(--color-plan-btn);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 1.6rem;
  text-decoration:none;
  letter-spacing: 0;
}
a.plan_rate:hover{ opacity: 0.8; text-decoration:none; }
.plan_rate b { font-size: 1.6rem; line-height: 1.3; }
.off { display: block; }
.off strong{ font-size: 1.2rem !important; display: block; }
.shousai{ font-size: 1.2rem !important; line-height: 1.15; margin-bottom: 5px; display: block; }
.shousai b{ font-size: 1.6rem !important; }
.shousai .ll{ display: none !important; }
.shousai .s{ font-size:1.3rem !important; }
.after_point_rate { font-size: 1.6rem !important; }
#spplan .bottom-to-top,#spplan .fade {opacity: 0;}


/* ----------------- photo gallery ------------------ */
#pg {
  width: 100%;
  padding: 50px 0 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
#pg .ttl { width: 75px; margin: 0 auto; margin-bottom: 50px; }
#pg .ttl h2.midashi { border-top: 2px solid var(--color-text); }

/*swiper*/
/*スライダー*/
#pg .pg-slider  {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto !important;
}
#pg .pg-slider .swiper-wrapper { width: 100%; height: auto; }
#pg .pg-slider .swiper-slide { position: relative; z-index: 999; }
#pg .pg-slider .swiper-slide img { width: 100%; }
#pg .pg-slider .swiper-slide .swiper-caption {
  position: absolute;
  bottom: 15px;
  color: #fff;
  right: 25px;
  text-align: right;
  font-size: 1.4rem;
  text-shadow: 0 0 5px rgba(0,0,0,0.8);
}

 /*ボタン（共通）*/
 .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
  bottom: 25px;
  position: absolute;
  z-index: 9;
  display: flex;
  justify-content: center;
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px !important; }
.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: rgba(255,255,255,0.8);
}
.swiper-pagination-bullet-active { opacity: 1; background: #fff; }

#pg .bottom-to-top,#pg .fade {opacity: 0;}


/* ----------------- map ------------------ */
#access {
  width: 100%;
  padding: 50px 5% 0;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  z-index: 2;
}

#access .ttl { width: 75px; margin: 0 auto; margin-bottom: 50px; }
#access .ttl h2.midashi { border-top: 2px solid var(--color-text); }
.access_box{ width: 100%; position: relative; }
.map { width: 100%; height: 300px; }
#access .contents{
  width: 100%;
  padding: 0 170px;
  margin: 25px auto;
  display: flex;
  line-height: 1;
  align-items: center;
}
#access .contents h3 { font-size: 1.8rem; display: inline-block; margin-right: 30px; }
#access .contents .txt { font-size: 1.4rem; display: inline-block; margin-right: 30px; }
#access .contents .link { font-size: 1.4rem; display: inline-block; margin-right: 30px; }
#access .contents .link a {
  background: var(--color-access-link);
  font-size: 1.1rem;
  color: #fff;
  padding: 4px 10px;
  line-height: 1;
  text-decoration: none;
}

.fukid {font-size:1.2rem; text-align:left; color:#333; width:350px; height:80px;}
.fukid a {color: #333;}
.map_photo{ width:100px; height:75px; float:left; margin:0 10px 0 0; border:0px; }
.map_directory_wp { width: 100%; max-width: 100%; }
.map_directory {width:1200px; max-width: 100%; text-align:center; margin:0 auto; padding:15px 0;}
.map_directory a {color:#333; margin:0 7px; font-size:1.5rem; margin-right: 1em;}

#access .bottom-to-top,#access .fade {opacity: 0;}

@media screen and (max-width: 1600px) and (min-width: 1px) {
}

/* ----------------- footer ------------------ */
.ft2 { width: 100%; padding: 50px 0 20px; }
.ft2 img { width: 80px; height: auto; }
address {
  font-style: normal;
  font-size: 1.1rem;
  color: #999999;
  font-family: helvetica, sans-serif, verdana;
  padding: 15px 0 20px 0;
  text-align: center;
}
/* ----------------- Page Top ------------------ */
#toPageTop {position:fixed; bottom:10px; right:30px;z-index: 9999;}
#toPageTop a {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 25px;
  height: 25px;
  border-right: 4px solid #999999;
  border-top: 4px solid #999999;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  box-sizing: border-box;
}
#toPageTop a:hover img {visibility:hidden;}

/* ----------------- 共通（余白ユーティリティ） ------------------ */
.tp100 {margin-top:100px;}
.tp80 {margin-top:80px;}
.tp60 {margin-top:50px;}
.tp50 {margin-top:50px;}
.tp45 {margin-top:45px;}
.tp40 {margin-top:40px;}
.tp35 {margin-top:35px;}
.tp30 {margin-top:30px;}
.tp25 {margin-top:25px;}
.tp20 {margin-top:20px;}
.tp15 {margin-top:15px;}
.tp10 {margin-top:10px;}
.tp5 {margin-top:5px;}
.tp0{ margin-top: 0px;}
.bm50 {margin-bottom:50px;}
.bm45 {margin-bottom:45px;}
.bm40 {margin-bottom:40px;}
.bm35 {margin-bottom:35px;}
.bm30 {margin-bottom:30px;}
.bm25 {margin-bottom:25px;}
.bm20 {margin-bottom:20px;}
.bm15 {margin-bottom:15px;}
.bm10 {margin-bottom:10px;}
.bm5 {margin-bottom:5px;}
.pb220{ padding-bottom: 220px;}


.pc_none{display:none !important;}
.pc_space:after{
  content:'　\A';
  white-space: pre;
}
.opc :hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
  }

/* =====================================================================
   歓宿縁 ESHIKOTO 個別調整（黒を基調とした大人イメージ）※この案件のみ / スマホ
   ===================================================================== */
#top_ttl{ justify-content:center; align-items:center; gap:16px; height:auto; }
#top_ttl .site-name{ font-size:2.6rem; font-weight:500; letter-spacing:9px; writing-mode:vertical-rl; -ms-writing-mode:tb-rl; text-shadow:0 0 12px rgba(0,0,0,.7); }
#top_ttl .site-en{ writing-mode:vertical-rl; -ms-writing-mode:tb-rl; font-family:var(--font-accent); font-size:1.05rem; letter-spacing:5px; color:rgba(255,255,255,.82); text-shadow:0 0 10px rgba(0,0,0,.7); }

/* ABOUT：写真4枚＋横組み（縦書きの間延びを解消） */
#about{ height:auto; min-height:0; padding:70px 6%; display:block; }
#about:before{ display:none; }
#about .about-inner{ display:block; }
#about .about-photos{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:34px; }
#about .about-photos figure{ margin:0; overflow:hidden; }
#about .about-photos img{ width:100%; height:40vw; object-fit:cover; display:block; }
#about .about-photos .ph1, #about .about-photos .ph4{ grid-column:1 / -1; height:54vw; }
#about .about-lead{ color:#efe9df; }
#about .about-lead .en{ font-family:var(--font-accent); font-style:italic; font-size:2.1rem; letter-spacing:3px; color:var(--color-plan-btn); display:block; line-height:1; }
#about .about-lead h2{ border:none; margin:8px 0 16px; padding:0; }
#about .about-lead h2 .name{ font-size:2rem; font-weight:500; display:block; }
#about .about-lead h2 .area{ font-size:1.3rem; opacity:.75; display:block; margin-top:4px; }
#about .about-lead .txt{ writing-mode:horizontal-tb; -ms-writing-mode:lr-tb; font-size:1.4rem; line-height:2; letter-spacing:.5px; }

#spplan{ background:rgba(15,14,11,.55); }
#spplan .plan, #spplan .plan_wp .plan p{ color:#efe9df; }

#pg .ttl h2.midashi, #access .ttl h2.midashi{ color:#efe9df; border-top-color:rgba(255,255,255,.5); }

#topics .topics_villa{ width:100%; padding:70px 5%; color:#efe9df; }
#topics .topics_villa .villa-txt{ margin:0 auto 40px; text-align:center; writing-mode:horizontal-tb; -ms-writing-mode:lr-tb; }
#topics .topics_villa .villa-txt .midashi{ display:inline-block; border-top:2px solid rgba(255,255,255,.5); }
#topics .topics_villa .villa-txt .lead{ margin-top:24px; line-height:2; letter-spacing:1px; font-size:1.4rem; }
#topics .topics_villa .villa-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
#topics .topics_villa .villa-grid figure{ margin:0; }
#topics .topics_villa .villa-grid img{ width:100%; height:38vw; object-fit:cover; display:block; }
#topics .topics_villa .villa-grid figcaption{ font-size:1.1rem; padding-top:6px; text-align:center; }

/* =====================================================================
   歓宿縁 ESHIKOTO 追加：参考イメージ反映（TOP / TOPICS1-3 / ヴィラslider）スマホ
   ===================================================================== */
/* --- TOP --- */
#navi{ padding:16px 18px 0; align-items:flex-start; }
#navi .brand a{ display:flex; flex-direction:column; line-height:1; }
#navi .brand .brand-jp{ font-size:1.8rem; letter-spacing:3px; color:#fff; text-shadow:0 0 10px rgba(0,0,0,.5); }
#navi .brand .brand-en{ font-family:var(--font-accent); font-size:.95rem; letter-spacing:4px; color:rgba(255,255,255,.85); margin-top:4px; }
#navi ul.menu{ display:none; }
#navi .logo_ikyu{ position:static; width:66px; height:auto; }
.mv-side{ display:none; }
.mv-catch{ position:absolute; z-index:9998; left:7%; right:7%; top:42%; transform:translateY(-50%); color:#fff; }
.mv-catch .c-main{ font-size:1.7rem; line-height:1.9; letter-spacing:2px; font-weight:500; text-shadow:0 2px 14px rgba(0,0,0,.6); }
.mv-catch .c-sub{ margin-top:16px; font-size:1.15rem; line-height:1.8; letter-spacing:1px; text-shadow:0 2px 12px rgba(0,0,0,.6); }

/* --- TOPICS 1-3 --- */
#topics .topics_in{ position:relative; padding:0 8%; min-height:64vh; display:flex; align-items:center; justify-content:flex-start; background-size:cover !important; background-position:center !important; }
#topics .topics_in::before{ content:""; position:absolute; inset:0; background:rgba(0,0,0,.42); z-index:0; }
#topics .tp-inner{ position:relative; z-index:1; max-width:none; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.7); }
#topics .tp-no{ display:inline-block; font-family:var(--font-accent); font-style:italic; font-size:1.2rem; letter-spacing:2px; margin-bottom:12px; }
#topics .tp-no i{ color:var(--color-plan-btn); margin-left:6px; }
#topics .tp-ttl{ font-size:2.2rem; font-weight:500; line-height:1.5; letter-spacing:2px; margin:0; }
#topics .tp-lead{ margin-top:18px; font-size:1.35rem; line-height:2; letter-spacing:.5px; }

/* --- TOPICS4 ヴィラ カードスライダー --- */
#topics .topics_villa{ padding:70px 0 80px; }
#topics .topics_villa .villa-slider{ padding:0 30px; margin-top:34px; position:relative; }
#topics .topics_villa .villa-slider figure{ margin:0; }
#topics .topics_villa .villa-slider img{ width:100%; height:46vw; object-fit:cover; display:block; }
#topics .topics_villa .villa-slider figcaption{ margin-top:10px; text-align:center; font-size:1.15rem; color:#efe9df; }
#topics .topics_villa .villa-swiper-pagination{ position:static; margin-top:18px; text-align:center; }

/* =====================================================================
   歓宿縁 ESHIKOTO 追加②：ロゴ / ABOUTボタン / PLAN再調整 / villaドット  スマホ
   ===================================================================== */
#navi .brand img{ width:140px; height:auto; display:block; }

#about .about-lead .about-btn{ margin-top:28px; }
#about .about-lead .about-btn a{ display:inline-flex; align-items:center; gap:12px; font-family:'Cormorant Garamond', 'Zen Old Mincho', serif; font-size:1.3rem; letter-spacing:2px; color:#efe9df; border:1px solid rgba(255,255,255,.55); padding:13px 26px; }
#about .about-lead .about-btn a::after{ content:"→"; }

/* PLAN：縦積み・バランス調整 */
#spplan{ padding:50px 5% 60px; }
#spplan .plan_wp{ display:block; margin:0 auto 46px; }
#spplan .plan_wp:before{ display:none; }
#spplan .plan_wp .img{ width:100%; margin:0 0 20px; }
#spplan .plan_wp .img img{ width:100%; height:auto; }
#spplan .plan{ width:100%; }
#spplan .plan .ttl{ margin:0; }
#spplan .plan .ttl .midashi{ border-top:2px solid rgba(255,255,255,.5); padding:16px 0 0; }
#spplan .plan .ttl .midashi .sub{ font-family:var(--font-accent); font-style:italic; font-size:1.4rem; letter-spacing:1px; color:var(--color-plan-btn); display:block; }
#spplan .plan .ttl .midashi .sub i{ font-style:italic; margin-left:6px; }
#spplan .plan .ttl .midashi .main{ font-size:1.8rem; font-weight:500; line-height:1.6; margin:10px 0 0; display:block; }
#spplan .plan .plan_rate{ margin-top:22px; }

/* TOPICS4 ドット位置 */
#topics .topics_villa{ padding:70px 0 70px; }
#topics .topics_villa .villa-swiper-pagination{ position:static; margin-top:14px; text-align:center; }

/* --- TOPICS1-3 背景クロスフェード（A案） --- */
#topics .topics_in{ overflow:hidden; }
#topics .tp-bg{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
#topics .tp-bg, #topics .tp-bg .swiper-wrapper, #topics .tp-bg .swiper-slide{ height:100%; }
#topics .tp-bg img{ width:100%; height:100%; object-fit:cover; display:block; }
#topics .topics_in::before{ z-index:1; }
#topics .tp-inner{ z-index:2; }

/* =====================================================================
   歓宿縁 ESHIKOTO 修正②：縦長ロゴを左固定 / ナビ右寄せ / mv-side廃止  スマホ
   ===================================================================== */
.mv-logo{ position:absolute; top:16px; left:18px; z-index:9999; display:block; }
.mv-logo img{ height:clamp(150px,30vh,220px); width:auto; display:block; }
.mv-side{ display:none; }
#navi{ justify-content:flex-end; padding:16px 18px; }
.mv-catch{ left:7%; right:7%; top:42%; }

/* キャッチ（スマホ）は left/right 指定済みで幅制御。念のため max-width も */
.mv-catch{ max-width:86%; }

/* MV左下：scroll インジケーター（ロゴの下） */
.mv-scroll{ position:absolute; left:26px; bottom:30px; z-index:9999; writing-mode:vertical-rl; -ms-writing-mode:tb-rl; font-family:var(--font-accent); font-size:1rem; letter-spacing:2px; color:rgba(255,255,255,.85); text-shadow:0 0 10px rgba(0,0,0,.6); padding-bottom:44px; }
.mv-scroll::after{ content:""; position:absolute; left:50%; bottom:0; width:1px; height:34px; background:rgba(255,255,255,.6); }

/* TOPICS4：スライド高さを中身に合わせて詰める（下の余白＝ドット離れを解消） */
#topics .topics_villa .villa-slider .swiper-wrapper{ height:auto !important; align-items:flex-start; }
#topics .topics_villa .villa-slider .swiper-slide{ height:auto !important; }
#topics .topics_villa .villa-swiper-pagination{ position:static; margin-top:14px; text-align:center; }

/* TOPICS4：流れる連続移動（マーキー）／左右余白なし スマホ */
#topics .topics_villa .villa-slider{ max-width:none; margin:34px 0 0; padding:0; }
#topics .topics_villa .villa-slider .swiper-wrapper{ transition-timing-function:linear !important; align-items:flex-start; height:auto !important; }
#topics .topics_villa .villa-slider .swiper-slide{ width:64vw; height:auto !important; }
#topics .topics_villa .villa-slider img{ width:100%; height:42vw; object-fit:cover; display:block; }
#topics .topics_villa .villa-slider figcaption{ margin-top:10px; text-align:center; font-size:1.15rem; color:#efe9df; }
#topics .topics_villa .villa-swiper-button, #topics .topics_villa .villa-swiper-pagination{ display:none !important; }

/* TOPICS4：CSSマーキー スマホ */
#topics .topics_villa .villa-marquee{ width:100%; margin-top:34px; overflow:hidden; }
#topics .topics_villa .villa-track{ display:flex; gap:12px; width:max-content; animation:villaScroll 38s linear infinite; }
#topics .topics_villa .villa-track figure{ margin:0; flex:0 0 auto; width:64vw; }
#topics .topics_villa .villa-track img{ width:100%; height:42vw; object-fit:cover; display:block; }
#topics .topics_villa .villa-track figcaption{ margin-top:10px; text-align:center; font-size:1.15rem; color:#efe9df; }
@keyframes villaScroll{ from{ transform:translateX(0); } to{ transform:translateX(calc(-50% - 6px)); } }

/* scroll をロゴの左右中心に合わせる（スマホ：ロゴ中心 ≈ 46px） */
.mv-scroll{ left:46px; transform:translateX(-50%); }

/* TOPICS4：各画像の左上にグループロゴを重ねる スマホ */
#topics .topics_villa .villa-track figure{ position:relative; }
#topics .topics_villa .villa-track .villa-logo{ position:absolute; top:10px; left:10px; width:54px; height:auto; z-index:2; }

/* TOPICS1-3：装飾漢字（毛筆）スマホは右下に控えめに */
#topics .tp-kanji{ position:absolute; z-index:1; top:auto; left:auto; right:14px; bottom:20px; transform:none; writing-mode:vertical-rl; -ms-writing-mode:tb-rl; font-family:'Yuji Boku', serif; font-weight:400; font-size:58px; letter-spacing:5px; color:rgba(255,255,255,.8); text-shadow:0 2px 16px rgba(0,0,0,.6); pointer-events:none; }
#topics .topics_in.tp-right .tp-kanji, #topics .topics_in.tp-left .tp-kanji{ left:auto; right:14px; }

/* TOPICS装飾漢字：New Tegomin・横書き・小さめ（上書き） スマホ */
#topics .tp-kanji{ writing-mode:horizontal-tb; -ms-writing-mode:lr-tb; font-family:'New Tegomin', serif; font-weight:400; font-size:30px; letter-spacing:5px; }

/* TOPICS / PLAN のセクション見出し（ギャラリー・アクセスと同じ体裁） スマホ */
#topics > .ttl, #spplan > .ttl{ width:75px; margin:0 auto; }
#topics > .ttl{ padding:60px 0 40px; }
#spplan > .ttl{ padding:0 0 34px; }
#topics > .ttl h2.midashi, #spplan > .ttl h2.midashi{ color:#efe9df; border-top:2px solid rgba(255,255,255,.5); }

/* PLAN料金：下段（割引後）を主役に・上段は控えめ スマホ */
#spplan a.plan_rate{ font-size:1.25rem; line-height:1.5; padding:14px 8px; }
#spplan .plan_rate > b{ font-size:1.4rem !important; font-weight:600; }
#spplan .off{ display:block; margin-top:8px; }
#spplan .shousai{ font-size:1.2rem !important; display:block; line-height:1.3; }
#spplan .shousai b{ font-size:1.2rem !important; }
#spplan .shousai .s{ font-size:1.05rem !important; }
#spplan .shousai b.after_point_rate{ font-size:2.1rem !important; font-weight:700; }

/* TOPキャッチを小さめに（調整） スマホ */
.mv-catch .c-main{ font-size:1.35rem; line-height:1.85; letter-spacing:1px; }
.mv-catch .c-sub{ font-size:1rem; margin-top:14px; }

/* MV左カラム：ロゴと scroll を同一軸で中央そろえ スマホ */
.mv-left{ position:absolute; top:16px; left:18px; bottom:28px; z-index:9999; display:flex; flex-direction:column; align-items:center; }
.mv-logo{ position:static; top:auto; left:auto; }
.mv-logo img{ display:block; }
.mv-scroll{ position:static; left:auto; right:auto; top:auto; bottom:auto; transform:none; margin-top:auto; }
.mv-scroll::after{ left:50%; }

/* PLAN料金：割引後価格を少し小さく（調整） スマホ */
#spplan .shousai b.after_point_rate{ font-size:1.75rem !important; }

/* PLAN料金：行間を少し詰める（調整） スマホ */
#spplan a.plan_rate{ line-height:1.35; }
#spplan .off{ margin-top:3px; }
#spplan .shousai{ line-height:1.2; }

/* Googleマップの高さを低く（調整） スマホ */
#access .map{ height:240px; }

/* TOPICS04 の番号「04」を 01-03 と同じアクセント色に */
#topics .topics_villa .villa-txt .midashi .sub i{ color:var(--color-plan-btn); }

/* TOPICS1-3：背景スライドの前後アロー スマホ */
#topics .topics_in::before{ pointer-events:none; }
#topics .tpbg-prev, #topics .tpbg-next{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:38px; height:38px; border:1px solid rgba(255,255,255,.65); border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.4rem; line-height:1; background:rgba(0,0,0,.2); cursor:pointer; -webkit-tap-highlight-color:transparent; }
#topics .tpbg-prev{ left:12px; }
#topics .tpbg-next{ right:12px; }

/* TOPICSアロー：円形をやめて矢印だけに スマホ */
#topics .tpbg-prev, #topics .tpbg-next{ width:auto; height:auto; border:none; border-radius:0; background:none; font-size:2.3rem; text-shadow:0 1px 8px rgba(0,0,0,.6); }

/* TOPICS04 の番号「04」前に空白（01-03と同じ） */
#topics .topics_villa .villa-txt .midashi .sub i{ margin-left:8px; }

/* SP：ロゴとキャッチの重なり解消（キャッチをロゴの右側へ・ロゴ少し小さく） */
.mv-logo img{ height:clamp(120px,20vh,170px); }
.mv-catch{ left:76px; right:18px; top:40%; bottom:auto; transform:translateY(-50%); max-width:none; }
.mv-catch .c-main{ font-size:1.25rem; line-height:1.8; }
.mv-catch .c-sub{ font-size:.92rem; margin-top:12px; }

/* SP：ABOUT写真の枠内余白を解消（画像が枠いっぱいに） */
#about .about-photos figure{ overflow:hidden; }
#about .about-photos img{ width:100%; height:100%; object-fit:cover; display:block; }
#about .about-photos .ph2, #about .about-photos .ph3{ height:40vw; }
#about .about-photos .ph1, #about .about-photos .ph4{ height:54vw; }

/* SP：TOPICS04 テキストに左右余白（端に接しないように） */
#topics .topics_villa .villa-txt{ padding-left:6%; padding-right:6%; box-sizing:border-box; }

/* SP：TOPICS04 テキストを左寄せ */
#topics .topics_villa .villa-txt{ text-align:left; }

/* セクション区切り：黒の濃淡をごく僅かに交互（区切りを認識しやすく） */
#about  { background:#141311; }   /* 少し明るい黒 */
#spplan { background:#0b0b09; }   /* 少し暗い黒（旧rgba指定を上書き） */
#pg     { background:#141311; }   /* 少し明るい黒 */
#access { background:#0b0b09; }   /* 少し暗い黒 */

/* セクション区切り：濃淡をはっきりめに（調整） */
#about  { background:#1e1b16; }
#spplan { background:#080706; }
#pg     { background:#1e1b16; }
#access { background:#080706; }

/* ACCESS：上の余白を他セクションと揃える スマホ */
#access{ padding-top:70px; }