/* ======== commons.css (完成版・統合済み) ======== */
/* ここから元の commons.css 本文（あなたが添付した内容） */
body{
 /* color: white; 文字を白にする */
 margin: 0
 /*background-color:#faf9f5;*/
 background-color:#FBFEF4;
}
a{
 background-color: transparent
}
a:active, a:hover{
 outline: 0
}
h1{
 font-size: 2em;
 margin: .67em 0
}
img{
 border: 0
}
button, html input[type=button], input[type=reset], input[type=submit]{
 -webkit-appearance: button;
 cursor: pointer
}
button[disabled], html input[disabled]{
 cursor: default
}
html{
 font-size: 62.5%
}
h1, h2, h3, h4, h5, p{
 margin: 0;
 padding: 0
}
.c-list__unstyled{
 list-style: none;
 margin: 0;
 padding: 0;
 display: block
}
.container{
 width: 960px;
 margin: 0 auto
}
@media(max-width:640px) {
 .container {
 width: 100%
 }
}
.header{
 position: sticky; /* スクロール追従（推奨） */
 top: 0;
 z-index: 2000; /* 既存は z-index:1000 なので上げる */
 background: #fff; /* 透け防止（メニュー背景が白なので合わせる）*/
}
.header .nav__global--container{
 /* 既存 box-shadow を活かしつつ固定時の見え方を安定させる（任意） */
 width: 100%;
}
.header[data-nav="1"]{
 margin-bottom: 0
}
.nav__global{
 font-size: 16px;
 font-size: 1.6rem;
 width: 960px;
 margin: 0 auto
}
.nav__global:after{
 content: "";
 clear: both;
 display: table
}
.nav__global--container{
 /*background: #f3f3f3;*/
 background: white;
 /*border-top: 5px solid #3494dc;*/ /*←header_topカラー*/
 box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
 /*border-top: 2px solid #2e8b57;*/ /*←header_topカラー*/
 /*border-top: 2px solid #ff9500; /*←header_topカラー*/
 /*border-top: 2px solid #186B42; /*←header_topカラー*/
 border-top: 2px solid #66B032; /*←header_topカラー*/
 position: relative;
 margin: auto 0 0
}
.nav__global--item{
 float: left;
 display: block;
 width: 15%;
 text-align: center;
 border-right: 1px solid #dbdbdb
}
.nav__global--item.logo{
margin-top: 5px;
 width: 22%;
}
.nav__global--item__dropdown .nav__global--link{
 -webkit-transition: all .12s linear;
 transition: all .12s linear
}
[data-nav="0"] .nav__global--item__dropdown .nav__global--link, [data-nav="1"] .nav__global--item__dropdown .nav__global--link:hover, [data-nav="1"] .nav__global--item__dropdown .nav__global--link.hover{
 background: #434343;
 color: #fff;
 text-decoration: none
}
[data-nav="0"] .nav__global--item__dropdown .nav__global--link .nav__global--icon, [data-nav="1"] .nav__global--item__dropdown .nav__global--link:hover .nav__global--icon, [data-nav="1"] .nav__global--item__dropdown .nav__global--link.hover .nav__global--icon{
 background-image: url(../images/sprite.png);
 background-position: -117px -109px;
 width: 16px;
 height: 9px
}
.nav__global--external{
 position: absolute;
 top: -40px;
 right: 0;
 line-height: 1;
 width: 100%
}
.nav__global--link{
 font-weight: 700;
 padding: 27px 0;
 display: block;
 line-height: 1;
 text-decoration: none;
 color: #333
}
.logo .nav__global--link{
 padding: 17px 0 19px
}
.nav__global--link:hover{
 text-decoration: underline
}
.nav__global--img{
 width: 150px;
 vertical-align: bottom
}
.nav__global--top, .nav__global--toggle, .nav__global--close{
 display: none
}
.nav__external{
 font-size: 13px;
 font-size: 1.3rem;
 display: inline-block
}
.nav__external:after{
 content: "";
 clear: both;
 display: table
}
.nav__external--container{
 width: 960px;
 text-align: right;
 margin: 0 auto
}
.nav__external--item{
 display: block;
 line-height: 1.154;
 float: left;
 border-color: #dcdcdc;
 border-style: solid;
 border-width: 0 1px
}
.nav__external--item+.nav__external--item{
 border-width: 0 1px 0 0
}
.nav__external--link{
 display: block;
 padding: 0 15px;
 color: #333;
 text-decoration: none;
 -webkit-transition: background .15s ease;
 transition: background .15s ease
}
.nav__external--link:hover{
 background: #f3f3f3
}
@media(max-width:640px) {
 .header {
 height: 41px;
 margin-bottom: 0
 }
 .nav__global {
 width: 100%;
 position: absolute;
 display: none;
 font-size: 1.5rem;
 -webkit-box-shadow: 0 2px 5px -1px rgba(0, 0, 0, .2);
 box-shadow: 0 2px 5px -1px rgba(0, 0, 0, .2)
 }
 /* header menu logo */
 .nav__global--top {
 background: #ffffff url(../../img/logo.png) no-repeat 60% 40%;
 -webkit-background-size: 150px auto;
 background-size: 150px auto;
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 width: 160px;
 height: 41px;
 overflow: hidden;
 white-space: nowrap;
 text-indent: 100%
 }
 /* header menu logo　ここまで */
 
 .nav__global--container {
 background: transparent;
 border: none;
 margin: 0
 }
 .nav__global--item {
 float: none;
 border: none;
 width: 100%;
 text-align: left;
 background: #eee
 }
 .nav__global--item.logo {
 display: none
 }
 .nav__global--item.top {
 margin: 41px 0 0
 }
 .nav__global--item__dropdown .nav__global--link {
 cursor: default
 }
 [data-nav] .nav__global--item__dropdown .nav__global--link, [data-nav] .nav__global--item__dropdown .nav__global--link:hover, [data-nav] .nav__global--item__dropdown .nav__global--link.hover {
 background: transparent;
 color: inherit
 }
 .nav__global--item__dropdown .nav__global--link:after {
 content: none
 }
 .nav__global--item.top, .nav__global--item.voice {
 border-bottom: 1px solid #dbdbdb
 }
 .nav__global--link {
 font-weight: 400;
 padding: 20px 15px;
 position: relative
 }
 .nav__global--link:after {
 display: inline-block;
 content: "";
 position: absolute;
 top: 20px;
 right: 15px;
 background-image: url(../../img/sprite.png);
 background-position: -57px -16.5px;
 width: 10.5px;
 height: 17.5px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px
 }
 .nav__global--img {
 max-width: 100%
 }
 .nav__global--external {
 position: static;
 background: #eee;
 font-size: 1.3rem
 }
 .nav__global--toggle {
 display: block;
 position: absolute;
 top: 12px;
 right: 15px;
 cursor: pointer;
 z-index: 1000;
 background-image: url(../../img/sprite.png);
 background-position: -28.5px 0;
 width: 26px;
 height: 16px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px
 }
 .nav__global--toggle.open {
 background-image: url(../../img/sprite.png);
 background-position: 0 0;
 width: 26px;
 height: 16px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px
 }
 .nav__global--close {
 display: block;
 background: #434343;
 font-size: 1.3rem;
 line-height: 1
 }
 .nav__global--close a {
 display: block;
 color: #ccc;
 text-decoration: none;
 padding: 16px 0;
 text-align: center;
 -webkit-transition: background-color .12s linear;
 transition: background-color .12s linear
 }
 .nav__global--close a:hover {
 background: #484848
 }
 .nav__global--close a:before {
 content: "";
 display: inline-block;
 margin: 0 9px 0 0;
 vertical-align: text-bottom;
 background-image: url(../../img/sprite.png);
 background-position: -57px 0;
 width: 14px;
 height: 14px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px
 }


 .nav__external {
 display: block;
 font-size: inherit;
 padding: 0 15px
 }
 .nav__external--container {
 width: 100%;
 text-align: left;
 padding: 28px 0 0
 }
 .nav__external--item {
 border: none;
 padding: 0 0 25px
 }
 .nav__external--item+.nav__external--item {
 border: none
 }
 .nav__external--link {
 padding: 0 16px 0 0
 }
 .nav__external--link:hover {
 background: transparent
 }
 .nav__external--link:before {
 content: "";
 display: inline-block;
 background-image: url(../../img/sprite.png);
 background-position: -32px -54.5px;
 width: 6px;
 height: 10.5px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px;
 margin: 0 5px 1px 0
 }
}
.footer{
 text-align: center;
 /*color: #ffffff;*/
 color: #000000;
 /*background: #3494dc;*/
 /*background: #2e8b57;*/
 background: gray; /* フッターエリア背景色 */
}
.footer--banner{
 display: grid !important;
 /* 大画面では横一列を優先。要素幅に合わせて均等化しない */
 grid-auto-flow: column; /* 横方向へ並べる（1行優先） */
 grid-auto-columns: max-content; /* 各アイテムの自然な幅に合わせる */
 justify-content: center; /* 全体を中央寄せ */
 align-items: center; /* 縦方向のそろえ */
 gap: 20px; /* バナー間隔 12px */
 padding: 20px 0; /* バナーエリア上下幅 20px */
 margin: 0; /* 左マージンの削除で中央寄せを正しく機能させる */
}
.footer--banner__item{
 float: none !important;
 display: block;
 margin: 0; /* 間隔は gap に一元化 */
}
.footer--banner img{
 display: block;
 height: auto;
 width: 100%; /* アイテム幅にフィット */
 max-width: 220px; /* PCの上限サイズ（必要に応じて調整） */
}
.footer--banner__item + .footer--banner__item{
 margin: 0;
}
.footer--banner__item a,
.footer--banner__link{
 display: inline-block; /* transformの基準を安定させる */
 overflow: hidden; /* 拡大時のはみ出しを隠す（レイアウト崩れ防止） */
 border-radius: 4px; /* 任意：角を少し丸める */
}
.footer--banner img{
 display: block;
 height: auto;
 width: 100%;
 max-width: 220px; /* 既存の上限（Grid版のブレイクポイントで調整済み） */
 /* スムースな拡大用の設定 */
 transform-origin: center center;
 transition: transform 180ms ease, filter 180ms ease;
 will-change: transform;
}
.footer--banner__item a:hover img,
.footer--banner__item a:focus-visible img,
.footer--banner__link:hover img,
.footer--banner__link:focus-visible img{
 transform: scale(1.06); /* 少し拡大（例：6%） */
 filter: brightness(1.02); /* 任意：ほんのり明るくして反応を見せる */
}
@media (prefers-reduced-motion: reduce) {
 .footer--banner img {
 transition: none;
 }
 .footer--banner__item a:hover img,
 .footer--banner__item a:focus-visible img,
 .footer--banner__link:hover img,
 .footer--banner__link:focus-visible img {
 transform: none;
 filter: none;
 }
}
.footer--banner__item a:focus-visible,
.footer--banner__link:focus-visible{
 outline: 2px solid #2b8aeb; /* 好みの色に */
 outline-offset: 3px;
}
.footer--pagetop{
 color: #333;
 display: block;
 background: #fff;
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1;
 text-decoration: none;
 padding: 26px 0 25px;
 -webkit-transition: background .04s ease-in;
 transition: background .04s ease-in
}
.footer--pagetop:before{
 display: inline-block;
 content: "";
 background-image: url(../../img/sprite.png);
 background-position: -44px -82px;
 width: 21px;
 height: 12px;
 margin: 0 20px 0 0
}
.footer--pagetop:hover{
 background: #ebebeb
}
.footer--nav{
 /*background: #f6f6f6;*/
 /*background:gray;*/
 background:lightgray; /* フッターnav背景色 */
 padding: 15px 0
}
.footer--nav__list{
 display: table;
 width: 100%;
 text-align: left;
 font-size: 12px;
 font-size: 1.25rem;
 line-height: 1;
 font-weight: 700;
 border-right: 1px solid #dcdcdc
}
.footer--nav__item__side, .footer--nav__item__center{
 display: table-cell;
 border-left: 1px solid #dcdcdc;
 padding: 0 0 0 12px
}
.footer--nav__item__side{
 width: 280px
}
.footer--nav__link{
 color: #333;
 text-decoration: none;
}
.footer--nav__link:hover{
 color: #0D12FD;
}
.footer--nav__link:before, .footer--nav__likelink:before{
 display: inline-block;
 content: "";
 margin: 0 8px 1px 0;
 background-image: url(../../img/sprite.png);
 background-position: -147px -29px;
 width: 6px;
 height: 10px;
}
.footer--copyright{
 font-size: 13px;
 font-size: 1.3rem;
 line-height: 1;
 padding: 50px 0;
 background: #faf9f5; /* フッターCopyright背景色 */
}
@media (max-width: 1199.98px) {
 .footer--banner {
 /* 行方向にも配置できるようにし、可変列で中央寄せ */
 grid-auto-flow: row; /* 縦方向への追加も許可（折り返し） */
 grid-template-columns: repeat(auto-fit, minmax(180px, max-content));
 justify-content: center;
 }
 .footer--banner img {
 max-width: 220px;
 }
}
@media (min-width: 479.98px) {
 .footer--banner {
 grid-template-columns: repeat(auto-fit, minmax(140px, max-content));
 }
 .footer--banner img {
 max-width: 180px;
 }
}
@media (max-width: 767.98px) {
 .footer--banner {
 padding: 24px 12px; /* 端の余白を少し確保 */
 grid-template-columns: repeat(auto-fit, minmax(160px, max-content));
 }
 .footer--banner img {
 max-width: 200px;
 }


 .footer--banner__item {
 margin: 0;
 padding: 0 3px
 }
 .footer--banner__item+.footer--banner__item {
 margin: 0
 }
 .footer--pagetop {
 font-size: 1.3rem;
 line-height: 1;
 padding: 14px 0
 }
 .footer--pagetop:before {
 background-image: url(../../img/sprite.png);
 background-position: -35px -41px;
 width: 10.5px;
 height: 6px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px;
 margin: 0 6px 2px 0
 }
 .footer--nav {
 padding: 20px 0
 }
 .footer--nav .container {
 padding: 0 15px
 }
 .footer--nav__list {
 display: block;
 border: none
 }
 .footer--nav__item__side, .footer--nav__item__center {
 width: auto;
 display: block;
 border: none;
 padding: 0
 }
 .footer--nav__link:before, .footer--nav__likelink:before {
 background-image: url(../../img/sprite.png);
 background-position: -40.5px -54.5px;
 width: 6px;
 height: 10px;
 -webkit-background-size: 81.5px 71px;
 background-size: 81.5px 71px
 }
 .footer--copyright {
 padding: 13px 0
 }
}
.top--heading{
 font-weight: 700;
 font-size: 38px;
 font-size: 3.8rem;
 color: #008000;    /*←サブタイトルカラー*/
 letter-spacing: -1px;
 line-height: 1.5;
 margin: 0 0 15px
}
.top--heading.alt{
 margin: 0 0 5px
}
.top--main{
 width: 100%;
 height: 640px;
 margin: 4px 0 0;
 overflow: hidden;
 position: relative;
 text-align: center;
 background-colr:white;
 /* ▼ PC用：デフォルト位置（ここを変えるだけでPC位置調整できる） */
 --ttl-top: 185px; /* 上からの距離 */
 --ttl-left: 50%; /* 左からの基準位置（中央なら50%） */
 --ttl-x: -50%; /* X方向微調整（中央寄せ） */
 --ttl-y: 0%; /* Y方向微調整 */
 --ttl-align: center; /* 文字揃え */
}
.top--main__list{
 width: 100%;
 height: 640px;
 display: block;
 position: absolute;
 top: 0;
 left: 0
}
.top--main__list--item{
 position: absolute;
 top: 0;
 left: 0;
 height: 640px;
 width: 100%;
 background-repeat: no-repeat;
 -webkit-background-size: auto 100%;
 background-size: auto 100%;
 background-position: 50% 50%
}
.top--main__list--item[data-num="1"]{
 background-image: url(../../img/top-main01.jpg)
}
.top--main__list--item[data-num="2"]{
 background-image: url(../../img/top-main02.jpg);
 opacity: 0;
 filter: alpha(opacity=0)
}
.top--main__list--item[data-num="3"]{
 background-image: url(../../img/top-main03.jpg);
 opacity: 0;
 filter: alpha(opacity=0)
}
.top--main__list--item[data-num="4"]{
 background-image: url(../../img/top-main04.jpg);
 opacity: 0;
 filter: alpha(opacity=0)
}
.top--ttl{
 position: absolute;
 z-index: 6;
 top: var(--ttl-top);
 left: var(--ttl-left);
 transform: translate(var(--ttl-x), var(--ttl-y));
 margin: 0; /* 既存 margin:155px 0 0 を無効化 */
 text-align: var(--ttl-align);
 width: auto;
 max-width: min(92vw, 980px); /* 画面幅が狭い時に収まるように */
}
.top--ttl__text{
 color: #fff; /* 背景写真の上なので白文字推奨 */
 font-weight: 700;
 line-height: 1.2;
 display: inline-block; /* 背景パネルを文字幅に合わせたい場合に便利 */
 padding: 16px 22px;
 border-radius: 6px;
 /* 写真の上でも読めるように半透明の黒パネル */
 background: rgba(0, 0, 0, 0.15);
 /* さらに読みやすくするなら影 */
 text-shadow: 0 2px 12px rgba(0,0,0,0.65);
}
.top--ttl__main{
 display: block;
 font-size: 44px;
 letter-spacing: 0.04em;
}
.top--ttl__sub{
 display: block;
 margin-top: 10px;
 font-size: 18px;
 font-weight: 500;
 letter-spacing: 0.06em;
 opacity: 0.95;
}
@media (max-width: 768px) {
 .top--main {
 /* ▼ SP用：ここを変えるだけでSP位置調整できる */
 --ttl-left: 50%;
 --ttl-x: -50%;
 --ttl-align: center;
 }
 .top--ttl {
 top: auto; /* PCのtop指定を無効化 */
 bottom: 80px; /* SPは下から80px（ここを調整） */
 }
 .top--ttl__text {
 padding: 12px 14px;
 border-radius: 6px;
 }
 .top--ttl__main { font-size: 16px; }
 .top--ttl__sub { font-size: 10px; margin-top: 8px; }
}
.top--section_block_A{
 /*background-color:whitesmoke;*/
 /*background-color:honeydew; */
 /*background-color:lightyellow;
 background-color:ivory;*/
 background-color:rgba(250, 249, 245, 0.4);
 padding: 35px 0 55px;
}
.top--section_block_B{
 padding: 35px 0 55px;
 background-color:white;
}
.top--section_block_T{
 padding: 5px 0 5px;
 /*background-color:white;*/
 background-color:rgba(255, 255, 240, 0.4);
}
@media(min-width:1500px) {
 .top--main__list--item {
 -webkit-background-size: 100% auto;
 background-size: 100% auto
 }
 .top--ttl {
 width: 70%;
 \*max-width: 400px;
 margin: 80px 0 0
 }
}
@media(max-width:640px) {
 .top--heading {
 font-size: 2.2rem;
 margin: 0 0 13px
 }
 .top--main {
 height: 210px;
 padding: 0 15px
 }
 .top--main__list {
 height: 300px;
 }
 .top--main__list--item {
 height: 300px;
 -webkit-background-size: auto 65%;
 background-size: auto 65%;
 background-position: 0 0
 }
 .top--ttl {
 width: 100%;
 max-width: 300px;
 margin: 50px 0 0
 }
 .top--section__conduct .container {
 padding: 0 15px
 }
 .top--section_block_A .top--section_block_B{
 padding: 10px 0 15px
 }
 .top--section_block_A .top--section_block_B .container {
 padding: 0 10px
 }
}
@media(max-width:640px) {
 .pattern--section .container, .voice--section .container {
 width: 100%;
 padding: 0 15px
 }
}
body.mobile{
 font-size: 14px; /* モバイルで文字を少し小さめに */
 padding: 10px; /* 余白を確保 */
}
body.mobile .container{
 width: 100%; /* モバイルは横幅をフルに */
 padding: 0 15px; /* サイド余白を追加 */
}
body.mobile h1, body.mobile h2{
 font-size: 1.8rem; /* 見出しを小さめに */
}
body.desktop{
 font-size: 16px; /* PCで標準サイズ */
}
body.desktop .container{
 max-width: 1000px; /* PCは中央寄せ */
 margin: 0 auto;
}
body.desktop h1, body.desktop h2{
 font-size: 2.4rem; /* 見出しを大きく */
}

