/* =========================================================
  custom.css — サイト固有スタイル
  child.css の後に読み込まれ、CSS変数・スタイルを上書きする。
=========================================================

  【新規サイト作成時の手順】
  1. ★ブランドカラーを設定（:root の --c-primary 等）
  2. ★下層ページヘッダー背景を設定（.p-topArea.-noimg）
  3. 必要に応じてフッター色・ドロワー色を上書き
  4. ページ固有スタイルを下部に追記

========================================================= */


/* =========================================================
  ★ ブランドカラー（必須）
  child.css のデフォルト値をここで上書きする
========================================================= */
:root {
    --c-primary:      #000000;   /* ★ メインカラー */
    --c-primary-dark: #000000;   /* ★ 濃いメインカラー（サブメニュー・確認メッセージ等） */
    --c-accent:       #D3AF37;
    --c-glay:         #888888;
    --c-border:       #CCCBCA;

    --g-gold: #D3AF37, #E3C316 50%, #CBA135; /* ゴールドグラデーション */

    --f-mincho: "Noto Serif JP", "游明朝体", "Yu Mincho", YuMincho,
              "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro",
              "ＭＳ Ｐ明朝", "MS PMincho", serif;
}



/* =========================================================
  common
========================================================= */

[data-scrolled="true"] .l-header {
    box-shadow: var(--shadow3);
    background-color: #FFFFFFED;
}

[data-scrolled="false"] .l-header {
    box-shadow: none;
    background-color: unset;
}

/* 下層ページ（TOPページ以外。投稿・固定ページ・アーカイブ等すべて含む）のみヘッダーにshadowをつける */
body:not(.home):not(.front-page) .l-header {
    box-shadow: var(--shadow3);
}

h2 {
  font-size: var(--fz-24-36);
  font-family: var(--f-mincho);
  font-weight: 600;
}

h3 {
  font-size: var(--fz-16-20);
  font-family: var(--f-mincho);
  font-weight: 600;
}

.cont2_wrap,
.cont3_wrap,
.news_wrap {
  margin-top: 0 !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.news_wrap,
.cta_wrap {
  padding-bottom: 100px !important;
  margin-top: 100px;
}

.cont2_wrap h2 {
  font-family: var(--f-mincho);
  font-size: var(--fz-18-24);
  line-height: 2;
}

.wp-block-button.c-btn-outline {
  width: 360px;
}

.l-footer,
.l-header__right {
  font-family: var(--f-mincho);
}

.l-footer .l-footer__nav a {
  font-size: 1rem;
}

.c-gnav__li>.c-gnav__a {
  padding: 16px 20px;
}

.c-gnav li.menu-item-178 a {
  border: 1px solid var(--c-bg);
  margin-left: 1.5rem;
  flex-direction: row;
  align-items: center;
}

.c-gnav li.menu-item-178 a::before {
    font-family: "Font Awesome 6 Free";
    content: "\f0e0";
    font-weight: 600;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: transform 0.3s ease;
}

/* TOPのMVオーバーレイ時（未スクロール時）以外はテキストカラーの枠線にする */
[data-scrolled="true"] li.menu-item-178 a,
body:not(.home):not(.front-page) li.menu-item-178 a {
  border: none;
  background-color: var(--c-primary);
  color: var(--c-bg);
}

/* =========================================================
  TOP
========================================================= */

/* MV */
.mv_wrap.wp-block-cover {
    min-height: 95svh;
    z-index: 10;
}

@media (max-width: 767px) {
    .mv_wrap.wp-block-cover {
        min-height: 95svh;
    }
}

.wp-block-cover.mv_wrap .wp-block-cover__image-background {
    animation: mv-zoom 20s ease-out forwards;
    transform-origin: right center; /* object-position(100% 50%)に合わせる */
}

@keyframes mv-zoom {
    from { transform: scale(1); }
    to   { transform: scale(1.15); }
}

/* mv_wrapを位置基準にする（wp-block-coverはデフォルトでposition:relative） */
.mv_wrap {
    position: relative;
}

/* 内部コンテナがposition:staticのままなら基準はmv_wrapになる */
.mv_wrap .wp-block-cover__inner-container {
    position: static;
}

.mv_col {
    position: absolute;
    bottom: 10vh;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 40px);
    max-width: 1000px;
    justify-content: center;
    gap: 5vw !important;
}

.mv_box_l {
  max-width: 180px;
}

.mv_box_r p {
  font-size: var(--fz-24-48);
  font-family: var(--f-mincho);
  margin-top: 0 !important;
  font-weight: 600;
}

.mv_box_r p span {
    background-image: linear-gradient(to bottom, var(--g-gold));
    background-size: 100% 15%;
    background-position: 0 100%;
    background-repeat: no-repeat;
}

@media (max-width: 760px) {
  .mv_col {
    bottom: 5vh;
  }
  .mv_box_r {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    flex-basis: 60% !important;
  }

  .mv_box_r p {
    writing-mode: vertical-rl;
  }

  .mv_box_r p span {
    background-image: linear-gradient(to right, var(--g-gold));
    background-size: 15% 100%;
    background-position: 100% 0;
    background-repeat: no-repeat;
  }
}

@media (max-width: 360px) {
  .mv_col {
    flex-direction: column-reverse;
  }

  .mv_box_l {
    max-width: 120px;
  }
}

.h_sub {
  background: linear-gradient(to left, var(--g-gold));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: var(--f-mincho);
  letter-spacing: 0.2em;
}

