@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/
/* ================================
   変数・ベース
================================ */
:root {
  --tq-gold: #f1c542;
  --tq-dark: #14183b;
  --tq-white: #fff;
  --line-w: 72px; /* 線の長さ */
  --line-h: 2px;  /* 線の太さ */
  --gap: 12px;    /* 要素間隔 */
  --half-bg-color: #0f1a34;
  --hero-overlay-color: rgba(0, 0, 0, .2);

  /* タイトル系（別用途のゴールド・ネイビー） */
  --tq-navy: #0f1531;
  --tq-gold-2: #deb82e;
}

.ttl { font-size: 17px; }
h1, h2 { font-family: "Times New Roman", "游明朝", "Yu Mincho", serif; }

/* ================================
   ヘッダー・タイトル
================================ */
.l-topTitleArea { min-height: 280px; padding: 1em 0; }
.c-gnav > .menu-item > a .ttl { font-size: 16px; font-weight: bold; }

h1.c-pageTitle{
  color:#ffd966; display:flex; flex-direction:column; align-items:center;
  font-size:3.5em;
  text-shadow:0 1px 1px rgba(0,0,0,.25), 0 4px 12px rgba(0,0,0,.25);
}
small.c-pageTitle__subTitle.u-fz-14{
  color:#fff; font-size:.3em; line-height:1.4; margin-top:0; opacity:1;
}

/* ================================
   2行見出し（tq-heading-2lines）
================================ */
h2.tq-heading-2lines{
  color:var(--tq-dark); display:inline-flex; flex-direction:column;
  gap:clamp(6px,.8vw,10px); line-height:1; margin:0; padding:0 10px !important;
}
.tq-heading-2lines .en{
  color:var(--tq-gold); font-family:"Times New Roman","游明朝","Yu Mincho",serif;
  font-size:5rem; font-weight:500; letter-spacing:.02em; white-space:nowrap;
}
.tq-heading-2lines .line-ja{
  display:flex; align-items:center; gap:var(--gap); color:#fff;
  font-size:clamp(14px,1.6vw,18px);
}
.tq-heading-2lines .line-ja .rule{
  background:var(--tq-gold); height:var(--line-h); width:var(--line-w);
  display:block; transform:translateY(1px);
}
.tq-heading-2lines .line-ja .ja{ white-space:nowrap; }
.is-dark .tq-heading-2lines{ color:var(--tq-white); }
.is-dark .tq-heading-2lines .en{ color:var(--tq-gold); }
.is-dark .tq-heading-2lines .line-ja .rule{ background:var(--tq-gold); }
.tq-heading-2lines.is-center{ align-items:center; }