/* ───────────────────────────────────────── */
/* ここから統合パッチ（commons.cleaned.css の調整を反映） */
/* ========================================
  Integrated patch from commons.cleaned.css
  Date: 2026-02-17 18:54
  Purpose:
   - ヘッダーメニューのレイアウトを維持しつつ、トップバナー(KV)の比率・背景を安定化。
   - フッターバナーの縦幅のばらつきを抑制。
   - ヘッダーとKVの間隔を 5px に固定。
   - 既存スタイルを壊さないよう、必要箇所のみ詳細度/!important で上書き。
======================================== */

/* ===== Top KV: 高さ固定を撤廃し、比率ベースへ ===== */
.top--main{
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 420px;
  max-height: 70vh;
  overflow: hidden;
  position: relative;
  text-align: center;
  background-color: #000;
}
.top--main,
.top--main__list,
.top--main__list--item{ height: auto !important; }
.top--main__list{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.top--main__list--item{
  position:absolute; inset:0; width:100%; height:100%;
  background-repeat:no-repeat;
  background-size: cover !important;
  -webkit-background-size: cover !important;
  background-position: center center !important;
}

/* ===== ヘッダー直下の余白：常に 5px ===== */
.header + .top--main{ margin-top:5px !important; }
@media (max-width:640px){ .header + .top--main{ margin-top:5px !important; } }

/* ===== タイトルの可読性（既存デザイン尊重） ===== */
.top--ttl{ position:absolute; z-index:6; width:auto; max-width:min(92vw,980px); }
.top--ttl__text{ color:#fff; font-weight:700; line-height:1.3; display:inline-block;
  padding: clamp(10px,1.8vw,16px) clamp(14px,2.5vw,22px); border-radius:6px;
  background: rgba(0,0,0,0.18); text-shadow:0 2px 12px rgba(0,0,0,0.65); }
.top--ttl__main{ display:block; font-size: clamp(20px,3.2vw,44px); letter-spacing:.04em; }
.top--ttl__sub{ display:block; margin-top: clamp(6px,.9vw,10px); font-size: clamp(12px,1.4vw,18px); font-weight:500; opacity:.95; }

/* ===== スマホ調整 ===== */
@media (max-width: 767.98px){
  .top--main{ aspect-ratio:16/9; min-height:210px; max-height:none; }
  .top--ttl{ bottom:56px; top:auto; transform:translate(-50%,0); left:50%; text-align:center; }
  .top--main__list--item[data-num="1"]{ background-position:70% 50% !important; }
  .top--main__list--item[data-num="2"]{ background-position:30% 50% !important; }
}

/* ===== フッターバナーの縦幅安定化（既存Grid維持） ===== */
:root{ --footer-banner-h-pc:56px; --footer-banner-h-sp:44px; }
.footer--banner{ align-items:center !important; }
.footer--banner__item{ align-self:center !important; }
.footer--banner img{
  height:auto; width:auto; max-height: var(--footer-banner-h-pc) !important; max-width:100%; object-fit:contain;
}
@media (max-width:767.98px){ .footer--banner img{ max-height: var(--footer-banner-h-sp) !important; } }

/* ===== ヘッダー補助：external領域の絶対配置の影響を無効化（PCのみ） ===== */
@media (min-width:641px){ .nav__global--external{ position:static !important; top:auto !important; } }

/* 互換セレクタ保険（BEMのアンダースコア揺れ対策） */
.top--main_ _list--item, .top--main__list--item{ background-size: cover !important; background-position:center center !important; }

/* ======== End of integrated patch ======== */



/* ===========================================
   SP時：メインコピー（.top--ttl__main）を1行固定
   文字数（全角約16文字）を前提に動的フォントサイズを算出
   =========================================== */
@media (max-width: 767.98px){

  /* タイトル枠の横幅（やや広く） */
  .top--ttl{
    max-width: 96vw;
  }

  /* 背景パネルの左右余白（広げすぎない程度） */
  .top--ttl__text{
    padding-left: 3vw;
    padding-right: 3vw;
  }

  /* メインコピー：一行固定＋前回より10〜15%小さく */
  .top--ttl__main{
    white-space: nowrap;
    letter-spacing: 0.03em;

    /*
      フォントサイズ調整：
      前回：
        clamp(16px, calc((100vw - 8vw) / 14), 28px)
      今回（小さめ版）：
        最小 14px、最大 24px に調整
        fluid計算も少し抑え気味に変更
    */
    font-size: clamp(14px, calc((100vw - 8vw) / 16), 24px);
  }

  /* サブコピー：相対的にさらに小さめ */
  .top--ttl__sub{
    margin-top: 6px;
    font-size: clamp(10px, 2.45vw, 14px);
    line-height: 1.4;
  }
}




/* ===== Update: nav__global--external desktop hide / SP show ===== */
/* デスクトップでは非表示、SP(<=640px)では表示 */
.nav__global--external{
  display: none !important;
  visibility: hidden !important;
}
@media (max-width:640px){
  .nav__global--external{
    display: block !important;
    visibility: visible !important;
    position: static !important;
  }
}


/* ===== Update: adjustable widths for .top--ttl / .top--ttl__text ===== */
:root{
  /* デフォルト最大幅（従来挙動と互換） */
  --ttl-max: min(92vw, 980px);
  /* テキストボックスの最大幅/幅：未指定なら従来どおりauto */
  --ttl-text-max: none;   /* 例: 720px / 80ch / 90% など */
  --ttl-text-w: auto;     /* 例: 100% / fit-content / clamp(260px,60vw,720px) など */
}
/* 見出しコンテナの最大幅を変数化 */
.top--ttl{ max-width: var(--ttl-max); }

/* テキストボックスの幅/最大幅を変数で制御可能に */
.top--ttl__text{
  max-width: var(--ttl-text-max);
  width: var(--ttl-text-w);
  box-sizing: border-box; /* padding込みの幅調整を安定化 */
}

/* オプション: 幅をざっくり変えたい時の補助クラス */
.top--ttl.is-narrow{ --ttl-max: 720px; }
.top--ttl.is-wide  { --ttl-max: min(96vw, 1200px); }
.top--ttl__text.is-narrow{ --ttl-text-w: clamp(240px, 70vw, 640px); }
.top--ttl__text.is-wide  { --ttl-text-w: 100%; --ttl-text-max: none; }

/* SP時は少し広め/狭めにする例（任意） */
@media (max-width:767.98px){
  .top--ttl.is-narrow{ --ttl-max: 92vw; }
  .top--ttl__text.is-narrow{ --ttl-text-w: clamp(220px, 92vw, 560px); }
}


/* ===== Logo size control for .nav__global--item.logo ===== */
/* 使い方: --logo-max-height の値を変えるとロゴ高さを一括調整できます */
.nav__global--item.logo{
  --logo-max-height: 30px; /* ← ここを変更するとロゴの高さが変わります */
  
}

/* ロゴリンクの表示を安定させる */
.nav__global--item.logo .nav__global--link{
  display: inline-block;
  line-height: 1;
  vertical-align: middle;
  max-width: 100%;
  margin-right: 15px;

}

/* ロゴ画像のサイズを高さ基準でコントロール（縦横比維持） */
.nav__global--item.logo .nav__global--img{
  display: block;              /* 画像下の隙間対策 */
  height: var(--logo-max-height);
  width: auto;                 /* アスペクト比維持 */
  max-width: 100%;             /* 親をはみ出さない */
  object-fit: contain;         /* 小さい高さでも見切れない */
}


/* （任意）必要ならブレークポイントで微調整 */
@media (max-width: 768px){
  /* SPでは .nav__global--item.logo 自体が display:none のため本調整は通常不要 */
  /* PCとタブレットで共用する場合は下記を有効にしてください。
  .nav__global--item.logo{ --logo-max-height: 28px; }
  */

}