@charset "UTF-8";
/*
@media screen and (max-width: 600px) {}
@media screen and (max-width: 992px) {}
@media screen and (max-width: 1200px) {}
*/
html.no-scroll, body.no-scroll { overflow: hidden; height: 100%; }

@keyframes rotation { 0% { transform: rotate(0deg); }
  100% { transform: rotate(180deg); } }
.drawer .dMenuParentLi { position: relative; }
.drawer .dMenuParentLi > a { padding-left: 2em; }
.drawer .dMenuParentLi:before, .drawer .dMenuParentLi:after { content: ''; position: absolute; width: 14px; height: 2px; background: #00A34A; right: 10px; top: 44%; }
.drawer .dMenuParentLi:before { transform: rotate(90deg); }
.drawer .dMenuParentLi.open:before { transform: rotate(0); }
.drawer .dMenuParentLi.v2 a { padding-left: 0; }
.drawer .dMenuParentLi.v2 + .dMenuChildLi ul li a:first-child { padding: 10px 0 10px 2em !important; }
.drawer .dMenuChildLi { display: none; }
.drawer .dMenuChildLi ul li a:first-child { padding-block: 0 !important; padding: 10px 0 10px 3.3em !important; }

.headerMenu, .megaMenu { display: none; }

@media (min-width: 992px) { .header .header-inner .header-btn { width: 100px !important; }
  .header .header-inner .logo { width: 170px; }
  .header .header-inner .logo a { margin-right: 0; }
  .headerMenu { height: 70px; display: flex; align-items: center; justify-content: center; width: 100%; font-size: 1.4rem; width: auto !important; /* 既存の100%を上書き */ flex: 1; /* 左右の空きスペースを埋める */ min-width: 0; /* 幅が狭くなった時にコンテナを縮める魔法の設定 */ }
  .headerMenu li { width: auto; flex-shrink: 0; padding-inline: 18px; min-width: 0; }
  .headerMenu li.mega { cursor: pointer; }
  .headerMenu li.mega p { padding-right: 10px; }
  .headerMenu li.mega p:after { content: ''; width: 7px; height: 7px; top: 50%; margin-top: -5px; display: block; position: absolute; right: -8px; transform: rotate(45deg); border-bottom: #fff 1px solid; border-right: #fff 1px solid; transition: .05s all; }
  .headerMenu li.open p:after { margin-top: -2px; transform: rotate(-45deg) rotateX(180deg); }
  .headerMenu li p { display: block; /* 既存のgridを解除し、自然な折り返しを許可 */ width: fit-content; /* 折り返し後、文字量の成り行きの幅に縮める */ margin: 0 auto; /* 縮んだ要素を中央に配置 */ text-align: center; /* テキスト自体を中央揃え */ }
  .headerMenu li a { display: block; }
  .headerMenu li p, .headerMenu li a { position: relative; line-height: 1.4; white-space: normal; }
  .headerMenu li p span, .headerMenu li a span { white-space: nowrap; }
  .headerMenu li p:before, .headerMenu li a:before { content: ''; position: absolute; inset: auto 0 0 0; width: 100%; height: 1px; background: var(--textColor); scale: 0 1; transform-origin: right top; transition: scale 0.3s ease; }
  .headerMenu li p:hover:before, .headerMenu li a:hover:before { scale: 1 1; transform-origin: left top; }
  .megaMenu { display: block; width: 100%; position: absolute; height: auto; left: 0; top: 100%; }
  .megaMenu .megaCnt { display: none; padding: 20px; box-sizing: border-box; background: rgba(0, 0, 0, 0.88); backdrop-filter: blur(8px); height: calc( 100vh - 120px); overflow-y: auto; overflow-x: hidden; }
  .megaMenu .megaCnt .megaCntInner { padding: 25px 50px 50px; display: flex; align-items: flex-start; justify-content: center; }
  .megaMenu .megaCnt .megaCntInner > div { min-width: 300px; }
  .megaMenu .megaCnt .megaCntInner > div a { text-decoration: none; }
  .megaMenu .megaCnt .megaCntInner > div a:hover { color: #00A34A; }
  .megaMenu .megaCnt .megaCntInner > div > p { font-size: 1.6rem; margin-bottom: .5em; padding-bottom: .5em; border-bottom: #fff 1px solid; }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer { line-height: 1.9; }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li p.switch2ndUl { position: relative; display: inline-block; cursor: pointer; padding: 0 25px 0 0; }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li p.switch2ndUl:before, .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li p.switch2ndUl:after { content: ''; position: absolute; width: 14px; height: 2px; background: #00A34A; right: 0; top: 44%; }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li p.switch2ndUl:before { transform: rotate(90deg); }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li p.switch2ndUl.open:before { transform: rotate(0); }
  .megaMenu .megaCnt .megaCntInner > div > p + ul.ul1stLayer li ul.ul2ndLayer { display: none; margin: 0 0 1em 1em; }
  .megaMenu .megaCnt .megaCntInner > div + div { margin-left: 60px; }
  .megaMenu .megaCnt p.closeBtn { cursor: pointer; position: absolute; right: 30px; top: 30px; height: 30px; width: 30px; }
  .megaMenu .megaCnt p.closeBtn:before, .megaMenu .megaCnt p.closeBtn:after { content: ''; position: absolute; display: block; width: 24px; height: 2px; background: #fff; left: 4px; top: 13px; }
  .megaMenu .megaCnt p.closeBtn:before { transform: rotate(45deg); }
  .megaMenu .megaCnt p.closeBtn:after { transform: rotate(-45deg); }
  .megaMenu .megaCnt.open p.closeBtn { transform-origin: center center; animation: rotation .5s linear 1; } }
