@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
*/

/* =========================================================
   HERO STACK（PC: 左静止 + 右スライド2枚 + テキスト最前面）
               SP: 重ね50/50 + 斜め仕切り + Scroll Down
   ========================================================= */

/* ---- Base ---- */
.hero-stack{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  height: clamp(560px, 62vw, 860px);
}

/* Layers */
.hero-stack .hero-left-panel,
.hero-stack .hero-right-main,
.hero-stack .hero-right-sub{
  position: absolute;
  inset: 0;
  margin: 0 !important;
  padding: 0 !important;
}
.hero-stack .hero-right-sub { z-index: 1; }
.hero-stack .hero-right-main{ z-index: 2; }
.hero-stack .hero-left-panel{ z-index: 3; }

/* PC 初期形状（ベース） */
.hero-stack .hero-left-panel{
  -webkit-clip-path: polygon(0 0, 55.35% 0, 34.35% 100%, 0 100%);
          clip-path: polygon(0 0, 55.35% 0, 34.35% 100%, 0 100%);
}
.hero-stack .hero-right-main{
  -webkit-clip-path: polygon(55% 0, 98.8% 0, 79% 100%, 34% 100%);
          clip-path: polygon(55% 0, 98.8% 0, 79% 100%, 34% 100%);
}
.hero-stack .hero-right-sub{
  -webkit-clip-path: polygon(97.8% 0, 100% 0, 100% 100%, 78% 100%);
          clip-path: polygon(97.8% 0, 100% 0, 100% 100%, 78% 100%);
  display: block !important;
}

/* SmartSlider full-fit */
.hero-stack .n2-ss-slider,
.hero-stack .n2-ss-slider .n2-ss-slider-content,
.hero-stack [id^="n2-ss-"]{
  width: 100% !important;
  height: 100% !important;
}
.hero-stack .n2-ss-slider .n2-ss-slide{ padding: 0 !important; }

/* Text front layer */
.hero-stack .hero-text-layer,
.hero-stack .hero-toplayer{
  position: absolute;
  inset: 0;
  z-index: 9999;
  display: grid;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none;
}
.hero-stack .hero-text-layer > *,
.hero-stack .hero-toplayer   > *{
  pointer-events: auto;
  align-self: center;
  justify-self: start;
  max-width: 44rem;
  margin-left: 7.5%;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0,0,0,.45);
}

/* Smooth scroll sitewide */
html{ scroll-behavior: smooth; }

/* ---- Scroll Down ribbon ---- */
.hero-stack .scroll-down{
  position: absolute;
  left: 50%;
  bottom: 28px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: .35em;
  padding: .75rem 1.8rem;
  -webkit-clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
          clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
  background: rgba(60,150,40,.95);
  color: #fff;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  z-index: 10000;
  pointer-events: auto;
}

.hero-stack .scroll-down::after{
  content: "";
  display: inline-block;
  width: 0; height: 0;
  border-left: .45em solid transparent;
  border-right: .45em solid transparent;
  border-top: .6em solid #fff; /* ▼ */
  margin-left: .25em;
  transform: translateY(1px);
}

/* Scroll Down 文字色制御 */
.hero-stack .scroll-down span{
  color: #7EBA2F !important;      /* 通常時の文字色（お好みで） */
  transition: color .25s ease;
}

/* hover / フォーカス時に白に */
.hero-stack .scroll-down:hover span,
.hero-stack .scroll-down:focus-visible span{
  color: #fff !important;
}


/* =========================================================
   Breakpoints
   ========================================================= */

/* PC (>=769px) */
@media (min-width: 769px){
  .hero-stack .hero-right-sub  { z-index: 1 !important; display:block !important; }
  .hero-stack .hero-right-main { z-index: 2 !important; }
  .hero-stack .hero-left-panel { z-index: 3 !important; }

  .hero-stack .hero-right-main{
    -webkit-clip-path: polygon(55% 0, 98.2% 0, 78.2% 100%, 34% 100%) !important;
            clip-path: polygon(55% 0, 98.2% 0, 78.2% 100%, 34% 100%) !important;
  }
  .hero-stack .hero-right-sub{
    -webkit-clip-path: polygon(98% 0, 100% 0, 100% 100%, 77% 100%) !important;
            clip-path: polygon(98% 0, 100% 0, 100% 100%, 77% 100%) !important;
  }

  /* sub slider fit */
  .hero-stack .hero-right-sub .n2-ss-slider,
  .hero-stack .hero-right-sub .n2-ss-slider .n2-ss-slider-content,
  .hero-stack .hero-right-sub .n2-ss-canvas{
    width:100% !important; height:100% !important; min-height:100% !important;
  }
}

