/* responsive-polish.css
   TOP(index.html) + kaisyaan1-6 mobile/tablet final correction.
   Loaded last so old fixed-width rules cannot win. */

html,
body{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}
*,*::before,*::after{box-sizing:border-box !important;}
img,video,iframe,table{max-width:100% !important;}

/* ===== common header / hamburger ===== */
.header{
  position:sticky !important;
  top:0 !important;
  z-index:180 !important;
  width:100% !important;
  min-width:0 !important;
  min-height:74px !important;
  padding:0 88px 0 26px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  overflow:visible !important;
}
.syamei-logo{
  flex:0 1 auto !important;
  min-width:0 !important;
  max-width:calc(100vw - 118px) !important;
  height:auto !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  overflow:hidden !important;
  writing-mode:horizontal-tb !important;
}
.syamei-logo > a,
.syamei-logo h1{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin:0 !important;
  padding:0 !important;
  height:auto !important;
  min-height:0 !important;
  min-width:0 !important;
  writing-mode:horizontal-tb !important;
}
.logoimage{
  flex:0 0 auto !important;
  width:auto !important;
  height:42px !important;
  display:block !important;
  object-fit:contain !important;
}
.logomojicolor{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  line-height:1.15 !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  writing-mode:horizontal-tb !important;
  font-size:clamp(1.28rem,2.4vw,1.95rem) !important;
}
.header nav[aria-label="メインメニュー"]{
  min-width:0 !important;
  flex:1 1 auto !important;
  padding-right:0 !important;
}
.main-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  flex-wrap:nowrap !important;
  min-width:0 !important;
}
.main-nav a[class^="menu"],
.main-nav a{
  white-space:nowrap !important;
  min-height:38px !important;
  padding:0 12px !important;
  font-size:.88rem !important;
}
#menubutton-iti,
#menubutton-iti.panelactive{
  position:fixed !important;
  top:13px !important;
  right:18px !important;
  width:48px !important;
  height:48px !important;
  inset:auto !important;
  z-index:320 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  backdrop-filter:none !important;
  pointer-events:auto !important;
  transform:none !important;
}
.menubutton,
#menubutton-iti.panelactive .menubutton{
  position:relative !important;
  top:auto !important;
  right:auto !important;
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  min-height:46px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:15px !important;
}
#menubutton-list{
  width:24px !important;
  height:24px !important;
  padding:0 !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  border:0 !important;
  background:transparent !important;
}
#menubutton-list span{
  width:24px !important;
  height:3px !important;
  flex:0 0 3px !important;
  border-radius:999px !important;
}
.menubutton.active #menubutton-list span:nth-child(1){transform:translateY(8px) rotate(45deg) !important;}
.menubutton.active #menubutton-list span:nth-child(2){opacity:0 !important;}
.menubutton.active #menubutton-list span:nth-child(3){transform:translateY(-8px) rotate(-45deg) !important;}
#menu{
  display:block !important;
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:auto !important;
  width:min(420px,88vw) !important;
  max-width:100vw !important;
  z-index:260 !important;
  transform:translateX(110%) !important;
  padding:94px 20px 26px !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
#menubutton-iti.panelactive + #menu,
#menubutton-iti.panelactive ~ #menu{
  transform:translateX(0) !important;
}
#menu .center-naka,
#menu ul{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
#menu ul{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:9px !important;
  list-style:none !important;
}
#menu li{margin:0 !important;padding:0 !important;list-style:none !important;}
#menu li a{
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-height:44px !important;
  padding:0 15px !important;
  white-space:nowrap !important;
}