/* ================================
   半分背景ユーティリティ
================================ */
.bg-half-bottom{ background-image:linear-gradient(to bottom,transparent 0 80%,var(--half-bg-color) 80% 100%); }
.bg-half-top   { background-image:linear-gradient(to bottom,var(--half-bg-color) 0 40%,transparent 40% 100%); }
.bg-half-left  { background-image:linear-gradient(to right,var(--half-bg-color) 0 50%,transparent 50% 100%); }
.bg-half-right { background-image:linear-gradient(to right,transparent 0 50%,var(--half-bg-color) 50% 100%); }
.bg-half-bottom,.bg-half-top,.bg-half-left,.bg-half-right{
  background-repeat:no-repeat; background-size:100% 100%;
}
.service-bl{ --half-bg-color:#eaedf1; }
.service-bl.-half-right{
  background-image:linear-gradient(to right,transparent 0 40%,var(--half-bg-color) 40% 100%);
}

/* ================================
   レイアウト調整（恒久）
================================ */
.l-header__inner.l-container, .l-fixHeader__inner{
  margin:0; max-width:100%; padding:0 0 0 20px;
}
.c-widget__title.-spmenu{ display:none; }
li.menu-item-243{ background-color:#0f1a34; color:#fff; padding:30px 20px; }
.contact-part{ position:absolute; top:-50px; width:140px; }
.container_04{ height:300px; }

/* ================================
   スクロールインジケータ（ベース）
================================ */
.scrollbar-text_04{
  color:#000; display:inline-block; font-family:serif; font-size:14px;
  left:5%; letter-spacing:.2em; line-height:1; padding:10px 10px 110px;
  position:absolute; text-shadow:none !important; text-transform:uppercase;
  top:30%; transform:translateX(-50%); writing-mode:vertical-lr;
}
.scrollbar_04{ left:4.8%; position:absolute; top:65%; transform:translateX(-50%); }
.scrollbar_04::after{
  content:""; position:absolute; left:0; bottom:0; width:1px; height:200px; background:#e59f11;
}
.scrollbar_04::before{
  content:""; position:absolute; left:-4px; bottom:0; width:8px; height:8px; border-radius:50%;
  background:#e59f11; animation:circlemove 2s ease-in-out infinite, cirlemovehide 2s ease-out infinite;
}
@keyframes circlemove{ 0%{bottom:200px;} 100%{bottom:0;} }
@keyframes cirlemovehide{ 0%{opacity:0;} 50%{opacity:1;} 80%{opacity:.9;} 100%{opacity:0;} }
@media (max-width:1300px){
  .scrollbar-text_04{ left:5%; top:15%; }
}

/* ================================
   Hero（見出しは追加CSS側でSP差分を上書き）
================================ */
.hero.-slider{ min-height:min(90vh,900px); overflow:hidden; position:relative; }
.hero__swiper, .hero__swiper .swiper-wrapper, .hero__swiper .swiper-slide{
  width:100%; height:100%;
}
.hero__swiper .swiper-slide{ position:relative; }
.hero__swiper img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform:scale(1); animation:none !important; will-change:transform,opacity;
}
@keyframes heroZoom{ from{transform:scale(1);} to{transform:scale(1.03);} }
.fallback-slide{ position:absolute; inset:0; opacity:0; transition:opacity .8s ease; }
.fallback-slide.is-active{ opacity:1; }
.fallback-slide img{ width:100%; height:100%; object-fit:cover; animation:none; }
.swell-block-fullWide + .swell-block-fullWide{ margin-top:-5em; }

/* Hero 上テキスト */
.hero__inner{
  position:absolute; bottom:0; width:min(1200px,92%); margin-inline:auto;
  padding:2rem; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.35); z-index:2;
}
.hero__title{ font-family:"Yu Mincho", serif; font-size:clamp(28px,6vw,64px); font-weight:500; line-height:1.2; }
.hero__title .accent{ color:#ffd966; }
.hero__btn{ display:inline-block; margin-top:24px; padding:12px 24px; color:#fff; border:1px solid #ffd966; }

/* 画像オーバーレイ */
.hero__overlay{
  position:absolute; inset:0; background:var(--hero-overlay-color);
  pointer-events:none; z-index:1;
}

/* ================================
   見出し（tq-heading）
================================ */
.tq-heading{
  display:flex; align-items:center; gap:16px; margin:0;
  font-size:clamp(20px,2.2vw,34px); line-height:1.2; font-weight:500; color:var(--tq-white);
}
.tq-heading .en{
  font-family:"Times New Roman","游明朝",serif; color:var(--tq-gold-2);
  font-weight:500 !important; letter-spacing:.02em; white-space:nowrap;
}
.tq-heading .ja{ white-space:nowrap; }
.tq-heading .rule{ flex:1; height:2px; background:var(--tq-gold-2); display:block; transform:translateY(1px); }
.is-light .tq-heading{ color:#14183b; }
.is-light .tq-heading .en, .is-light .tq-heading .rule{ color:var(--tq-gold-2); background:var(--tq-gold-2); }

/* ================================
   RealEstate ボタン
================================ */
a.re-btn.re-btn--navy{
  background-color:#14183b !important; color:#fff !important; border:1px solid #fff !important;
}
a.re-btn.re-btn--navy.on-light,
a.re-btn.re-btn--navy.on-dark{
  background-color:#14183b !important; color:#fff !important; border-color:#fff !important;
}
/* 疑似ライン（※どちらか運用に合わせて） */
a.re-btn.re-btn--navy::after{ background:#fff !important; }
a.re-btn.re-btn--navy .line{  background:#deb82e !important; }

/* 通常・ホバー */
a.re-btn.re-btn--navy:hover,
a.re-btn.re-btn--navy.on-light:hover,
a.re-btn.re-btn--navy.on-dark:hover{
  background-color:#fff !important; color:#14183b !important; border-color:#14183b !important;
}
a.re-btn.re-btn--navy::after,
a.re-btn.re-btn--navy .line{ transition:transform .3s ease, background-color .3s ease; }
a.re-btn.re-btn--navy:hover::after,
a.re-btn.re-btn--navy:hover .line{ transform:translateX(10px); }

/* Ghost Button 基盤 */
:root{ --re-btn-gold:#deb82e; --re-btn-dark:#14183b; --re-btn-light:#ffffff; }
.re-btn{
  --btn-color:var(--re-btn-dark);
  --line-gap:-20px; --line-w:60px; --line-h:2px;
  position:relative; display:inline-flex; justify-content:center; align-items:center;
  min-height:65px; padding:12px 60px; font-size:1.4rem; line-height:1.2;
  font-weight:bold; letter-spacing:.04em; color:var(--btn-color);
  background:transparent; border:1.2px solid currentColor; border-radius:0;
  transition:all .3s ease; text-decoration:none;
}
.re-btn::after{
  content:""; position:absolute; top:50%; left:calc(100% + var(--line-gap));
  width:var(--line-w); height:var(--line-h); background:var(--re-btn-gold);
  transform:translateY(-50%) translateX(0); transition:transform .3s ease;
}
.re-btn:hover::after, .re-btn:focus-visible::after{
  transform:translateY(-50%) translateX(14px);
}
.re-btn.on-dark{ --btn-color:var(--re-btn-light); }
.re-btn.on-dark:hover, .re-btn.on-dark:focus-visible{
  background:var(--re-btn-light); color:var(--re-btn-dark); border-color:var(--re-btn-light);
}
.re-btn.on-light{ --btn-color:var(--re-btn-dark); }
.re-btn.on-light:hover, .re-btn.on-light:focus-visible{
  background:var(--re-btn-dark); color:var(--re-btn-light); border-color:var(--re-btn-dark);
}
.re-btn:focus-visible{ outline:2px solid var(--re-btn-gold); outline-offset:2px; }
a.re-btn.re-btn--navy::after {
    background: #deb82e !important;
}

@media (prefers-reduced-motion: reduce){ .re-btn, .re-btn::after{ transition:none; } }

/* ================================
   フェードアニメーション
================================ */
.fadein-up, .fadein-down, .fadein-left, .fadein-right, .fadein-zoom{
  opacity:0; transition:none;
}
.fadein-up{ transform:translateY(40px); }
.fadein-down{ transform:translateY(-40px); }
.fadein-left{ transform:translateX(-40px); }
.fadein-right{ transform:translateX(40px); }
.fadein-zoom{ transform:scale(.92); }
.fadein-delay-1{ animation-delay:.1s !important; }
.fadein-delay-2{ animation-delay:.3s !important; }
.fadein-delay-3{ animation-delay:.5s !important; }
.fadein-delay-4{ animation-delay:.7s !important; }
.fadein-up.is-visible{ animation:fadeInUp 1.1s cubic-bezier(.77,0,.18,1) forwards; }
.fadein-down.is-visible{ animation:fadeInDown 1.1s cubic-bezier(.77,0,.18,1) forwards; }
.fadein-left.is-visible{ animation:fadeInLeft 1.1s cubic-bezier(.77,0,.18,1) forwards; }
.fadein-right.is-visible{ animation:fadeInRight 1.1s cubic-bezier(.77,0,.18,1) forwards; }
.fadein-zoom.is-visible{ animation:fadeInZoom 1.1s cubic-bezier(.77,0,.18,1) forwards; }
@keyframes fadeInUp{ from{opacity:0; transform:translateY(40px);} to{opacity:1; transform:translateY(0);} }
@keyframes fadeInDown{ from{opacity:0; transform:translateY(-40px);} to{opacity:1; transform:translateY(0);} }
@keyframes fadeInLeft{ from{opacity:0; transform:translateX(-40px);} to{opacity:1; transform:translateX(0);} }
@keyframes fadeInRight{ from{opacity:0; transform:translateX(40px);} to{opacity:1; transform:translateX(0);} }
@keyframes fadeInZoom{ from{opacity:0; transform:scale(.92);} to{opacity:1; transform:scale(1);} }

/* ================================
   物件ページ：半分背景（上帯）
================================ */
.estate-halfbg{
  --band:180px;
  background: linear-gradient(#14183b 0 var(--band), #fff var(--band) 100%);
}