@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* TameshiTech Home v3.1 — production CSS
   Scope: homepage staging/production markup generated by TameshiTech Core.
   Generated: 2026-09-08
*/

.tt31{
  --navy:#082d52;--navy2:#103f6b;--blue:#087dcc;--cyan:#00a9e8;
  --ink:#102a43;--muted:#5d7083;--line:#dce8f2;--soft:#f6fbff;--max:1140px;
  color:var(--ink);
}
.tt31 *{box-sizing:border-box}
.tt31 a{text-decoration:none}
.tt31 .wrap{max-width:var(--max);margin:0 auto}

/* HERO */
.tt31 .hero{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:1.16fr .84fr;gap:42px;align-items:center;
  margin:18px 0 70px;padding:68px 60px;
  border:1px solid #d6e8f6;border-radius:30px;
  background:
    radial-gradient(circle at 90% 10%,rgba(0,169,232,.18),transparent 26%),
    radial-gradient(circle at 8% 94%,rgba(8,125,204,.09),transparent 29%),
    linear-gradient(135deg,#f9fcff 0%,#eef8ff 55%,#fbfdff 100%);
  box-shadow:0 20px 50px rgba(18,58,99,.10);
}
.tt31 .hero-copy,.tt31 .process{position:relative;z-index:1}
.tt31 .kicker{
  display:inline-flex;padding:8px 14px;border:1px solid #c8e4f5;border-radius:999px;
  background:rgba(255,255,255,.84);color:#0c65a4;font-size:12px;font-weight:900;letter-spacing:.08em
}
.tt31 h1{
  max-width:750px;margin:22px 0 18px;
  color:var(--navy);font-size:clamp(39px,5vw,61px);line-height:1.16;letter-spacing:-.04em
}
.tt31 .hero-lead{
  max-width:700px;margin:0 0 27px;color:#52677a;font-size:17px;line-height:1.9
}
.tt31 .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.tt31 .btn-main,.tt31 .btn-sub{
  display:inline-flex;align-items:center;gap:8px;padding:14px 20px;border-radius:10px;font-weight:800
}
.tt31 .btn-main{
  background:linear-gradient(135deg,#113d70,#087dcc 55%,#00a9e8);
  color:#fff!important;box-shadow:0 7px 18px rgba(8,125,204,.24)
}
.tt31 .btn-sub{border:1px solid #cfe1ee;background:#fff;color:#214c70!important}

/* process visual rather than duplicate navigation */
.tt31 .process{
  padding:26px;border:1px solid rgba(255,255,255,.9);border-radius:22px;
  background:rgba(255,255,255,.76);box-shadow:0 12px 34px rgba(18,58,99,.08)
}
.tt31 .process-label{
  margin-bottom:18px;color:#6f8598;font-size:11px;font-weight:900;letter-spacing:.12em
}
.tt31 .step{
  position:relative;display:grid;grid-template-columns:46px 1fr;gap:14px;
  padding:14px 0
}
.tt31 .step + .step{border-top:1px solid #e3edf4}
.tt31 .step-num{
  width:42px;height:42px;display:grid;place-items:center;border-radius:12px;
  background:linear-gradient(135deg,#edf7ff,#e3f3fd);color:#087dcc;font-size:12px;font-weight:900
}
.tt31 .step b{display:block;margin:1px 0 4px;color:#153f65;font-size:15px}
.tt31 .step span{display:block;color:#6b7f91;font-size:13px;line-height:1.55}

/* SECTIONS */
.tt31 .section{margin-bottom:72px}
.tt31 .section-head{
  display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:25px
}
.tt31 .label{
  display:block;margin-bottom:7px;color:#00a9e8;font-size:11px;font-weight:900;letter-spacing:.14em
}
.tt31 .section-head h2{margin:0;font-size:32px;letter-spacing:-.025em}
.tt31 .section-head p{max-width:610px;margin:0;color:var(--muted);line-height:1.8}

/* FEATURED 3 */
.tt31 .featured{display:grid;grid-template-columns:1.28fr .72fr;gap:18px}
.tt31 .feature-main{
  position:relative;overflow:hidden;min-height:430px;
  display:flex;flex-direction:column;justify-content:flex-end;padding:35px;border-radius:24px;
  background:
    radial-gradient(circle at 85% 15%,rgba(0,169,232,.28),transparent 31%),
    linear-gradient(135deg,#0b2f52 0%,#114c7c 58%,#087dcc 100%);
  color:#fff!important;box-shadow:0 17px 42px rgba(11,47,82,.18)
}
.tt31 .feature-main:after{
  content:"AI";position:absolute;right:22px;top:6px;color:rgba(255,255,255,.05);
  font-size:150px;font-weight:900;line-height:1
}
.tt31 .badge{
  position:relative;z-index:1;display:inline-flex;width:max-content;padding:6px 9px;margin-bottom:auto;
  border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.10);
  font-size:11px;font-weight:900;letter-spacing:.1em
}
.tt31 .feature-main h3{
  position:relative;z-index:1;max-width:570px;margin:0 0 12px;color:#fff;font-size:32px;line-height:1.3
}
.tt31 .feature-main p{
  position:relative;z-index:1;max-width:620px;margin:0 0 20px;color:#dbeaf6;line-height:1.85
}
.tt31 .feature-main b{position:relative;z-index:1;color:#fff}
.tt31 .feature-side{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.tt31 .feature-small{
  display:flex;flex-direction:column;padding:27px;border:1px solid var(--line);border-radius:20px;
  background:#fff;box-shadow:0 8px 26px rgba(18,58,99,.07);color:var(--ink)!important;transition:.2s ease
}
.tt31 .feature-small:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(18,58,99,.11)}
.tt31 .mini-label{color:#0c65a4;font-size:11px;font-weight:900;letter-spacing:.1em}
.tt31 .feature-small h3{margin:10px 0 9px;color:#123a63;font-size:22px;line-height:1.4}
.tt31 .feature-small p{margin:0 0 16px;color:#5b6f82;line-height:1.8}
.tt31 .feature-small b{margin-top:auto;color:#087dcc}

/* SECONDARY GUIDES ONLY — avoids repeating all 5 */
.tt31 .secondary-guides{
  display:grid;grid-template-columns:1fr 1fr;gap:18px
}
.tt31 .secondary-card{
  position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr;gap:18px;
  padding:27px;border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(180deg,#fff,#fbfdff);color:var(--ink)!important;
  box-shadow:0 7px 24px rgba(18,58,99,.055);transition:.2s ease
}
.tt31 .secondary-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(18,58,99,.09)}
.tt31 .icon{
  width:50px;height:50px;display:grid;place-items:center;border-radius:14px;
  background:#edf7ff;color:#087dcc;font-size:13px;font-weight:900
}
.tt31 .secondary-card h3{margin:0 0 8px;color:#153f65;font-size:21px}
.tt31 .secondary-card p{margin:0 0 13px;color:#617487;line-height:1.75}
.tt31 .secondary-card b{color:#087dcc;font-size:13px}

/* METHODOLOGY + FIRSTHAND split */
.tt31 .method{
  display:grid;grid-template-columns:1.15fr .85fr;gap:18px
}
.tt31 .rules{
  padding:34px;border-radius:24px;background:linear-gradient(135deg,#082d52,#0d416f);
  color:#fff;box-shadow:0 16px 40px rgba(8,45,82,.15)
}
.tt31 .rules h2{margin:0 0 11px;color:#fff;font-size:30px}
.tt31 .rules-lead{margin:0 0 23px;color:#d4e5f2;line-height:1.8}
.tt31 .rule{
  display:grid;grid-template-columns:52px 1fr;gap:14px;padding:16px 0
}
.tt31 .rule + .rule{border-top:1px solid rgba(255,255,255,.12)}
.tt31 .rule-num{color:#8dd8ff;font-size:11px;font-weight:900;letter-spacing:.1em}
.tt31 .rule h3{margin:0 0 5px;color:#fff;font-size:17px}
.tt31 .rule p{margin:0;color:#d7e7f3;font-size:14px;line-height:1.7}

.tt31 .firsthand{
  display:flex;flex-direction:column;padding:31px;border:1px solid #cfe4f3;border-radius:24px;
  background:linear-gradient(135deg,#eef8ff,#fbfdff)
}
.tt31 .firsthand .label{margin-bottom:8px}
.tt31 .firsthand h2{margin:0 0 11px;font-size:27px}
.tt31 .firsthand p{margin:0 0 21px;color:#5b6f82;line-height:1.85}
.tt31 .firsthand-main{
  display:block;padding:17px;margin-bottom:12px;border-radius:14px;background:#fff;
  border:1px solid #d9e9f3;color:#153f65!important
}
.tt31 .firsthand-main strong{display:block;margin-bottom:5px}
.tt31 .firsthand-main span{color:#63778a;font-size:13px}
.tt31 .compare-links{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}
.tt31 .compare-links a{
  padding:13px;border:1px solid #d9e9f3;border-radius:12px;background:#fff;color:#214c70!important;
  font-size:13px;font-weight:800
}

/* About */
.tt31 .about{
  display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;
  padding:30px 32px;border:1px solid #cfe4f3;border-radius:20px;background:#f8fbfe
}
.tt31 .about h2{margin:0 0 8px;font-size:26px}
.tt31 .about p{max-width:770px;margin:0;color:#5b6f82;line-height:1.85}
.tt31 .about a{
  display:inline-flex;padding:13px 17px;border-radius:9px;background:#102a43;
  color:#fff!important;font-weight:800;white-space:nowrap
}

/* Responsive */
@media(max-width:980px){
  .tt31 .hero{grid-template-columns:1fr}
  .tt31 .featured{grid-template-columns:1fr}
  .tt31 .feature-side{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .tt31 .method{grid-template-columns:1fr}
}
@media(max-width:720px){
  .tt31 .hero{padding:46px 22px;border-radius:20px}
  .tt31 h1{font-size:34px}
  .tt31 .hero-lead{font-size:15px}
  .tt31 .section{margin-bottom:52px}
  .tt31 .section-head{display:block}
  .tt31 .section-head p{margin-top:8px}
  .tt31 .feature-side{grid-template-columns:1fr}
  .tt31 .secondary-guides{grid-template-columns:1fr}
  .tt31 .rules{padding:26px 20px}
  .tt31 .compare-links{grid-template-columns:1fr}
  .tt31 .about{grid-template-columns:1fr}
}

/* ===== v2.8 Cocoon interference hardening ===== */

/* Staging/production homepage: remove article chrome that makes a service homepage look like a post */
body:has(.tt31) #sidebar,
body:has(.tt31) .sidebar,
body:has(.tt31) .article-header,
body:has(.tt31) .entry-title,
body:has(.tt31) .date-tags,
body:has(.tt31) .post-date,
body:has(.tt31) .post-update,
body:has(.tt31) .sns-share,
body:has(.tt31) .sns-share-buttons,
body:has(.tt31) .sns-follow,
body:has(.tt31) .author-info,
body:has(.tt31) .article-footer,
body:has(.tt31) .toc,
body:has(.tt31) .toc-content,
body:has(.tt31) .toc-widget-box {
  display:none!important;
}

/* Force the staged page to use homepage-like full width */
body:has(.tt31) #content,
body:has(.tt31) .content,
body:has(.tt31) .content-in,
body:has(.tt31) #main,
body:has(.tt31) main.main {
  width:100%!important;
  max-width:none!important;
}
body:has(.tt31) #main,
body:has(.tt31) main.main {
  float:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}
body:has(.tt31) .entry-content {
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

/* Keep theme's generic heading rules from leaking into the custom service UI */
body:has(.tt31) .tt31 h1,
body:has(.tt31) .tt31 h2,
body:has(.tt31) .tt31 h3 {
  background:transparent!important;
  border:0!important;
  border-left:0!important;
  border-bottom:0!important;
  padding:0!important;
  box-shadow:none!important;
}
body:has(.tt31) .tt31 h2::before,
body:has(.tt31) .tt31 h3::before {
  display:none!important;
}

/* Explicit contrast rules */
.tt31 .hero h1,
.tt31 .section-head h2,
.tt31 .about h2,
.tt31 .firsthand h2,
.tt31 .secondary-card h3 {
  color:#102a43!important;
}
.tt31 .rules h2,
.tt31 .rule h3 {
  color:#ffffff!important;
  background:transparent!important;
}
.tt31 .rules .label,
.tt31 .rule-num {
  color:#8dd8ff!important;
}
.tt31 .rules-lead,
.tt31 .rule p {
  color:#e2eef7!important;
}
.tt31 .feature-main h3,
.tt31 .feature-main p,
.tt31 .feature-main b {
  background:transparent!important;
}
.tt31 .feature-main h3,
.tt31 .feature-main b {
  color:#fff!important;
}
.tt31 .feature-main p {
  color:#e7f2fa!important;
}
.tt31 .feature-small h3,
.tt31 .feature-small p,
.tt31 .feature-small b,
.tt31 .secondary-card h3,
.tt31 .secondary-card p,
.tt31 .secondary-card b {
  background:transparent!important;
}

/* More breathing room and cleaner readable measure */
.tt31 .wrap {
  width:min(1140px, calc(100% - 40px));
}
.tt31 .section-head p {
  max-width:560px;
}
.tt31 .about p,
.tt31 .firsthand p {
  max-width:720px;
}

/* New-list should stay inside the service layout rather than edge-to-edge */
body:has(.tt31) .new-entry-cards {
  width:min(1140px, calc(100% - 40px))!important;
  margin:0 auto 60px!important;
}

/* Hide stray page-navigation/share blocks after the latest list */
body:has(.tt31) .footer-meta,
body:has(.tt31) .under-entry-content {
  display:none!important;
}

@media(max-width:720px){
  .tt31 .wrap {width:min(100% - 24px, 1140px)}
  body:has(.tt31) .new-entry-cards {width:calc(100% - 24px)!important}
}


/* ===== v2.9 final polish ===== */

/* Prevent awkward single-character wrapping in the hero on common desktop widths */
.tt31 h1{
  max-width:780px!important;
  font-size:clamp(38px,4.45vw,58px)!important;
  line-height:1.16!important;
  text-wrap:balance;
}
@media (max-width:1180px) and (min-width:721px){
  .tt31 h1{
    font-size:46px!important;
    max-width:700px!important;
  }
  .tt31 .hero{
    grid-template-columns:1.12fr .88fr!important;
    gap:30px!important;
    padding-left:46px!important;
    padding-right:46px!important;
  }
}

/* Make Cocoon latest posts a stable responsive grid rather than a clipped horizontal row */
body:has(.tt31) .new-entry-cards{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  overflow:visible!important;
}
body:has(.tt31) .new-entry-card-link{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
}
body:has(.tt31) .new-entry-card{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
body:has(.tt31) .new-entry-card-content{
  min-width:0!important;
}
body:has(.tt31) .new-entry-card-title{
  overflow-wrap:anywhere!important;
}

@media(max-width:900px){
  body:has(.tt31) .new-entry-cards{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:560px){
  body:has(.tt31) .new-entry-cards{
    grid-template-columns:1fr!important;
  }
}

/* Homepage-style ending: breadcrumb is unnecessary here */
body:has(.tt31) .breadcrumb,
body:has(.tt31) #breadcrumb,
body:has(.tt31) .breadcrumb-caption{
  display:none!important;
}


/* ===== v3.0 final latest-grid fix ===== */
.tt31-latest-grid{
  width:min(1140px,calc(100% - 40px))!important;
  margin:0 auto 64px!important;
}
.tt31-latest-grid .new-entry-cards,
.tt31-latest-grid .new-entry-cards.large-thumb-on,
.tt31-latest-grid .new-entry-cards.large-thumb-off{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  width:100%!important;
  max-width:none!important;
  overflow:visible!important;
}
.tt31-latest-grid .new-entry-card-link{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
}
.tt31-latest-grid .new-entry-card{
  display:flex!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
}
.tt31-latest-grid .new-entry-card-thumb{
  flex:0 0 38%!important;
  min-width:0!important;
}
.tt31-latest-grid .new-entry-card-content{
  flex:1 1 auto!important;
  min-width:0!important;
  padding-left:10px!important;
}
.tt31-latest-grid .new-entry-card-title{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  line-height:1.45!important;
}
@media(max-width:900px){
  .tt31-latest-grid .new-entry-cards,
  .tt31-latest-grid .new-entry-cards.large-thumb-on,
  .tt31-latest-grid .new-entry-cards.large-thumb-off{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:560px){
  .tt31-latest-grid{
    width:calc(100% - 24px)!important;
  }
  .tt31-latest-grid .new-entry-cards,
  .tt31-latest-grid .new-entry-cards.large-thumb-on,
  .tt31-latest-grid .new-entry-cards.large-thumb-off{
    grid-template-columns:1fr!important;
  }
}


/* ===== v3.1 final latest-card fix ===== */

/* Override Cocoon horizontal-card internals: use vertical cards inside the 3-column grid */
.tt31-latest-grid .new-entry-card{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:12px!important;
  background:#fff!important;
}
.tt31-latest-grid .new-entry-card-thumb{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  float:none!important;
}
.tt31-latest-grid .new-entry-card-thumb img{
  display:block!important;
  width:100%!important;
  height:150px!important;
  object-fit:cover!important;
  margin:0!important;
}
.tt31-latest-grid .new-entry-card-content{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  padding:14px 14px 16px!important;
  margin:0!important;
  float:none!important;
}
.tt31-latest-grid .new-entry-card-title{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  color:#102a43!important;
  font-size:15px!important;
  font-weight:700!important;
  line-height:1.55!important;
  text-align:left!important;
  writing-mode:horizontal-tb!important;
  word-break:normal!important;
  overflow-wrap:anywhere!important;
  white-space:normal!important;
  letter-spacing:normal!important;
}
.tt31-latest-grid .new-entry-card-link{
  overflow:hidden!important;
  border-radius:12px!important;
  height:100%!important;
}

/* Avoid any carousel/slider remnants from Cocoon */
.tt31-latest-grid .new-entry-cards{
  transform:none!important;
  left:auto!important;
  right:auto!important;
}
.tt31-latest-grid .carousel-button,
.tt31-latest-grid .slick-arrow,
.tt31-latest-grid .swiper-button-next,
.tt31-latest-grid .swiper-button-prev{
  display:none!important;
}

/* Compact responsive thumbnails */
@media(max-width:900px){
  .tt31-latest-grid .new-entry-card-thumb img{height:140px!important}
}
@media(max-width:560px){
  .tt31-latest-grid .new-entry-card-thumb img{height:auto!important;aspect-ratio:16/9}
}
/* =========================================================
   TameshiTech Header Responsive Polish v2
   Cocoonの menu-header / menu-mobile を分離して制御
   重要: display は変更しない（非表示側を起こさない）
   ========================================================= */

/* 共通: ナビ項目の折り返しを防止 */
#header-container #navi .navi-in > ul > li > a {
  white-space: nowrap !important;
}

/* PC: Cocoonの通常ヘッダーメニューだけを整える */
@media screen and (min-width: 1024px) {
  #header-container #navi .navi-in > .menu-header {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 4px !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 12px !important;
  }

  #header-container #navi .navi-in > .menu-header > li {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  #header-container #navi .navi-in > .menu-header > li > a {
    min-height: 46px !important;
    padding: 0 15px !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    border-radius: 9px !important;
  }
}

/* 中間幅: Cocoonが使うmenu-mobileだけを1段にする
   displayは一切指定しないので、非表示側が二重表示されない */
@media screen and (min-width: 769px) and (max-width: 1023px) {
  #header-container #navi .navi-in > .menu-mobile {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    overflow-x: visible !important;
    white-space: nowrap !important;
    gap: 2px !important;
    margin: 0 auto !important;
    padding: 0 6px !important;
  }

  #header-container #navi .navi-in > .menu-mobile > li {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    line-height: 1.2 !important;
  }

  #header-container #navi .navi-in > .menu-mobile > li > a {
    min-height: 44px !important;
    padding: 0 10px !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    border-radius: 8px !important;
  }

  /* ロゴも少しだけコンパクトにして5項目の余白を確保 */
  .header-container-in.hlt-top-menu .site-name-text {
    font-size: 22px !important;
  }
}

/* hover/currentは表示中メニューだけに自然に適用 */
@media screen and (min-width: 769px) {
  #header-container #navi .navi-in > ul > li > a:hover {
    color: #087dcc !important;
    background: #f0f8fe !important;
  }

  #header-container #navi .navi-in > ul > .current-menu-item > a,
  #header-container #navi .navi-in > ul > .current-menu-ancestor > a {
    color: #087dcc !important;
    background: #edf7ff !important;
    box-shadow: inset 0 -2px 0 #00a9e8 !important;
  }
}

/* スマホはCocoon標準のモバイルヘッダー/スライドインに完全委譲 */
@media screen and (max-width: 768px) {
  /* intentionally no overrides */
}
/* =========================================================
   TameshiTech Header Responsive Polish v2
   Cocoonの menu-header / menu-mobile を分離して制御
   重要: display は変更しない（非表示側を起こさない）
   ========================================================= */

/* 共通: ナビ項目の折り返しを防止 */
#header-container #navi .navi-in > ul > li > a {
  white-space: nowrap !important;
}

/* PC: Cocoonの通常ヘッダーメニューだけを整える */
@media screen and (min-width: 1024px) {
  #header-container #navi .navi-in > .menu-header {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 4px !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 12px !important;
  }

  #header-container #navi .navi-in > .menu-header > li {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  #header-container #navi .navi-in > .menu-header > li > a {
    min-height: 46px !important;
    padding: 0 15px !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    border-radius: 9px !important;
  }
}

/* 中間幅: Cocoonが使うmenu-mobileだけを1段にする
   displayは一切指定しないので、非表示側が二重表示されない */
@media screen and (min-width: 769px) and (max-width: 1023px) {
  #header-container #navi .navi-in > .menu-mobile {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    overflow-x: visible !important;
    white-space: nowrap !important;
    gap: 2px !important;
    margin: 0 auto !important;
    padding: 0 6px !important;
  }

  #header-container #navi .navi-in > .menu-mobile > li {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    line-height: 1.2 !important;
  }

  #header-container #navi .navi-in > .menu-mobile > li > a {
    min-height: 44px !important;
    padding: 0 10px !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    border-radius: 8px !important;
  }

  /* ロゴも少しだけコンパクトにして5項目の余白を確保 */
  .header-container-in.hlt-top-menu .site-name-text {
    font-size: 22px !important;
  }
}

/* hover/currentは表示中メニューだけに自然に適用 */
@media screen and (min-width: 769px) {
  #header-container #navi .navi-in > ul > li > a:hover {
    color: #087dcc !important;
    background: #f0f8fe !important;
  }

  #header-container #navi .navi-in > ul > .current-menu-item > a,
  #header-container #navi .navi-in > ul > .current-menu-ancestor > a {
    color: #087dcc !important;
    background: #edf7ff !important;
    box-shadow: inset 0 -2px 0 #00a9e8 !important;
  }
}

/* スマホはCocoon標準のモバイルヘッダー/スライドインに完全委譲 */
@media screen and (max-width: 768px) {
  /* intentionally no overrides */
}