@media (max-width:1180px){
  .header{min-height:66px !important;padding:0 74px 0 16px !important;}
  .main-nav{display:none !important;}
  .header nav[aria-label="メインメニュー"]{display:none !important;}
  .syamei-logo{max-width:calc(100vw - 98px) !important;gap:9px !important;}
  .logoimage{height:38px !important;}
  .logomojicolor{font-size:1.42rem !important;}
  #menubutton-iti,#menubutton-iti.panelactive{top:9px !important;right:12px !important;}
}
@media (max-width:480px){
  .header{min-height:58px !important;padding:0 64px 0 10px !important;}
  .syamei-logo{max-width:calc(100vw - 82px) !important;gap:7px !important;}
  .logoimage{height:31px !important;}
  .logomojicolor{font-size:1.12rem !important;letter-spacing:.01em !important;}
  #menubutton-iti,#menubutton-iti.panelactive{top:7px !important;right:9px !important;width:44px !important;height:44px !important;}
  .menubutton,#menubutton-iti.panelactive .menubutton{width:42px !important;height:42px !important;min-width:42px !important;min-height:42px !important;border-radius:14px !important;}
  #menubutton-list,#menubutton-list span{width:22px !important;}
  #menu{width:100vw !important;padding:80px 14px 22px !important;}
  #menu::before{font-size:1.48rem !important;left:18px !important;top:24px !important;}
  #menu li a{min-height:43px !important;font-size:.95rem !important;}
}
@media (max-width:340px){
  .logomojicolor{font-size:1.02rem !important;}
  .logoimage{height:29px !important;}
}

