/* ===== ペイント外壁塗装デモ2号（コーラル×クリーム／丸ゴシック） 共通CSS ===== */
:root{
--coral:#ef7d6c; --coral2:#e0624f; --coral-d:#c84f3d;
--cream:#fff7f1; --cream2:#faf3ec; --pink:#f7dcd4; --pink2:#fbe8e1;
--yellow:#e3b100; --yellow-d:#b88c00;
--ink:#4a4540; --gray:#7d736c; --line:#f0e3dc; --line2:#ece2da;
--soft:#fbe8c8; --soft2:#fde3da;
--shadow:0 14px 36px rgba(214,96,76,.12); --shadow-s:0 6px 18px rgba(214,96,76,.09);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans JP",sans-serif;color:var(--ink);line-height:1.85;background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.maru{font-family:"Zen Maru Gothic",sans-serif}
.wrap{width:100%;max-width:1100px;margin:0 auto;padding:0 22px}
.sec{padding:70px 0}
.sec.cream{background:var(--cream)}
.sec.gray{background:var(--cream2)}
/* 見出し（英語透かし＋コーラル小見出し＋日本語） */
.lbl{display:block;text-align:center;margin-bottom:30px;position:relative}
.lbl .e{font-family:"Zen Maru Gothic",sans-serif;display:block;color:var(--coral);font-size:13px;font-weight:700;letter-spacing:.1em}
.lbl .j{font-family:"Zen Maru Gothic",sans-serif;display:block;font-size:26px;font-weight:700;color:var(--ink);line-height:1.5;margin-top:4px}
.lbl .j .o{color:var(--coral)}
.lbl .wm{position:absolute;left:50%;top:-22px;transform:translateX(-50%);font-family:"Zen Maru Gothic",sans-serif;
font-size:64px;font-weight:700;color:rgba(239,125,108,.08);letter-spacing:.06em;white-space:nowrap;pointer-events:none;z-index:0}
.lbl .e,.lbl .j{position:relative;z-index:1}
/* ボタン */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-family:"Zen Maru Gothic",sans-serif;
border-radius:40px;padding:14px 28px;font-size:15px;transition:.2s;cursor:pointer;border:none}
.btn--cv{background:var(--coral);color:#fff;box-shadow:0 8px 20px rgba(239,125,108,.32)}
.btn--cv:hover{background:var(--coral2);transform:translateY(-2px)}
.btn--ghost{background:#fff;color:var(--coral);border:1.5px solid var(--coral)}
.btn--ghost:hover{background:var(--coral);color:#fff}
.btn--yellow{background:var(--yellow);color:#fff;box-shadow:0 8px 20px rgba(227,177,0,.3)}
.btn--yellow:hover{background:var(--yellow-d);transform:translateY(-2px)}
.btn .ico{transition:transform .2s}.btn--cv:hover .ico{transform:translateX(4px)}
/* ===== ヘッダー ===== */
header{position:sticky;top:0;z-index:60;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05)}
.htop{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;flex-direction:column;line-height:1.15}
.logo small{font-size:10px;color:var(--gray);letter-spacing:.04em}
.logo b{font-family:"Zen Maru Gothic",sans-serif;font-size:21px;font-weight:700;color:var(--coral);letter-spacing:.03em}
.hright{display:flex;align-items:center;gap:14px}
.hright .tel{text-align:right;line-height:1.1}
.hright .tel small{font-size:10px;color:var(--gray)}
.hright .tel a{font-family:"Zen Maru Gothic",sans-serif;display:flex;align-items:center;gap:5px;font-size:22px;font-weight:700;color:var(--coral)}
.hright .hcv{background:var(--coral);color:#fff;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:13px;padding:9px 16px;border-radius:24px;display:inline-flex;align-items:center;gap:6px}
.hburger{display:none;font-size:26px;color:var(--coral);background:none;border:none;cursor:pointer}
/* 口コミ帯 */
.revbar{background:var(--coral);color:#fff}
.revbar .in{display:flex;align-items:center;justify-content:space-between;padding:6px 0;font-size:12px}
.revbar .g{display:flex;align-items:center;gap:7px}
.revbar .g .gg{background:#fff;color:var(--coral);border-radius:4px;padding:1px 6px;font-weight:700;font-size:11px}
.revbar .stars{color:#ffe06b;letter-spacing:1px}
.revbar .more{opacity:.92}
.revbar a.more:hover{text-decoration:underline;opacity:1}
.phead .crumb a:hover{text-decoration:underline;color:var(--coral)}
/* ナビ */
.nav{background:#fff;border-bottom:1px solid var(--line)}
.nav .in{display:flex;gap:4px;justify-content:center;flex-wrap:wrap}
.nav a{font-family:"Zen Maru Gothic",sans-serif;font-size:14px;font-weight:500;color:var(--ink);padding:13px 16px;position:relative}
.nav a:hover,.nav a.on{color:var(--coral)}
.nav a.on::after{content:"";position:absolute;left:16px;right:16px;bottom:6px;height:2px;background:var(--coral);border-radius:2px}
/* ===== ページ見出しバナー（下層用） ===== */
.phead{position:relative;background:linear-gradient(120deg,#fdeee7,#fbe3da);overflow:hidden}
.phead .in{position:relative;z-index:1;padding:40px 0 34px}
.phead h1{font-family:"Zen Maru Gothic",sans-serif;font-size:30px;font-weight:700;color:var(--ink)}
.phead .en{display:block;color:var(--coral);font-size:13px;font-weight:700;font-family:"Zen Maru Gothic",sans-serif;letter-spacing:.1em;margin-top:3px}
.phead .crumb{font-size:12px;color:var(--gray);margin-top:8px}
.phead .wm{position:absolute;right:3%;top:50%;transform:translateY(-50%);font-family:"Zen Maru Gothic",sans-serif;
font-size:84px;font-weight:700;color:rgba(255,255,255,.6);letter-spacing:.04em;pointer-events:none}
.phead .blob{position:absolute;left:-30px;top:-20px;width:140px;height:140px;border-radius:50%;background:#fbe8c8;opacity:.55}
/* ===== ヒーロー（TOP） ===== */
.hero{position:relative;background:var(--cream);overflow:hidden}
.hero .blob1{position:absolute;top:-50px;right:-40px;width:230px;height:230px;border-radius:50%;background:var(--soft);opacity:.55}
.hero .blob2{position:absolute;bottom:-60px;left:-50px;width:200px;height:200px;border-radius:50%;background:var(--soft2);opacity:.6}
.hero .in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;padding:54px 0}
.hero .eyebrow{display:inline-block;background:#fff;color:var(--coral);border:1px solid #f6c3b9;font-family:"Zen Maru Gothic",sans-serif;
font-size:12px;font-weight:700;padding:5px 14px;border-radius:24px;margin-bottom:14px}
.hero h1{font-family:"Zen Maru Gothic",sans-serif;font-size:40px;font-weight:700;line-height:1.45;color:var(--ink)}
.hero h1 .o{color:var(--coral)}
.hero .lead{font-size:15px;color:var(--gray);line-height:1.9;margin:16px 0 22px}
.hero .lead b{color:var(--coral-d)}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .badges{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.hero .badges span{background:#fff;border:1px solid var(--line);border-radius:24px;padding:5px 13px;font-size:12px;font-weight:700;color:var(--coral-d)}
.hero .ph{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);min-height:330px}
.hero .ph img{width:100%;height:100%;min-height:330px;object-fit:cover;object-position:center 30%}
/* 実績バンド */
.stats{background:#fff}
.stats .row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stats .s{background:var(--cream);border-radius:14px;text-align:center;padding:22px 10px}
.stats .num{font-family:"Zen Maru Gothic",sans-serif;font-size:34px;font-weight:700;color:var(--coral);line-height:1}
.stats .num i{font-style:normal;font-size:16px;margin-left:2px}
.stats .cap{font-size:12px;color:var(--gray);margin-top:7px}
/* 番号付き特長 */
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.feat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 22px;display:flex;gap:16px;box-shadow:var(--shadow-s)}
.feat .no{font-family:"Zen Maru Gothic",sans-serif;font-size:32px;font-weight:700;color:var(--coral);line-height:1;flex:none}
.feat h3{font-family:"Zen Maru Gothic",sans-serif;font-size:17px;font-weight:700;color:var(--ink);margin-bottom:6px}
.feat p{font-size:13.5px;color:var(--gray)}
/* サービス3カード */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc .c{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-s);text-align:center}
.svc .c .ic{width:54px;height:54px;margin:22px auto 0;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;color:var(--coral);font-size:26px}
.svc .c h3{font-family:"Zen Maru Gothic",sans-serif;font-size:16px;font-weight:700;margin:12px 0 0}
.svc .c p{font-size:13px;color:var(--gray);padding:8px 20px 22px}
/* 施工事例カード（3列） */
.works{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.wcard{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-s);transition:.2s}
.wcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.wcard .ba{display:grid;grid-template-columns:1fr 1fr;gap:2px;position:relative}
.wcard .ba .imgw{height:120px;overflow:hidden;position:relative}
.wcard .ba .imgw img{width:100%;height:120px;object-fit:cover}
.wcard .ba .imgw.before img{filter:grayscale(.5) brightness(.8) sepia(.2)}
.wcard .ba .tg{position:absolute;top:7px;font-size:9px;font-weight:700;color:#fff;padding:2px 7px;border-radius:3px;font-family:"Zen Maru Gothic",sans-serif}
.wcard .ba .tg.b{left:7px;background:rgba(74,69,64,.85)}.wcard .ba .tg.a{right:7px;background:var(--coral)}
.wcard .bd{padding:14px 16px}
.wcard .tags{display:flex;gap:5px;margin-bottom:7px;flex-wrap:wrap}
.wcard .tags span{font-size:10px;color:var(--coral);border:1px solid #f3c7bd;border-radius:4px;padding:1px 7px}
.wcard h4{font-family:"Zen Maru Gothic",sans-serif;font-size:15px;font-weight:700;color:var(--ink)}
.wcard .meta{font-size:12px;color:var(--gray);margin-top:3px}
.wcard .price{font-family:"Zen Maru Gothic",sans-serif;color:var(--coral);font-weight:700;font-size:18px;margin-top:6px}
.wcard .price small{color:var(--gray);font-size:11px;font-weight:400}
.wcard .more{display:inline-block;margin-top:10px;font-size:12px;color:var(--coral);border:1px solid #f3c7bd;border-radius:20px;padding:6px 16px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700}
.wcard .more:hover{background:var(--coral);color:#fff;border-color:var(--coral)}
/* お客様の声 */
.voices{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.voice{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 20px;box-shadow:var(--shadow-s);position:relative}
.voice .q{font-family:"Zen Maru Gothic",sans-serif;font-size:44px;color:var(--pink);position:absolute;top:8px;right:16px;line-height:1}
.voice .stars{color:#ffb400;font-size:14px;letter-spacing:1px}
.voice p{font-size:13.5px;margin-top:8px;position:relative;z-index:1}
.voice .who{margin-top:12px;font-size:12px;color:var(--gray);display:flex;align-items:center;gap:9px;border-top:1px solid var(--line);padding-top:10px}
.voice .av{width:34px;height:34px;border-radius:50%;background:var(--pink);flex:none;display:flex;align-items:center;justify-content:center;color:var(--coral)}
/* 料金プランカード */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.plan{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-s)}
.plan .ph{color:#fff;text-align:center;padding:14px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:16px}
.plan.white .ph{background:#8a8f98}.plan.std .ph{background:#5b8fb0}.plan.prem .ph{background:var(--coral)}.plan.muki .ph{background:#2faa8e}.plan.gold .ph{background:#c8a24a}
.plan .pop{background:#fff;color:var(--coral);font-size:10px;font-weight:700;padding:2px 10px;border-radius:14px;display:inline-block;margin-bottom:4px}
.plan .bd{padding:18px 18px 22px;text-align:center}
.plan .yr{font-size:12px;color:var(--gray)}
.plan .pr{font-family:"Zen Maru Gothic",sans-serif;font-size:30px;font-weight:700;color:var(--coral);margin:6px 0}
.plan .pr small{font-size:13px;color:var(--gray)}
.plan ul{list-style:none;text-align:left;margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.plan li{font-size:12.5px;color:var(--gray);padding:3px 0;display:flex;gap:7px}
.plan li .ico{color:var(--coral);flex:none}
/* 比較表 */
.ctable{max-width:760px;margin:24px auto 0;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-s);background:#fff}
.ctable .r{display:grid;grid-template-columns:1.3fr 1fr 1.1fr}
.ctable .r>div{padding:14px 12px;border-top:1px solid var(--line);text-align:center;font-size:13px;display:flex;align-items:center;justify-content:center}
.ctable .r .it{justify-content:flex-start;font-weight:700;color:var(--ink);background:var(--cream2);font-size:13px}
.ctable .head>div{border-top:none;font-weight:700;color:#fff;background:#a39990;font-family:"Zen Maru Gothic",sans-serif}
.ctable .head .us{background:var(--coral)}
.ctable .us{background:var(--pink2);font-weight:700;color:var(--coral-d)}
.ctable .o{color:#2faa6e;font-weight:700;font-size:17px}.ctable .x{color:#c2462f;font-weight:700}
/* FAQ */
.faq{max-width:820px;margin:0 auto}
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden;box-shadow:var(--shadow-s)}
.faq summary{list-style:none;cursor:pointer;padding:18px 22px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:12px;font-size:15px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .qq{font-family:"Zen Maru Gothic",sans-serif;color:#fff;background:var(--coral);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none}
.faq summary .mk{margin-left:auto;color:var(--coral);font-size:20px;transition:transform .3s;flex:none}
.faq details[open] summary .mk{transform:rotate(45deg)}
.faq .a{padding:0 22px 20px 58px;color:var(--gray);font-size:13.5px;line-height:1.9}
.faqcat{max-width:820px;margin:0 auto 14px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--coral-d);font-size:17px;border-bottom:2px solid var(--coral);padding-bottom:8px}
.faqcat+.faq{margin-bottom:34px}
/* 施工の流れ */
.flow{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;gap:16px;align-items:center;box-shadow:var(--shadow-s)}
.step .no{font-family:"Zen Maru Gothic",sans-serif;background:var(--coral);color:#fff;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex:none}
.step h4{font-family:"Zen Maru Gothic",sans-serif;font-size:15px;font-weight:700;color:var(--ink)}
.step p{font-size:13px;color:var(--gray);margin-top:2px}
.step .ar{text-align:center;color:var(--coral);font-size:18px}
/* ===== お問い合わせ リボンパネル（共通） ===== */
.contact{background:#fff;padding:50px 0}
.cribbon{position:relative;background:var(--pink);max-width:1000px;margin:0 auto;padding:50px 30px 56px;
clip-path:polygon(0 0,50% 6%,100% 0,100% 100%,50% 94%,0 100%)}
.cribbon .e{text-align:center;color:var(--coral-d);font-family:"Zen Maru Gothic",sans-serif;font-size:12px;font-weight:700;letter-spacing:.1em}
.cribbon h2{text-align:center;font-family:"Zen Maru Gothic",sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:2px 0 6px}
.cribbon .sub{text-align:center;font-size:13px;color:var(--gray);max-width:560px;margin:0 auto 24px}
.cbtns{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:680px;margin:0 auto}
.cbtn{position:relative;border-radius:16px;padding:22px 16px 18px;text-align:center;color:#fff;display:block}
.cbtn.col{background:var(--coral)}.cbtn.yel{background:var(--yellow)}
.cbtn .rib{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:#fff;font-family:"Zen Maru Gothic",sans-serif;font-size:11px;font-weight:700;padding:3px 14px;border-radius:14px;white-space:nowrap}
.cbtn.col .rib{color:var(--coral)}.cbtn.yel .rib{color:var(--yellow-d)}
.cbtn b{font-family:"Zen Maru Gothic",sans-serif;font-size:17px;font-weight:700;display:block}
.cbtn small{font-size:12px;opacity:.95;display:block;margin-top:3px}
.cbtn .num{font-family:"Zen Maru Gothic",sans-serif;font-size:21px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:4px}
/* ===== フッター ===== */
footer{background:var(--cream2);color:var(--gray);padding:40px 0 26px;font-size:13px}
footer .ftop{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:20px}
footer .fl b{font-family:"Zen Maru Gothic",sans-serif;color:var(--coral);font-size:20px;font-weight:700}
footer .fl p{font-size:12px;margin-top:8px;line-height:1.8}
footer .fcol b{font-family:"Zen Maru Gothic",sans-serif;color:var(--ink);font-size:13px;display:block;margin-bottom:8px}
footer .fcol a{display:block;font-size:12.5px;padding:3px 0;color:var(--gray)}
footer .fcol a:hover{color:var(--coral)}
footer .copy{text-align:center;margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:11px;opacity:.8}
footer .dis{text-align:center;font-size:11px;opacity:.7;margin-top:8px}
/* アイコン */
.ico{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-.12em}
/* スマホ固定CTA */
.mobcta{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;box-shadow:0 -4px 18px rgba(0,0,0,.12);padding:8px;gap:8px}
.mobcta a{flex:1;border-radius:12px;padding:10px 4px;text-align:center;color:#fff;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:13px;display:flex;flex-direction:column;align-items:center;gap:1px}
.mobcta a small{font-size:9px;font-weight:500;opacity:.95}
.mobcta .c1{background:var(--coral);flex:1.5}.mobcta .c2{background:var(--yellow)}
/* ===== かわいい装飾パーツ ===== */
/* 手書き風マーカー下線 */
.uline{background-image:url("data:image/svg+xml;utf8,");background-repeat:repeat-x;background-position:left bottom;padding-bottom:9px}
/* 黄色マーカー下線 */
.uline-y{background-image:url("data:image/svg+xml;utf8,");background-repeat:repeat-x;background-position:left bottom;padding-bottom:8px}
/* マーカー蛍光ハイライト */
.hl{background:linear-gradient(transparent 58%,#f9c9c0 58%,#f9c9c0 92%,transparent 92%);padding:0 3px}
/* リボン見出しラベル（右に切り込み） */
.rib2{display:inline-block;background:var(--coral);color:#fff;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:15px;padding:7px 26px 7px 18px;
clip-path:polygon(0 0,100% 0,calc(100% - 13px) 50%,100% 100%,0 100%);box-shadow:3px 3px 0 #f6cabf}
.rib2.y{background:var(--yellow);box-shadow:3px 3px 0 #f3dca0}
/* 大きな透かし番号 */
.bnum{position:absolute;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:130px;line-height:.8;color:#fae7e1;z-index:0;pointer-events:none}
/* キラキラ */
.spk{color:#f4c84a;display:inline-block}
/* ハイライト・ペナント（頼んでよかった！） */
.pennant{display:inline-block;background:var(--coral);color:#fff;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;padding:6px 16px;border-radius:7px;position:relative;margin:0 4px}
.pennant::after{content:"";position:absolute;left:18px;bottom:-7px;border-width:8px 8px 0;border-style:solid;border-color:var(--coral) transparent transparent}
/* 選ばれる理由：交互の大きな番号行 */
.frow{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;margin-bottom:36px;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-s)}
.frow .fphoto{height:300px;overflow:hidden}
.frow .fphoto img{width:100%;height:100%;object-fit:cover}
.frow .fbody{position:relative;padding:30px 34px 30px 6px}
.frow:nth-child(even) .fphoto{order:2}
.frow:nth-child(even) .fbody{padding:30px 6px 30px 34px}
.frow .bnum{top:6px;right:18px;color:#fbeae3}
.frow h3{font-family:"Zen Maru Gothic",sans-serif;font-size:24px;font-weight:700;color:var(--ink);line-height:1.5;margin:14px 0 0;position:relative}
.frow p{font-size:14px;color:var(--gray);line-height:1.9;margin-top:12px;position:relative}
/* 3つのこだわりカード（写真＋番号バッジ＋マーカー） */
.ccards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.ccard{text-align:center}
.ccard .ph{position:relative;height:220px;border-radius:16px;overflow:hidden;box-shadow:var(--shadow-s)}
.ccard .ph img{width:100%;height:100%;object-fit:cover}
.ccard .nbadge{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:42px;height:42px;border:2px solid #fff;border-radius:50%;
display:flex;align-items:center;justify-content:center;color:#fff;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:17px;background:rgba(239,125,108,.25)}
.ccard .cap{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:18px;color:var(--ink);margin-top:16px;line-height:1.5}
.ccard .cap .o{color:var(--coral)}
/* 頼んでよかった！バンド */
.proudband{position:relative;background:var(--pink);text-align:center;padding:58px 0 50px;overflow:hidden}
.proudband .tornedge{position:absolute;top:-1px;left:0;width:100%;height:34px;display:block;z-index:2}
.proudband .tornedge path{fill:#fff}
.proudband .blobp{position:absolute;width:120px;height:120px;border-radius:50%;background:var(--soft);opacity:.5}
.proudband h2{font-family:"Zen Maru Gothic",sans-serif;font-size:28px;font-weight:700;color:var(--ink);position:relative;z-index:1;line-height:1.7}
.proudband p{max-width:600px;margin:18px auto 0;font-size:14px;color:#6a615b;line-height:1.95;position:relative;z-index:1}
.proudband .pennant{transform:rotate(-2.5deg);font-size:25px;padding:6px 18px;box-shadow:3px 3px 0 rgba(200,79,61,.28)}
.proudband .spkw{position:absolute;color:#fff;z-index:1;pointer-events:none}
.proudband .rollerdeco{position:absolute;left:5%;bottom:14px;width:46px;color:#fff;opacity:.85;z-index:1}
.proudband .mascotw{position:absolute;right:5%;bottom:0;width:185px;z-index:1}
.proudband .mascotchar{width:185px;height:auto;display:block;filter:drop-shadow(0 6px 10px rgba(200,79,61,.18))}
/* 30秒見積りフォーム */
.qest{background:#fdf5e0;border-radius:24px;padding:34px;display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;align-items:center;position:relative;overflow:hidden}
.qest .e{color:var(--coral);font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:12px;letter-spacing:.08em}
.qest h2{font-family:"Zen Maru Gothic",sans-serif;font-size:25px;font-weight:700;color:var(--ink);margin:4px 0 14px}
.qest .note{font-size:12px;color:var(--gray);line-height:1.8}
.qest .mascot{position:relative;margin-top:20px;width:150px}
.qest .mascot img{width:150px;height:150px;object-fit:cover;border-radius:50%;border:5px solid #fff;box-shadow:var(--shadow-s)}
.qest .bubble{position:absolute;left:-14px;top:-6px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:7px 12px;font-size:11px;font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--coral-d);box-shadow:var(--shadow-s)}
.qest .bubble::after{content:"";position:absolute;left:24px;bottom:-7px;border-width:8px 7px 0;border-style:solid;border-color:#fff transparent transparent}
.qform{background:#fff;border-radius:16px;padding:22px}
.qform .fld{display:grid;grid-template-columns:90px 1fr;gap:10px;align-items:center;margin-bottom:11px}
.qform label{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:12.5px;color:var(--ink)}
.qform label .req{color:var(--coral);font-size:10px;margin-left:3px}
.qform input{width:100%;padding:9px 11px;border:1.5px solid var(--line2);border-radius:8px;font-size:13px;font-family:inherit}
.qform .chk{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--gray)}
.qform .sub{text-align:center;margin-top:14px}
.qform .privacy{text-align:center;font-size:11px;color:var(--gray);margin-top:10px}
/* 波形の区切り */
.wave{display:block;width:100%;height:28px}
.wave path{fill:var(--pink)}
/* ===== フルブリード・ヒーロー（写真背景に載せる） ===== */
.fbhero{position:relative;color:#fff;overflow:hidden}
.fbhero .bg{position:absolute;inset:0;background:url('../img/hero.jpg') center/cover no-repeat}
.fbhero .ov{position:absolute;inset:0;background:linear-gradient(102deg,rgba(45,33,28,.62),rgba(45,33,28,.34) 52%,rgba(45,33,28,.12))}
.fbhero .in{position:relative;z-index:2;display:grid;grid-template-columns:1.4fr .6fr;gap:24px;align-items:start;padding:42px 0 60px;min-height:470px}
.fbhero .rib2{margin-bottom:14px}
.fbhero h1{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;font-size:22px;line-height:1.6;text-shadow:0 3px 12px rgba(0,0,0,.5)}
.fbhero h1 .box{background:var(--coral);padding:2px 11px;border-radius:6px;display:inline-block;box-shadow:0 3px 8px rgba(0,0,0,.28)}
.fbhero h1 .big{display:block;font-size:44px;line-height:1.32;margin-top:12px}
.fbhero h1 .y{color:#ffd24a}
.fbhero .badges3{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.fbhero .bdg{background:#fff;border-radius:16px;padding:13px 16px;color:var(--ink);text-align:center;box-shadow:0 10px 22px rgba(0,0,0,.2);min-width:128px}
.fbhero .bdg .ic{color:var(--coral);font-size:20px}
.fbhero .bdg .t{font-size:11px;color:var(--gray);margin-top:1px}
.fbhero .bdg .n{font-family:"Zen Maru Gothic",sans-serif;color:var(--coral);font-weight:700;font-size:19px;line-height:1.2}
.fbhero .bdg .n small{font-size:11px}
.fbhero .rightcol{position:relative}
.fbhero .infopanel{background:rgba(239,125,108,.94);border-radius:14px;padding:20px 22px;box-shadow:0 10px 24px rgba(0,0,0,.22)}
.fbhero .infopanel b{font-family:"Zen Maru Gothic",sans-serif;font-size:19px;display:block;line-height:1.55}
.fbhero .infopanel span{font-size:12.5px;opacity:.96;display:block;margin-top:8px;line-height:1.75}
.fbhero .ctarow{margin-top:24px}
/* NEWSバンド */
.newsband{background:#fff;border-bottom:1px solid var(--line)}
.newsband .in{display:flex;align-items:center;gap:14px;padding:12px 0;font-size:13px;flex-wrap:wrap}
.newsband .lb{font-family:"Zen Maru Gothic",sans-serif;font-weight:700;color:var(--coral);display:flex;align-items:baseline;gap:7px}
.newsband .lb .en{font-size:11px;color:var(--gray);letter-spacing:.08em}
.newsband .date{color:var(--gray);font-size:12px}
.newsband .tag{background:var(--pink);color:var(--coral-d);font-size:10px;font-weight:700;padding:2px 10px;border-radius:12px}
.newsband .txt{color:var(--ink)}
/* ===== レスポンシブ ===== */
@media(max-width:860px){
.sec{padding:48px 0}
.hright .tel,.hright .hcv{display:none}
.hburger{display:block}
.nav{display:none}
.revbar .in{font-size:11px}
.hero .in{grid-template-columns:1fr;gap:22px;padding:36px 0}
.hero h1{font-size:29px}
.lbl .j{font-size:22px}.lbl .wm{font-size:46px;top:-14px}
.stats .row{grid-template-columns:1fr 1fr}
.feats,.svc,.works,.voices,.plans{grid-template-columns:1fr}
.frow,.ccards,.qest{grid-template-columns:1fr;gap:0}
.frow:nth-child(even) .fphoto{order:0}
.frow .fbody,.frow:nth-child(even) .fbody{padding:24px}
.frow .fphoto{height:210px}
.frow h3{font-size:20px}.bnum{font-size:80px}
.ccards{gap:18px}
.proudband .mascotw{display:none}
.qest{padding:24px}.qest .mascot{margin:18px auto 0}
.qform .fld{grid-template-columns:1fr;gap:4px}
.fbhero .in{grid-template-columns:1fr;padding:28px 0 60px;min-height:0}
.fbhero h1{font-size:19px}.fbhero h1 .big{font-size:30px}
.fbhero .badges3 .bdg{flex:1;min-width:0;padding:11px 6px}
.fbhero .rightcol{margin-top:6px}
.newsband .in{font-size:12px;gap:10px}
.ctable .r>div{font-size:12px;padding:11px 7px}
.phead .wm{font-size:46px}
.cribbon{padding:40px 18px 46px;clip-path:polygon(0 0,50% 4%,100% 0,100% 100%,50% 96%,0 100%)}
.cbtns{grid-template-columns:1fr}
footer .ftop{grid-template-columns:1fr 1fr}
body{padding-bottom:74px}
.mobcta{display:flex}
}
/* ===== スマホ：ハンバーガーメニュー開閉 ===== */
@media(max-width:860px){
.nav.open{display:block;border-top:1px solid var(--line);box-shadow:0 10px 18px rgba(214,96,76,.10)}
.nav.open .in{flex-direction:column;gap:0;padding:4px 0}
.nav.open a{width:100%;text-align:left;padding:14px 22px;border-bottom:1px solid var(--line);font-size:15px}
.nav.open a:last-child{border-bottom:none}
.nav.open a.on{color:var(--coral)}
.nav.open a.on::after{display:none}
.hburger.active{color:var(--coral2)}
}