.web-design-page{--wd-orange:#f4511e;--wd-space:clamp(88px,8vw,144px);background:#fff;color:#000;font:16px/2 "Helvetica Neue",Arial,"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;font-feature-settings:"palt";-webkit-font-smoothing:antialiased}
.web-design-page *,.web-design-page *::before,.web-design-page *::after{box-sizing:border-box}
.web-design-page :is(h1,h2,h3,p,ol,ul,figure){margin:0}
.web-design-page :is(ol,ul){padding:0;list-style:none}
.web-design-page a{color:inherit;text-decoration:none}
.web-design-page a:focus-visible{outline:2px solid var(--wd-orange);outline-offset:5px}
.web-design-page section[id],.web-design-page article[id]{scroll-margin-top:120px}
.wd-container{width:min(100% - var(--gutter)*2,1440px);margin-inline:auto}
.wd-section{padding-block:var(--wd-space)}
.wd-meta{display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:14px}
.wd-meta nav{display:flex;gap:16px;align-items:center}
.wd-meta a:hover{text-decoration:underline;text-underline-offset:4px}
.wd-kicker{font-weight:700;letter-spacing:.12em;white-space:nowrap}
.wd-kicker i{display:inline-block;width:7px;height:7px;margin-right:10px;border-radius:50%;background:var(--wd-orange);vertical-align:2px}
.wd-hero{padding-top:32px}
.wd-display{font-size:clamp(72px,9.7vw,156px);font-style:italic;font-weight:700;letter-spacing:-.055em;line-height:1.08;margin-block:48px 32px!important}
.wd-display>span{color:var(--wd-orange)}
.wd-page-label{font-size:14px;font-weight:700;letter-spacing:.08em;margin-bottom:20px!important}
.wd-hero-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:48px;align-items:start}
.wd-hero h1{font-size:clamp(30px,3vw,48px);font-weight:700;line-height:1.65;letter-spacing:.01em;white-space:nowrap}
.wd-hero h1>span{color:var(--wd-orange)}
.wd-hero-copy>p{line-height:2.1;letter-spacing:.025em}
.wd-button{display:flex;align-items:center;justify-content:space-between;gap:24px;width:fit-content;max-width:100%;min-height:56px;padding:14px 16px 14px 24px;border:1px solid #fff;border-radius:999px;font-size:14px;font-weight:700;line-height:1.6;transition:background .25s,color .25s}
.wd-button>span{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:#fff;color:var(--wd-orange);transition:transform .25s}
.wd-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.wd-button:hover>span{transform:translateX(3px)}
.wd-button-primary{margin-top:28px;background:var(--wd-orange);border-color:var(--wd-orange);color:#fff!important}
.wd-button-primary:hover{background:#fff;color:var(--wd-orange)!important}
.wd-button-primary:hover>span{background:var(--wd-orange);color:#fff}
.wd-page-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:56px;border-top:1px solid #000;border-bottom:1px solid #000;padding-block:16px}
.wd-page-nav a{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:44px;font-size:14px;font-weight:700}
.wd-page-nav a>span{color:var(--wd-orange);font-style:italic}
.wd-page-nav a:hover{color:var(--wd-orange)}
.wd-section-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.wd-heading>p{font-size:clamp(38px,3.6vw,52px);font-style:italic;font-weight:700;line-height:1.15;letter-spacing:-.035em;margin-bottom:24px!important}
.wd-heading h2{font-size:clamp(30px,3.2vw,46px);font-weight:700;line-height:1.65;letter-spacing:.03em}
.wd-purpose-copy>p+p{margin-top:24px!important}
.wd-lead{font-size:26px;font-weight:700;line-height:1.7;letter-spacing:.03em}
.wd-purpose-map{margin-top:56px!important;padding:40px 48px 32px!important;border:1px solid #ddd;border-radius:28px;text-align:center}
.wd-purpose-goals{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wd-purpose-goals>span{padding:12px;border-bottom:1px solid #aaa;font-size:15px;font-weight:600}
.wd-purpose-connector{font-size:28px;line-height:1;padding:24px 0;color:var(--wd-orange)}
.wd-purpose-core{max-width:540px;margin:auto;padding:24px;background:var(--wd-orange);border-radius:16px;color:#fff}
.wd-purpose-core>span{font-size:14px;letter-spacing:.08em}
.wd-purpose-core p{font-size:24px;font-weight:700;line-height:1.6;margin-top:6px!important}
.wd-purpose-map figcaption{font-size:14px;margin-top:20px;line-height:1.8}
.wd-approach{background:var(--wd-orange);color:#fff;border-radius:48px}
.wd-approach-intro{padding-top:8px;line-height:2.1}
.wd-questions{margin-top:56px}
.wd-question{display:grid;grid-template-columns:1fr 1fr;gap:80px;border-top:1px solid #ffffff80;padding:40px 0}
.wd-question:last-child{padding-bottom:0}
.wd-question-title{display:flex;gap:28px;align-items:start}
.wd-question-title>span{font-size:28px;line-height:1.2;font-weight:700;font-style:italic}
.wd-question-title div>p{font-size:14px;line-height:1.3;letter-spacing:.08em;margin-bottom:12px!important}
.wd-question h3{font-size:clamp(28px,3vw,40px);line-height:1.5;font-weight:700;letter-spacing:.025em}
.wd-question-copy>div{margin-top:24px;padding-top:20px;border-top:1px solid #ffffff50}
.wd-question-copy>div>span{display:block;font-size:14px;font-weight:700;margin-bottom:8px}
.wd-question-copy>div>p{font-size:15px;line-height:1.9}
.wd-domain-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:56px}
.wd-domain{min-width:0}
.wd-domain-preview{aspect-ratio:4/3;padding:18px;border:1px solid #ddd;border-radius:24px;background:#f7f7f5;overflow:hidden}

.wd-domain-label{font-size:14px;letter-spacing:.04em;margin-top:24px!important;color:var(--wd-orange);font-weight:600}
.wd-domain h3{font-size:24px;line-height:1.6;font-weight:700;margin-block:12px!important}
.wd-domain>p:last-child{font-size:15px;line-height:2}
.wd-domain-note{margin-top:40px!important;padding-top:24px;border-top:1px solid #ddd;font-size:15px}

.wd-process-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:56px!important}
.wd-process-list>li{position:relative;border-top:1px solid #000;padding-top:24px}
.wd-process-list>li:not(:last-child)::after{content:'→';position:absolute;right:0;top:20px;color:var(--wd-orange);font-size:24px}
.wd-step-number{font-size:42px;font-weight:700;font-style:italic;color:var(--wd-orange);line-height:1}
.wd-process-list h3{font-size:20px;font-weight:700;line-height:1.6;margin-block:24px 12px!important}
.wd-process-list p{font-size:15px;line-height:2}

@media(max-width:1100px){.wd-hero-grid{grid-template-columns:1fr;gap:32px}.wd-hero-copy{display:flex;align-items:end;justify-content:space-between;gap:32px}.wd-hero-copy>p{font-size:15px}.wd-hero h1{font-size:clamp(32px,4.2vw,44px)}.wd-hero-copy .wd-button{margin-top:0}.wd-section-grid,.wd-question{gap:48px}.wd-domain-grid{gap:24px}.wd-domain h3{font-size:21px}.wd-process-list{gap:24px}.wd-process-list h3{font-size:18px}}
@media(max-width:760px){.web-design-page{--wd-space:80px}.wd-hero{padding-top:24px}.wd-meta{align-items:start;gap:16px}.wd-meta nav{gap:8px;justify-content:flex-end;flex-wrap:wrap;line-height:1.7}.wd-kicker{letter-spacing:.05em}.wd-display{font-size:clamp(58px,12.5vw,94px);margin-block:44px 24px!important}.wd-hero-grid{gap:24px}.wd-hero h1{font-size:clamp(26px,5.8vw,36px);white-space:normal;letter-spacing:.01em}.wd-hero-copy{display:block}.wd-hero-copy .wd-button{margin-top:24px}.wd-page-nav{grid-template-columns:1fr 1fr;gap:0 24px;margin-top:40px;padding-block:12px}.wd-page-nav a{font-size:14px;min-height:48px}.wd-section-grid,.wd-question{grid-template-columns:1fr;gap:28px}.wd-heading>p{font-size:38px;margin-bottom:20px!important}.wd-heading h2{font-size:30px;line-height:1.6}.wd-lead{font-size:24px}.wd-purpose-map{margin-top:32px!important;padding:24px 20px!important;border-radius:20px}.wd-purpose-goals{grid-template-columns:1fr 1fr;gap:8px 16px}.wd-purpose-goals>span{font-size:14px;padding:8px 0}.wd-purpose-core{padding:20px 12px}.wd-purpose-core p{font-size:20px}.wd-approach{border-radius:28px}.wd-questions{margin-top:32px}.wd-question{padding-block:32px}.wd-question-title{gap:20px}.wd-question h3{font-size:30px}.wd-question-copy>div{margin-top:20px;padding-top:16px}.wd-domain-grid{grid-template-columns:1fr;gap:40px;margin-top:32px}.wd-domain-preview{aspect-ratio:5/3;padding:20px}.wd-domain h3{font-size:24px}.wd-domain-label{margin-top:20px!important}.wd-domain-note{margin-top:32px!important}.wd-process-list{grid-template-columns:1fr;gap:28px;margin-top:32px!important}.wd-process-list>li{padding-left:64px;min-height:96px}.wd-step-number{position:absolute;left:0;top:28px;font-size:32px}.wd-process-list>li:not(:last-child)::after{content:'↓';right:0;top:24px;font-size:20px}.wd-process-list h3{font-size:21px;margin:0 24px 12px 0!important}.wd-button{gap:16px;padding-left:20px;font-size:14px}}
@media(max-width:380px){.wd-meta nav{max-width:160px}.wd-kicker{font-size:14px}.wd-hero h1{font-size:25px}.wd-display{font-size:56px}.wd-page-nav{gap:0 16px}.wd-button{gap:12px;padding-inline:16px}.wd-purpose-core p{font-size:18px}}
@media(prefers-reduced-motion:reduce){.web-design-page *{scroll-behavior:auto!important;transition:none!important}}
.web-design-page ::selection{background:#f4511e;color:#fff}
.page-template-page-web-design #sp-contact-btn :is(a,button){background:#f4511e;color:#fff;font-size:14px;letter-spacing:.06em}

.web-design-page .wd-domain-image{padding:0;border:0}
.wd-domain-image img{display:block;width:100%;height:100%;object-fit:cover}

.wd-heading :is(#wd-purpose-title,#wd-approach-title){font-size:clamp(52px,6.2vw,88px);line-height:1.3;letter-spacing:.04em}

.wd-carts{margin-top:24px;padding-top:20px;border-top:1px solid #ddd}.wd-carts h4{margin:0 0 12px;font-size:14px;font-weight:700}.wd-carts ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.wd-cart-logo{display:flex;align-items:center;justify-content:center;min-height:60px;padding:12px;border:1px solid #e8e8e8;border-radius:8px}.wd-cart-logo img{display:block;width:100%;max-width:132px;height:32px;object-fit:contain}.wd-cart-futureshop{background:#222;border-color:#222}.wd-cart-logo:hover{opacity:.7}

.wd-carts-note{margin-top:12px!important;font-size:14px;line-height:1.8}

.wd-faq{display:grid;grid-template-columns:1fr 1.5fr;gap:80px;padding-bottom:var(--wd-space)}.wd-faq .wd-heading h2{font-size:30px}.wd-faq details{border-top:1px solid #aaa}.wd-faq details:last-child{border-bottom:1px solid #aaa}.wd-faq summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;cursor:pointer;font-size:16px;font-weight:700;list-style:none;line-height:1.8}.wd-faq summary::-webkit-details-marker{display:none}.wd-faq summary>span{flex-shrink:0;font-size:24px;color:var(--wd-orange)}.wd-faq details[open] summary>span{transform:rotate(45deg)}.wd-faq details>p{padding-bottom:24px;font-size:15px}.wd-faq summary:focus-visible{outline:2px solid var(--wd-orange);outline-offset:4px}
@media(max-width:1100px){.wd-faq{gap:48px}}
@media(max-width:760px){.wd-faq{grid-template-columns:1fr;gap:32px}.wd-faq summary{font-size:15px;gap:16px}}

/* Keep the explanatory copy level with the Japanese service heading. */
@media(min-width:761px){
  :is(.wd-approach-header,.wd-areas-header,.wd-process-header){row-gap:24px}
  :is(.wd-approach-header,.wd-areas-header,.wd-process-header)>.wd-heading{display:contents}
  :is(.wd-approach-header,.wd-areas-header,.wd-process-header) .wd-heading>p{grid-column:1;grid-row:1;margin-bottom:0!important}
  :is(.wd-approach-header,.wd-areas-header,.wd-process-header) h2{grid-column:1;grid-row:2}
  :is(.wd-approach-header,.wd-areas-header,.wd-process-header)>:is(.wd-approach-intro,.wd-section-intro){grid-column:2;grid-row:2}
  .wd-approach-header>.wd-approach-intro{padding-top:0}
}
