@charset "UTF-8";
/* ==========================================================
   企業情報ページ スマホ（768px以下）
   ========================================================== */
@media (max-width: 768px) {

  #company-page { --header-h: 60px; font-size: 14px; }
  html { scroll-padding-top: 60px; }
  #company-page .sp-only { display: inline; }
  #company-page .cp-container,
  #company-page .cp-container--narrow { width: calc(100% - 56px); }
  #company-page .cp-section { padding: 80px 0; }
  #company-page .cp-title { margin-bottom: 32px; font-size: 25px; letter-spacing: .12em; }
  #company-page .cp-eyebrow { margin-bottom: 16px; font-size: 11px; }
  #company-page .cp-eyebrow::after { width: 36px; }

  /* Header / メニュー */
  #company-page .cp-header__inner { width: calc(100% - 40px); }
  #company-page .cp-logo { font-size: 21px; }
  #company-page .cp-menu-btn { display: block; width: 26px; height: 18px; }
  #company-page .cp-menu-btn span:nth-child(2) { top: 9px; }
  #company-page .cp-menu-btn span:nth-child(3) { top: 16px; }
  #company-page .cp-menu-btn[aria-expanded="true"] span:nth-child(1),
  #company-page .cp-menu-btn[aria-expanded="true"] span:nth-child(3) { top: 9px; }
  #company-page .cp-nav {
    position: fixed; top: var(--header-h); left: 0; right: 0; bottom: 0;
    flex-direction: column; justify-content: center; gap: 28px;
    background: var(--paper);
    opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s;
  }
  #company-page .cp-nav.is-open { opacity: 1; visibility: visible; }
  #company-page .cp-nav a { font-size: 20px; }
  #company-page .cp-nav__contact { margin-top: 12px; padding: 10px 40px; }
  body.cp-nav-open { overflow: hidden; }

  /* About：写真を背景に、文字は左寄せで重ねる */
  #company-page .cp-hero { min-height: auto; align-items: flex-start; }
  #company-page .cp-hero__image { width: 100%; top: var(--header-h); }
  #company-page .cp-hero__image img { object-position: 70% top; }
  #company-page .cp-hero__image::after {
    background:
      linear-gradient(90deg, rgba(253,252,250,.92) 0%, rgba(253,252,250,.65) 50%, rgba(253,252,250,0) 85%),
      linear-gradient(0deg, var(--white) 0%, rgba(253,252,250,0) 30%);
  }
  #company-page .cp-hero__copy { width: calc(100% - 56px); padding: 34vh 0 72px; }
  #company-page .cp-hero__title { margin-bottom: 32px; font-size: 25px; line-height: 1.75; letter-spacing: .12em; }
  #company-page .cp-hero__text { font-size: 13px; line-height: 2.2; }

  /* Philosophy：泡の写真を右下に薄く */
  #company-page .cp-philosophy__bg { top: auto; left: auto; right: 0; width: 75%; height: 60%; opacity: .55; }
  #company-page .cp-philosophy__inner { padding-left: 0; }
  #company-page .cp-philosophy__bg::after {
    background: linear-gradient(180deg, var(--paper) 0%, rgba(246,243,238,0) 60%),
                linear-gradient(90deg, var(--paper) 0%, rgba(246,243,238,0) 70%);
  }
  #company-page .cp-flow { margin-top: 40px; padding-top: 32px; }
  #company-page .cp-flow li { font-size: 14px; line-height: 2.2; }
  #company-page .cp-flow li + li { margin-top: 6px; }
  #company-page .cp-flow em { display: block; }

  /* Business：1列 */
  #company-page .cp-business__list { grid-template-columns: 1fr; }
  #company-page .cp-biz,
  #company-page .cp-biz:nth-child(even) { padding: 36px 0 40px; border-left: 0; }
  #company-page .cp-biz__ja { font-size: 19px; margin-bottom: 14px; }
  #company-page .cp-biz__text { font-size: 13px; }

  /* Message：写真を上、文章を下 */
  #company-page .cp-message__grid { grid-template-columns: 1fr; }
  #company-page .cp-message__photo { min-height: 0; aspect-ratio: 4 / 5; }
  #company-page .cp-message__photo::after {
    background: linear-gradient(180deg, rgba(22,29,43,0) 55%, var(--navy) 100%);
  }
  #company-page .cp-message__body { margin-top: -120px; position: relative; z-index: 1; padding: 0 28px 80px; }
  #company-page .cp-message__name { font-size: 28px; }
  #company-page .cp-message__quote { margin: 32px 0 28px; font-size: 18px; }
  #company-page .cp-message__text { font-size: 13px; line-height: 2.1; }
  #company-page .cp-message__closing { font-size: 14px; }

  /* Company：項目名を上、内容を下 */
  #company-page .cp-table > div { grid-template-columns: 1fr; gap: 4px; padding: 20px 0; }
  #company-page .cp-table dt { font-size: 12px; }
  #company-page .cp-table dd { font-size: 14px; }

  /* Services */
  #company-page .cp-links a { flex-direction: column; gap: 2px; padding: 22px 48px 22px 0; }
  #company-page .cp-links a:hover { padding-left: 0; background: none; }
  #company-page .cp-links__en { width: auto; font-size: 11px; }
  #company-page .cp-links__ja { font-size: 16px; }

  /* Contact */
  #company-page .cp-contact { padding: 90px 0; }
  #company-page .cp-contact__bg img { object-position: 40% center; }
  #company-page .cp-contact__text { font-size: 13px; }
  #company-page .cp-btn { display: flex; justify-content: center; margin-top: 36px; padding: 18px 56px 18px 24px; font-size: 14px; }
  #company-page .cp-btn i { right: 22px; width: 22px; }
}