/* CORDIAL top page — all rules scoped under .cdl */
.cdl-page{overflow-x:hidden}
.cdl{width:100vw;margin-left:calc(50% - 50vw);margin-top:-1px;font-family:var(--sans);color:var(--ink);line-height:1.9;text-align:left}
.cdl *{box-sizing:border-box}
.cdl a{text-decoration:none;color:inherit}
/* SWELL の本文装飾を打ち消す（!important は意図的） */
.cdl h2,.cdl h3,.cdl p,.cdl table,.cdl th,.cdl td,.cdl tr{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.cdl h2,.cdl h3{padding:0!important;color:inherit}
.cdl h2::before,.cdl h2::after,.cdl h3::before,.cdl h3::after{content:none!important;display:none!important}
.cdl p{margin:0 0 20px}
.cdl .hd2 h2{margin:10px 0 0}
.cdl .card h3{margin:14px 0 12px}
.cdl table{border-collapse:collapse;width:100%;background:#fff!important;margin:0}
.cdl th,.cdl td{border-bottom:1px solid var(--line)!important}
.cdl img{max-width:100%;height:auto}
.cdl button{font-family:inherit}
.cdl{
  --ink:#1c1d21; --ink2:#4a4c54; --line:#dcdad4; --bg:#f6f4ef; --white:#fff; --gold:#0a5fb4; --navy:#10245e;
  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --en:"Helvetica Neue",Arial,sans-serif;
}
.cdl{font-family:var(--sans);color:var(--ink);background:var(--white);line-height:1.9;-webkit-font-smoothing:antialiased}
.cdl a{color:inherit;text-decoration:none}
.cdl .wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.cdl /* header */
header{position:fixed;top:30px;left:0;right:0;z-index:50;transition:.4s;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);box-shadow:0 1px 0 var(--line)}
.cdl /* placeholder photo */
.ph{position:absolute;inset:0;background-size:cover;background-position:center}
.cdl .ph::after{content:attr(data-l);position:absolute;right:18px;bottom:14px;font:10px/1 var(--en);letter-spacing:.2em;color:rgba(255,255,255,.55)}
.cdl .p1{background:linear-gradient(135deg,#0c1c4d 0%,#14449a 55%,#4fb4ea 100%)}
.cdl .p2{background:linear-gradient(160deg,#25211b 0%,#5a4a33 55%,#c2a76c 100%)}
.cdl .p3{background:linear-gradient(120deg,#1c1d21 0%,#434650 60%,#9a9ca5 100%)}
.cdl .p4{background:linear-gradient(145deg,#1f2b2a 0%,#3d5654 60%,#9bb3ae 100%)}
.cdl .p5{background:linear-gradient(150deg,#2b1f26 0%,#5c4252 60%,#b89aab 100%)}
.cdl .bld{position:absolute;inset:0;opacity:.16;background-image:
 linear-gradient(90deg,#fff 1px,transparent 1px),linear-gradient(0deg,#fff 1px,transparent 1px);background-size:64px 80px;
 -webkit-mask-image:linear-gradient(0deg,#000 10%,transparent 85%);mask-image:linear-gradient(0deg,#000 10%,transparent 85%)}
.cdl .im1{background-image:url(img/photo1.jpg)}
.cdl .im2{background-image:url(img/photo2.jpg)}
.cdl .im3{background-image:url(img/photo3.jpg)}
.cdl .im4{background-image:url(img/photo4.jpg)}
.cdl .im5{background-image:url(img/photo5.jpg)}
.cdl .im6{background-image:url(img/photo6.jpg)}
.cdl .im6.pos{background-position:30% center}
.cdl .cta::before{content:"";position:absolute;inset:0;background:rgba(16,36,94,.58);z-index:1}
.cdl .cta .ph{opacity:1}
.cdl /* hero */
.hero{position:relative;height:100vh;min-height:620px;overflow:hidden;background:#111}
.cdl .hero .s{position:absolute;inset:0;opacity:0;transition:opacity 1.8s ease}
.cdl .hero .s.on{opacity:3}
.cdl .hero .s .ph{animation:kb 14s ease-out forwards;transform:scale(1)}
@keyframes kb{to{transform:scale(1.12)}}
.cdl .hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.1) 40%,rgba(0,0,0,.5))}
.cdl .hero .copy{position:absolute;z-index:3;left:0;right:0;bottom:16vh;color:#fff}
.cdl .hero .en{font-family:var(--en);letter-spacing:.5em;font-size:12px;opacity:.85}
.cdl .hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(28px,4.6vw,56px);letter-spacing:.14em;line-height:1.6;margin:18px 0 20px}
.cdl .hero p{font-size:14px;letter-spacing:.12em;opacity:.9}
.cdl .dots{position:absolute;z-index:3;right:28px;bottom:16vh;display:flex;flex-direction:column;gap:12px}
.cdl .dots i{width:1px;height:28px;background:rgba(255,255,255,.35);display:block;transition:.5s}
.cdl .dots i.on{background:#fff;height:48px}
.cdl .scroll{position:absolute;z-index:3;left:50%;bottom:0;font:10px var(--en);letter-spacing:.3em;color:#fff;transform:translateX(-50%);padding-bottom:62px}
.cdl .scroll::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:50px;background:#fff;animation:sc 2s infinite}
@keyframes sc{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.cdl /* sections */
section{padding:128px 0}
.cdl .hd2{margin-bottom:56px}
.cdl .hd2 .en{font-family:var(--en);font-size:12px;letter-spacing:.42em;color:var(--gold)}
.cdl .hd2 h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,34px);letter-spacing:.12em;margin-top:10px;line-height:1.6}
.cdl .about{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.cdl .about .img{position:relative;aspect-ratio:4/5;overflow:hidden}
.cdl .about .img::before{content:"";position:absolute;z-index:2;inset:18px -18px -18px 18px;border:1px solid var(--gold);pointer-events:none}
.cdl .about p{color:var(--ink2);font-size:15px;margin-bottom:20px}
.cdl .more{display:inline-flex;gap:16px;align-items:center;font:12px var(--en);letter-spacing:.3em;margin-top:12px;border-bottom:1px solid var(--ink);padding-bottom:8px}
.cdl .more::after{content:"→"}
.cdl .biz{background:var(--bg)}
.cdl .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.cdl .card{background:#fff;padding:44px 34px;position:relative;transition:.4s}
.cdl .card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.08)}
.cdl .card .n{font:300 44px var(--en);color:var(--gold);letter-spacing:.06em}
.cdl .card h3{font-family:var(--serif);font-weight:500;font-size:20px;margin:14px 0 12px;letter-spacing:.1em}
.cdl .card p{font-size:14px;color:var(--ink2)}
.cdl /* gallery */
.gal{background:var(--navy);color:#fff}
.cdl .gal .hd2 h2{color:#fff}
.cdl .stage{position:relative;aspect-ratio:16/8;overflow:hidden;background:#000}
.cdl .stage .g{position:absolute;inset:0;overflow:hidden}
.cdl .ctl{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.cdl .ctl button{font:11px var(--en);letter-spacing:.2em;background:none;color:#fff;border:1px solid rgba(255,255,255,.35);padding:9px 18px;cursor:pointer;transition:.3s}
.cdl .ctl button.on,.cdl .ctl button:hover{background:#fff;color:var(--navy)}
.cdl .arr{position:absolute;top:50%;z-index:5;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(0,0,0,.2);color:#fff;font-size:18px;cursor:pointer}
.cdl .arr.l{left:18px}
.cdl .arr.r{right:18px}
.cdl .thumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:8px}
.cdl .thumbs i{display:block;aspect-ratio:1.5;opacity:.45;cursor:pointer;transition:.3s;position:relative;overflow:hidden}
.cdl .thumbs i.on{opacity:1;outline:1px solid var(--gold)}
.cdl .cap{margin-top:14px;font:12px var(--en);letter-spacing:.2em;opacity:.7}
.cdl /* strengths */
.num{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line)}
.cdl .num div{padding:46px 30px;border-right:1px solid var(--line)}
.cdl .num div:last-child{border-right:0}
.cdl .num b{font:300 54px var(--en);display:block;letter-spacing:.04em}
.cdl .num span{font-size:13px;color:var(--ink2)}
.cdl /* company */
.co{background:var(--bg)}
.cdl table{width:100%;border-collapse:collapse;background:#fff}
.cdl th,.cdl td{padding:22px 28px;border-bottom:1px solid var(--line);text-align:left;font-size:14px;vertical-align:top}
.cdl th{width:200px;font-weight:500;letter-spacing:.14em;color:var(--ink2)}
.cdl .tbd{color:#b08a1c;background:#fff7d6;padding:1px 6px;font-size:12px}
.cdl /* cta */
.cta{position:relative;color:#fff;text-align:center;overflow:hidden}
.cdl .cta .ph{opacity:.9}
.cdl .cta .wrap{position:relative;z-index:2}
.cdl .cta h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3.2vw,36px);letter-spacing:.14em;margin-bottom:18px}
.cdl .cta p{font-size:14px;letter-spacing:.1em;margin-bottom:40px;opacity:.9}
.cdl .cta .big{display:inline-block;border:1px solid #fff;padding:20px 64px;font:13px var(--en);letter-spacing:.35em;transition:.3s}
.cdl .cta .big:hover{background:#fff;color:var(--ink)}
.cdl .rv{opacity:0;transform:translateY(28px);transition:1s cubic-bezier(.2,.7,.2,1)}
.cdl .rv.in{opacity:1;transform:none}
@media(max-width:820px){.cdl .about{grid-template-columns:1fr;gap:48px}
.cdl .cards,.cdl .num{grid-template-columns:1fr}
.cdl .num div{border-right:0;border-bottom:1px solid var(--line)}
.cdl section{padding:84px 0}
.cdl .stage{aspect-ratio:4/3}
.cdl .thumbs{grid-template-columns:repeat(6,1fr)}
.cdl th{width:110px;padding:16px}
.cdl td{padding:16px}
.cdl .dots{display:none}}

.cdl .hero p{margin:0}
.cdl .hero .copy{text-shadow:0 1px 14px rgba(0,0,0,.5)}
/* JS が動かない時は表示を隠さない */
.cdl:not(.cdl-js) .rv{opacity:1;transform:none}
.cdl .gal .hd2 .en{color:#8cc0f2}