/* SP (<=768px) */
@media (max-width: 768px){
  .hero-stack{
    height: min(100dvh, 500px) !important;
    overflow: hidden !important;
  }
  .hero-stack .hero-left-panel{ pointer-events: none; }

  .hero-stack .hero-left-panel,
  .hero-stack .hero-right-main,
  .hero-stack .hero-right-sub{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    backface-visibility: hidden;
    transform: translateZ(0);
  }
  .hero-stack .hero-right-sub{  display: none !important; }
  .hero-stack .hero-right-main{ z-index: 1 !important; overflow:hidden !important; }
  .hero-stack .hero-left-panel{ z-index: 2 !important; }

  /* 50/50 仕切り */
  .hero-stack .hero-left-panel{
    -webkit-clip-path: polygon(0 0, 50% 0, 34.6% 100%, 0 100%) !important;
            clip-path: polygon(0 0, 50% 0, 34.6% 100%, 0 100%) !important;
  }
  .hero-stack .hero-right-main{
    -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 35.4% 100%) !important;
            clip-path: polygon(50% 0, 100% 0, 100% 100%, 35.4% 100%) !important;
    transform: translateX(-0.8vw);
  }

  /* left cover */
  .hero-stack .hero-left-panel .wp-block-cover__image-background{
    background-size: cover !important;
    background-position: 50% 50% !important;
  }

  /* slider fit */
  .hero-stack .hero-right-main .wp-block-shortcode{ display:block !important; height:100% !important; }
  .hero-stack .hero-right-main .wp-block-shortcode > *{ height:100% !important; }
  .hero-stack .hero-right-main [id^="n2-ss-"]{
    width:100% !important; height:100% !important; min-height:100% !important; padding-bottom:0 !important;
  }
  .hero-stack .hero-right-main .n2-ow,
  .hero-stack .hero-right-main .n2-section-smartslider,
  .hero-stack .hero-right-main [id^="n2-ss-"][id$="-align"],
  .hero-stack .hero-right-main .n2-ss-align,
  .hero-stack .hero-right-main .n2-ss-slider-outer,
  .hero-stack .hero-right-main .n2-ss-slider-inner,
  .hero-stack .hero-right-main .n2-ss-slider,
  .hero-stack .hero-right-main .n2-ss-slider .n2-ss-slider-content,
  .hero-stack .hero-right-main .n2-ss-canvas,
  .hero-stack .hero-right-main .n2-ss-layers-container,
  .hero-stack .hero-right-main .n2-ss-slide{
    position:absolute !important; inset:0 !important;
    width:100% !important; height:100% !important; min-height:100% !important;
  }
  .hero-stack .hero-right-main .n2-ss-slide-background,
  .hero-stack .hero-right-main .n2-ss-slide-background img,
  .hero-stack .hero-right-main .n2-ss-slide-background video{
    position:absolute !important; inset:0 !important;
    width:100% !important; height:100% !important; object-fit:cover !important;
  }

  /* text layout (SP) */
  .hero-stack .hero-text-layer{
    align-content: center;
    justify-content: start;
    justify-items: start;
  }
  .hero-stack .hero-text-layer > *{
    align-self: auto;
    margin-left: 6vw; margin-right: 6vw;
    max-width: 90%;
    text-align: left;
  }

/* Scroll Down spacing */
.hero-stack .scroll-down{ bottom:16px; padding:.7rem 1.1rem; }
}


/* =========================================================
   TYPOGRAPHY（hero-copy__* 統一）
   - WP/Gutenbergのフォントサイズ系に確実に勝つ
   ========================================================= */

