/* EeNa sp.css — 767px以下 */
@media (max-width: 767px) {
  body { font-size: 14px; }
  .inner { padding: 0 20px; }
  .hd-bar { display: none; }
  .hd-main { height: 60px; gap: 4px; }
  .logo img { height: 24px; }
  .hd-search { display: none; }
  .hd-search-btn { display: grid; place-items: center; width: 44px; height: 44px; margin-left: auto; }
  .menu-btn { display: block; position: relative; width: 44px; height: 44px; border: 0; background: transparent; cursor: pointer; margin-right: -10px; }
  .menu-btn span { position: absolute; left: 12px; right: 12px; height: 1px; background: var(--ink); transition: transform .3s var(--ease), opacity .2s; }
  .menu-btn span:nth-child(1) { top: 16px; }
  .menu-btn span:nth-child(2) { top: 22px; }
  .menu-btn span:nth-child(3) { top: 28px; }
  .menu-btn[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-btn[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-btn[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  body.menu-open { overflow: hidden; }

  /* カテゴリは横スクロールで常に表示 */
  .gnav { border-top: 1px solid var(--line); }
  .gnav ul { overflow-x: auto; scrollbar-width: none; padding: 0 10px; gap: 0; -webkit-overflow-scrolling: touch; }
  .gnav ul::-webkit-scrollbar { display: none; }
  .gnav a { padding: 11px 12px; font-size: 12px; letter-spacing: .14em; }
  .gnav a::after { bottom: 3px; }

  .sec { padding: 72px 0; }
  .sec-head { margin-bottom: 28px; padding-bottom: 14px; }
  .sec-h { gap: 4px 12px; }
  .sec-h .en { font-size: 36px; }
  .sec-h-sm .en { font-size: 26px; }
  .sec-h .ja { font-size: 10px; letter-spacing: .24em; }
  .more { font-size: 16px; }

  .cards { gap: 36px 16px; }
  .cards-md, .cards-sm { grid-template-columns: 1fr 1fr; }
  .cards-lg { grid-template-columns: 1fr; gap: 44px; }
  .card-body { padding-top: 12px; }
  .card-meta { gap: 4px 10px; font-size: 10px; }
  .card-meta time { font-size: 13px; }
  .cat { gap: 6px; font-size: 10px; letter-spacing: .12em; }
  .cat::before { width: 10px; }
  .card-title, .cards-sm .card-title { font-size: 13px; line-height: 1.7; margin-top: 6px; }
  .cards-lg .card-title { font-size: 16px; }

  .hero { padding: 0 0 8px; }
  .hero > .inner { padding: 0; }
  .hero-img { aspect-ratio: 4 / 3; }
  .hero-body { padding: 20px 20px 0; }
  .hero-title { font-size: 21px; line-height: 1.65; margin-top: 10px; }
  .hero-desc { font-size: 12px; }
  .hero-side { padding: 48px 20px 0; }
  .pickup li { padding: 16px 0; }
  .pickup a { gap: 14px; }
  .pickup a::before { font-size: 22px; min-width: 26px; }
  .mini-img { width: 76px; }
  .sec-latest { padding-top: 56px; }
  .feature { gap: 36px; }
  .sec-interview .card-img { aspect-ratio: 4 / 3; }

  .about-grid { gap: 36px; }
  .cta-box { padding: 28px 24px; }
  .ad-wrap .ad { margin-bottom: 72px; }

  .page-head { padding: 18px 0 40px; }
  .page-title { font-size: 25px; letter-spacing: .08em; }
  .page-en { margin-top: 32px; font-size: 19px; }
  .page-head .breadcrumb + .page-title { margin-top: 32px; }
  .list-body { padding-top: 40px; padding-bottom: 80px; }
  .pager { margin-top: 56px; gap: 0; }
  .pager a, .pager .gap { min-width: 36px; height: 40px; padding: 0 6px; font-size: 16px; }
  .pager .pg-prev, .pager .pg-next { padding: 0 10px; }

  .article-page { padding-top: 18px; }
  .article-head { margin-top: 32px; }
  .article-title { font-size: 22px; line-height: 1.7; margin-top: 18px; letter-spacing: .04em; }
  .article-meta { margin-top: 14px; font-size: 14px; }
  .article-eyecatch { margin: 32px -20px 0; }
  .share { margin: 32px auto; }
  .post-body { font-size: 15.5px; line-height: 2.05; letter-spacing: .04em; }
  .post-body h2 { font-size: 19px; }
  .post-body h3 { font-size: 17px; }
  .post-body h4, .post-body h5, .post-body h6 { font-size: 16px; }
  .post-body th { white-space: normal; }
  .article-tags { flex-direction: column; gap: 12px; margin-top: 56px; }
  .prevnext { grid-template-columns: 1fr; }
  .pn-next { text-align: left; border-left: 0; border-top: 1px solid var(--line); }
  .related { margin-top: 80px; padding: 64px 0 72px; }

  .page-body { padding-top: 40px; padding-bottom: 80px; }
  .about-lead { font-size: 16px; text-align: left; }
  .info-table th { width: auto; white-space: normal; min-width: 7em; }
  .search-form .btn { padding: 10px 20px; }
  .drawer-cats .en { min-width: 120px; font-size: 18px; }
  .drawer-cats .sub { padding-left: 136px; }

  .site-footer { padding: 64px 0 28px; }
  .ft-grid { grid-template-columns: 1fr 1fr; gap: 40px 20px; }
  .ft-brand { grid-column: 1 / -1; }
  .copyright { margin-top: 56px; }
  .post-body .eena-point { padding: 22px 20px; }
  .hd-lang-sp { display: block; margin-left: auto; }
  .hd-lang-sp + .menu-btn { margin-left: 4px; }
}