/* SPICA & CO. — site styles
   枠 (ヘッダ・本文・フッタ) は白と Spica Ink だけ。アプリ固有の色はタイルとアプリページの中だけ (--app-*)。 */
:root{
  --ink:#2B577F;        /* Spica Ink */
  --navy:#0D2A4C;       /* Deep Navy / 濃い文字 */
  --text:#0d2a4c;
  --sub:#4b6580;        /* 本文の補助 (navy の淡) */
  --face:#EAF2FB;
  --face2:#f5f9fd;
  --line:#B9CFE3;
  --white:#ffffff;
  --r-xs:3px; --r-sm:4px; --r-md:6px; --r-lg:10px; --r-xl:14px;
  --sh-1:0 1px 2px rgba(13,42,76,.06);
  --sh-2:0 6px 24px rgba(13,42,76,.08);
  --serif:'Libre Caslon Display',Georgia,serif;
  --sans:'Hiragino Kaku Gothic ProN','Hiragino Sans','Yu Gothic UI','Meiryo',sans-serif;
  --wrap:1160px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.85;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink)}
a:hover{color:var(--navy)}
.nw{white-space:nowrap}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.en{font-family:var(--serif);font-weight:400;letter-spacing:.02em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- header ---------- */
.site-head{border-bottom:1px solid var(--line);background:var(--white)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px}
.logo{display:block;padding:14px 0}
.logo img{height:22px;width:auto}
.gnav{display:flex;align-items:center;gap:28px;font-size:13.5px;letter-spacing:.04em}
.gnav a{text-decoration:none;color:var(--navy);padding:4px 0;border-bottom:1px solid transparent}
.gnav a:hover,.gnav a[aria-current="page"]{border-bottom-color:var(--ink);color:var(--ink)}
.gnav a.cta{border:1px solid var(--ink);border-radius:999px;padding:7px 18px;color:var(--ink)}
.gnav a.cta:hover,.gnav a.cta[aria-current="page"]{background:var(--ink);color:var(--white)}

/* ---------- common sections ---------- */
section{padding:88px 0}
.kicker{font-family:var(--serif);font-size:15px;letter-spacing:.14em;color:var(--ink);margin:0 0 10px;text-transform:uppercase}
h1,h2,h3{color:var(--navy);font-weight:700;line-height:1.4;margin:0}
.h-xl{font-size:56px;letter-spacing:.04em;line-height:1.25}
.h-lg{font-size:34px;letter-spacing:.03em}
.h-md{font-size:22px;letter-spacing:.02em}
.lead{font-size:16px;color:var(--sub);margin:14px 0 0}
.sub{color:var(--sub)}
.small{font-size:13px}
.btn{display:inline-block;text-decoration:none;border-radius:999px;padding:12px 30px;font-size:14px;letter-spacing:.06em;border:1px solid var(--ink);color:var(--ink);background:var(--white);line-height:1.5}
.btn:hover{background:var(--face)}
.btn.solid{background:var(--ink);color:var(--white)}
.btn.solid:hover{background:var(--navy);border-color:var(--navy);color:var(--white)}
.more{display:inline-block;font-size:14px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:2px;margin-top:16px}
.more:hover{border-bottom-color:var(--ink)}
.band{background:var(--face)}
.band2{background:var(--face2)}
.center{text-align:center}

/* ---------- top: intro ---------- */
.intro{padding:72px 0 40px}
.intro .mission{font-size:15px;color:var(--sub);margin:0 0 28px}

/* ---------- app tiles ---------- */
.tiles{display:flex;flex-direction:column;gap:18px;margin-top:22px}
.tile{position:relative;border-radius:var(--r-xl);overflow:hidden;background:var(--app-bg);color:var(--app-tx);text-decoration:none;display:grid;grid-template-columns:1fr 340px;height:300px;border:1px solid var(--app-line,transparent)}
.tile:hover{box-shadow:var(--sh-2)}
.tile .t-body{padding:28px 26px 26px;flex:1 1 56%;display:flex;flex-direction:column;min-width:0}
.tile .t-head{display:flex;align-items:center;gap:14px}
.tile .t-icon{width:60px;height:60px;border-radius:14px;background:#fff;flex:none;box-shadow:var(--sh-1);object-fit:cover}
.tile .t-name{font-size:24px;line-height:1.2;color:var(--app-tx)}
.tile .t-name.en{font-size:28px}
.tile .t-status{display:inline-block;font-size:11.5px;letter-spacing:.04em;margin-top:6px;padding:1px 9px;border-radius:999px;border:1px solid var(--app-ac);color:var(--app-ac2,var(--app-ac));background:rgba(255,255,255,.55)}
.tile .t-catch{font-size:17px;font-weight:700;line-height:1.55;margin:18px 0 8px;color:var(--app-tx)}
.tile .t-desc{font-size:13.5px;line-height:1.85;margin:0;color:var(--app-sub,var(--app-tx));opacity:.92}
.tile .t-link{margin-top:auto;padding-top:16px;font-size:13.5px;color:var(--app-ac2,var(--app-ac))}

/* app color sets (タイル・アプリページの中だけ) */
.app-mikke{--app-bg:#E4F2F2;--app-tx:#0B3B3B;--app-sub:#24504F;--app-ac:#0E8C8C;--app-ac2:#0A6E6E;--app-strong:#0C7A7A;--app-strong-tx:#fff}
.app-nazolog{--app-bg:#F7EEDB;--app-tx:#2A2110;--app-sub:#4A3D22;--app-ac:#D8A21B;--app-ac2:#8C6510;--app-strong:#F6EBD3;--app-strong-tx:#2A2110}
.app-weeklylog{--app-bg:#F4F0E6;--app-tx:#1E1F21;--app-sub:#45484D;--app-ac:#C9AE6C;--app-ac2:#7A6326;--app-strong:#F6EFDD;--app-strong-tx:#1E1F21}
.app-sento{--app-bg:#E3EBEC;--app-tx:#1E3442;--app-sub:#3A5260;--app-ac:#2F4F63;--app-ac2:#2F4F63;--app-strong:#2F4F63;--app-strong-tx:#fff}
.app-podcast{--app-bg:#17130F;--app-tx:#F1E6D3;--app-sub:#D9CCB6;--app-ac:#D9B27A;--app-ac2:#E6C796;--app-strong:#17130F;--app-strong-tx:#F1E6D3}

/* ---------- BIP band ---------- */
.bip{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;align-items:center}
.bip h2 .en{font-size:46px;color:var(--navy);display:block;line-height:1.1;font-weight:400}
.bip h2 .ja{display:block;font-size:20px;margin-top:10px}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lcard{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 20px;text-decoration:none;color:var(--text);min-height:170px}
.lcard:hover{border-color:var(--ink);box-shadow:var(--sh-1)}
.lcard .l-name{font-family:var(--serif);font-size:24px;color:var(--navy);line-height:1.2}
.lcard .l-id{font-size:12.5px;color:var(--ink);margin-top:4px;word-break:break-all}
.lcard .l-desc{font-size:13px;color:var(--sub);margin:12px 0 0;line-height:1.75}
.lcard .l-go{margin-top:auto;padding-top:12px;font-size:13px;color:var(--ink)}

/* ---------- services teaser ---------- */
.svc3{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;border-top:1px solid var(--line)}
.svc3 > div{padding:30px 28px 8px;border-left:1px solid var(--line)}
.svc3 > div:first-child{border-left:0;padding-left:0}
.num{font-family:var(--serif);font-size:30px;color:var(--ink);line-height:1;display:block;margin-bottom:12px}
.svc3 h3{font-size:20px;margin-bottom:10px}
.svc3 p{margin:0;font-size:14px;color:var(--sub)}

/* ---------- method teaser ---------- */
.steps6{display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin:40px 0 0;padding:0;list-style:none;position:relative}
.steps6::before{content:"";position:absolute;left:8%;right:8%;top:19px;border-top:1px solid var(--line)}
.steps6 li{text-align:center;position:relative;padding:0 6px}
.steps6 .dot{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--serif);font-size:16px;position:relative}
.steps6 b{display:block;margin-top:12px;font-size:15px;color:var(--navy)}
.steps6 span.d{display:block;font-size:12.5px;color:var(--sub);line-height:1.7;margin-top:4px}
.bipbar{margin-top:26px;border:1px solid var(--ink);border-radius:var(--r-md);padding:10px 16px;text-align:center;font-size:13.5px;color:var(--ink);background:var(--white)}
.bipbar .en{font-size:16px}

/* ---------- footer ---------- */
.site-foot{border-top:1px solid var(--line);padding:48px 0 40px;background:var(--white)}
.site-foot .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:start}
.site-foot .f-logo img{height:20px;width:auto;margin-top:6px}
.site-foot .f-tag{font-size:13px;color:var(--sub);border-left:1px solid var(--line);padding-left:24px;margin:0}
.site-foot nav{display:grid;grid-template-columns:repeat(2,auto);gap:6px 28px;font-size:13px}
.site-foot nav a{color:var(--navy);text-decoration:none}
.site-foot nav a:hover{color:var(--ink);text-decoration:underline}
.site-foot .copy{grid-column:1 / -1;font-size:12px;color:var(--sub);margin:12px 0 0}

/* ---------- page head (下層) ---------- */
.page-head{padding:72px 0 48px;border-bottom:1px solid var(--line)}
.page-head .lead{max-width:none}
.crumb{font-size:12.5px;color:var(--sub);margin-bottom:18px}
.crumb a{color:var(--sub)}

/* ---------- apps list ---------- */
.apps-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.apps-grid .tile{min-height:280px}

/* ---------- app page ---------- */
.app-hero{background:var(--app-strong);color:var(--app-strong-tx);padding:72px 0 0;overflow:hidden}
.app-hero .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:end}
.app-hero .h-copy{padding-bottom:72px}
.app-hero .h-catch{color:var(--app-strong-tx);font-size:44px;line-height:1.35;letter-spacing:.03em;font-weight:700;margin:0}
.app-hero h1.a-name{margin:0;color:var(--app-strong-tx);font-weight:400}
.app-hero h1.a-name.ja{font-weight:700}
.app-hero .a-id{display:flex;align-items:center;gap:16px;margin-top:30px}
.app-hero .a-id img{width:72px;height:72px;border-radius:16px;background:#fff;box-shadow:var(--sh-1)}
.app-hero .a-name{font-size:34px;line-height:1.1}
.app-hero .a-name.ja{font-size:26px;font-weight:700}
.app-hero .a-sub{margin:18px 0 0;font-size:15px;opacity:.92}
.app-hero .a-actions{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.store-btn{display:inline-block;text-decoration:none;border-radius:var(--r-md);padding:12px 22px;font-size:14px;letter-spacing:.04em;background:var(--app-strong-tx);color:var(--app-strong);border:1px solid var(--app-strong-tx);line-height:1.4}
.store-btn:hover{opacity:.88;color:var(--app-strong)}
.store-btn.ghost{background:transparent;color:var(--app-strong-tx)}
.soon{display:inline-block;border:1px solid currentColor;border-radius:var(--r-md);padding:10px 18px;font-size:14px;opacity:.9}
.h-art{padding-bottom:72px;display:flex;justify-content:center}
.h-art img{width:min(420px,100%);border-radius:var(--r-lg)}

.feature{padding:80px 0;border-bottom:1px solid var(--line)}
.feature .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.feature.rev .f-text{order:2}
.feature .f-label{display:flex;align-items:center;gap:14px;color:var(--app-ac2);font-size:14px;letter-spacing:.06em}
.feature .f-label .num{font-size:28px;margin:0;color:var(--app-ac2)}
.feature .f-label::after{content:"";width:48px;border-top:1px solid var(--app-ac2)}
.feature h2{font-size:32px;margin:18px 0 16px;letter-spacing:.03em}
.feature p{margin:0;color:var(--sub);font-size:15px}
.feature .f-img{display:flex;justify-content:center}
.feature .f-note{margin-top:14px;font-size:13px}
.note-box{background:var(--face2);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 24px;font-size:14px;color:var(--sub)}

.makers{background:var(--face);padding:64px 0}
.makers .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
.makers h2{font-size:26px;margin:6px 0 12px}
.makers p{margin:0;color:var(--sub)}
.makers .m-logo img{width:min(320px,100%);margin-left:auto}

.updates{padding:56px 0 40px}
.updates table{width:100%;border-collapse:collapse;font-size:14px;margin-top:18px}
.updates td{border-top:1px solid var(--line);padding:12px 8px;vertical-align:top}
.updates tr:last-child td{border-bottom:1px solid var(--line)}
.updates td.v{width:9em;color:var(--ink);white-space:nowrap}
.updates td.d{width:8em;text-align:right;color:var(--sub);white-space:nowrap}

.app-legal{padding:22px 0 30px;font-size:12.5px;color:var(--sub);text-align:center;border-top:1px solid var(--line)}
.app-legal a{color:var(--sub);margin:0 10px;display:inline-block}

/* ---------- prose (事務ページ・規約) ---------- */
.prose{max-width:820px;margin:0 auto;padding:56px 32px 88px}
.prose h1{font-size:30px;margin-bottom:8px}
.prose h2{font-size:19px;margin:44px 0 12px;padding-top:18px;border-top:1px solid var(--line)}
.prose h3{font-size:16px;margin:28px 0 8px}
.prose p,.prose li{font-size:14.5px}
.prose ol,.prose ul{padding-left:1.6em}
.prose li{margin:4px 0}
.prose .meta{font-size:13px;color:var(--sub);margin:0 0 28px}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:14px 0}
.prose table{border-collapse:collapse;width:100%;font-size:13.5px}
.prose .tbl-scroll table{min-width:520px}
.prose{overflow-wrap:anywhere}
.prose th,.prose td{border:1px solid var(--line);padding:9px 12px;text-align:left;vertical-align:top;line-height:1.7}
.prose th{background:var(--face);color:var(--navy)}
.prose td.k{font-weight:700;color:var(--navy);background:var(--face2)}
.prose .dates{margin-top:36px;color:var(--sub);font-size:13.5px}
.prose .src{font-size:12.5px;color:var(--sub);background:var(--face2);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;margin:0 0 28px}

.dl{display:grid;grid-template-columns:13em 1fr;border-top:1px solid var(--line);margin:24px 0 0}
.dl dt,.dl dd{margin:0;padding:16px 8px;border-bottom:1px solid var(--line);font-size:14.5px}
.dl dt{color:var(--navy);font-weight:700}
.dl dd.blank{color:var(--sub)}

/* ---------- services page ---------- */
.svc{padding:80px 0;border-bottom:1px solid var(--line)}
.svc .s-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:56px}
.svc h2{font-size:30px;margin-top:4px}
.svc .s-what{font-size:16px;color:var(--text);margin:0 0 18px}
.svc h3{font-size:16px;margin:30px 0 10px;color:var(--ink)}
.flow{list-style:none;padding:0;margin:0;counter-reset:f}
.flow li{position:relative;padding:12px 0 12px 48px;border-top:1px solid var(--line);font-size:14.5px}
.flow li:last-child{border-bottom:1px solid var(--line)}
.flow li::before{counter-increment:f;content:counter(f);position:absolute;left:4px;top:12px;width:28px;height:28px;border-radius:50%;border:1px solid var(--ink);color:var(--ink);font-family:var(--serif);font-size:14px;display:flex;align-items:center;justify-content:center;line-height:1}
.flow b{color:var(--navy)}
.outputs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.outputs > div{border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;background:var(--face2)}
.outputs b{display:block;color:var(--navy);margin-bottom:4px}
.outputs p{margin:0;font-size:13.5px;color:var(--sub)}
.bounds{border-left:3px solid var(--navy);background:#EEF1F6;padding:16px 20px;font-size:14px;margin-top:22px;color:var(--navy);border-radius:0 var(--r-md) var(--r-md) 0}
.case{border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;background:var(--white)}
.svc-main{background:var(--face2)}

/* ---------- method page ---------- */
.os-figure{margin:40px 0 0;border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;background:var(--white)}
.os-figure svg{width:100%;height:auto;display:block}
.os-figure .v{display:none}
.phase{display:grid;grid-template-columns:80px 1fr;gap:20px;padding:30px 0;border-top:1px solid var(--line)}
.phase .num{font-size:40px}
.phase h3{font-size:21px;margin:0 0 4px}
.phase .p-sub{color:var(--ink);font-size:14px;margin:0 0 10px}
.phase p{margin:0;color:var(--sub);font-size:14.5px}
.judge3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.judge3 > div{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px}
.judge3 h3{font-size:19px;margin:0 0 8px}
.judge3 p{margin:0;font-size:14px;color:var(--sub)}

/* ---------- log / now ---------- */
.now{margin-top:24px;border-top:1px solid var(--line)}
.now li{list-style:none;padding:16px 4px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:12em 1fr;gap:16px;font-size:14.5px}
.now{padding:0}
.now b{color:var(--navy)}
.updated{font-size:13px;color:var(--sub);margin-top:8px}

/* ---------- contact ---------- */
.mail-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}
.mail-list a{display:block;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px;text-decoration:none;color:var(--text);background:var(--white)}
.mail-list a:hover{border-color:var(--ink);background:var(--face2)}
.mail-list b{display:block;color:var(--navy);font-size:16px}
.mail-list span{font-size:13px;color:var(--sub)}
.addr{font-size:20px;font-family:var(--sans);color:var(--ink);word-break:break-all}

/* ================= responsive ================= */
@media (max-width:1000px){
  .h-xl{font-size:46px}
  .app-hero .h-catch{font-size:36px}
}
@media (max-width:860px){
  .wrap{padding:0 22px}
  section{padding:64px 0}
  .site-head .wrap{flex-direction:column;align-items:flex-start;gap:4px;min-height:0;padding-top:14px;padding-bottom:12px}
  .logo{padding:4px 0 6px}
  .gnav{gap:16px;flex-wrap:wrap;font-size:13px}
  .gnav a.cta{padding:4px 12px}
  .h-xl{font-size:38px}
  .h-lg{font-size:27px}
                            .bip{grid-template-columns:1fr;gap:28px}
  .bip h2 .en{font-size:36px}
  .cards3{grid-template-columns:1fr}
  .lcard{min-height:0}
  .svc3{grid-template-columns:1fr}
  .svc3 > div{border-left:0;padding:24px 0 20px;border-bottom:1px solid var(--line)}
  .steps6{grid-template-columns:repeat(3,1fr);row-gap:26px}
  .steps6::before{display:none}
  .site-foot .wrap{grid-template-columns:1fr;gap:18px}
  .site-foot .f-tag{border-left:0;padding-left:0}
  .site-foot nav{grid-template-columns:repeat(2,auto);justify-content:start}
  .page-head{padding:48px 0 36px}
  .app-hero{padding-top:48px}
  .app-hero .wrap{grid-template-columns:1fr;gap:8px}
  .app-hero .h-copy{padding-bottom:28px}
  .app-hero .h-catch{font-size:30px}
  .app-hero .a-id img{width:60px;height:60px;border-radius:14px}
  .app-hero .a-name{font-size:28px}
        .h-art{padding-bottom:48px}
  .feature{padding:56px 0}
  .feature .wrap{grid-template-columns:1fr;gap:28px}
  .feature.rev .f-text{order:0}
  .feature h2{font-size:25px}
    .makers .wrap{grid-template-columns:1fr}
  .makers .m-logo img{margin-left:0;width:200px}
  .prose{padding:40px 22px 64px}
  .prose h1{font-size:24px}
  .dl{grid-template-columns:1fr}
  .dl dt{border-bottom:0;padding-bottom:0}
  .dl dd{padding-top:4px}
  .svc .s-grid{grid-template-columns:1fr;gap:20px}
  .svc h2{font-size:25px}
  .outputs{grid-template-columns:1fr}
  .os-figure{padding:16px}
  .os-figure .h{display:none}
  .os-figure .v{display:block;max-width:420px;margin:0 auto}
  .phase{grid-template-columns:52px 1fr;gap:12px}
  .phase .num{font-size:30px}
  .judge3{grid-template-columns:1fr}
  .now li{grid-template-columns:1fr;gap:2px}
  .mail-list{grid-template-columns:1fr}
  .updates td.v{width:auto}
}
@media (max-width:400px){
  .app-hero .h-catch{font-size:25px}
  .app-hero .a-name{font-size:24px}
  .app-hero .a-name.ja{font-size:22px}
  .h-xl{font-size:34px}
  .gnav{gap:13px;font-size:12.5px}
  .tile .t-body{padding:24px 20px 22px}
  .tile .t-catch{font-size:16px}
}

/* ---------- additions ---------- */
.logo-h{margin:0;line-height:0;font-size:inherit}
a.plain{color:inherit;text-decoration:none}
a.plain:hover{color:var(--ink)}
b.ink{color:var(--navy)}
.tight-top{padding-top:56px}
.plain-list{margin:0;padding-left:1.2em}
.plain-list li{margin:0}
.svc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.svc-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 26px;text-decoration:none;color:var(--text);background:var(--white)}
.svc-card:hover{border-color:var(--ink);box-shadow:var(--sh-1)}
.svc-card h2{font-size:21px;margin:0 0 10px}
.svc-card p{margin:0;font-size:14px;color:var(--sub)}
.svc-card .more-in{margin-top:auto;padding-top:16px;font-size:13.5px;color:var(--ink)}
.succ{padding-top:24px}
.narrow{max-width:880px}
.succ .s-h{font-size:24px;margin:56px 0 16px;padding-top:28px;border-top:1px solid var(--line)}
.succ .s-h:first-child{margin-top:24px}
.succ h3{font-size:17px;margin:24px 0 6px;color:var(--ink)}
.succ p{margin:0 0 10px}
.bounds p{margin:0 0 6px}
.bounds p:last-child{margin:0}
.faq{margin:0}
.faq dt{font-weight:700;color:var(--navy);padding:16px 0 4px;border-top:1px solid var(--line)}
.faq dd{margin:0;padding:0 0 16px;color:var(--sub);font-size:14.5px}
.succ-cta{margin-top:64px;padding:40px 32px;border-radius:var(--r-xl);background:var(--face);text-align:center}
@media (max-width:860px){
  .svc-cards{grid-template-columns:1fr}
  .succ .s-h{font-size:21px;margin-top:44px}
  .succ-cta{padding:32px 20px}
}

/* ---------- app tiles: 1 アプリ 1 行・同じ型。端末は切らずに全体を見せる ---------- */
.list-h{font-size:30px;letter-spacing:.04em;margin-top:56px}
.intro .list-h:first-of-type{margin-top:8px}
.tile{height:auto!important;min-height:344px;grid-template-columns:1fr 300px;align-items:stretch}
.tile .t-body{padding:34px 36px;justify-content:center}
.tile .t-link{margin-top:22px;padding-top:0}
.t-media{display:flex;align-items:center;justify-content:center;padding:28px 0}
.t-media .phone{width:140px;flex:none}
.t-media.art{padding:0;position:relative}
.t-media.art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* 端末枠 (サイト側の CSS。ストア画像の飾りは使わない)。画面 390:844 の比を保つ */
.phone{background:#15181c;border-radius:26px;padding:7px;box-shadow:var(--sh-2)}
.phone img{width:100%;height:auto;aspect-ratio:390/844;border-radius:20px;display:block}
.app-hero{padding-bottom:64px}
.app-hero .wrap{align-items:center}
.app-hero .h-copy{padding-bottom:0}
.h-shots{display:flex;gap:18px;align-items:center;justify-content:center;height:auto;overflow:visible;padding:8px 0}
.h-shots .phone{width:30%;max-width:190px;flex:none;margin:0!important}
.h-shots .phone:nth-child(2){max-width:210px;width:33%}
.feature .f-img .phone{width:min(280px,100%)}
@media (max-width:860px){
  .list-h{font-size:24px;margin-top:44px}
  .tile{grid-template-columns:1fr;min-height:0}
  .tile .t-body{padding:26px 22px 4px}
  .t-media{padding:22px 0 26px}
  .t-media .phone{width:150px}
  .t-media.art{height:auto}
  .t-media.art img{position:static;height:auto;aspect-ratio:1/1}
  .app-hero{padding-bottom:40px}
  .app-hero .h-copy{padding-bottom:20px}
  .h-shots{gap:10px}
  .h-shots .phone{padding:4px;border-radius:16px}
  .h-shots .phone img{border-radius:12px}
  .feature .f-img .phone{width:min(230px,66%)}
}

/* ================= アプリ紹介ページ: 3 つの型 ================= */
.pill-btn{display:inline-block;border-radius:999px;padding:13px 30px;font-size:14.5px;font-weight:700;letter-spacing:.04em;text-decoration:none;background:var(--app-ac2);color:#fff;border:2px solid var(--app-ac2);line-height:1.4}
.pill-btn:hover{opacity:.9;color:#fff}
.pill-btn.ghost{background:transparent;color:var(--app-ac2)}
.pill-badge{display:inline-block;border-radius:999px;padding:6px 16px;font-size:12.5px;border:1px solid currentColor;line-height:1.4}

/* ---- Mikké: TimeTree 型 ---- */
.tt-hero{background:linear-gradient(180deg,#0A6E6E 0%,#169C96 34%,#7FD3C6 68%,#E4F6F1 100%);padding:72px 0 64px;text-align:center;color:#fff}
.tt-catch{font-size:46px;font-weight:800;line-height:1.4;letter-spacing:.04em;margin:0;color:#fff;text-shadow:0 1px 12px rgba(4,50,50,.25)}
.tt-stage{display:flex;justify-content:center;align-items:center;margin:44px auto 36px}
.tt-center{width:290px;position:relative;z-index:2}
.tt-side{width:210px;position:relative;z-index:1}
.tt-side.l{margin-right:-56px;transform:translateY(48px) rotate(-4deg)}
.tt-side.r{margin-left:-56px;transform:translateY(48px) rotate(4deg)}
.tt-stage .phone{box-shadow:0 24px 60px rgba(4,60,60,.28)}
.tt-id{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:40px}
.tt-id img{width:64px;height:64px;border-radius:15px;background:#fff;box-shadow:var(--sh-2)}
.tt-id h1{margin:0;font-size:36px;color:#0A4A4A;font-weight:400}
.tt-sub{max-width:640px;margin:14px auto 0;color:#0B3B3B;font-size:15px}
.tt-actions{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:24px;flex-wrap:wrap;color:#0A6E6E}
.tt-actions .pill-btn.on-dark{background:#0A6E6E;border-color:#0A6E6E}
.tt-cards{padding:72px 0 80px;background:#fff}
.narrow-l{max-width:1000px}
.tt-card{display:grid;grid-template-columns:1fr 280px;gap:48px;align-items:center;background:#E8F6F3;border-radius:28px;padding:48px 56px;margin-bottom:22px}
.tt-card.alt{background:#F1F8EE}
.tt-label{font-size:13px;font-weight:700;color:#0A6E6E;letter-spacing:.06em;margin:0 0 12px}
.tt-card h2{font-size:30px;line-height:1.45;margin:0 0 16px;color:#0B3B3B}
.tt-card p{margin:0;color:#24504F;font-size:15px}
.tt-shot .phone{width:100%}
.tt-note{background:#F5FAF9;border:1px solid #CDE9E3;border-radius:999px;padding:12px 24px;font-size:13.5px;color:#24504F;margin:12px 0 0;text-align:center}

/* ---- NAZOLOG.: Filmarks 型 ---- */
.fm-strip{background:#0E0E0B;color:#d9d4c4;font-size:12.5px}
.fm-strip .wrap{display:flex;justify-content:space-between;align-items:center;min-height:38px;gap:12px}
.fm-strip-r{color:#D8A21B}
.fm-hero{position:relative;overflow:hidden;background:#17150F;color:#fff;padding:64px 0}
.fm-wall{position:absolute;inset:-20px;display:grid;grid-template-columns:repeat(12,1fr);gap:10px;padding:10px;opacity:.32;transform:rotate(-4deg) scale(1.1);pointer-events:none}
.fm-card{display:block;aspect-ratio:3/4;border:2px solid #D8A21B;border-radius:4px;background:linear-gradient(180deg,#3a3326,#1f1b14);position:relative}
.fm-card i{position:absolute;top:6px;left:6px;font-style:normal;font-size:10px;padding:1px 5px;border-radius:3px;background:#D8A21B;color:#17150F}
.fm-card i.ng{background:#5B6B7A;color:#fff}
.fm-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,21,15,.9) 0%,rgba(23,21,15,.62) 55%,rgba(23,21,15,.3) 100%);pointer-events:none}
.fm-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:center}
.fm-kicker{color:#D8A21B;font-size:14px;letter-spacing:.06em;margin:0 0 14px}
.fm-catch{font-size:42px;font-weight:800;line-height:1.4;margin:0;color:#fff}
.fm-id{display:flex;align-items:center;gap:14px;margin-top:30px}
.fm-id img{width:64px;height:64px;border-radius:15px;background:#fff}
.fm-id h1{margin:0;font-size:34px;color:#fff;font-weight:400}
.fm-actions{display:flex;gap:12px;align-items:center;margin-top:26px;flex-wrap:wrap}
.pill-btn.gold{background:#D8A21B;border-color:#D8A21B;color:#17150F}
.pill-badge.gold{color:#D8A21B}
.fm-phone .phone{width:100%;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.fm-section{background:#F4F3EF;padding:56px 0 72px}
.fm-h{text-align:center;font-size:26px;color:#1A1A1A;margin:0 0 30px}
.fm-shelves{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.fm-shelf{background:#fff;border:1px solid #E0DDD3}
.fm-bar{background:#DCD9D0;color:#2a2618;text-align:center;font-size:13.5px;font-weight:700;padding:7px 10px;letter-spacing:.06em}
.fm-body{display:grid;grid-template-columns:170px 1fr;gap:24px;padding:22px;align-items:center}
.fm-body.text-only{grid-template-columns:1fr}
.fm-shot .phone{width:100%;padding:5px;border-radius:20px}
.fm-shot .phone img{border-radius:15px}
.fm-text h2{font-size:21px;line-height:1.5;margin:0 0 10px;color:#1A1A1A}
.fm-text p{margin:0;font-size:14px;color:#4A3D22}
.fm-more{display:inline-block;background:#6F6B60;color:#fff;text-decoration:none;font-size:13.5px;padding:10px 64px;border-radius:3px}
.fm-more:hover{background:#4f4c44;color:#fff}

/* ---- Weekly: LINE 型 ---- */
.ln-hero{position:relative;min-height:680px;background-size:cover;background-position:center;display:flex;align-items:flex-end;color:#fff}
.ln-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,14,8,.05) 0%,rgba(20,14,8,.15) 40%,rgba(20,14,8,.62) 100%)}
.ln-copy{position:relative;z-index:2;padding-bottom:84px;width:100%}
.ln-en{font-family:"Helvetica Neue",Arial,sans-serif;font-weight:800;font-size:76px;line-height:1.05;letter-spacing:-.01em;margin:0;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.ln-ja{font-size:24px;font-weight:700;margin:18px 0 0;color:#fff;line-height:1.6;text-shadow:0 1px 12px rgba(0,0,0,.3)}
.ln-dl{display:flex;align-items:center;gap:12px;margin-top:30px}
.ln-dl img{width:44px;height:44px;border-radius:11px;background:#fff}
.ln-dl h1{margin:0;font-size:24px;color:#fff;font-weight:400}
.ln-badge{border:1px solid rgba(255,255,255,.8);border-radius:4px;padding:4px 12px;font-size:12.5px;color:#fff}
.ln-sec{padding:120px 0;background:#fff}
.ln-sec.alt{background:#F6F1E6}
.ln-label{font-family:"Helvetica Neue",Arial,sans-serif;font-size:13px;font-weight:700;letter-spacing:.12em;color:#7A6326;margin:0 0 16px}
.ln-sec h2{font-size:44px;font-weight:800;line-height:1.4;margin:0;color:#1E1F21;letter-spacing:.02em}
.ln-p{max-width:640px;margin:22px auto 0;color:#45484D;font-size:15.5px}
.ln-shot{display:flex;justify-content:center;margin-top:52px}
.ln-shot .phone{width:300px}

@media (max-width:860px){
  .tt-hero{padding:48px 0 44px}
  .tt-catch{font-size:28px}
  .tt-stage{margin:28px auto 20px}
  .tt-center{width:170px}
  .tt-side{width:104px}
  .tt-side.l{margin-right:-26px;transform:translateY(26px) rotate(-4deg)}
  .tt-side.r{margin-left:-26px;transform:translateY(26px) rotate(4deg)}
  .tt-stage .phone{padding:5px;border-radius:20px}
  .tt-stage .tt-side .phone{padding:4px;border-radius:14px}
  .tt-stage .tt-side .phone img{border-radius:10px}
  .tt-id{margin-top:30px}
  .tt-id h1{font-size:28px}
  .tt-cards{padding:44px 0 56px}
  .tt-card{grid-template-columns:1fr;gap:26px;padding:32px 24px;border-radius:22px}
  .tt-card h2{font-size:23px}
  .tt-shot{display:flex;justify-content:center}
  .tt-shot .phone{width:min(230px,70%)}
  .tt-note{border-radius:16px}
  .fm-strip .wrap{font-size:11.5px}
  .fm-hero{padding:44px 0}
  .fm-wall{grid-template-columns:repeat(6,1fr)}
  .fm-hero::after{background:rgba(23,21,15,.78)}
  .fm-grid{grid-template-columns:1fr;gap:32px}
  .fm-catch{font-size:28px}
  .fm-id h1{font-size:28px}
  .fm-phone{display:flex;justify-content:center}
  .fm-phone .phone{width:min(220px,64%)}
  .fm-shelves{grid-template-columns:1fr}
  .fm-body{grid-template-columns:120px 1fr;gap:16px;padding:16px}
  .fm-text h2{font-size:17px}
  .ln-hero{min-height:560px}
  .ln-copy{padding-bottom:52px}
  .ln-en{font-size:44px}
  .ln-ja{font-size:18px}
  .ln-sec{padding:72px 0}
  .ln-sec h2{font-size:28px}
  .ln-shot{margin-top:36px}
  .ln-shot .phone{width:min(240px,70%)}
}

/* ================= 2026-10-22 修正: MADE BY / Mikké の淡いヒーロー / NAZOLOG. の棚 / Weekly の動き / サービスのイラスト ================= */
/* MADE BY (全アプリ共通) */
.makers{background:#fff;border-top:1px solid var(--line)}
.makers .made-by{font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:.14em;color:var(--navy);margin:0 0 14px}

/* Mikké: 淡いミントから白へ */
.tt-hero{background:linear-gradient(180deg,#CFEDE6 0%,#E3F5F0 40%,#F2FBF8 75%,#FFFFFF 100%);color:#0A5A5A}
.tt-catch{color:#0A5A5A;text-shadow:none}
.tt-stage .phone{box-shadow:0 22px 50px rgba(10,90,90,.20)}

/* NAZOLOG.: 1 機能 1 行・棚板に立つ端末 */
.fm-rows{background:#F7F3EA;padding:64px 0 24px}
.fm-sub{text-align:center;font-family:"Helvetica Neue",Arial,sans-serif;font-weight:700;font-size:12px;letter-spacing:.2em;color:#8C6510;margin:0 0 8px}
.fm-rows .fm-h{font-size:32px;margin:0 0 24px}
.fm-row{padding:44px 0}
.fm-row-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.fm-row.rev .fm-rtext{order:2}
.fm-n{font-family:var(--serif);font-size:44px;color:#D8A21B;line-height:1;display:block}
.fm-rlabel{font-size:14px;font-weight:700;color:#8C6510;letter-spacing:.08em;margin:10px 0 8px}
.fm-rtext h2,.fm-row.last h2{font-size:36px;line-height:1.4;margin:0 0 16px;color:#1A1A1A;font-weight:800}
.fm-rtext p{margin:0;color:#4A3D22;font-size:15px}
.fm-lastp{max-width:640px;margin:0 auto;color:#4A3D22;font-size:15px}
.fm-stage{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:14px;padding:0 6px 22px}
.fm-stage::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:14px;background:linear-gradient(180deg,#4a3f2c,#2a2418);border-radius:3px;box-shadow:0 10px 18px rgba(42,36,24,.25)}
.fm-rphone{width:270px;position:relative;z-index:2;flex:none}
.fm-rphone .phone{width:100%}
.fm-mini{display:flex;gap:8px;align-items:flex-end;position:relative;z-index:1}
.fm-mc{display:block;width:54px;aspect-ratio:3/4;border:2px solid #D8A21B;border-radius:4px;background:linear-gradient(180deg,#fffaf0,#f3ead6);position:relative}
.fm-mc:nth-child(2){width:62px}
.fm-mc i{position:absolute;top:5px;left:5px;font-style:normal;font-size:9px;padding:1px 4px;border-radius:3px;background:#D8A21B;color:#17150F}
.fm-mc i.ng{background:#5B6B7A;color:#fff}
.fm-row.last{padding:40px 0 72px}

/* Weekly: ヘッダの下から画面いっぱい + スクロールの動き */
.ln-hero{min-height:calc(100vh - 85px);min-height:calc(100svh - 85px);overflow:hidden;background:#2a1d12}
.ln-bgwrap{position:absolute;inset:-6% 0 0 0;will-change:transform}
.ln-bg{position:absolute;inset:0;background-size:cover;background-position:center;animation:lnZoom 26s ease-in-out infinite alternate}
@keyframes lnZoom{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.js-motion .rv{opacity:0;transform:translateY(32px);transition:opacity 1s ease,transform 1s ease}
.js-motion .rv.in{opacity:1;transform:none}
.js-motion .ln-sec .rv:nth-child(2){transition-delay:.08s}
.js-motion .ln-sec .rv:nth-child(3){transition-delay:.16s}
.js-motion .ln-sec .rv:nth-child(4){transition-delay:.24s}
.phone.cycle{position:relative}
.phone.cycle img{transition:opacity .9s ease;opacity:0}
.phone.cycle img.on{opacity:1}
.phone.cycle img:not(:first-child){position:absolute;top:7px;left:7px;width:calc(100% - 14px)}
@media (prefers-reduced-motion:reduce){
  .ln-bg{animation:none}
  .js-motion .rv{opacity:1;transform:none;transition:none}
  .phone.cycle img{transition:none}
}

/* サービス: イラストで説明する */
.il{display:block;width:100%;height:auto}
.il-head{padding-bottom:40px}
.il-head-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.il-head-img .il{max-width:520px;margin-left:auto;border-radius:var(--r-xl);background:#fff}
.ilsec{padding:24px 0 80px}
.pt-band{display:flex;align-items:stretch;border:1px solid var(--ink);border-radius:var(--r-sm);margin:64px 0 24px;font-size:18px;line-height:1.5;overflow:hidden}
.pt-band .pt-label{background:var(--ink);color:#fff;font-size:13px;letter-spacing:.08em;padding:12px 18px;display:flex;align-items:center;white-space:nowrap;font-weight:700}
.pt-band .pt-title{padding:12px 20px;color:var(--navy);flex:1;text-align:center}
.who2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.who2 > div{background:var(--face2);border-radius:var(--r-lg);padding:20px 22px}
.who2 b{color:var(--navy)}
.who2 p{margin:6px 0 0;font-size:14px;color:var(--sub)}
.pt-row{display:grid;grid-template-columns:280px 1fr;gap:36px;align-items:center}
.pt-row p{margin:0 0 10px}
.pt-il{border-radius:var(--r-lg)}
.steps4{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.steps4 li{background:var(--face2);border-radius:var(--r-lg);padding:16px 16px 20px;text-align:center;position:relative}
.steps4 .il{border-radius:var(--r-md);background:#fff;margin-bottom:12px}
.steps4 .s-n{display:inline-flex;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;align-items:center;justify-content:center;font-family:var(--serif);font-size:15px}
.steps4 b{display:block;color:var(--navy);margin:8px 0 6px;font-size:15px;line-height:1.5}
.steps4 p{margin:0;font-size:13px;color:var(--sub);line-height:1.7;text-align:left}
.flowbox{display:flex;align-items:center;gap:0;margin:24px 0}
.fb-box{flex:1;border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:18px 14px;text-align:center;background:#fff}
.fb-box.main{background:var(--ink);color:#fff}
.fb-box b{display:block;font-size:15px;color:var(--navy)}
.fb-box.main b{color:#fff}
.fb-box span{display:block;font-size:12.5px;color:var(--sub);margin-top:6px;line-height:1.6}
.fb-box.main span{color:#EAF2FB}
.fb-arrow{flex:none;width:96px;position:relative;text-align:center;font-size:11.5px;color:var(--ink)}
.fb-arrow::before{content:"";display:block;height:1.5px;background:var(--ink);margin:0 10px}
.fb-arrow::after{content:"";position:absolute;left:8px;right:8px;top:-4px;height:10px;background:linear-gradient(135deg,var(--ink) 50%,transparent 50%) left/8px 8px no-repeat,linear-gradient(-45deg,var(--ink) 50%,transparent 50%) right/8px 8px no-repeat;opacity:.9}
.fb-arrow span{display:block;margin-top:6px}
.wide-il{max-width:560px;margin:8px auto 0;border-radius:var(--r-lg)}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dodont > div{border-radius:var(--r-lg);padding:20px 24px}
.dodont .do{background:var(--face)}
.dodont .dont{background:#EEF1F6;border-left:3px solid var(--navy)}
.dodont b{display:block;color:var(--navy);font-size:16px;margin-bottom:8px}
.dodont ul{margin:0;padding-left:1.2em;font-size:14px}
.model-lead{color:var(--sub);margin:0 0 20px}
.model{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;position:relative}
.m-st{background:#fff;border:1.5px solid var(--line);border-radius:var(--r-lg);padding:14px 12px 16px;position:relative;display:flex;flex-direction:column}
.m-st:not(:last-child)::after{content:"";position:absolute;right:-11px;top:26px;width:10px;height:10px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:rotate(45deg);background:transparent;z-index:2}
.m-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.m-n{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;align-items:center;justify-content:center;font-family:var(--serif);font-size:13px;flex:none}
.m-head b{color:var(--navy);font-size:15px;line-height:1.3}
.m-st dl{margin:0 0 10px;font-size:12.5px;line-height:1.6}
.m-st dt{color:var(--ink);font-weight:700;font-size:11.5px;margin-top:8px}
.m-st dd{margin:2px 0 0;color:var(--sub)}
.m-spica{display:inline-block;margin-top:auto;font-size:11.5px;background:var(--ink);color:#fff;border-radius:999px;padding:3px 10px;line-height:1.5;align-self:flex-start}
.m-base{margin-top:14px;background:var(--face);border:1.5px dashed var(--ink);border-radius:var(--r-lg);padding:16px 20px;font-size:14px;color:var(--text);text-align:center}
.m-base b{color:var(--navy)}
.m-spica.in{margin-left:10px;vertical-align:middle}

@media (max-width:860px){
  .makers .made-by{font-size:24px}
  .fm-rows{padding:44px 0 8px}
  .fm-rows .fm-h{font-size:24px}
  .fm-row{padding:28px 0}
  .fm-row-grid{grid-template-columns:1fr;gap:24px}
  .fm-row.rev .fm-rtext{order:0}
  .fm-rtext h2,.fm-row.last h2{font-size:25px}
  .fm-n{font-size:34px}
  .fm-rphone{width:min(200px,56%)}
  .fm-mini{gap:5px}
  .fm-mc{width:30px}
  .fm-mc:nth-child(2){width:34px}
  .fm-mc i{display:none}
  .fm-mini .fm-mc:nth-child(3){display:none}
  .ln-hero{min-height:calc(100vh - 97px);min-height:calc(100svh - 97px)}
  .il-head-grid{grid-template-columns:1fr;gap:20px}
  .il-head-img .il{margin:0 auto}
  .pt-band{margin:48px 0 18px;font-size:15px}
  .pt-band .pt-label{padding:10px 12px;font-size:12px}
  .pt-band .pt-title{padding:10px 12px;text-align:left}
  .who2,.dodont{grid-template-columns:1fr}
  .pt-row{grid-template-columns:1fr;gap:16px}
  .pt-row .pt-il{max-width:260px;margin:0 auto}
  .steps4{grid-template-columns:1fr 1fr;gap:10px}
  .steps4 li{padding:12px 10px 14px}
  .flowbox{flex-direction:column}
  .fb-box{width:100%}
  .fb-arrow{width:auto;height:46px;display:flex;align-items:center;gap:8px;justify-content:center}
  .fb-arrow::before{width:1.5px;height:34px;margin:0}
  .fb-arrow::after{display:none}
  .fb-arrow span{margin:0}
  .model{grid-template-columns:1fr;gap:18px}
  .m-st:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-13px;transform:translateX(-50%) rotate(135deg)}
  .m-spica.in{margin:8px 0 0;display:inline-block}
}
.m-st .m-spica{display:block;align-self:stretch;border-radius:var(--r-md);padding:6px 10px;text-align:center;font-weight:700;font-size:12.5px}
.m-st .m-spica small{display:block;font-weight:400;font-size:10.5px;opacity:.85;letter-spacing:.04em}

/* ================= 2026-10-22 修正 (3) ================= */
/* NAZOLOG.: カードを消した棚板 / 04 のイラスト */
.fm-stage{padding:0 0 22px}
.fm-stage::after{left:12%;right:12%}
.fm-illust{display:flex;justify-content:center}
.fm-illust img{width:100%;max-width:520px;height:auto;border-radius:var(--r-xl);display:block}

/* Podcast: ラジオ局型 (太い黒枠の箱・最新回のパネル・太枠の入口・日付付きカード) */
.rd{background:#F0C27A;padding:40px 0 64px;color:#17130F}
.rd-box{background:#fff;border:4px solid #17130F;border-radius:14px;overflow:hidden}
.rd-top{display:grid;grid-template-columns:1.7fr 1fr;gap:20px}
.rd-bar{display:flex;border-bottom:4px solid #17130F}
.rd-bar-l{flex:1;background:#17130F;color:#F0C27A;font-family:"Helvetica Neue",Arial,sans-serif;font-weight:800;letter-spacing:.12em;padding:8px 16px;font-size:15px}
.rd-bar-r{padding:8px 16px;font-weight:800;font-family:"Helvetica Neue",Arial,sans-serif;font-size:15px;background:#fff}
.rd-onair-body{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:24px}
.rd-art{width:100%;height:auto;border-radius:10px;border:3px solid #17130F}
.rd-show{margin:0;font-size:13px;font-weight:700;color:#8A5A12}
.rd-ep{margin:6px 0 4px;font-size:26px;line-height:1.4;color:#17130F}
.rd-meta{margin:0;font-size:13px;color:#5a4a36}
.rd-sum{margin:10px 0 18px;font-size:14.5px;color:#3a2f22}
.rd-play{display:inline-flex;align-items:center;gap:10px;background:#17130F;color:#F0C27A;text-decoration:none;font-weight:800;border-radius:999px;padding:12px 26px 12px 18px;border:3px solid #17130F}
.rd-play:hover{background:#2d241b;color:#FFD99A}
.rd-tri{width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.rd-side-body{padding:20px 22px}
.rd-side-body h1{margin:0;font-size:24px;color:#17130F}
.rd-catch{margin:10px 0 14px;font-size:14px;color:#3a2f22;line-height:1.7}
.rd-info{margin:0;display:grid;grid-template-columns:4em 1fr;gap:6px 8px;font-size:13.5px;border-top:2px dashed #17130F;padding-top:12px}
.rd-info dt{font-weight:800}
.rd-info dd{margin:0}
.rd-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}
.rd-nav a{display:block;text-align:center;background:#fff;border:4px solid #17130F;border-radius:12px;padding:14px 8px;font-weight:800;color:#17130F;text-decoration:none;box-shadow:0 5px 0 #17130F}
.rd-nav a:hover{transform:translateY(2px);box-shadow:0 3px 0 #17130F}
.rd-sec{padding:48px 0 8px}
.rd-h{font-family:"Helvetica Neue",Arial,sans-serif;font-weight:900;font-size:34px;letter-spacing:.04em;text-align:center;margin:0 0 22px;color:#17130F}
.rd-lead{text-align:center;max-width:680px;margin:0 auto 22px;font-size:15px}
.rd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.rd-grid.three{grid-template-columns:repeat(3,1fr)}
.rd-grid.two{grid-template-columns:repeat(2,1fr);max-width:720px;margin:0 auto}
.rd-card{display:flex;flex-direction:column;background:#fff;border:4px solid #17130F;border-radius:12px;padding:16px 16px 14px;text-decoration:none;color:#17130F;min-height:170px}
a.rd-card:hover{background:#FFF6E6}
.rd-card.plain{min-height:0}
.rd-date{display:inline-block;align-self:flex-start;background:#17130F;color:#F0C27A;font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px;margin-bottom:10px}
.rd-card b{font-size:16px;line-height:1.5}
.rd-csum{font-size:13px;color:#4a3d2c;margin-top:6px;line-height:1.7}
.rd-go{margin-top:auto;padding-top:10px;font-size:13px;font-weight:800}
.rd-listen{padding:22px 24px;text-align:center}
.rd-listen p{margin:0 0 16px}

/* アプリ開発: 開発プロセスと作ったもの */
.proc6{list-style:none;padding:0;margin:16px 0 14px;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;counter-reset:none}
.proc6 li{position:relative;background:var(--face2);border-radius:var(--r-md);padding:12px 6px;text-align:center}
.proc6 li:not(:last-child)::after{content:"";position:absolute;right:-8px;top:50%;width:8px;height:8px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:translate(-2px,-50%) rotate(45deg);z-index:2}
.proc6 .p-n{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--serif);font-size:12px;align-items:center;justify-content:center}
.proc6 b{display:block;font-size:13px;color:var(--navy);margin-top:4px;line-height:1.4}
.proc6 small{display:block;font-size:11px;color:var(--sub)}
.made{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.made-card{display:flex;gap:14px;align-items:center;background:var(--app-bg);border-radius:var(--r-lg);padding:14px 16px;text-decoration:none;color:var(--app-tx)}
.made-card:hover{box-shadow:var(--sh-1)}
.made-card img{width:56px;height:56px;border-radius:13px;background:#fff;flex:none;object-fit:cover}
.mc-body{display:flex;flex-direction:column;min-width:0}
.mc-body b{font-size:16px}
.mc-desc{font-size:12.5px;line-height:1.6;opacity:.9}
.mc-st{align-self:flex-start;margin-top:6px;font-size:11px;border:1px solid var(--app-ac);color:var(--app-ac2);border-radius:999px;padding:0 8px;background:rgba(255,255,255,.6)}

/* ログ: イラストを添える */
.log-row{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-bottom:28px}
.log-row.rev > div:first-child{order:2}
.log-row p{color:var(--sub)}
.log-ils{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.log-ils.one{grid-template-columns:1fr;max-width:420px;justify-self:center}
.log-ils .il{border-radius:var(--r-lg);background:#fff}

@media (max-width:860px){
  .fm-illust img{max-width:100%}
  .rd{padding:24px 0 48px}
  .rd-top{grid-template-columns:1fr;gap:14px}
  .rd-onair-body{grid-template-columns:1fr;gap:16px;padding:18px}
  .rd-art{max-width:200px}
  .rd-ep{font-size:21px}
  .rd-nav{grid-template-columns:1fr 1fr;gap:10px}
  .rd-nav a{padding:12px 6px;font-size:14px}
  .rd-h{font-size:26px}
  .rd-grid,.rd-grid.three,.rd-grid.two{grid-template-columns:1fr}
  .rd-card{min-height:0}
  .proc6{grid-template-columns:repeat(3,1fr);row-gap:12px}
  .proc6 li:nth-child(3)::after{display:none}
  .made{grid-template-columns:1fr}
  .log-row{grid-template-columns:1fr;gap:20px}
  .log-row.rev > div:first-child{order:0}
}

/* ================= 2026-10-22 修正 (4) ================= */
/* NAZOLOG.: 棚板も消して端末だけ */
.fm-stage{padding:0}
.fm-stage::after{display:none}

/* フッタ: 右のリンクを 1 行の横並びに (特商法のリンクが増えても入る余白) */
.site-foot .wrap{grid-template-columns:auto minmax(0,1fr) auto;align-items:center}
.site-foot .f-logo img{margin-top:0}
.site-foot nav{display:flex;flex-wrap:nowrap;gap:0 22px;font-size:13px}
.site-foot nav a{white-space:nowrap}
@media (max-width:1100px){
  .site-foot .wrap{grid-template-columns:auto 1fr}
  .site-foot nav{grid-column:1 / -1}
}
@media (max-width:860px){
  .site-foot .wrap{grid-template-columns:1fr}
  .site-foot nav{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;grid-column:auto}
}

/* 線画アイコン */
.ico{width:24px;height:24px;display:block;flex:none}
.ico.lg{width:30px;height:30px}
.ico-badge{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:var(--face);border:1px solid var(--line);margin-bottom:10px}
.ico-badge.lg{width:56px;height:56px}
.ico-badge.lg .ico{width:28px;height:28px}
.ico-strip{list-style:none;padding:0;margin:36px 0 0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.ico-strip li{text-align:center;display:flex;flex-direction:column;align-items:center}
.ico-strip b{color:var(--navy);font-size:15px}
.ico-strip small{color:var(--sub);font-size:12px}
.who-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
.who-row > div{display:flex;gap:14px;align-items:flex-start;background:var(--face2);border-radius:var(--r-lg);padding:16px 18px}
.who-row p{margin:0;font-size:13.5px;color:var(--sub);line-height:1.7}
.who-row b{display:block;color:var(--navy);font-size:15px}
.judge3 .num{display:inline-block;margin-left:8px;vertical-align:top}
.ph-ico{display:flex;flex-direction:column;align-items:center;gap:2px}
.phase{grid-template-columns:90px 1fr}
.phase .ph-ico .num{font-size:22px}

/* お問い合わせ: 用件の select */
.ct-form{margin:24px 0 8px;background:var(--face2);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px}
.ct-label{display:block;font-weight:700;color:var(--navy);margin-bottom:10px}
.ct-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.ct-select{flex:1 1 280px;min-width:0;font:inherit;font-size:15px;color:var(--text);padding:12px 40px 12px 14px;border:1px solid var(--ink);border-radius:var(--r-md);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B577F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/18px;appearance:none;-webkit-appearance:none}
.ct-go{white-space:nowrap}
.ct-go.is-off{opacity:.4;pointer-events:auto;cursor:not-allowed}
.ct-note{margin:12px 0 0}

/* ログ: Instagram・X を独立した節に */
.sns{padding:56px 0;border-top:1px solid var(--line)}
.sns-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.sns-logo{width:48px;height:48px;color:#0D2A4C;flex:none}
.sns-name{margin:0;font-size:28px;color:var(--navy);font-family:var(--serif);font-weight:400}
.sns-id{margin:0;color:var(--ink);font-size:14px}
.sns-follow{margin-left:auto;display:inline-block;background:var(--ink);color:#fff;text-decoration:none;border-radius:999px;padding:12px 30px;font-weight:700;font-size:14.5px;white-space:nowrap}
.sns-follow:hover{background:var(--navy);color:#fff}
.sns-desc{margin:16px 0 0;color:var(--sub)}
.sns-embeds{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-top:22px}
.sns-note{padding:8px 0 72px}
.sns-note .lcard{max-width:420px}

@media (max-width:860px){
  .ico-strip{grid-template-columns:repeat(3,1fr);row-gap:18px}
  .who-row{grid-template-columns:1fr}
  .phase{grid-template-columns:64px 1fr}
  .ico-badge.lg{width:48px;height:48px}
  .ct-form{padding:18px 16px}
  .ct-go{width:100%;text-align:center}
  .sns{padding:44px 0}
  .sns-follow{margin-left:0;width:100%;text-align:center}
}
[hidden]{display:none!important}

/* ログ: SNS 3 つを 1 つのまとまりに (1 行の横並び・細い罫線) */
.sns-list{margin-top:8px;border-top:1px solid var(--line);margin-bottom:24px}
.sns-row{border-bottom:1px solid var(--line);padding:22px 0}
.sns-line{display:grid;grid-template-columns:40px auto minmax(0,1fr) auto;align-items:center;gap:0 20px}
.sns-row .sns-logo{width:36px;height:36px;color:#0D2A4C}
.sns-who{display:flex;align-items:baseline;gap:10px;white-space:nowrap}
.sns-row .sns-name{margin:0;font-family:var(--serif);font-weight:400;font-size:24px;color:var(--navy);line-height:1.2}
.sns-row .sns-id{color:var(--ink);font-size:13.5px}
.sns-row .sns-desc{margin:0;color:var(--sub);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sns-row .sns-follow{margin:0;padding:9px 22px;font-size:13.5px}
.sns-row .sns-embeds{margin-top:18px}
@media (max-width:860px){
  .sns-row{padding:18px 0}
  .sns-line{grid-template-columns:32px minmax(0,1fr) auto;gap:6px 12px}
  .sns-row .sns-logo{width:30px;height:30px}
  .sns-who{flex-direction:column;align-items:flex-start;gap:0}
  .sns-row .sns-name{font-size:20px}
  .sns-row .sns-id{font-size:12px}
  .sns-row .sns-logo{grid-column:1;grid-row:1}
  .sns-who{grid-column:2;grid-row:1}
  .sns-row .sns-follow{grid-column:3;grid-row:1;width:auto;padding:8px 16px;font-size:13px}
  .sns-row .sns-desc{grid-column:1 / -1;grid-row:2;font-size:12.5px;margin-top:8px}
}

/* トップ: サービスをアプリと同じ型の全幅タイルで (色はサイト共通の白と青) */
.top-svc{padding:24px 0 88px}
.svc-tile{--app-bg:#F5F9FD;--app-tx:#0d2a4c;--app-sub:#4b6580;--app-ac:#2B577F;--app-ac2:#2B577F;--app-line:#B9CFE3}
.svc-tile:hover{border-color:#2B577F}
.svc-tile .svc-n{font-family:var(--serif);font-size:30px;color:#2B577F;line-height:1;margin-bottom:10px;display:block}
.svc-tile .t-name{font-size:24px;font-weight:700;color:#0d2a4c;line-height:1.35}
.svc-tile .t-desc{margin-top:10px;font-size:14px}
.svc-tile .t-link{margin-top:18px;color:#2B577F}
.svc-il{padding:20px 24px;background:#fff}
.svc-il img{width:100%;height:100%;max-height:260px;object-fit:contain;display:block}
@media (max-width:860px){
  .top-svc{padding:8px 0 64px}
  .svc-tile .t-name{font-size:20px}
  .svc-il{height:220px;padding:14px 18px}
}

/* ================= About ================= */
.ab-head{padding:64px 0 48px}
.ab-head-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.ab-catch{font-size:22px;font-weight:700;color:var(--ink);margin:14px 0 0;line-height:1.6}
.ab-two{display:grid;gap:14px}
.ab-card{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px;text-decoration:none;color:var(--text)}
.ab-card:hover{border-color:var(--ink);box-shadow:var(--sh-1)}
.ab-card .kicker{margin:0}
.ab-card b{font-size:20px;color:var(--navy)}
.ab-card span{font-size:14px;color:var(--sub)}
.ab-card .more-in{color:var(--ink);margin-top:6px}
#company .dl{margin-top:20px}
.ab-h3{font-size:16px;margin:32px 0 6px;color:var(--navy)}
#log,#company,#channels,#now,#co{scroll-margin-top:24px}

/* ================= みんなの声 ================= */
.vc-hero{background:linear-gradient(180deg,#EAF2FB 0%,#F5F9FD 70%,#fff 100%);padding:64px 0 48px;border-bottom:1px solid var(--line)}
.vc-hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:48px;align-items:center}
.vc-catch{font-size:26px;font-weight:800;color:var(--navy);line-height:1.55;margin:14px 0 0}
.vc-flow{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.vc-flow li{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 8px;text-align:center}
.vc-flow li:not(:last-child)::after{content:"";position:absolute;right:-8px;top:50%;width:8px;height:8px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:translate(-2px,-50%) rotate(45deg);z-index:2}
.vc-flow b{display:block;font-size:13.5px;color:var(--navy)}
.vc-flow span{display:block;font-size:11.5px;color:var(--sub);line-height:1.5}
.vc-os{margin:16px 0 0;font-size:13.5px;color:var(--sub)}
.vc-il .il{max-width:440px;margin-left:auto;border-radius:var(--r-xl);background:#fff;border:1px solid var(--line)}
.vc-form-sec{padding:64px 0 40px}
.vc-form{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:28px 30px;box-shadow:var(--sh-2)}
.vc-row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vc-field{display:block;margin-bottom:18px}
.vc-label{display:flex;align-items:baseline;gap:8px;font-weight:700;color:var(--navy);font-size:14.5px;margin-bottom:6px}
.vc-label em{font-style:normal;font-size:11px;font-weight:700;color:#fff;background:var(--ink);border-radius:999px;padding:1px 8px}
.vc-label small{font-weight:400;color:var(--sub);font-size:12px}
.vc-form select,.vc-form textarea,.vc-form input[type=text]{width:100%;font:inherit;font-size:15px;color:var(--text);border:1px solid var(--line);border-radius:var(--r-md);padding:11px 13px;background:#fff}
.vc-form select{appearance:none;-webkit-appearance:none;padding-right:40px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B577F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/18px}
.vc-form textarea{resize:vertical;min-height:140px;line-height:1.7}
.vc-form select:focus,.vc-form textarea:focus,.vc-form input:focus{outline:2px solid var(--ink);outline-offset:1px;border-color:var(--ink)}
.vc-check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--text);cursor:pointer;margin:4px 0 18px}
.vc-check input{width:18px;height:18px;margin-top:3px;accent-color:#2B577F;flex:none}
.vc-notes{background:var(--face2);border-radius:var(--r-md);padding:12px 16px;font-size:13px;color:var(--sub)}
.vc-notes p{margin:2px 0}
.vc-submit{margin:22px 0 0;text-align:center}
.vc-submit .btn{font-size:15px;padding:13px 40px;cursor:pointer;font-family:inherit}
.vc-board{padding:56px 0 88px;background:var(--face2);border-top:1px solid var(--line)}
.vc-board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.vc-filter{display:flex;gap:8px;flex-wrap:wrap}
.vc-filter button{font:inherit;font-size:13px;border:1px solid var(--ink);color:var(--ink);background:#fff;border-radius:999px;padding:6px 14px;cursor:pointer}
.vc-filter button[aria-pressed="true"]{background:var(--ink);color:#fff}
.vc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.vc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;display:flex;flex-direction:column}
.vc-meta{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:12px;color:var(--sub);align-items:center}
.vc-st{font-weight:700;border-radius:999px;padding:1px 10px;border:1px solid var(--ink);color:var(--ink)}
.vc-st.st-3{background:var(--ink);color:#fff}
.vc-date{margin-left:auto}
.vc-text{margin:12px 0 6px;font-size:15px;color:var(--text);line-height:1.75}
.vc-nick{margin:0;font-size:12.5px;color:var(--sub)}
.vc-reply{margin-top:12px;border-left:3px solid var(--line);padding:4px 0 4px 12px}
.vc-reply b{font-size:12.5px;color:var(--ink)}
.vc-reply p{margin:2px 0 0;font-size:13.5px;color:var(--sub)}
.vc-empty{background:#fff;border:1.5px dashed var(--line);border-radius:var(--r-xl);padding:48px 24px;text-align:center}
.vc-empty-t{font-size:20px;font-weight:700;color:var(--navy);margin:0 0 6px}
.vc-empty p{margin:0 0 6px;color:var(--sub)}
.vc-empty .btn{margin-top:14px}
.vc-thanks{text-align:center}

@media (max-width:860px){
  .ab-head{padding:44px 0 32px}
  .ab-head-grid{grid-template-columns:1fr;gap:24px}
  .ab-catch{font-size:18px}
  .vc-hero{padding:44px 0 32px}
  .vc-hero-grid{grid-template-columns:1fr;gap:24px}
  .vc-catch{font-size:20px}
  .vc-flow{grid-template-columns:1fr 1fr;gap:10px}
  .vc-flow li:not(:last-child)::after{display:none}
  .vc-il .il{margin:0 auto;max-width:300px}
  .vc-form{padding:20px 16px}
  .vc-row2{grid-template-columns:1fr;gap:0}
  .vc-cards{grid-template-columns:1fr}
  .vc-empty{padding:36px 18px}
}
/* ヘッダのナビが 6 つになったので、狭い幅で詰める */
@media (max-width:1100px){ .gnav{gap:20px} }
@media (max-width:860px){ .gnav{gap:12px 14px;font-size:12.5px} }
@media (max-width:400px){ .gnav{gap:10px 11px;font-size:12px} .gnav a.cta{padding:3px 10px} }

/* ================= 2026-10-22 レビュー対応 ================= */
/* ヘッダ (860px 以下): 1 行目 = ロゴとお問い合わせ、2 行目 = ナビ 5 項目を均等に。押せる高さ 40px 以上 */
@media (max-width:860px){
  .site-head .wrap{position:relative;padding-top:10px;padding-bottom:4px;gap:6px}
  .logo{padding:10px 0;min-height:40px;display:flex;align-items:center}
  .gnav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;gap:0;font-size:12.5px}
  .gnav a{display:flex;align-items:center;justify-content:center;min-height:42px;padding:0 2px;white-space:nowrap;border-bottom-width:2px}
  .gnav a.cta{position:absolute;right:22px;top:10px;min-height:40px;padding:0 16px;border-radius:999px;border-bottom-width:1px}
}
@media (max-width:400px){
  .gnav{font-size:12px}
  .gnav a.cta{padding:0 12px}
}
/* みんなの声: 流れの番号。375px では縦 1 列 */
.vc-flow i{display:inline-flex;width:20px;height:20px;border-radius:50%;background:var(--ink);color:#fff;font-style:normal;font-family:var(--serif);font-size:11px;align-items:center;justify-content:center;margin-bottom:4px}
@media (max-width:860px){
  .vc-flow{grid-template-columns:1fr;gap:8px}
  .vc-flow li{display:grid;grid-template-columns:24px auto 1fr;align-items:center;gap:10px;text-align:left;padding:8px 12px}
  .vc-flow i{margin:0}
  .vc-flow b{font-size:14px}
  .vc-flow span{font-size:12.5px}
  .vc-flow li:not(:last-child)::after{display:block;right:auto;left:22px;top:auto;bottom:-6px;transform:rotate(135deg);width:7px;height:7px}
}
.vc-count{margin-left:auto;font-variant-numeric:tabular-nums}

/* みんなの声のヒーロー: イラストなし。見出しは 1440px で 1 行、流れは横いっぱい */
.vc-hero-one{max-width:var(--wrap)}
.vc-hero-one .vc-catch{font-size:28px;white-space:nowrap;letter-spacing:.01em}
.vc-hero-one .lead{max-width:none}
.vc-hero-one .vc-flow{margin-top:30px;gap:14px}
.vc-hero-one .vc-flow li{padding:14px 10px}
.vc-hero-one .vc-flow b{font-size:15px}
.vc-hero-one .vc-flow span{font-size:12.5px}
.vc-hero-one .vc-flow li:not(:last-child)::after{right:-11px}
@media (max-width:1100px){ .vc-hero-one .vc-catch{font-size:23px} }
@media (max-width:860px){
  .vc-hero-one .vc-catch{font-size:20px;white-space:normal}
  .vc-hero-one .vc-flow li{padding:8px 12px}
  .vc-hero-one .vc-flow li:not(:last-child)::after{right:auto}
}

/* みんなの声のヒーロー: 見出しは全幅で 1 行、その下に 左=導入文 / 右=イラスト */
.vc-hero .vc-catch{font-size:28px;white-space:nowrap;letter-spacing:.01em}
.vc-hero .vc-hero-grid{margin-top:18px;grid-template-columns:1.1fr 1fr;align-items:center}
.vc-hero .vc-hero-grid .lead{margin-top:0}
.vc-hero .vc-il .il{max-width:480px}
@media (max-width:1100px){ .vc-hero .vc-catch{font-size:23px} }
@media (max-width:860px){
  .vc-hero .vc-catch{font-size:20px;white-space:normal}
  .vc-hero .vc-hero-grid{grid-template-columns:1fr;gap:20px}
}

/* ================= 横幅の統一: 節の外枠は全ページ基準の幅 (.wrap = 最大 1160px・左右 32px)。読み物の本文だけを狭める ================= */
.narrow,.narrow-l{max-width:var(--wrap)}
.prose{max-width:var(--wrap);padding-left:32px;padding-right:32px}
.prose > p,.prose > ul,.prose > ol,.prose > .tbl-scroll,.prose > table,.prose > dl,.prose > .mail-list,.prose > .ct-form,.prose > .meta{max-width:860px}
.vc-form{max-width:860px;margin-left:auto;margin-right:auto}
.vc-form-sec .h-md{margin-bottom:0;text-align:center}
.vc-hero-cta{margin:20px 0 0}
.vc-notes{list-style:disc;margin:0;padding:12px 16px 12px 34px}
.vc-notes li{margin:3px 0;line-height:1.7}
/* 「◯◯を見る →」型のリンクは 1 つの塊にして、矢印だけが次の行に落ちないように */
.more,.more-in,.t-link,.l-go,.sns-follow,.btn,.pill-btn,.store-btn,.rd-play,.fm-more{white-space:nowrap}
.lead,.vc-os,.km{word-break:auto-phrase}
@media (max-width:860px){
  .prose{padding-left:22px;padding-right:22px}
}

/* About の冒頭: 入口カードを外したので 1 段。文字の幅だけ読みやすく */
.ab-head-one .lead,.ab-head-one .ab-catch{max-width:860px}
.ab-head{padding:64px 0 56px}

/* ================= サービスのサマリ (/services/) ================= */
.sv-hero{background:linear-gradient(180deg,#EAF2FB 0%,#F5F9FD 70%,#fff 100%);padding:64px 0 56px;border-bottom:1px solid var(--line)}
.sv-hero-grid{display:grid;grid-template-columns:1fr;gap:28px}
.sv-catch{font-size:30px;font-weight:800;color:var(--navy);margin:14px 0 0;line-height:1.45}
.sv-note{font-size:13.5px;color:var(--sub);margin:12px 0 0}
.sv-hero-il .il{width:100%;border-radius:var(--r-xl);background:#fff;border:1px solid var(--line)}
.sv-bands{padding:64px 0 40px}
.sv-band{display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center;padding:36px 36px;margin-bottom:22px;border:1px solid var(--line);border-radius:var(--r-xl);background:#fff;text-decoration:none;color:var(--text)}
.sv-band:hover{border-color:var(--ink);box-shadow:var(--sh-2)}
.sv-band.rev .sv-media{order:2}
.sv-media{display:grid;gap:12px}
.sv-media.duo{grid-template-columns:1fr 1fr}
.sv-media .il{width:100%;height:100%;object-fit:contain;border-radius:var(--r-lg);background:var(--face2)}
.sv-media.one .il{max-height:320px}
.sv-text .num{font-size:34px}
.sv-text h2{font-size:28px;margin:6px 0 10px;color:var(--navy)}
.sv-short{margin:0;color:var(--sub);font-size:15px}
.sv-items{margin:16px 0 18px;padding:0;list-style:none}
.sv-items li{position:relative;padding:7px 0 7px 22px;border-top:1px solid var(--line);font-size:14.5px;color:var(--navy)}
.sv-items li:last-child{border-bottom:1px solid var(--line)}
.sv-items li::before{content:"";position:absolute;left:4px;top:15px;width:8px;height:8px;border-radius:50%;border:2px solid var(--ink)}
.sv-text .more-in{color:var(--ink);font-size:14.5px;font-weight:700}
.sv-link{padding:64px 0}
.sv-chain{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.sv-chain li{position:relative}
.sv-chain li:not(:last-child)::after{content:"";position:absolute;right:-20px;top:50%;width:12px;height:12px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:translateY(-50%) rotate(45deg)}
.sv-chain a{display:flex;flex-direction:column;gap:4px;height:100%;background:#fff;border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:20px 22px;text-decoration:none;color:var(--text)}
.sv-chain a:hover{background:var(--face)}
.sv-chain .num{font-size:24px}
.sv-chain b{font-size:18px;color:var(--navy)}
.sv-chain span:last-child{font-size:13.5px;color:var(--sub)}
.sv-flow-sec{padding:64px 0}
.sv-flow{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sv-flow li{position:relative;background:var(--face2);border-radius:var(--r-lg);padding:22px 20px;text-align:center}
.sv-flow li:not(:last-child)::after{content:"";position:absolute;right:-12px;top:44px;width:9px;height:9px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:rotate(45deg);z-index:2}
.sv-fn{display:block;font-family:var(--serif);font-size:15px;color:var(--ink)}
.sv-flow b{display:block;font-size:16px;color:var(--navy);margin:2px 0 6px}
.sv-flow p{margin:0;font-size:13.5px;color:var(--sub);text-align:left}
.sv-cta{padding:8px 0 80px}
.sv-cta-box{background:var(--face);border-radius:var(--r-xl);padding:44px 32px;text-align:center}
@media (max-width:860px){
  .sv-hero{padding:44px 0 36px}
  .sv-hero-grid{grid-template-columns:1fr;gap:24px}
  .sv-catch{font-size:23px}
  .sv-bands{padding:40px 0 20px}
  .sv-band{grid-template-columns:1fr;gap:20px;padding:22px 18px}
  .sv-band.rev .sv-media{order:0}
  .sv-text h2{font-size:22px}
  .sv-chain{grid-template-columns:1fr;gap:26px}
  .sv-chain li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-19px;transform:translateX(-50%) rotate(135deg)}
  .sv-flow{grid-template-columns:1fr 1fr;gap:12px}
  .sv-flow li::after{display:none}
  .sv-flow li{padding:16px 12px}
  .sv-cta-box{padding:32px 18px}
}

/* アプリ開発: 参考アウトプット (5 つの神器の一部) */
.jg-h{font-size:19px;color:var(--navy);margin:0 0 8px}
.jg-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:20px}
.jg-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column}
.jg-card:first-child{grid-column:1 / -1}
.jg-img{background:var(--face2);border-bottom:1px solid var(--line);padding:14px;display:flex;align-items:center;justify-content:center}
.jg-img img{width:100%;height:auto;max-height:420px;object-fit:contain;border-radius:var(--r-sm);background:#fff}
.jg-card figcaption{padding:14px 18px 16px}
.jg-card b{display:block;font-size:16px;color:var(--navy)}
.jg-card figcaption span{display:block;font-size:13.5px;color:var(--sub);margin-top:4px}
@media (max-width:860px){ .jg-grid{grid-template-columns:1fr} }

/* 参考アウトプット: 1 行ずつ、左に画像・右に説明 */
.jg-list{display:flex;flex-direction:column;gap:18px;margin-top:20px}
.jg-row{margin:0;display:grid;grid-template-columns:1.25fr 1fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.jg-row .jg-img{border-bottom:0;border-right:1px solid var(--line)}
.jg-row .jg-img img{max-height:340px}
.jg-row figcaption{padding:22px 24px;display:flex;flex-direction:column;justify-content:center}
.jg-row b{font-size:18px;color:var(--navy)}
.jg-q{display:block;font-size:14px;color:var(--ink);font-weight:700;margin-top:6px;line-height:1.6}
.jg-row p{margin:10px 0 0;font-size:14px;color:var(--sub);line-height:1.8}
@media (max-width:860px){
  .jg-row{grid-template-columns:1fr}
  .jg-row .jg-img{border-right:0;border-bottom:1px solid var(--line)}
  .jg-row figcaption{padding:16px 18px}
}

/* アプリ開発のヒーロー（イラスト無し）を低くする */
.page-head.svc-compact{padding:28px 0 26px}
.page-head.svc-compact>.wrap{display:grid;grid-template-columns:1fr auto;column-gap:40px;align-items:center}
.page-head.svc-compact>.wrap>*{grid-column:1}
.page-head.svc-compact .crumb{margin:0 0 6px}
.page-head.svc-compact .kicker{margin:0 0 2px}
.page-head.svc-compact .h-lg{margin:0 0 6px}
.page-head.svc-compact .lead{margin:0}
.page-head.svc-compact>.wrap>p[style*="margin-top"]{grid-column:2;grid-row:1/span 4;margin:0!important}
@media (max-width:860px){.page-head.svc-compact{padding:22px 0 20px}.page-head.svc-compact>.wrap{display:block}.page-head.svc-compact>.wrap>p[style*="margin-top"]{margin-top:14px!important}}