@charset "utf-8";
/* トップページのリニューアル部分（ヒーローの文章・VISION・BUSINESS・STRENGTHS・TRACK RECORD・COMPANYの導入文・お問い合わせ）
   色は既存サイトとチェーン紹介ページに合わせている: 背景 #25213E / カード #312D50 / 線 #433D6B / アクセント #FF8800 */

/* ---------- ヒーロー ---------- */
/* キャッチが主役。右に図形、下部に実績の帯。大きなロゴはヘッダーと重複するので出さない */
.kv { position: relative; overflow: hidden; height: auto; min-height: 100vh; box-sizing: border-box; padding: 112px 0 40px;
      display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 0; }
.kv > h2 { display: none; }
.hero_copy { position: relative; z-index: 1; margin: 0 20px; }
.hero_en { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #FF8800; margin-bottom: 20px; }
.hero_catch { font-size: clamp(2.1rem, 1.3rem + 3.4vw, 4.5rem); font-weight: 700; line-height: 1.3; letter-spacing: .02em; margin-bottom: 24px; }
.hero_lead { font-size: 15px; line-height: 1.9; color: #A9A6C4; margin-bottom: 36px; }
.hero_btns { display: flex; flex-wrap: wrap; gap: 12px; }
.btn_primary, .btn_ghost { display: inline-block; padding: 15px 30px; border-radius: 999px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background .3s, color .3s, border-color .3s; }
.btn_primary { background: #FF8800; color: #fff; border: 1px solid #FF8800; }
.btn_primary:hover { background: #ff9d2e; }
.btn_ghost { border: 1px solid rgba(255,255,255,.35); color: #fff; }
.btn_ghost:hover { border-color: #fff; }

.hero_art { position: absolute; z-index: 0; right: -190px; top: -10px; width: 380px; opacity: .22; pointer-events: none; }
.hero_art svg { display: block; width: 100%; height: auto; }
.hero_art .orbit { transform-box: view-box; transform-origin: 50% 50%; animation: hero_spin 80s linear infinite; }
.hero_art .o2 { animation-duration: 120s; animation-direction: reverse; }
.hero_art .o3 { animation-duration: 60s; }
@keyframes hero_spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .hero_art .orbit { animation: none; } }

.hero_stats { position: relative; z-index: 1; list-style: none; margin: 56px 20px 0; border-top: 1px solid rgba(255,255,255,.14); }
/* 背景の網目の上でも読めるよう、帯の後ろだけ暗くする（画面の端まで） */
.hero_stats::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: -40px; left: -100vw; right: -100vw; background: linear-gradient(to bottom, rgba(33, 29, 58, .78), rgba(33, 29, 58, .92)); }
.hero_stats li { padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.stat_label { font-family: "Barlow", sans-serif; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #8E8AAE; margin-bottom: 6px; }
.stat_big { font-family: "Barlow", "Noto Sans JP", sans-serif; font-weight: 600; font-size: 28px; line-height: 1.2; color: #fff; margin-bottom: 6px; }
.stat_small { font-size: 13px; line-height: 1.7; color: #A9A6C4; }

/* ---------- ABOUT（2社の掛け合わせ） ---------- */
/* 図は正方形のまま縮小する（切り抜き・重ね配置はしない） */
.jv_wrap { margin: 0 15px; }
.jv_fig { max-width: 420px; margin: 0 auto 24px; }
.jv_fig picture, .jv_fig img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; }
.jv_lead { font-size: clamp(.9rem, .82rem + .35vw, 1.05rem); line-height: 2; color: #A9A6C4; margin-bottom: 24px; }
.jv_list { list-style: none; border-top: 1px solid #433D6B; }
.jv_list > li { padding: 16px 0; border-bottom: 1px solid #433D6B; }
.jv_name { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 18px; margin-bottom: 4px; }
.jv_name span { font-family: inherit; font-weight: 400; font-size: 12px; color: #9E9AC0; margin-left: 10px; }
.jv_body { font-size: 14px; line-height: 1.8; color: #A9A6C4; }
.jv_points { list-style: none; margin-top: 10px; display: grid; gap: 6px; }
.jv_points li { position: relative; padding: 0 0 0 16px; border: none; font-size: 13px; line-height: 1.7; color: #A9A6C4; }
.jv_points li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 6px; height: 6px; background: #FF8800; border-radius: 1px; }
.jv_self .jv_name { color: #FF8800; }
.jv_self .jv_body { color: #fff; font-weight: 500; }

/* ---------- LAB ---------- */
.lab_wrap { margin: 0 15px; }
.lab_intro { border-left: 3px solid #FF8800; padding: 4px 0 4px 20px; margin-bottom: 32px; }
.lab_lead { font-size: clamp(1.05rem, .9rem + .6vw, 1.4rem); font-weight: 500; line-height: 1.8; color: #fff; margin-bottom: 18px; }
.lab_body { font-size: 14px; line-height: 2; color: #A9A6C4; }
.lab_steps { list-style: none; display: grid; grid-template-columns: 1fr; gap: 1px; background: #433D6B; border: 1px solid #433D6B; border-radius: 8px; overflow: hidden; margin-bottom: 28px; }
.lab_steps li { background: #312D50; padding: 24px 22px; }
.lab_steps .lab_no { font-family: "Barlow", sans-serif; font-weight: 600; color: #FF8800; font-size: 24px; line-height: 1; margin-bottom: 12px; }
.lab_steps .lab_no span { font-size: 12px; color: #9E9AC0; letter-spacing: .08em; margin-left: 10px; font-weight: 500; }
.lab_steps h4 { font-size: 16px; margin-bottom: 8px; }
.lab_steps p { font-size: 14px; line-height: 1.9; color: #A9A6C4; }
.lab_scope_h { font-size: 13px; color: #9E9AC0; margin-bottom: 10px; }
.lab_tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin-bottom: 14px; }
.lab_tags li { font-size: 13px; padding: 7px 14px; border: 1px solid #433D6B; background: #2B2748; border-radius: 999px; }
.lab_tech { font-size: 13px; color: #A9A6C4; }

/* RESEARCH の写真 */
.lab_photo { margin: 0 0 24px; border-radius: 8px; overflow: hidden; aspect-ratio: 16 / 10; background: #1E1B33; }
.lab_photo img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.85) brightness(.9); }

/* LAB: 検証テーマ */
.lab_log { background: #2B2748; border: 1px solid #433D6B; border-radius: 8px; padding: 22px 20px; margin-bottom: 16px; }
.lab_log_h { font-family: inherit; font-size: 14px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.lab_log_h::before { content: ""; width: 3px; height: 16px; background: #FF8800; }
.theme_list { list-style: none; }
.theme_list { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 14px; }
.theme_list li { background: #312D50; border: 1px solid #433D6B; border-top: 2px solid #FF8800; border-radius: 6px; padding: 16px 16px 18px; line-height: 1.7; }
.th_name { font-size: 15px; font-weight: 700; color: #fff; margin-bottom: 6px; word-break: keep-all; overflow-wrap: anywhere; }
.th_note { font-size: 13px; color: #9E9AC0; }
.lab_log_intro { font-size: 14px; color: #A9A6C4; margin-bottom: 8px; }
.lab_note { font-size: 12px; color: #9E9AC0; margin-top: 10px; }

/* ---------- INSIGHTS ---------- */
.ins_lead { margin: -10px 15px 26px; font-size: 14px; color: #A9A6C4; }
.ins_outer { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 15px; }
.ins_card { display: block; background: #312D50; border: 1px solid #433D6B; border-radius: 8px; overflow: hidden; color: #fff; text-decoration: none; transition: border-color .3s, transform .3s; }
.ins_card:hover { border-color: #FF8800; }
.ins_img { aspect-ratio: 16 / 9; background: #1E1B33; overflow: hidden; }
.ins_img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ins_meta { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: #9E9AC0; padding: 14px 18px 0; }
.ins_meta span:first-child { color: #FF8800; }
.ins_card h4 { font-size: 15px; line-height: 1.7; padding: 8px 18px 20px; }

/* ---------- 共通: カード ---------- */
.svc_outer, .tr_outer { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 15px; }
.svc_card, .tr_card { background: #312D50; border: 1px solid #433D6B; border-radius: 8px; padding: 28px 24px; }
.card_no, .str_no { font-family: "Barlow", sans-serif; font-weight: 600; color: #FF8800; font-size: 28px; line-height: 1; }
.card_en { font-family: "Barlow", sans-serif; color: #9E9AC0; font-size: 13px; letter-spacing: .06em; margin: 8px 0 12px; }
.svc_card h4 { font-size: 18px; line-height: 1.6; margin-bottom: 14px; }
.card_body { font-size: 14px; line-height: 1.9; color: #A9A6C4; margin-bottom: 18px; }
.card_tags, .domain_list, .cta_ex { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; }
.card_tags li { font-size: 12px; padding: 4px 10px; border: 1px solid #5A5488; border-radius: 3px; color: #A9A6C4; }
.service_link.center { text-align: center; margin-top: 30px; }

/* ---------- BUSINESS: 対応領域 ---------- */
.svc_domain { margin: 32px 15px 0; }
.svc_domain_h { font-size: 13px; color: #9E9AC0; margin-bottom: 12px; }

/* ---------- STRENGTHS ---------- */
.str_list { list-style: none; margin: 0 15px; display: grid; grid-template-columns: 1fr; gap: 16px; }
.str_list li { background: #312D50; border: 1px solid #433D6B; border-radius: 8px; overflow: hidden; }
.str_photo { margin: 0; aspect-ratio: 16 / 9; background: #1E1B33; }
.str_photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* 写真だけ少し落ち着かせる（ロゴ入りの自社素材 .png はそのまま） */
.str_photo img[src$=".jpg"] { filter: saturate(.85) brightness(.9); }
.str_text { padding: 24px 22px 28px; }
.str_list .str_no { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 28px; color: #FF8800; line-height: 1; margin-bottom: 12px; }
.str_list h4 { font-size: 18px; margin-bottom: 10px; line-height: 1.5; }
.str_list p { font-size: 14px; line-height: 1.9; color: #A9A6C4; }

/* ---------- HOW WE WORK ---------- */
.process_note { margin: -10px 15px 30px; font-size: 15px; color: #A9A6C4; }
.step_list { list-style: none; display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 15px; counter-reset: none; }
.step_list li { position: relative; background: #312D50; border: 1px solid #433D6B; border-radius: 8px; padding: 24px 22px; }
.step_list .step_no { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 28px; color: #FF8800; line-height: 1; margin-bottom: 12px; }
.step_list .step_no span { font-size: 13px; font-weight: 500; color: #9E9AC0; letter-spacing: .08em; margin-left: 10px; vertical-align: middle; }
.step_list h4 { font-size: 17px; margin-bottom: 10px; }
.step_list .step_body { font-size: 14px; line-height: 1.9; color: #A9A6C4; margin-bottom: 16px; }
.step_list .step_out_h { font-size: 12px; color: #9E9AC0; margin-bottom: 8px; }
.step_out { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; }
.step_out li { font-size: 12px; padding: 3px 10px; border: 1px solid #5A5488; border-radius: 3px; color: #A9A6C4; background: none; }

/* ---------- TRACK RECORD ---------- */
.tr_wrap { margin: 0 15px; }
.tr_sub { font-family: "Barlow", sans-serif; font-weight: 300; color: #FF8800; font-size: clamp(1.063rem, .9rem + .8vw, 1.5rem); margin: 10px 0 16px; }
.domain_list { margin-bottom: 40px; }
.domain_list li { font-size: 14px; padding: 8px 16px; background: #312D50; border: 1px solid #433D6B; border-radius: 999px; }
.tr_outer { margin: 0; }
.tr_cat { display: inline-block; font-size: 12px; color: #FF8800; border: 1px solid #FF8800; border-radius: 3px; padding: 2px 10px; margin-bottom: 14px; }
.tr_card h4 { font-size: 16px; line-height: 1.6; margin-bottom: 10px; }
.tr_card p { font-size: 14px; line-height: 1.9; color: #A9A6C4; }
.tr_card .tr_cat { color: #FF8800; font-size: 12px; line-height: 1.6; }
.tr_note { font-size: 12px; color: #9E9AC0; margin-top: 16px; }

/* ---------- COMPANY ---------- */
.company_mission { margin: 0 15px 36px; padding: 24px 20px; border: 1px solid #433D6B; border-radius: 8px; text-align: center; }
.cm_h { font-family: "Barlow", sans-serif; font-weight: 300; font-size: 18px; color: #FF8800; margin-bottom: 10px; }
.cm_text { font-size: clamp(.9rem, .8rem + .5vw, 1.2rem); line-height: 2; }
.company_lead { margin: 0 15px 30px; font-size: clamp(.875rem, .8rem + .35vw, 1.05rem); line-height: 2; color: #A9A6C4; }

/* ---------- お問い合わせ ---------- */
.cta_cols { display: grid; grid-template-columns: 1fr; gap: 16px; text-align: left; max-width: 980px; margin: 0 auto; }
.cta_col { background: #2B2748; border: 1px solid #433D6B; border-radius: 8px; padding: 26px 22px; display: flex; flex-direction: column; }
.cta_col h4 { font-size: 17px; margin-bottom: 10px; }
.cta_col > p { font-size: 14px; line-height: 1.9; color: #A9A6C4; margin-bottom: 14px; }
.cta_col .cta_ex { justify-content: flex-start; margin-bottom: 22px; }
.cta_col a { margin-top: auto; text-align: center; }
section#cta { padding: 20px 0 80px; }
.cta_box { margin: 0 15px; padding: 44px 24px; text-align: center; background: #312D50; border: 1px solid #433D6B; border-top: 3px solid #FF8800; border-radius: 8px; }
.cta_en { font-family: "Barlow", sans-serif; font-weight: 600; letter-spacing: .15em; color: #FF8800; font-size: 13px; margin-bottom: 10px; }
section h2.cta_title { font-family: inherit; color: #fff; border: none; display: block; padding: 0; font-size: clamp(1.25rem, 1rem + 1.2vw, 2rem); font-weight: 700; line-height: 1.5; margin-bottom: 18px; }
.cta_body { font-size: 14px; line-height: 2; color: #A9A6C4; max-width: 680px; margin: 0 auto 26px; }
.cta_ex_h { font-size: 13px; color: #9E9AC0; margin-bottom: 10px; }
.cta_ex { justify-content: center; margin-bottom: 32px; }
.cta_ex li { font-size: 13px; padding: 6px 14px; border: 1px solid #5A5488; border-radius: 999px; }

@media screen and (min-width: 768px) {
  .hero_copy { margin: 0 25px; }
  .svc_outer { margin: 0 30px; }
  .tr_outer { grid-template-columns: 1fr 1fr; }
  .step_list { grid-template-columns: 1fr 1fr; margin: 0 30px; }
  .lab_wrap { margin: 0 30px; }
  .lab_steps { grid-template-columns: repeat(3, 1fr); }
  .theme_list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jv_wrap { margin: 0 30px; }
  .company_mission { margin: 0 30px 40px; }
  .ins_outer { grid-template-columns: 1fr 1fr; margin: 0 30px; }
  .ins_lead { margin-left: 30px; margin-right: 30px; }
  .cta_cols { grid-template-columns: 1fr 1fr; }
  .process_note { margin-left: 30px; margin-right: 30px; }
  .tr_wrap, .company_lead, .cta_box { margin-left: 30px; margin-right: 30px; }
  .str_list { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 30px; gap: 20px; }
  .svc_domain { margin: 36px 30px 0; }
  .cta_box { padding: 60px 40px; }
}

@media screen and (min-width: 1024px) {
  .kv { padding-top: 60px; }
  .kv h2 { width: 420px; margin-left: 80px; }
  .hero_copy { margin-left: 80px; }
  .svc_outer { grid-template-columns: repeat(3, 1fr); max-width: 1280px; margin: 0 auto; padding: 0 30px; }
  .str_list, .tr_wrap, .cta_box { max-width: 1220px; margin-left: auto; margin-right: auto; }
  .tr_outer { grid-template-columns: repeat(4, 1fr); }
  .step_list { grid-template-columns: repeat(4, 1fr); max-width: 1220px; margin: 0 auto; }
  .lab_wrap { max-width: 1220px; margin: 0 auto; display: grid; grid-template-columns: 5fr 7fr; column-gap: 56px; }
  .lab_intro { grid-row: auto; }
  .lab_log, .lab_tech { grid-column: 1 / -1; }
  .lab_log { padding: 28px 32px; margin-top: 8px; }
  .theme_list { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
  .th_name { font-size: 14px; }
  .jv_wrap { max-width: 1220px; margin: 0 auto; display: grid; grid-template-columns: minmax(320px, 440px) 1fr; gap: 56px; align-items: center; }
  .jv_fig { max-width: none; margin: 0; }
  .company_mission { max-width: 1220px; margin: 0 auto 44px; }
  .lab_steps { grid-template-columns: 1fr; }
  .ins_outer { grid-template-columns: repeat(4, 1fr); max-width: 1220px; margin: 0 auto; }
  .ins_lead { max-width: 1220px; margin: -10px auto 30px; }
  .process_note { max-width: 1220px; margin: -10px auto 36px; }
  .company_lead { max-width: 1220px; margin: 0 auto 40px; padding: 0 30px; }
}


/* =================================================================
   PC（1024px以上）: 右側の空きをなくし、文字を一段大きくする
   ================================================================= */
@media screen and (min-width: 1024px) {
  /* ヒーロー: 左に文章・右に図形、下に実績の帯（3列） */
  .kv { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); grid-template-rows: 1fr auto; column-gap: 40px; align-items: center;
        padding: 140px max(80px, calc((100vw - 1220px) / 2)) 56px; }
  .hero_copy { grid-column: 1; grid-row: 1; margin: 0; }
  .hero_en { font-size: 13px; margin-bottom: 28px; }
  .hero_catch { margin-bottom: 28px; }
  .hero_lead { font-size: 18px; margin-bottom: 44px; }
  .btn_primary, .btn_ghost { font-size: 16px; padding: 17px 36px; }
  .hero_art { position: relative; right: auto; top: auto; grid-column: 2; grid-row: 1; justify-self: end; width: 100%; max-width: 480px; opacity: 1; }
  .hero_stats::before { bottom: -56px; }
  .hero_stats { grid-column: 1 / -1; grid-row: 2; margin: 64px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero_stats li { padding: 28px 32px 0 0; border-bottom: none; }
  .hero_stats li + li { padding-left: 32px; border-left: 1px solid rgba(255,255,255,.1); }
  .stat_label { font-size: 12px; margin-bottom: 10px; }
  .stat_big { font-size: 34px; margin-bottom: 10px; word-break: keep-all; }
  .stat_small { font-size: 14px; }

  /* 文字サイズ（本文16px前後・見出し20px前後） */
  .jv_lead, .lab_body, .company_lead { font-size: 17px; }
  .jv_name { font-size: 22px; }
  .jv_body { font-size: 16px; }
  .jv_points li { font-size: 15px; }
  .lab_lead { font-size: 21px; }
  .lab_steps h4 { font-size: 18px; }
  .lab_steps p, .lab_log_intro { font-size: 15px; }
  .lab_log_h { font-size: 16px; }
  .th_name { font-size: 16px; }
  .th_note { font-size: 14px; }
  .lab_note, .tr_note { font-size: 13px; }
  .svc_card h4 { font-size: 21px; }
  .card_en { font-size: 14px; }
  .card_body { font-size: 16px; }
  .card_tags li { font-size: 13px; }
  .process_note { font-size: 16px; }
  .step_list h4 { font-size: 19px; }
  .step_list .step_body { font-size: 15px; }
  .step_out li { font-size: 13px; }
  .domain_list li { font-size: 15px; }
  .tr_card h4 { font-size: 18px; }
  .tr_card p { font-size: 15px; }
  .cta_body { font-size: 16px; }
  .cta_col h4 { font-size: 20px; }
  .cta_col > p { font-size: 16px; }
  .cta_ex li { font-size: 14px; }
  .cm_text { font-size: 20px; }

  /* 選ばれる理由: 写真付きの2列カード */
  .str_list { max-width: 1220px; margin: 0 auto; }
  .str_text { padding: 32px 34px 36px; }
  .str_list .str_no { font-size: 36px; margin-bottom: 14px; }
  .str_list h4 { font-size: 22px; margin-bottom: 14px; }
  .str_list p { font-size: 16px; }
  .svc_domain { max-width: 1220px; margin: 44px auto 0; }
  /* RESEARCH: 左に説明、右に写真 */
  .lab_wrap { align-items: start; }
  .lab_photo { margin: 0; }

  /* 既存セクション（NEWS・会社概要）も新しいセクションと同じ幅に揃える */
  #news .news_outer, #news .media_outer, #company .company_outer { max-width: 1220px; }

  /* 余白とメリハリ: セクション間を広げ、日本語の見出しを大きく */
  #about, #lab, #business, #strengths, #process, #track { padding-top: 110px; padding-bottom: 60px; }
  #about h3, #lab h3, #business h3, #strengths h3, #process h3, #track h3 { font-size: 22px; font-weight: 700; margin-bottom: 56px; }
  .lab_lead { font-size: 24px; }
  .jv_list > li { padding: 22px 0; }
  .svc_card, .tr_card { padding: 36px 32px; }
  .card_body { margin-bottom: 22px; }
}

/* =================================================================
   カード内の段をそろえる（見出し・本文の行数が違ってもタグ・成果物の位置を横一列に）
   ================================================================= */
.svc_card, .step_list > li { display: flex; flex-direction: column; }
.svc_card .card_tags, .step_list .step_out_h { margin-top: auto; }
@supports (grid-template-rows: subgrid) {
  @media screen and (min-width: 768px) {
    .step_list > li { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; align-content: start; }
    .step_list .step_out_h { margin-top: 0; align-self: end; }
  }
  @media screen and (min-width: 1024px) {
    .svc_outer { row-gap: 0; }
    .svc_card { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; }
    .svc_card .card_tags { margin-top: 0; align-self: end; }
  }
}

/* RESEARCH（PC）: 写真を小さく。文章側を広げ、写真の高さは文章の高さに合わせる */
@media screen and (min-width: 1024px) {
  .lab_wrap { grid-template-columns: 7fr 5fr; }
  .lab_photo { position: relative; aspect-ratio: auto; align-self: stretch; min-height: 220px; }
  .lab_photo img { position: absolute; inset: 0; }
}

/* =================================================================
   RESOURCES（資料請求）: レポートの表紙・トップのカード
   表紙は tools/resources.py が HTML で描く（.rcover）。文字は表紙の幅に比例（cqw）
   ================================================================= */
.rcover { container-type: inline-size; position: relative; aspect-ratio: 210 / 297; background: #F6F4EF; color: #25213E;
          box-shadow: 0 18px 40px rgba(0,0,0,.45); text-align: left; overflow: hidden; }
/* 余白も表紙の幅に比例させるため、中の箱に付ける（表紙そのものに cqw の余白は付けられない） */
.rc_in { box-sizing: border-box; height: 100%; padding: 11cqw 10cqw 0; display: flex; flex-direction: column; }
.rcover::before { content: ""; position: absolute; left: 0; top: 0; width: 2.4cqw; height: 100%; background: #FF8800; }
.rc_brand { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 3.6cqw; letter-spacing: .22em; padding-bottom: 3cqw; border-bottom: .5cqw solid #25213E; margin: 0; }
.rc_type { font-family: "Barlow", sans-serif; font-weight: 600; font-size: 3.6cqw; letter-spacing: .2em; color: #FF8800; margin: 4cqw 0 0; }
.rc_title { font-size: 9.4cqw; font-weight: 700; line-height: 1.4; margin: auto 0 0; word-break: keep-all; overflow-wrap: anywhere; }
.rc_sub { font-size: 4.4cqw; line-height: 1.6; color: #5A5670; margin: 4cqw 0 0; }
.rc_foot { margin: 12cqw -10cqw 0; height: 17cqw; background: #25213E; display: flex; align-items: center; justify-content: flex-end; padding: 0 8cqw; }
.rc_foot img { width: 8cqw; height: auto; }

.res_outer { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 15px; }
.res_card { display: block; background: #312D50; border: 1px solid #433D6B; border-radius: 8px; overflow: hidden; color: #fff; text-decoration: none; transition: border-color .3s; }
.res_card:hover { border-color: #FF8800; }
.res_visual { aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center;
              background: radial-gradient(circle at 70% 30%, #3A3563 0%, #1E1B33 70%); }
.res_visual .rcover { width: 34%; }
.res_text { padding: 22px 22px 26px; }
.res_meta { display: flex; align-items: center; gap: 12px; font-size: 12px; color: #9E9AC0; margin-bottom: 10px; }
.res_meta span { font-family: "Barlow", sans-serif; font-weight: 600; letter-spacing: .14em; color: #FF8800; border: 1px solid #FF8800; border-radius: 3px; padding: 2px 8px; }
.res_card h4 { font-size: 18px; line-height: 1.5; margin-bottom: 6px; word-break: keep-all; overflow-wrap: anywhere; }
.res_sub { font-size: 14px; color: #A9A6C4; margin-bottom: 14px; }
.res_desc { font-size: 14px; line-height: 1.9; color: #A9A6C4; margin-bottom: 18px; }
.res_more { font-size: 14px; font-weight: 700; color: #FF8800; }
.res_more::after { content: " →"; }

/* STRENGTHS から資料へのリンク */
.str_link { display: inline-block; margin-top: 16px; font-size: 14px; font-weight: 700; color: #FF8800; text-decoration: none; }
.str_link::after { content: " →"; }
.str_link:hover { text-decoration: underline; }

@media screen and (min-width: 768px) {
  .res_outer { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 30px; gap: 20px; }
  .res_card.is-feature { grid-column: 1 / -1; display: grid; grid-template-columns: 5fr 7fr; }
  .res_card.is-feature .res_visual { aspect-ratio: auto; min-height: 320px; }
  .res_card.is-feature .res_visual .rcover { width: 44%; }
  .res_card.is-feature .res_text { padding: 36px 40px; align-self: center; }
}
@media screen and (min-width: 1024px) {
  .res_outer { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1220px; margin: 0 auto; }
  .res_card.is-feature .res_visual { min-height: 380px; }
  .res_card.is-feature .res_visual .rcover { width: 40%; }
  .res_card.is-feature h4 { font-size: 26px; }
  .res_card.is-feature .res_sub { font-size: 16px; }
  .res_card.is-feature .res_desc { font-size: 16px; }
  .res_card.is-feature .res_more { font-size: 16px; }
  .str_link { font-size: 15px; }
  .cta_cols { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; }
}

/* 表紙の番号・テーマのロゴ（ロゴはタイトルの上。ない資料はタイトルだけ） */
.rc_type span { color: #25213E; margin-left: .4em; }
.rc_logo { display: block; height: 9cqw; width: auto; max-width: 60cqw; margin-top: auto; object-fit: contain; object-position: left center; }
.rc_logo + .rc_title { margin-top: 5cqw; }
/* 横長の大きなカード（資料が1つのとき）は、請求をボタンの形で見せる */
.res_card.is-feature .res_more { display: inline-block; background: #FF8800; color: #fff; padding: 13px 30px; border-radius: 999px; transition: background .3s; }
.res_card.is-feature:hover .res_more { background: #ff9d2e; }
.res_note { font-size: 12px; color: #9E9AC0; margin: 14px 15px 0; }
@media screen and (min-width: 768px) { .res_note { margin: 16px 30px 0; } }
@media screen and (min-width: 1024px) { .res_note { max-width: 1220px; margin: 18px auto 0; font-size: 13px; } }

/* RESEARCH の中の「公開レポート」と、領域の一覧の下の勉強会・相談ボタン */
.th_ask_box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 18px; padding-top: 18px; border-top: 1px solid #433D6B; }
.th_ask_box p { font-size: 14px; color: #D6D3EA; }
.th_ask_box .btn_ghost { font-size: 14px; padding: 12px 26px; }
.lab_reports { background: #2B2748; border: 1px solid #433D6B; border-radius: 8px; padding: 22px 20px; }
.lab_reports .res_outer { margin: 14px 0 0; }
.lab_reports .res_note { margin: 14px 0 0; }
@media screen and (min-width: 1024px) {
  .lab_reports { grid-column: 1 / -1; padding: 28px 32px; margin-top: 8px; }
  .lab_reports .res_outer { max-width: none; }
  .lab_reports .res_note { max-width: none; }
  .th_ask_box p { font-size: 15px; }
}
@media screen and (min-width: 1024px) { .res_outer.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 2冊以上並んだとき、「資料を請求する」を下端にそろえる（説明の長さが違ってもジグザグにしない） */
.res_card:not(.is-feature) { display: flex; flex-direction: column; }
.res_card:not(.is-feature) .res_text { flex: 1; display: flex; flex-direction: column; }
.res_card:not(.is-feature) .res_more { margin-top: auto; }
/* 表紙：テーマのロゴは Hinode のロゴ（帯の中・幅34cqw）より小さく収める */
.rc_logo { max-width: 40cqw; max-height: 14cqw; height: auto; width: auto; margin-bottom: 1cqw; }
.rc_foot img { width: 44cqw; }
.rc_foot { justify-content: flex-start; padding: 0 10cqw; }
/* お問い合わせが1つだけ（英語版）のときは、枠を重ねずボタンだけを中央に */
.cta_cols.n1 { display: block; max-width: none; text-align: center; }
.cta_cols.n1 .cta_col { background: none; border: none; padding: 0; align-items: center; }
.cta_cols.n1 .cta_col h4, .cta_cols.n1 .cta_col > p { display: none; }
.cta_cols.n1 .cta_col a { margin-top: 0; padding: 17px 44px; font-size: 16px; }
/* 英語版：日本語より横に長くなるので、見出しと帯の文字を一段小さく */
html[lang="en"] .hero_catch { font-size: clamp(2rem, 1.2rem + 2.2vw, 3.25rem); line-height: 1.2; }
@media screen and (min-width: 1024px) { html[lang="en"] .stat_big { font-size: 27px; } }
/* 提供サービスのカード：4枚になったので PC は2列×2段（4列だと見出しが語の途中で折り返す） */
@media screen and (min-width: 1024px) { .svc_outer { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1220px; padding: 0; gap: 20px; } .svc_outer { row-gap: 0; } .svc_card { margin-bottom: 20px; } }
/* ABOUT の最後（Hinode Technologies の下）に置く Mission。枠は付けず、区切り線の下に文字だけ */
.jv_mission { padding-top: 18px; }
.jv_mission .cm_h { margin-bottom: 6px; font-size: 15px; }
.jv_mission .cm_text { font-size: 15px; line-height: 1.9; }
@media screen and (min-width: 1024px) { .jv_mission .cm_text { font-size: 16px; } }

/* =================================================================
   余白を詰める（サイト全体）：セクション間 170〜200px → 約100px、見出しの下 50〜56px → 32px
   ================================================================= */
section#lab, section#business, section#strengths, section#process,
section#protocol, section#executive, section#news { padding-top: 56px; padding-bottom: 20px; }
section#about { padding-bottom: 20px; }
section#company { padding-bottom: 160px; }
section#cta { padding-bottom: 56px; }
#about h3, #lab h3, #business h3, #strengths h3, #process h3,
#protocol h3, #executive h3, #news h3, #company h3 { margin-bottom: 28px; }
.jv_list > li { padding: 16px 0; }
.lab_intro { margin-bottom: 24px; }
.svc_domain { margin-top: 24px; }
.service_link.center { margin-top: 24px; }
@media screen and (min-width: 1024px) {
  section#lab, section#business, section#strengths, section#process,
  section#protocol, section#executive, section#news { padding-top: 72px; padding-bottom: 28px; }
  section#about { padding-bottom: 28px; }
  section#company { padding-bottom: 200px; }
  #about h3, #lab h3, #business h3, #strengths h3, #process h3,
  #protocol h3, #executive h3, #news h3, #company h3 { margin-bottom: 36px; }
  .jv_list > li { padding: 16px 0; }
  .svc_card, .tr_card { padding: 28px 28px; }
  .str_text { padding: 26px 30px 28px; }
  .svc_domain { margin-top: 28px; }
  .cta_box { padding: 44px 40px; }
  .lab_reports, .lab_log { padding: 24px 28px; }
}
@media screen and (min-width: 1024px) {
  .str_photo { aspect-ratio: 21 / 9; }
  .lab_reports .res_card:not(.is-feature) .res_visual { aspect-ratio: 2 / 1; }
  .lab_reports .res_card:not(.is-feature) .res_visual .rcover { width: 30%; }
}

/* 10/19 JV先の確認：帯の大きな文字は2行にしない（画面幅に合わせて縮める）／Mission の見出しを太字に */
@media screen and (min-width: 1024px) {
  .stat_big { font-size: clamp(20px, 2.1vw, 32px); white-space: nowrap; }
  html[lang="en"] .stat_big { font-size: clamp(17px, 1.75vw, 27px); }
}
.jv_mission .cm_h { font-weight: 700; font-size: 16px; }
/* スマホでも帯の大きな文字を1行に（幅の狭い端末では画面幅に合わせて縮める） */
@media screen and (max-width: 1023px) {
  .stat_big { font-size: clamp(22px, 7.4vw, 28px); white-space: nowrap; }
  html[lang="en"] .stat_big { font-size: clamp(19px, 6.2vw, 28px); }
}