/* WPサイズ/行高/整列クラスをヒーロー内で無効化 */
.hero-stack :is(.hero-text-layer, .hero-toplayer)
:is(.has-xxl-font-size,.has-xl-font-size,.has-large-font-size,
    .has-medium-font-size,.has-small-font-size,.has-tiny-font-size,
    .is-style-lead,.wp-block-paragraph,.wp-block-heading,
    .has-text-align-left,.has-text-align-center,.has-text-align-right){
  font-size: inherit !important;
  line-height: inherit !important;
}

/* family（共通） */
.hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__catch{
  font-family: "Cal Sans", sans-serif !important; font-weight: 700;
}
.hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__sub{
  font-family: "Noto Serif JP", serif !important; font-weight: 700;
}
.hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__lead{
  font-family: "Noto Serif JP", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 200;
}

/* SP sizes */
@media (max-width: 768px){
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(h1,h2,h3,p).hero-copy__catch,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__catch{
    font-size: clamp(36px, 10vw, 48px) !important;
    line-height: 1.05 !important;
    letter-spacing: .02em;
    margin-bottom: .48em;
  }
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(h2,h3,p).hero-copy__sub,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__sub{
    font-size: clamp(16px, 5vw, 28px) !important;
    line-height: 1.3 !important;
    margin-top: .4em; margin-bottom: .3em;
	letter-spacing: 0.24em;
  }
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(p,div).hero-copy__lead,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__lead{
    font-size: clamp(11px, 2.8vw, 14px) !important;
    line-height: 1.8 !important;
    margin-top: .7em;
	letter-spacing: 0.1em;
  }
}

/* PC sizes */
@media (min-width: 769px){
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(h1,h2,h3,p).hero-copy__catch,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__catch{
    font-size: clamp(28px, 5vw, 54px) !important;
    line-height: 1.05 !important;
    margin: 0 0 .48em !important;
  }
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(h2,h3,p).hero-copy__sub,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__sub{
    font-size: clamp(16px, 3.2vw, 28px) !important;
    line-height: 1.3 !important;
    margin: .25em 0 .2em !important;
    letter-spacing: 0.24em;
  }
  .hero-stack :is(.hero-text-layer, .hero-toplayer)
  :is(p,div).hero-copy__lead,
  .hero-stack :is(.hero-text-layer, .hero-toplayer) .hero-copy__lead{
    font-size: clamp(13px, 2.6vw, 18px) !important;
    line-height: 1.8 !important;
    margin: .55em 0 0 !important;
	letter-spacing: 0.1em;
  }
}

/* =========================================================
   INTRO LOGO SPLASH
   ========================================================= */
#intro-logo{
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 99999;
  opacity: 0;
  pointer-events: none;
  transition: opacity .75s cubic-bezier(.22,.61,.36,1), visibility 0s linear .75s;
  will-change: opacity;
}

/* 表示状態（head内の初期CSSと整合） */
#intro-logo.is-show,
#intro-logo{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* 退場（opacityのみ） */
#intro-logo.is-leave{
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

#intro-logo::before,
#intro-logo::after{
  transition: opacity .75s cubic-bezier(.22,.61,.36,1);
}
#intro-logo.is-leave::before,
#intro-logo.is-leave::after{
  opacity: 0;
}

/* ロゴ画像 */
#intro-logo img{
  width: min(38vw, 220px);
  height: auto;
  opacity: 0; /* 初期は透明、keyframesで1へ */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  backface-visibility: hidden;
  will-change: opacity;
  animation: intro-fade-only 900ms ease-out forwards;
}

/* フェードインのみ */
@keyframes intro-fade-only{
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* 背景（グリーン系グラデーション） */
#intro-logo, #intro-logo::before{
  --brand-1:#0b5d3b;
  --brand-2:#11a66b;
  --brand-3:#c9f1de;
  background:
    linear-gradient(
      135deg,
      var(--brand-1) 0%,
      #0f6a48 33%,
      var(--brand-2) 55%,
      #49c78f 83%,
      var(--brand-3) 100%
    ) !important;
}
#intro-logo::before{
  content:""; position: fixed; inset: 0; z-index: -1;
}