/* ===== common footer ===== */
footer{width:100% !important;min-width:0 !important;}
.footer-flex{padding:32px 18px 16px !important;}
.footer-wrap{
  width:100% !important;
  max-width:var(--kyoei-max) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:20px !important;
}
.footer-brand-bottom,
.footer-copylight{width:100% !important;max-width:var(--kyoei-max) !important;margin-left:auto !important;margin-right:auto !important;}
.footer-syamei-logo{min-width:0 !important;display:flex !important;align-items:center !important;flex-wrap:nowrap !important;gap:10px !important;}
.footer-logoimage{height:40px !important;width:auto !important;flex:0 0 auto !important;}
.footer-logomojicolor{white-space:nowrap !important;word-break:keep-all !important;font-size:1.35rem !important;}
@media (max-width:900px){.footer-wrap{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media (max-width:560px){
  .footer-flex{padding:28px 16px 14px !important;}
  .footer-wrap{grid-template-columns:1fr !important;gap:16px !important;}
  .footer-logoimage{height:34px !important;}
  .footer-logomojicolor{font-size:1.16rem !important;}
}

/* ===== TOP: keep body style, only guard mobile overflow ===== */
.modern-home-page main,
.modern-home-page .section,
.modern-home-page .section-inner,
.modern-home-page .hero,
.modern-home-page .hero-rebuilt{
  min-width:0 !important;
  max-width:100% !important;
}
@media (max-width:720px){
  .modern-home-page .hero{padding:18px 10px 16px !important;}
  .modern-home-page .hero .hero-rebuilt{width:100% !important;padding:10px !important;border-radius:22px !important;}
}

/* ===== kaisyaan1-6 company pages ===== */
.company-page .zentaihaikei,
.company-page .bunnkatu,
.company-page article,
.company-page aside,
.company-page .center-flex,
.company-page .center-sayuuiti{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
.company-page .zentaihaikei{
  padding:1px 18px 48px !important;
  overflow:hidden !important;
}
.company-page .page-title,
.company-page .page-title1,
.company-page .page-title2,
.company-page .page-title3,
.company-page .page-title4,
.company-page .page-title5{
  width:100% !important;
  max-width:var(--kyoei-max) !important;
  margin:34px auto 22px !important;
  padding:36px 26px 34px !important;
  font-size:clamp(1.9rem,4.5vw,2.7rem) !important;
  line-height:1.25 !important;
  word-break:keep-all !important;
}
.company-page .bunnkatu{
  max-width:var(--kyoei-max) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:260px minmax(0,1fr) !important;
  gap:24px !important;
  align-items:start !important;
}
.company-page aside{order:1 !important;}
.company-page article{
  order:2 !important;
  width:100% !important;
  min-width:0 !important;
  padding:30px clamp(20px,3vw,38px) !important;
  overflow:hidden !important;
}
.company-page .bana{display:none !important;}
.company-page article h2.company-content-title,
.company-page article h2{
  max-width:100% !important;
  word-break:keep-all !important;
}
.company-page article p,
.company-page article li,
.company-page article td,
.company-page article th{
  max-width:100% !important;
  word-break:normal !important;
  overflow-wrap:anywhere !important;
}
.company-page .itemichi{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
.company-page .item-matome{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}
.company-page .item-matome a,
.company-page .item-matome a > div{
  width:100% !important;
  min-width:0 !important;
}
.company-page .item-matome h2{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

@media (max-width:900px){
  .company-page .zentaihaikei{padding:1px 14px 42px !important;}
  .company-page .bunnkatu{display:flex !important;flex-direction:column !important;gap:16px !important;}
  .company-page aside,.company-page article{width:100% !important;}
  .company-page aside{order:1 !important;}
  .company-page article{order:2 !important;padding:24px 18px !important;border-radius:22px !important;}
  .company-page .itemichi{position:relative !important;top:auto !important;padding:14px !important;border-radius:20px !important;}
  .company-page .item-matome{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:8px !important;}
  .company-page .item-matome a > div{min-height:44px !important;padding:0 10px !important;border-radius:13px !important;}
  .company-page .item-matome h2{font-size:.86rem !important;}
}
@media (max-width:620px){
  .company-page .zentaihaikei{padding:1px 10px 34px !important;}
  .company-page .page-title,
  .company-page .page-title1,
  .company-page .page-title2,
  .company-page .page-title3,
  .company-page .page-title4,
  .company-page .page-title5{
    margin:18px auto 12px !important;
    padding:24px 18px 22px !important;
    border-radius:18px !important;
    font-size:1.55rem !important;
  }
  .company-page .page-title::before,
  .company-page .page-title1::before,
  .company-page .page-title2::before,
  .company-page .page-title3::before,
  .company-page .page-title4::before,
  .company-page .page-title5::before{
    font-size:.63rem !important;
    margin-bottom:6px !important;
  }
  .company-page article{padding:18px 12px !important;border-radius:18px !important;}
  .company-page article h2.company-content-title,
  .company-page article h2{
    margin-bottom:16px !important;
    padding-left:10px !important;
    border-left-width:5px !important;
    font-size:1.22rem !important;
    line-height:1.35 !important;
  }
  .company-page article p{font-size:.88rem !important;line-height:1.85 !important;}
  .company-page .item-midashi{font-size:.98rem !important;padding-bottom:8px !important;}
  .company-page .item-matome{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:7px !important;}
  .company-page .item-matome a > div{min-height:40px !important;padding:0 9px !important;}
  .company-page .item-matome h2{font-size:.8rem !important;}
}
@media (max-width:360px){
  .company-page .item-matome{grid-template-columns:1fr !important;}
}

/* company tables: turn fixed tables into mobile cards */
.company-page .tableiti,
.company-page .tableiti2,
.company-page .gaiyou-table,
.company-page .enkaku-table,
.company-page .iso-table{
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
.company-page table,
.company-page .tableoutside{
  width:100% !important;
  max-width:100% !important;
  table-layout:auto !important;
  border-collapse:collapse !important;
}
.company-page table td,
.company-page table th{
  vertical-align:top !important;
  overflow-wrap:anywhere !important;
}
@media (max-width:620px){
  .company-page .tableoutside,
  .company-page .tableoutside tbody,
  .company-page .tableoutside tr,
  .company-page .tableoutside td{
    display:block !important;
    width:100% !important;
  }
  .company-page .tableoutside tr{
    border-bottom:1px solid rgba(221,229,238,.95) !important;
  }
  .company-page .tableoutside td{
    padding:10px 10px !important;
    border-left:0 !important;
    border-right:0 !important;
    white-space:normal !important;
  }
  .company-page .lefttable{
    background:#f2f8fa !important;
    font-weight:800 !important;
    border-bottom:0 !important;
  }
  .company-page .righttable{border-top:0 !important;}
}

/* kaisyaan1 philosophy */
@media (max-width:620px){
  .company-page.page-kaisyaan1 .keieirinen-li{gap:9px !important;}
  .company-page.page-kaisyaan1 .keieirinen-li li{
    padding:12px 12px 12px 38px !important;
    font-size:.86rem !important;
    line-height:1.65 !important;
  }
  .company-page.page-kaisyaan1 .keieirinen-li li::before{
    left:13px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
  }
}

/* kaisyaan2 greeting */
.company-page.page-kaisyaan2 .goaisatu-flex{
  width:100% !important;
  max-width:680px !important;
  min-width:0 !important;
}
.company-page.page-kaisyaan2 .goaisatu-ue-flex{
  width:100% !important;
  min-width:0 !important;
}
.company-page.page-kaisyaan2 .goaisatu-ue,
.company-page.page-kaisyaan2 .goaisatu-sita{
  min-width:0 !important;
  max-width:100% !important;
}
.company-page.page-kaisyaan2 .goaisatu-pic{
  flex:0 0 auto !important;
}
@media (max-width:620px){
  .company-page.page-kaisyaan2 .goaisatu-flex{
    max-width:100% !important;
    padding:16px 14px 18px !important;
    border-radius:14px !important;
  }
  .company-page.page-kaisyaan2 .goaisatu-ue-flex{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:14px !important;
  }
  .company-page.page-kaisyaan2 .goaisatu-pic{
    order:1 !important;
    width:150px !important;
    height:150px !important;
    margin:0 auto !important;
  }
  .company-page.page-kaisyaan2 .goaisatu-ue{order:2 !important;width:100% !important;}
  .company-page.page-kaisyaan2 .goaisatu-ue p,
  .company-page.page-kaisyaan2 .goaisatu-sita p{
    font-size:.86rem !important;
    line-height:1.85 !important;
    letter-spacing:.03em !important;
  }
  .company-page.page-kaisyaan2 .goaisatu-name{
    white-space:nowrap !important;
    font-size:.86rem !important;
    text-align:right !important;
  }
}

/* kaisyaan5 ISO */
.company-page.page-kaisyaan5 .hinshituhosyou-flex,
.company-page.page-kaisyaan5 .hinshituhosyou-sayuuiti,
.company-page.page-kaisyaan5 .hinshituhosyou-iti,
.company-page.page-kaisyaan5 .hinshituhosyou-iti-p,
.company-page.page-kaisyaan5 .hinshituhosyou-housin{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
.company-page.page-kaisyaan5 .hinshituhosyou-housin h2{
  border-left:0 !important;
  padding-left:0 !important;
}
.company-page.page-kaisyaan5 .hinshituhosyou-migisita,
.company-page.page-kaisyaan5 .hinshituhosyou-daihyou,
.company-page.page-kaisyaan5 .hinshituhosyou-kyouei-name{
  max-width:100% !important;
}
@media (max-width:620px){
  .company-page.page-kaisyaan5 .hinshituhosyou-housin{
    padding:18px 12px 20px !important;
    margin-bottom:18px !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-housin h2{
    font-size:1.22rem !important;
    margin-bottom:18px !important;
    text-align:center !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-p-flex{
    display:grid !important;
    grid-template-columns:1.8em minmax(0,1fr) !important;
    margin-bottom:12px !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-p-flex p{
    font-size:.84rem !important;
    line-height:1.75 !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-migisita{
    width:100% !important;
    margin:22px 0 0 auto !important;
    align-items:flex-end !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-migisita p,
  .company-page.page-kaisyaan5 .hinshituhosyou-daihyou,
  .company-page.page-kaisyaan5 .hinshituhosyou-kyouei-name{
    white-space:nowrap !important;
    font-size:.78rem !important;
  }
  .company-page.page-kaisyaan5 .hinshituhosyou-logoimage{height:24px !important;width:auto !important;}
}

/* kaisyaan6 group */
.company-page.page-kaisyaan6 .group-flex,
.company-page.page-kaisyaan6 .group0,
.company-page.page-kaisyaan6 .group1,
.company-page.page-kaisyaan6 .group2,
.company-page.page-kaisyaan6 .group-video1,
.company-page.page-kaisyaan6 .group-bideo2{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
.company-page.page-kaisyaan6 video{
  width:100% !important;
  height:auto !important;
  max-width:550px !important;
}
@media (max-width:620px){
  .company-page.page-kaisyaan6 .group-flex{gap:16px !important;}
  .company-page.page-kaisyaan6 .group0,
  .company-page.page-kaisyaan6 .group1,
  .company-page.page-kaisyaan6 .group2{
    padding:18px 12px 20px !important;
    border-radius:18px !important;
  }
  .company-page.page-kaisyaan6 .top-movie-kyouei-name,
  .company-page.page-kaisyaan6 .top-movie-tekuno-name{
    margin-bottom:12px !important;
    flex-wrap:nowrap !important;
  }
  .company-page.page-kaisyaan6 .top-movie-kyouei-name h2{font-size:1.16rem !important;}
  .company-page.page-kaisyaan6 .top-movie-kyouei-name-logo{height:26px !important;}
  .company-page.page-kaisyaan6 .group-name-1,
  .company-page.page-kaisyaan6 .top-movie-tekuno-name-logo{
    max-width:92% !important;
    max-height:46px !important;
  }
  .company-page.page-kaisyaan6 video{border-radius:13px !important;}
}

/* ===== desktop width balance 20260608-3 =====
   Mobile/tablet rules above remain unchanged. Only large desktop screens are capped
   so the page does not stretch too wide. Header/footer/hamburger stay common. */
@media (min-width:1181px){
  :root{
    --kyoei-desktop-max:1180px;
    --kyoei-company-max:1080px;
    --kyoei-reading-max:760px;
  }

  /* common header: full-width background, inner content visually capped */
  .header{
    padding-left:max(28px, calc((100vw - var(--kyoei-desktop-max)) / 2 + 28px)) !important;
    padding-right:max(104px, calc((100vw - var(--kyoei-desktop-max)) / 2 + 104px)) !important;
  }
  #menubutton-iti,
  #menubutton-iti.panelactive{
    right:max(18px, calc((100vw - var(--kyoei-desktop-max)) / 2 + 18px)) !important;
  }

  /* common footer: band remains full width, contents are capped */
  .footer-wrap,
  .footer-brand-bottom,
  .footer-copylight{
    width:min(calc(100% - 48px), var(--kyoei-desktop-max)) !important;
    max-width:var(--kyoei-desktop-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* TOP desktop: keep the good responsive behavior, only tighten large screens */
  .modern-home-page .hero{
    padding:48px 24px 42px !important;
  }
  .modern-home-page .hero .hero-rebuilt{
    width:min(calc(100% - 48px), var(--kyoei-desktop-max)) !important;
    max-width:var(--kyoei-desktop-max) !important;
    height:400px !important;
    margin:0 auto !important;
  }
  .modern-home-page .section{
    padding-left:24px !important;
    padding-right:24px !important;
  }
  .modern-home-page .section-inner,
  .modern-home-page .cta-inner{
    width:min(calc(100% - 48px), var(--kyoei-desktop-max)) !important;
    max-width:var(--kyoei-desktop-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .modern-home-page .card-grid,
  .modern-home-page .group-grid{
    max-width:var(--kyoei-desktop-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .modern-home-page .strength-layout,
  .modern-home-page .info-layout{
    max-width:var(--kyoei-desktop-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* company pages desktop: a little narrower than TOP for readability */
  .company-page .zentaihaikei{
    padding-left:24px !important;
    padding-right:24px !important;
  }
  .company-page .page-title,
  .company-page .page-title1,
  .company-page .page-title2,
  .company-page .page-title3,
  .company-page .page-title4,
  .company-page .page-title5{
    width:min(calc(100% - 48px), var(--kyoei-company-max)) !important;
    max-width:var(--kyoei-company-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .company-page .bunnkatu{
    width:min(calc(100% - 48px), var(--kyoei-company-max)) !important;
    max-width:var(--kyoei-company-max) !important;
    grid-template-columns:240px minmax(0,1fr) !important;
    gap:24px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .company-page article{
    padding:32px 34px !important;
  }
  .company-page article p,
  .company-page article li{
    line-height:1.9 !important;
  }
  .company-page.page-kaisyaan2 .goaisatu-flex,
  .company-page.page-kaisyaan5 .hinshituhosyou-iti,
  .company-page.page-kaisyaan5 .hinshituhosyou-housin,
  .company-page.page-kaisyaan6 .group-flex{
    max-width:var(--kyoei-reading-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .company-page.page-kaisyaan3 .tableiti,
  .company-page.page-kaisyaan4 .tableiti,
  .company-page.page-kaisyaan5 .tableiti{
    max-width:var(--kyoei-reading-max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* ===== hamburger behavior fix 20260608-4 =====
   Common behavior for TOP + company pages.
   - Button stays aligned with the shared header.
   - Menu opens/closes by JS class, not by fragile sibling-only rules.
   - Backdrop closes the menu and body scroll is locked while open. */
body.menu-open{
  overflow:hidden !important;
}
#menubutton-iti,
#menubutton-iti.panelactive{
  position:fixed !important;
  top:13px !important;
  right:18px !important;
  left:auto !important;
  bottom:auto !important;
  width:48px !important;
  height:48px !important;
  z-index:520 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  pointer-events:auto !important;
  background:transparent !important;
  transform:none !important;
  opacity:1 !important;
  visibility:visible !important;
}
.menubutton,
#menubutton-iti.panelactive .menubutton{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  min-height:46px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(203,211,220,.95) !important;
  box-shadow:0 10px 26px rgba(12,26,49,.13) !important;
  backdrop-filter:blur(14px) !important;
  cursor:pointer !important;
}
#menubutton-list{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:24px !important;
  height:24px !important;
  padding:0 !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  border:0 !important;
  background:transparent !important;
  cursor:pointer !important;
}
#menubutton-list span{
  width:24px !important;
  height:3px !important;
  flex:0 0 3px !important;
  display:block !important;
  border-radius:999px !important;
  background:#74808c !important;
  transition:transform .24s ease, opacity .2s ease, background .2s ease !important;
}
#menubutton-box.active #menubutton-list span:nth-child(1),
.menubutton.active #menubutton-list span:nth-child(1){
  transform:translateY(8px) rotate(45deg) !important;
}
#menubutton-box.active #menubutton-list span:nth-child(2),
.menubutton.active #menubutton-list span:nth-child(2){
  opacity:0 !important;
  transform:scaleX(.4) !important;
}
#menubutton-box.active #menubutton-list span:nth-child(3),
.menubutton.active #menubutton-list span:nth-child(3){
  transform:translateY(-8px) rotate(-45deg) !important;
}
#menu-backdrop{
  position:fixed !important;
  inset:0 !important;
  z-index:430 !important;
  background:rgba(8,18,32,.30) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .24s ease, visibility .24s ease !important;
}
body.menu-open #menu-backdrop,
#menu-backdrop.is-open{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
#menu{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:auto !important;
  width:min(420px,88vw) !important;
  max-width:100vw !important;
  z-index:500 !important;
  display:block !important;
  padding:96px 22px 28px !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  transform:translateX(108%) !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:none !important;
  transition:transform .30s cubic-bezier(.2,.8,.2,1), box-shadow .30s ease !important;
  background:radial-gradient(circle at 20% 10%, rgba(184,213,64,.26), transparent 30%),radial-gradient(circle at 85% 16%, rgba(69,129,205,.26), transparent 34%),linear-gradient(145deg,rgba(13,31,58,.98),rgba(21,48,84,.97) 52%,rgba(10,27,50,.98)) !important;
  color:#fff !important;
  border-left:1px solid rgba(255,255,255,.12) !important;
}
body.menu-open #menu,
#menu.is-open,
#menubutton-iti.panelactive + #menu,
#menubutton-iti.panelactive ~ #menu{
  transform:translateX(0) !important;
  pointer-events:auto !important;
  box-shadow:-24px 0 60px rgba(7,18,34,.30) !important;
}
#menu .center-naka,
#menu ul{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
#menu ul{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:9px !important;
  list-style:none !important;
}
#menu li{margin:0 !important;padding:0 !important;list-style:none !important;}
#menu li a{
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-height:44px !important;
  padding:0 15px !important;
  white-space:nowrap !important;
}
@media (min-width:1181px){
  #menubutton-iti,
  #menubutton-iti.panelactive{
    right:max(18px, calc((100vw - var(--kyoei-desktop-max, 1180px)) / 2 + 18px)) !important;
  }
}
@media (max-width:1180px){
  #menubutton-iti,
  #menubutton-iti.panelactive{
    top:9px !important;
    right:12px !important;
  }
}
@media (max-width:480px){
  #menubutton-iti,
  #menubutton-iti.panelactive{
    top:7px !important;
    right:9px !important;
    width:44px !important;
    height:44px !important;
  }
  .menubutton,
  #menubutton-iti.panelactive .menubutton{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    border-radius:14px !important;
  }
  #menubutton-list,
  #menubutton-list span{
    width:22px !important;
  }
  #menu{
    width:100vw !important;
    padding:82px 14px 22px !important;
  }
}