.hr_gold {
  /* background: linear-gradient(to left, var(--g-gold)); */
  background: #CBA135;
  border: none;
  height: 1px !important;
  max-width: 120px !important;
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

/* cont1: OUR SERVICE セクション */
.cont1_wrap {
  position: relative;
  overflow: hidden;
  padding: 80px var(--ark-pad--container);
  margin-top: 0;
}

.cont1_wrap::before, .cont1_wrap::after {
  content: '';
  position: absolute;
  top: -50%;
  height: 200%;
  background-color: #F5F5F5;
  transform: rotate(10deg);
  pointer-events: none;
}

.cont1_wrap::before {
  right: 70px;
  width: 10px
}
.cont1_wrap::after  {
  right: 90px;
  width: 70px;
}

.cont1_wrap .wp-block-group__inner-container {
  position: relative;
  z-index: 1;
}

.cont1_wrap .cont1_grid {
  gap: 0;
}

.cont1_grid > div {
  padding: 30px var(--st-pad--container);
  background-color: var(--c-bg);
}

.cont1_grid_box_1,
.cont1_grid_box_2 {
  border: 1px solid var(--c-accent);
  border-left: 0;
}

.cont1_grid_box_3 {
  border: 1px solid var(--c-accent);
  border-right: 0;
  border-left: 0;
}

.cont1_grid_box_4 {
  border: 1px solid var(--c-accent);
  border-right: 0;
}

@media (max-width:1024px) {
  .wp-container-core-group-is-layout-85a54dc3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .cont1_grid_box_2 {
    border-right: 0;
  }

  .cont1_grid_box_3,
  .cont1_grid_box_4 {
    border-top: 0;
  }

  .cont1_grid_box_3 {
    border-right: 1px solid var(--c-accent);
  }

  .cont1_grid_box_4 {
    border-left: 0;
  }
}

@media (max-width:460px) {
  .wp-container-core-group-is-layout-85a54dc3 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }

  .cont1_grid_box_1 {
    border: 1px solid var(--c-accent);
    border-top: 0;
    border-bottom: 0;
  }
  .cont1_grid_box_2,
  .cont1_grid_box_3 {
    border: 1px solid var(--c-accent);
    border-bottom: 0;
  }
  .cont1_grid_box_4 {
    border: 1px solid var(--c-accent);
    border-bottom: 0;
  }
}

.cont3_box {
  border: 1px solid var(--c-text);
  padding: 30px var(--st-pad--container-mid);
  background: var(--c-bg);
}

.news_wrap ul.news_cont {
  border: 0;
  max-height: 260px;
  overflow-y: scroll;
}

.news_wrap ul.news_cont li {
  padding: 2rem 0;
  border-bottom: 1px dashed var(--c-border);
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
}

.news_wrap ul.news_cont li a,
.news_wrap ul.news_cont li time {
  font-size: 1rem;
}

.news_wrap ul.news_cont li time {
  margin-right: 4rem;
  min-width: 10rem;
}

.wp-block-columns.news_btn {
  margin-top: 2.5rem;
}

.news_btn .wp-block-button.c-btn-outline a {
  margin-top: 0 !important;
}

.news_btn .insta figure {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .news_wrap ul.news_cont li {
    flex-direction: column-reverse;
    align-items: flex-start
  }
}

.cta_wrap .cta_col {
  border: 1px solid rgb(136, 136, 136, .5);
  padding: 20px var(--ark-pad--container);
  margin-top: 40px;
}
.cra_box_tel {
  border-right: 1px solid rgb(136, 136, 136, .5);
  font-family: var(--f-mincho);
}

@media (max-width: 781px) {
  .cra_box_tel {
    border-right: 0;
  }
}

.foot {
  font-family: var(--f-mincho);
  margin-bottom: var(--ark-mt);
}



/* =========================================================
  下層ページ
========================================================= */
.p-topArea.-noimg {
    /* パターン①: 画像 + オーバーレイ */
    background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(/wp-content/uploads/2026/07/mv_01.webp);
    background-size: cover;
    background-position: center;

    /* パターン②: グラデーションのみ */
    /* background: linear-gradient(to right, var(--c-primary) 0%, var(--c-primary-dark) 100%); */
}

.p_cont1_col {
  position: relative;
  margin-bottom: 15vh;
  font-family: var(--f-mincho);
}

.p_cont1_box_r {
  position: absolute;
  top: 7vh;
  left: 25%;
  background: var(--c-bg);
  padding: 30px var(--ark-pad--container);
  box-shadow: var(--shadow4);
  max-width: max(40vw, 640px);
}

.ceo_txt {
  font-size: var(--fz-16-20);
  font-weight: 900;
}

@media (max-width: 920px) {
  .p_cont1_box_r {
    top: 32vh;
    left: 10%;
  }

  .p_cont1_col {
    margin-bottom: 40vh;
  }
}

@media (max-width: 781px) {
  .p_cont1_box_r {
    position: static;
    z-index: 5;  
    max-width: 100%;
  }

  .p_cont1_col {
    margin-bottom: inherit;
  }
}

.business_grid {
  gap: 3vw ;
}

.business_box {
  background: var(--c-bg);
  padding: 30px var(--ark-pad--container) 40px;
  box-shadow: var(--shadow4);
}

.business_box h3 {
  border-bottom: 1px solid #d5b139b3;
  padding-bottom: 1.3em;
}

@media (max-width: 460px) {
  .business_grid.wp-container-core-group-is-layout-28b052f3 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

/* =========================================================
  ドロワー（スマホメニュー）背景色
========================================================= */
/* .p-drawer { background-color: var(--c-accent); } */


/* =========================================================
  フッター色
========================================================= */
/* .l-footer { background-color: var(--c-accent); color: var(--c-bg); } */
/* .l-footer p.c-copyright { color: var(--c-bg); } */


/* =========================================================
  ページ固有スタイル
========================================================= */