/* 自動退場のCSS保険（約1.2秒表示→0.85秒でフェードアウト） */
@media (prefers-reduced-motion: no-preference){
  html:not(.intro-manual) #intro-logo{
    animation: intro-auto-hide .85s cubic-bezier(.22,.61,.36,1) 1.2s forwards;
  }
  @keyframes intro-auto-hide{
    to{ opacity:0; visibility:hidden; pointer-events:none; }
  }
}

/* =========================================================
   SWELL 固定ページ：タイトル帯を非表示 & 余白をなくす
   ========================================================= */

/* 1) タイトル帯（テーマ側のページタイトル見出し）を隠す */
.page :is(.c-pageTitle,.p-pageTitle,.l-pageHeader,.p-articleHead,.l-articleHeader){
  display: none !important;
}

/* 2) タイトル帯が消えた分の“上余白”をゼロにする（本文まわり） */
.page :is(.l-contents,.l-contents__main,.l-main,.p-article,.post_content){
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 3) 本文先頭ブロックの上余白を消す（ブロックエディタ対策） */
.page .post_content > *:first-child { margin-top: 0 !important; }

/* 4) グループ系の上側インナー余白も念のためカット */
.page :is(.wp-block-group, .is-layout-constrained){
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ===== パンくず直下の余白をゼロに（SWELL） ===== */
.page :is(.c-breadcrumb,.p-breadcrumb,.breadcrumb){ margin-bottom: 0 !important; }
.page .post_content .wp-block-shortcode{ margin-bottom: 0 !important; }
.page :is(.c-breadcrumb,.p-breadcrumb,.breadcrumb) + *,
.page .post_content .wp-block-shortcode + *{ margin-top: 0 !important; }

/* Spacer が先頭なら影響をなくす（任意） */
.page .post_content .wp-block-spacer:is(:first-child, .c-breadcrumb + .wp-block-spacer){
  height: 0 !important; margin: 0 !important;
}

/* ===== タイトルをスライダーに重ねる（SWELL × Smart Slider） ===== */
.page-hero{ position: relative; margin-top: -3.5rem; } /* 透明ヘッダー調整。不要なら削除 */
.page-hero .page-hero__overlay{
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  padding: clamp(16px, 6vw, 72px); text-align: center; pointer-events: none;
}
.page-hero .page-title{
  font-size: clamp(28px, 4.8vw, 48px);
  line-height: 1.2; font-weight: 700; color: #fff;
  text-shadow: 0 2px 16px rgba(0,0,0,.35);
}

/* Smart Slider 高さ（任意） */
.n2-ss-slider, .n2-ss-slider .n2-ss-section-main-content { min-height: clamp(320px, 40vw, 460px); }

/* 固定ページごとの上余白ゼロ（必要分だけ） */
.page-id-3  :is(#content,.l-content__inner),
.page-id-28  :is(#content,.l-content__inner),
.page-id-282 :is(#content,.l-content__inner),
.page-id-207 :is(#content,.l-content__inner),
.page-id-553 :is(#content,.l-content__inner),
.page-id-563 :is(#content,.l-content__inner),
.page-id-560 :is(#content,.l-content__inner),
.page-id-596 :is(#content,.l-content__inner),
.page-id-261 :is(#content,.l-content__inner){ padding-top: 0 !important; }

/* =========================================================
   /news/（= 投稿ページ：is_home かつ .blog）用の一括ルール
   ========================================================= */

/* タイトル帯・見出し系をまとめて隠す（親ごと＆H1個別） */
.home.blog:not(.front-page) :is(.l-pageHeader,.p-archiveHead,.p-pageTitle,.c-pageTitle),
.home.blog:not(.front-page) h1,
.home.blog:not(.front-page) .archive-title,
.home.blog:not(.front-page) .p-archiveTitle { display: none !important; }

/* タイトル帯が消えた分の上余白をゼロに */
.home.blog:not(.front-page) :is(.l-contents,.l-contents__inner){ margin-top: 0 !important; padding-top: 0 !important; }

/* パンくず直下の余白相殺 */
.home.blog:not(.front-page) :is(.breadcrumb,.p-breadcrumb,.c-breadcrumb){ margin-bottom: 0 !important; }
.home.blog:not(.front-page) :is(.breadcrumb,.p-breadcrumb,.c-breadcrumb) + *{ margin-top: 0 !important; }

/* ループ前に差し込むスライダーのラッパ（.posts-hero） */
.home.blog:not(.front-page) .posts-hero{ margin: 0 !important; }
.home.blog:not(.front-page) .breadcrumb + .posts-hero{ margin-top: 0 !important; }

/* Smart Slider の最低高さ（任意） */
.home.blog:not(.front-page) .n2-ss-slider,
.home.blog:not(.front-page) .n2-ss-slider .n2-ss-section-main-content{
  min-height: clamp(320px, 40vw, 460px);
}

/* Gutenberg先頭見出しの保険（H1ブロック化している場合） */
.home.blog:not(.front-page) .post_content > .wp-block-heading:first-of-type{ display:none !important; }


/* ① トップのヘッダー幅を下層と同じ“箱幅”にする */
.home .l-header__inner.l-container{
  max-width: var(--swl-container, 1200px); /* 下層の実数値に合わせてOK */
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;   /* スクショでは 0 32px だったので、好みで 16〜32px に調整 */
  padding-right: 16px;
}

/* ②（保険）グローバルナビを常に右寄せに統一 */
.l-header__inner .c-gnav,
.l-header__inner .p-globalNav,
.l-header__inner .c-gnav__inner{
  justify-content: flex-end;
}


/*
 * SWELLのアウトラインボタン（.is-style-btn_line）に
 * .my-outline-white というクラスを追加した場合、
 * そのボタンのリンク（.swl-btn_link）の背景色を白（#ffffff）にする
 */
.my-outline-white.is-style-btn_line .swell-block-button__link {
  background-color: #ffffff;
}

/*
 .my-outline-white ボタンのホバー時（:hover）のスタイル
 */
.my-outline-white.is-style-btn_line .swell-block-button__link:hover {
  background-color: #0b753c; /* 背景色をグリーンに */
  color: #ffffff;            /* テキスト色を白に */
  border-color: #0b753c;    /* 枠線の色も背景色に合わせる */
}


/* パンくずリストの背景色を変更 */
.p-breadcrumb {
    background-color: #7eb92e !important;
	color: #ffffff;
	padding-top: 1px;    /* 上の余白（数値は調整してください）*/
    padding-bottom: 1px; /* 下の余白（数値は調整してください）*/
}


/* PC */
@media (min-width:1025px){
  body.page-id-282 #n2-ss-9item2{
    --margin-left: clamp(48px, 6vw, 140px) !important; /* 左からの距離（PC） */
  }
}
/* SP */
@media (max-width:1024px){
  body.page-id-282 #n2-ss-9item2{
    --margin-left: 20px !important; /* 左からの距離（SP） */
  }
}

/* 念のための保険（Smart SliderのAlignがLeftでない/ガター影響時の効き強化） */
body.page-id-282 #n2-ss-9item2{
  margin-left: 0 !important;
  right: auto !important;
}

@media (max-width: 767px) {
  .catch-en {
    display: inline-block;
    line-height: 1 !important;  /* 英語2行の行間を詰める */
  }
}

/* ビジョンページのキャッチコピーの行間調整 */
.v-catch {
	display: inline-block;
	line-height: 1.2 !important;
  }


/* プロフィールテーブルの全体的な設定 */
/* 1. テーブル本体の罫線を消去 (既存クラスを優先) */
/* has-fixed-layout クラスを含むテーブルすべてに適用 */
table.has-fixed-layout,
table.profile_table { /* 念のため、指定したクラスも併記 */
    border: none !important;
    border-collapse: collapse !important;
    box-shadow: none !important; /* テーマによっては影が罫線のように見えるため消去 */
}

/* 2. セル（thとtd）の罫線を消去 (最重要) */
table.has-fixed-layout th,
table.has-fixed-layout td,
table.profile_table th,
table.profile_table td {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
}

/* 3. テーブルの枠線を提供する可能性のある親要素のクラスの罫線も消去（SWELL対策） */
.wp-block-table.profile_table,
.wp-block-table table.has-fixed-layout {
    border: none !important;
    box-shadow: none !important;
}

p.shadow {text-shadow: 1px 2px 3px #ffffff; }