/* ==========================================================
   SUNWOO TECH RESPONSIVE STYLES
   Load order: style.css -> page stylesheet -> mobile.css
   All screen media queries are centralized in this file.
========================================================== */

/* Common component refinements migrated from style.css */
@media(max-width:900px){
    body.mobile-menu-open{overflow:hidden}
    .site-header .gnb,.site-header .header-cta{display:none}
    .site-header .mobile-menu-toggle{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:44px;
        height:44px;
        margin-left:auto;
        padding:0;
        border:1px solid #dbe4ea;
        border-radius:2px;
        background:#fff;
        color:var(--blue-deep);
        font-size:20px;
        cursor:pointer;
    }
    .site-header .mobile-menu-toggle:focus-visible,
    .mobile-global-menu a:focus-visible,
    .mobile-global-menu button:focus-visible{outline:3px solid rgba(38,119,180,.3);outline-offset:2px}
    .mobile-global-menu{
        position:fixed;
        inset:0;
        z-index:500;
        display:block;
        width:100%;
        height:100vh;
        height:100dvh;
        overflow:hidden;
        visibility:hidden;
        pointer-events:none;
    }
    .mobile-global-menu__dim{
        display:none;
    }
    .mobile-global-menu__panel{
        position:absolute;
        inset:0;
        display:flex;
        flex-direction:column;
        width:100%;
        height:100vh;
        height:100dvh;
        background:#fff;
        overflow:hidden;
        overscroll-behavior:contain;
        transform:translateX(100%);
        transition:transform .32s cubic-bezier(.22,.72,.2,1);
    }
    .mobile-menu-open .mobile-global-menu{visibility:visible;pointer-events:auto}
    .mobile-menu-open .mobile-global-menu__dim{opacity:1}
    .mobile-menu-open .mobile-global-menu__panel{transform:translateX(0)}
    .mobile-global-menu__head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        min-height:76px;
        padding:0 24px;
        border-bottom:1px solid #e5ebef;
    }
    .mobile-global-menu__head>strong{color:var(--blue-deep);font-size:20px;letter-spacing:-.025em}
    .mobile-global-menu__close{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:42px;
        height:42px;
        margin-right:-8px;
        padding:0;
        border:0;
        background:transparent;
        color:var(--blue-deep);
        font-size:23px;
        cursor:pointer;
    }
    .mobile-global-menu__nav{flex:1;overflow-y:auto;padding:12px 24px 30px}
    .mobile-global-menu__group{padding:22px 0;border-bottom:1px solid #e5ebef}
    .mobile-global-menu__primary{display:flex;align-items:baseline;gap:14px;color:var(--blue-deep)}
    .mobile-global-menu__primary>span{color:var(--blue);font-size:13px;font-weight:800;letter-spacing:.06em}
    .mobile-global-menu__primary>strong{font-size:22px;line-height:1.3;letter-spacing:-.035em}
    .mobile-global-menu__sub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin:15px 0 0 38px}
    .mobile-global-menu__sub a{position:relative;padding:7px 0 7px 11px;color:#5e6b79;font-size:14px;line-height:1.45}
    .mobile-global-menu__sub a:before{content:"";position:absolute;top:16px;left:0;width:3px;height:3px;background:#91a4b3}
    .mobile-global-menu__sub a:hover{color:var(--blue)}
    .mobile-global-menu__foot{padding:24px;background:#0b2b3d;color:#fff}
    .mobile-global-menu__foot p{margin:0 0 14px;color:rgba(255,255,255,.64);font-size:13px;line-height:1.6}
    .mobile-global-menu__foot a{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 2px;border-top:1px solid rgba(255,255,255,.34);border-bottom:1px solid rgba(255,255,255,.34);color:#fff;font-size:14px;font-weight:750}
    .mobile-global-menu__foot a i{font-size:14px}
}

@media(max-width:520px){
    .mobile-global-menu__head{padding:0 20px}
    .mobile-global-menu__nav{padding-right:20px;padding-left:20px}
    .mobile-global-menu__foot{padding:22px 20px}
}

@media(max-width:1024px){
    .tech-process .process-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
    .tech-process .process-step{min-height:260px}
    .tech-process .process-step:after{display:none}
}

@media(max-width:820px){
    body .sub-hero{height:390px}
    .sub-hero-copy h1{font-size:34px}
    .sub-hero-copy p{font-size:14px}
    .brand-banner{background-position:72% center}
    .approach-heading{margin-bottom:54px}
    .approach-row{gap:30px;padding:54px 0}
    .approach-media{min-height:0;aspect-ratio:16/9}
    .approach-row.image-right .approach-media,.approach-row.image-right .approach-text{order:initial}
    .signature:after{width:150px;height:54px}
    .footer-minimal{padding:52px 0 34px}
    .footer-top-link{top:50px}
    .footer-brand svg{width:185px}
    .footer-company{margin-top:42px}
    .footer-bottom{margin-top:60px}
    .product-page .product-bottom{background-position:55% center}
    .product-page .product-bottom:before{background:rgba(5,27,40,.83)}
    .product-page .bottom-grid{grid-template-columns:1fr}
    .product-page .philosophy{padding:60px 0 50px;border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}
    .product-page .contact{padding:50px 0 60px}
    .technology-cta{background-position:68% center}
    .technology-cta:before{background:rgba(4,18,27,.72)}
    .technology-cta .cta-inner{min-height:480px;padding:64px 0;grid-template-columns:minmax(0,1fr);align-content:end}
}

@media(max-width:520px){
    body .sub-hero{height:360px}
    .sub-hero-copy h1{font-size:30px;line-height:1.4}
    .sub-hero-copy p{margin-top:16px}
    .approach-row{gap:24px;padding:46px 0}
    .approach-text h3{font-size:23px}
    .chart-card{padding:0}
    .product-card{padding:16px}
    .signature{gap:12px}
    .signature:after{width:132px;height:48px}
    .footer-minimal{padding:44px 0 30px}
    .footer-brand svg{width:165px}
    .footer-top-link{top:42px;width:52px;height:58px}
    .footer-company{margin-top:36px;padding-right:0;font-size:13px}
    .footer-company-name{display:block}
    .footer-company-name span{display:block;margin-top:2px;font-size:13px}
    .footer-contact-inline{display:block}
    .footer-contact-inline>span{display:none}
    .footer-contact-inline a{display:block}
    .footer-bottom{margin-top:48px;padding-top:24px}
    .map-address-card .map-pin{border-right:0}
    .product-page .philosophy h2{font-size:29px}
    .product-page .contact h2{font-size:23px}
    .product-page .contact-button{max-width:none}
    .technology-cta .cta-inner h2{font-size:30px}
    .technology-cta .cta-inner p{font-size:14px}
    .tech-process .process-flow{grid-template-columns:1fr}
    .tech-process .process-step{min-height:0}
}

/* Existing shared responsive rules */
@media(max-width:900px){.wrap{width:min(100% - 40px,var(--wrap))}.site-header{height:64px}.brand{min-width:auto}.gnb{display:none}.header-cta{margin-left:auto}.hero{height:720px}.hero-photo{inset:0 0 0 28%;opacity:.88}.hero-shade{background:linear-gradient(90deg,#f7f3ed 0%,rgba(247,243,237,.95) 42%,rgba(247,243,237,.25) 75%,rgba(247,243,237,0) 100%)}.hero-copy{width:72%;margin-top:40px}.hero-lead{font-size:29px}.hero h1{font-size:46px}.section{padding:88px 0}.about-top,.product-grid,.history-inner{grid-template-columns:1fr;gap:50px}.about-photos{height:380px}.values{grid-template-columns:1fr 1fr}.value-intro{grid-column:1/-1;margin-bottom:20px}.history{height:auto;padding:90px 0}.history-bg{inset:0}.timeline li{grid-template-columns:85px 1fr}.field-grid{height:auto;grid-template-columns:1fr}.field-main{height:420px}.field-side{grid-template-columns:1fr 1fr;grid-template-rows:none}.field-side figure{height:280px}.cta-inner{height:250px}.wave{width:80%}}

@media (max-width: 1080px) {
    .header-inner { width: calc(100% - 40px); }
    .gnb { gap: 24px; }
    .search-box { display: none; }
    .container { width: min(900px, calc(100% - 50px)); }
    .sub-hero { height: 460px; }
    .experience-grid, .approach-row { gap: 55px; }
}

@media (max-width: 820px) {
    .site-header { height: 72px; }
    .header-inner { width: calc(100% - 28px); }
    .brand { min-width: auto; }
    .brand-mark { width: 34px; }
    .brand-type strong { font-size: 15px; }
    .brand-type small { font-size: 13px; }
    .gnb a:not(.active), .header-utils { display: none; }
    .gnb { margin-left: auto; }
    .gnb a.active { font-size: 14px; min-width: auto; }
    .sub-hero { height: 520px; }
    .sub-hero > img { object-position: 56% 48%; }
    .hero-overlay { background: linear-gradient(90deg,rgba(7,25,44,.86) 0%,rgba(8,31,52,.68) 62%,rgba(0,0,0,.2) 100%); }
    .hero-copy h1 { font-size: 36px; }
    .hero-copy p br { display: none; }
    .sub-tabs { height: 72px; gap: 12px; overflow-x: auto; justify-content: flex-start; padding: 0 18px; }
    .sub-tabs a { min-width: 98px; flex: 0 0 auto; font-size: 14px; }
    .section-large, .section-xlarge { padding: 100px 0; }
    .intro h2, .approach-heading h2, .experience-copy h2 { font-size: 30px; }
    .intro-gallery { grid-template-columns: 1fr; gap: 40px; }
    .gallery-item img { height: 340px; }
    .experience-grid, .approach-row, .closing-inner { grid-template-columns: 1fr; }
    .experience-grid { gap: 60px; }
    .experience-visual { min-height: 450px; }
    .approach { max-width: 100%; overflow-x: hidden; }
    .approach .wrap, .approach-list, .approach-row, .approach-media, .approach-text { min-width: 0; max-width: 100%; }
    .approach-list { width: 100%; gap: 85px; }
    .approach-row { width: 100%; grid-template-columns: minmax(0, 1fr); gap: 34px; }
    .approach-row.image-right .approach-media, .approach-row.image-right .approach-text { order: initial; }
    .approach-media { width: 100%; min-height: 0; aspect-ratio: 16 / 10; overflow: hidden; }
    .approach-media img { width: 100%; max-width: 100%; height: 100%; object-fit: cover; }
    .brand-banner { height: 420px; }
    .brand-banner-copy { padding: 0 30px; }
    .brand-banner-copy h2 { font-size: 28px; }
    .brand-banner-copy p br { display: none; }
    .closing-inner { padding: 72px 0; gap: 24px; min-height: auto; }
    .closing-ear { right: -45px; opacity: .6; }
    .footer-inner { min-height: 130px; height: auto; padding: 30px 0; flex-wrap: wrap; gap: 12px 24px; }
    .footer-inner strong { width: 100%; }
}

@media (max-width: 520px) {
    .container { width: calc(100% - 36px); }
    .hero-copy h1 { font-size: 31px; }
    .hero-copy p { font-size: 14px; }
    .section-large, .section-xlarge { padding: 82px 0; }
    .intro h2, .approach-heading h2, .experience-copy h2, .closing h2 { font-size: 27px; }
    .lead, .experience-copy p, .approach-text p, .closing p { font-size: 14px; }
    .intro-gallery { margin-top: 54px; }
    .gallery-item img { height: 260px; }
    .photo-main { width: 88%; height: 350px; }
    .photo-sub { width: 52%; height: 150px; }
    .experience-facts { gap: 25px; }
    .brand-banner-copy h2 { font-size: 25px; }
    .approach-heading { margin-bottom: 72px; }
    .approach-text h3 { font-size: 23px; }
    .approach-media.photo img { width: 100%; height: 100%; }
    .chart-svg { height: 210px; }
}

@media (max-width:1200px){
    .ceo-wrap{width:min(1100px,calc(100% - 48px));grid-template-columns:380px 1fr;gap:50px;min-height:auto;padding:64px 0}
    .portrait-card{height:620px}
    .value-card{grid-column:2;display:flex;width:auto;justify-content:space-around;padding:18px 24px;border-radius:22px}
    .value-item{flex-direction:row}
    .value-sep{width:1px;height:52px;margin:0 18px}
    .icon-circle{width:54px;height:54px}.icon-circle svg{width:34px;height:34px}
    .ceo-head h1{font-size:40px}
}
@media (max-width:820px){
    .ceo-wrap{display:block;width:min(680px,calc(100% - 34px));padding:42px 0 54px}
    .portrait-card{height:520px;margin-bottom:46px}
    .ceo-head h1{font-size:34px}
    .lead-quote{font-size:18px;padding:0 28px}
    .value-card{margin-top:36px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:0}
    .value-item{flex-direction:column}
    .value-sep{display:none}
    .bg-ear{width:200px;right:-45px}
}
@media (max-width:520px){
    .ceo-wrap{width:calc(100% - 28px)}
    .portrait-card{height:430px;border-radius:26px}.portrait-card img{border-radius:26px}
    .ceo-head h1{font-size:29px;line-height:1.4}
    .lead-quote{margin-top:28px;font-size:16px;line-height:1.65}
    .lead-quote br{display:none}
    .body-copy{font-size:15px;line-height:1.75}
    .value-card{padding:16px 8px}.value-item strong{font-size:15px}.icon-circle{width:48px;height:48px}
}
@page{size:1680px 945px;margin:0}


@media(max-width:1024px){
    .intro-grid,.process-grid,.direction-inner,.future-layout{grid-template-columns:1fr;gap:55px}
    .product-page .intro-grid{grid-template-columns:minmax(0,1fr);gap:50px}
    .product-page .section-copy{max-width:none}
    .product-page .product-visual{width:100%;min-width:0}
    .feature-layout{grid-template-columns:1fr}
    .feature-cards{grid-template-columns:repeat(3,1fr)}
    .direction-inner{padding:90px 0}
    .future-steps{grid-template-columns:repeat(4,1fr);gap:20px}
    .step-arrow{display:none}
}

@media(max-width:768px){
    .wrap{width:calc(100% - 40px)}
    .section-large{padding:90px 0}
    .section-copy h2,.direction-copy h2{font-size:30px}
    .product-visual{padding:22px}
    .product-page .intro-grid{gap:36px}
    .product-page .product-visual{padding:0}
    .product-page .product-image{width:100%;height:auto;aspect-ratio:4/3}
    .product-image{height:320px}
    .product-notes{grid-template-columns:1fr;gap:18px}
    .product-notes div+div:before{display:none}
    .feature-cards{grid-template-columns:1fr}
    .process-list{grid-template-columns:1fr}
    .process-arrow{transform:rotate(90deg)}
    .product-direction,.direction-inner{min-height:auto}
    .direction-points{margin-top:10px}
    .future-steps{grid-template-columns:1fr 1fr;gap:45px 20px}
    .bottom-grid{grid-template-columns:1fr}
    .philosophy{border-right:0;border-bottom:1px solid #dce7f0}
    .philosophy,.contact{min-height:auto;padding:65px 20px}
}

@media(max-width:520px){
    .product-page .product-intro.section-large{padding:70px 0 76px}
    .product-page .intro-grid{gap:28px}
    .product-page .section-copy h2{font-size:27px;line-height:1.42}
    .product-page .section-copy p{font-size:14px;line-height:1.82}
    .product-page .product-visual>.reference-note{margin-top:10px;line-height:1.6}
}


@media(max-width:1024px){
    .overview-grid,.detail-grid,.detail-grid.reverse,.prototype-grid{grid-template-columns:1fr;gap:60px}
    .detail-grid.reverse .analysis-card,.detail-grid.reverse .section-copy{order:initial}
    .process-flow{grid-template-columns:repeat(4,1fr);gap:22px}
    .process-line{display:none}
    .filter-concept{grid-template-columns:1fr 45px 1fr 45px 1fr}
}

@media(max-width:768px){
    .wrap{width:calc(100% - 40px)}
    .section-large{padding:90px 0}
    .section-copy h2,.section-heading h2,.prototype-copy h2{font-size:30px}
    .overview-visual{min-height:360px;padding:25px}
    .wave-panel{height:310px}
    .process-flow{grid-template-columns:1fr 1fr;gap:45px 20px}
    .filter-concept{grid-template-columns:1fr}
    .filter-arrow{transform:rotate(90deg);padding:12px 0}
    .prototype-visual{grid-template-columns:1fr}
    .prototype-plus{transform:rotate(90deg)}
    .ear-sample-image,.earplug-image{height:300px}
    .cta-inner{min-height:auto;padding:75px 0;grid-template-columns:1fr;gap:35px}
}


/* RESPONSIVE */
@media(max-width:1024px){
    .map-address-card{
        grid-template-columns:64px 1fr 105px;
        width:calc(100% - 50px);
    }
    .address-copy strong{font-size:20px}
    .table-head,.table-row{grid-template-columns:220px 1fr}
    .location-cards{grid-template-columns:1fr}
}

@media(max-width:768px){
    .wrap{width:calc(100% - 40px)}
    .location-map-section{padding-top:90px}
    .location-heading h2{font-size:30px}
    .map-box{height:500px}
    .map-address-card{
        bottom:-105px;
        width:calc(100% - 24px);
        grid-template-columns:52px 1fr;
        gap:16px;
        padding:23px 20px;
        border-radius:14px;
    }
    .map-pin{width:50px;height:50px}
    .map-pin:before{left:17px;top:11px;width:18px;height:23px;border-width:4px}
    .map-pin:after{left:24px;top:18px;width:6px;height:6px}
    .address-copy strong{font-size:17px}
    .map-button{
        grid-column:1/-1;
        width:100%;
        height:48px;
        flex-direction:row;
        border-radius:6px;
    }
    .map-button-icon{width:20px;height:18px}
    .section-large{padding:170px 0 90px}
    .table-head{display:none}
    .table-row{
        grid-template-columns:1fr;
        padding:25px 0;
    }
    .table-row>div{padding:0 20px;border-right:0!important}
    .transport-info{
        margin-top:15px;
        padding-left:74px!important;
    }
    .location-cards{margin-top:30px}
    .info-card{min-height:150px}
}

/* Main page only: migrated from main.css */
@media (max-width:900px){
    body.main-page{overflow-x:hidden}
    body.main-page .site-header{
        top:16px;
        width:calc(100% - 32px);
        height:62px;
        border:1px solid rgba(25,53,73,.1);
        border-radius:6px;
        background:rgba(255,255,255,.86);
        box-shadow:0 8px 24px rgba(21,42,56,.08);
        backdrop-filter:blur(14px);
        -webkit-backdrop-filter:blur(14px);
    }
    body.main-page .header-inner{width:100%;margin:0;padding:0 10px 0 16px}
    body.main-page .brand{min-width:auto}
    body.main-page .brand svg{width:137px;height:auto}
    body.main-page .site-header .mobile-menu-toggle{
        flex:0 0 auto;
        width:46px;
        height:38px;
        margin-left:auto;
        padding:0 0 0 12px;
        border:0;
        border-left:1px solid rgba(25,53,73,.15);
        border-radius:0;
        background:transparent;
        box-shadow:none;
        color:var(--blue-deep);
        font-size:18px;
    }
    body.main-page .site-header .mobile-menu-toggle i{display:block;line-height:1}
    body.main-page .hero{height:720px}
    body.main-page .hero-photo{inset:0 0 0 28%;opacity:.88}
    body.main-page .hero-copy{width:72%;margin-top:40px}
    body.main-page .hero-lead{font-size:29px}
    body.main-page .hero h1{font-size:46px}
    body.main-page .about{padding-top:88px}
    body.main-page .about-top,
    body.main-page .product-grid,
    body.main-page .history-inner{grid-template-columns:1fr;gap:50px}
    body.main-page .about-photos{height:380px}
    body.main-page .values{grid-template-columns:1fr 1fr}
    body.main-page .value-intro{grid-column:1/-1;margin-bottom:20px}
    body.main-page .history{height:auto;padding:90px 0}
    body.main-page .history-inner{min-height:410px}
    body.main-page .product-grid{padding:88px 0}
    body.main-page .field{max-width:100%;overflow:hidden;overflow-x:clip;padding:88px 0}
    body.main-page .field>.wrap{width:calc(100% - 40px);max-width:100%;min-width:0;margin-right:auto;margin-left:auto}
    body.main-page .field-heading{width:100%;min-width:0;margin-bottom:32px}
    body.main-page .field-heading .eyebrow{max-width:100%;font-size:13px;white-space:normal}
    body.main-page .field-heading h2{max-width:100%;font-size:32px;overflow-wrap:break-word;word-break:keep-all}
    body.main-page .field-grid{width:100%;max-width:100%;min-width:0;grid-template-columns:minmax(0,1fr);gap:14px}
    body.main-page .field-grid>*,
    body.main-page .field-side>figure{max-width:100%;min-width:0}
    body.main-page .field-main,
    body.main-page .field-side figure{width:100%;min-width:0;height:auto;aspect-ratio:4/3}
    body.main-page .field-main{grid-column:auto}
    body.main-page .field img{max-width:100%}
    body.main-page .field figcaption{right:20px;left:20px;max-width:calc(100% - 40px)}
    body.main-page .field figcaption strong{white-space:normal;word-break:keep-all}
    body.main-page .community{padding-top:88px;padding-bottom:88px}
    body.main-page .cta-inner{height:250px}
    body.main-page .wave{width:80%}
}

@media (max-width:768px){
    body.main-page .site-header{top:14px;width:calc(100% - 28px);height:60px;border-radius:4px}
    body.main-page .header-inner{padding:0 9px 0 15px}
    body.main-page .brand svg{width:134px}
    body.main-page .site-header .mobile-menu-toggle{width:44px;height:36px;padding-left:11px;font-size:18px}
    body.main-page .hero{height:100svh;min-height:640px;max-height:780px}
    body.main-page .hero-photo{inset:0;opacity:1;background-position:64% center}
    body.main-page .hero-photo:after{
        background:
            linear-gradient(180deg,rgba(245,240,232,.08) 0%,rgba(245,240,232,.16) 37%,rgba(245,240,232,.92) 100%),
            linear-gradient(90deg,rgba(245,240,232,.64) 0%,rgba(245,240,232,.24) 68%,rgba(245,240,232,0) 100%);
    }
    body.main-page .hero-inner{align-items:flex-end;padding-bottom:clamp(64px,11vh,92px)}
    body.main-page .hero-copy{width:100%;max-width:440px;margin:0}
    body.main-page .hero-lead{margin:0 0 10px;font-size:20px;font-weight:500;line-height:1.45;letter-spacing:-.035em}
    body.main-page .hero h1{font-size:clamp(32px,6vw,38px);line-height:1.14;letter-spacing:-.052em}
    body.main-page .hero-desc{max-width:350px;margin-top:22px;color:#39444c;font-size:14px;line-height:1.72}
}

@media (max-width:520px){
    body.main-page .site-header{top:12px;width:calc(100% - 24px);height:60px;border-radius:4px}
    body.main-page .header-inner{padding:0 8px 0 14px}
    body.main-page .brand svg{width:132px}
    body.main-page .site-header .mobile-menu-toggle{width:42px;height:36px;padding-left:10px;font-size:17px}
    body.main-page .header-cta{height:42px;padding:0 14px}
    body.main-page .hero{height:100svh;min-height:640px;max-height:760px}
    body.main-page .hero-photo{inset:0;opacity:1;background-position:64% center}
    body.main-page .hero-photo:after{
        background:
            linear-gradient(180deg,rgba(245,240,232,.08) 0%,rgba(245,240,232,.16) 37%,rgba(245,240,232,.92) 100%),
            linear-gradient(90deg,rgba(245,240,232,.64) 0%,rgba(245,240,232,.24) 68%,rgba(245,240,232,0) 100%);
    }
    body.main-page .hero-inner{align-items:flex-end;padding-bottom:clamp(64px,11vh,88px)}
    body.main-page .hero-copy{width:100%;max-width:360px;margin:0}
    body.main-page .hero-lead{margin:0 0 10px;font-size:18px;font-weight:500;line-height:1.45;letter-spacing:-.035em}
    body.main-page .hero h1{font-size:clamp(30px,8.2vw,34px);line-height:1.14;letter-spacing:-.052em}
    body.main-page .hero-desc{max-width:310px;margin-top:22px;color:#39444c;font-size:14px;line-height:1.72}
    body.main-page .about-copy h2,
    body.main-page .product-copy h2,
    body.main-page .field-heading h2,
    body.main-page .history-copy h2,
    body.main-page .community h2{font-size:27px}
    body.main-page .cta h2{font-size:27px}
    body.main-page .about-top,
    body.main-page .product-grid,
    body.main-page .history-inner{gap:38px}
    body.main-page .about-photos{height:320px}
    body.main-page .photo-a{width:58%;height:235px}
    body.main-page .photo-b{width:55%;height:225px}
    body.main-page .values{grid-template-columns:1fr;margin-top:54px}
    body.main-page .value-intro{margin-bottom:0}
    body.main-page .value-item{min-height:auto;padding:24px 0;border-left:0;border-top:1px solid var(--line)}
    body.main-page .history{padding:76px 0}
    body.main-page .timeline li{grid-template-columns:76px 1fr}
    body.main-page .product-grid{padding:76px 0}
    body.main-page .product-visual{min-height:0}
    body.main-page .exploded{width:min(100%,737px);height:auto}
    body.main-page .field{padding:76px 0}
    body.main-page .field>.wrap{width:calc(100% - 28px)}
    body.main-page .field-heading{margin-bottom:26px}
    body.main-page .field-grid{grid-template-columns:minmax(0,1fr);gap:12px}
    body.main-page .field figcaption{right:16px;bottom:16px;left:16px;max-width:calc(100% - 32px)}
    body.main-page .field figcaption strong{font-size:15px}
    body.main-page .community{padding-top:76px;padding-bottom:76px}
    body.main-page .community-head{align-items:flex-start}
    body.main-page .news-list a{grid-template-columns:78px 1fr 16px}
    body.main-page .cta-inner{height:auto;min-height:240px;gap:24px}
}

/* Board pages only: migrated from board.css */
@media (max-width: 768px) {
    body.board-page .default-board .board-head{
        align-items: flex-start;
        flex-direction: column;
    }

    body.board-page .default-board .board-table .col-num,
    body.board-page .default-board .board-table .col-name,
    body.board-page .default-board .board-table .col-hit{
        display: none;
    }

    body.board-page .default-board .board-table .col-date{
        width: 110px;
    }

    body.board-page .default-board .board-table th,
    body.board-page .default-board .board-table td{
        height: 54px;
        padding: 0 10px;
        font-size: 14px;
    }

    body.board-page .default-board .view-subject{
        font-size: 26px;
    }

    body.board-page .default-board .view-meta{
        flex-direction: column;
        gap: 6px;
    }

    body.board-page .default-board .view-meta span + span::before{
        display: none;
    }

    body.board-page .default-board .view-nav .nav-row{
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        padding: 16px 0;
    }

    body.board-page .default-board .view-nav .nav-label{
        flex: none;
        padding-left: 0;
    }

    body.board-page .default-board .view-nav a{
        width: 100%;
    }
}

@media (max-width: 1024px) {
    body.board-page .board-section{
        padding: 70px 0 100px;
    }

    body.board-page .media-list-top{
        align-items: flex-start;
        flex-direction: column;
    }

    body.board-page .media-search{
        width: 100%;
        min-width: 0;
    }

    body.board-page .media-search-input{
        width: 100%;
    }

    body.board-page .media-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px 20px;
    }

    body.board-page .media-info h3{
        font-size: 20px;
    }

    body.board-page .media-view-head h2{
        font-size: 32px;
    }
}

@media (max-width: 640px) {
    body.board-page .board-section{
        padding: 54px 0 80px;
    }

    body.board-page .board-inner{
        padding: 0 18px;
    }

    body.board-page .dmi-sec-head h3{
        font-size: 28px;
    }

    body.board-page .media-search{
        flex-direction: column;
        align-items: stretch;
    }

    body.board-page .media-search select{
        width: 100%;
    }

    body.board-page .media-grid{
        grid-template-columns: 1fr;
        gap: 40px;
    }

    body.board-page .media-info{
        padding-top: 16px;
    }

    body.board-page .media-info h3{
        margin-bottom: 10px;
        font-size: 19px;
    }

    body.board-page .media-info p{
        font-size: 15px;
    }

    body.board-page .media-view-head h2{
        font-size: 26px;
    }

    body.board-page .media-view-utils{
        align-items: flex-start;
        flex-direction: column;
    }

    body.board-page .media-view-tools{
        width: 100%;
    }

    body.board-page .media-view-tools button{
        flex: 1;
    }

    body.board-page .view-nav .nav-row{
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        padding: 16px 0;
    }

    body.board-page .view-nav .nav-label{
        flex: none;
    }

    body.board-page .media-write-row{
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.board-page .media-write-row label{
        padding-top: 0;
    }
}

@media (max-width: 768px) {
    body.board-page .jw-news-list__top{
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    body.board-page .jw-news-search{
        width: 100%;
    }

    body.board-page .jw-news-list__link{
        grid-template-columns: minmax(0, 1fr) 24px;
        gap: 8px 12px;
        min-height: 88px;
        padding: 17px 6px;
    }

    body.board-page .jw-news-list__link:hover{
        padding-left: 10px;
    }

    body.board-page .jw-news-list__number{
        display: none;
    }

    body.board-page .jw-news-list__subject{
        grid-column: 1;
        font-size: 16px;
        white-space: normal;
    }

    body.board-page .jw-news-list__date{
        grid-column: 1;
        grid-row: 2;
        font-size: 13px;
        text-align: left;
    }

    body.board-page .jw-news-list__arrow{
        grid-column: 2;
        grid-row: 1 / span 2;
        align-self: center;
    }

    body.board-page .jw-news-view__header{
        padding: 0 60px 24px 0;
    }

    body.board-page .jw-news-view__title{
        font-size: 25px;
        word-break: break-word;
    }

    body.board-page .jw-news-view__share{
        width: 44px;
        height: 44px;
    }

    body.board-page .jw-news-view__body{
        min-height: 320px;
        padding: 34px 4px 52px;
    }

    body.board-page .jw-news-view__media{
        margin-bottom: 30px;
    }

    body.board-page .jw-news-view__content{
        font-size: 16px;
        line-height: 1.85;
        word-break: break-word;
    }

    body.board-page .jw-news-view__nav{
        grid-template-columns: 1fr;
    }

    body.board-page .jw-news-view__nav-spacer{
        display: none;
    }

    body.board-page .jw-news-view__nav-item{
        padding: 22px 4px;
        border-bottom: 1px solid var(--jw-news-line);
    }

    body.board-page .jw-news-view__nav-item.is-next{
        align-items: flex-start;
        text-align: left;
    }
}

@media (max-width: 520px) {
    body.board-page .jw-news-search{
        flex-direction: column;
    }

    body.board-page .jw-news-search__select{
        flex-basis: 48px;
    }

    body.board-page .jw-news-list__paging .pg_page,
    body.board-page .jw-news-list__paging .pg_current{
        min-width: 34px;
        height: 36px;
        padding: 0 5px;
        font-size: 14px;
    }

    body.board-page .jw-news-view__actions{
        flex-wrap: wrap;
    }

    body.board-page .jw-news-view__button{
        min-width: 92px;
    }
}

@media screen and (max-width:1024px){
    body.board-page .jw-inquiry-write{padding-top:14px;}
    body.board-page .jw-inquiry-write__head{margin-bottom:38px;}
    body.board-page .jw-inquiry-write__layout{grid-template-columns:1fr;}
    body.board-page .jw-inquiry-write__aside{position:relative; top:auto;}
}

@media screen and (max-width:767px){
    body.board-page .jw-inquiry-write{padding:0 0 24px;}
    body.board-page .jw-inquiry-write__head{margin-bottom:30px; padding-left:15px; border-left-width:2px; text-align:left;}
    body.board-page .jw-inquiry-write__head h2{font-size:34px;}
    body.board-page .jw-inquiry-write__head>span{margin-top:13px; font-size:14px; word-break:normal;}
    body.board-page .jw-inquiry-write__form{padding:26px 18px 24px; border-radius:0; box-shadow:none;}
    body.board-page .jw-inquiry-write__grid{grid-template-columns:1fr; gap:18px;}
    body.board-page .jw-inquiry-write__field--full{grid-column:auto;}
    body.board-page .jw-inquiry-write__field input[type="text"],
    body.board-page .jw-inquiry-write__field input[type="password"],
    body.board-page .jw-inquiry-write__field input[type="email"],
    body.board-page .jw-inquiry-write__field select{height:52px; padding:0 14px; font-size:14px;}
    body.board-page .jw-inquiry-write__field textarea{min-height:180px; padding:14px; font-size:14px;}
    body.board-page .jw-inquiry-write__privacy{margin-top:22px; padding:17px 16px;}
    body.board-page .jw-inquiry-write__privacy label{align-items:flex-start; font-size:13px; line-height:1.55;}
    body.board-page .jw-inquiry-write__privacy details{margin-left:28px;}
    body.board-page .jw-inquiry-write__privacy p{font-size:13px;}
    body.board-page .jw-inquiry-write__actions{display:grid; grid-template-columns:1fr 1fr; margin-top:22px;}
    body.board-page .jw-inquiry-write__button{width:100%; min-width:0; height:52px; padding:0 14px;}
    body.board-page .jw-inquiry-write__aside{padding:26px 22px; border-radius:16px;}
    body.board-page .jw-inquiry-write__aside h3{font-size:26px;}
    body.board-page .jw-inquiry-write__current-file{align-items:flex-start; flex-direction:column; gap:8px;}
}

@media screen and (max-width:767px){
    body.board-page .jw-inquiry-write__captcha{padding:17px 16px;}
    body.board-page .jw-inquiry-write__captcha-box,
    body.board-page .jw-inquiry-write__captcha #captcha{align-items:stretch;}
    body.board-page .jw-inquiry-write__captcha #captcha_img{width:145px; height:54px;}
    body.board-page .jw-inquiry-write__captcha #captcha_key{flex:1 1 120px; width:auto; min-width:120px; height:54px;}
    body.board-page .jw-inquiry-write__captcha #captcha_mp3,
    body.board-page .jw-inquiry-write__captcha #captcha_reload{height:44px;}
}

@media screen and (max-width:767px){
    body.board-page .inquiry-view__info{grid-template-columns:1fr;}
    body.board-page .inquiry-view__info-item:nth-child(odd){border-right:0;}
    body.board-page .inquiry-view__info-item{grid-template-columns:96px minmax(0,1fr); min-height:58px;}
    body.board-page .inquiry-view__info-item dt,
    body.board-page .inquiry-view__info-item dd{padding:12px 14px;}
    body.board-page .inquiry-view__content{padding:34px 4px 44px;}
    body.board-page .inquiry-view__files{padding:24px 4px;}
}

@media (max-width:1320px){
    body.board-page .facilities-page{padding-left:24px;padding-right:24px;}
}

@media (max-width:1024px){
    body.board-page .facilities-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    body.board-page .facilities-view__title{font-size:38px;}
}

@media (max-width:767px){
    body.board-page .facilities-page{padding:44px 16px 80px;}
    body.board-page .facilities-intro{display:block;margin-bottom:24px;padding:28px 22px;}
    body.board-page .facilities-intro__title{font-size:28px;}
    body.board-page .facilities-intro__text{font-size:15px;}
    body.board-page .facilities-intro .facilities-btn{margin-top:22px;}
    body.board-page .facilities-category{overflow-x:auto;flex-wrap:nowrap;margin-right:-16px;padding-right:16px;padding-bottom:16px;scrollbar-width:none;}
    body.board-page .facilities-category::-webkit-scrollbar{display:none;}
    body.board-page .facilities-category__item{flex:0 0 auto;min-height:42px;padding:0 16px;font-size:13px;white-space:nowrap;}
    body.board-page .facilities-grid{grid-template-columns:1fr;gap:22px;}
    body.board-page .facilities-card__content{min-height:82px;padding:20px;}
    body.board-page .facilities-view__header{display:block;margin-bottom:28px;padding-bottom:24px;}
    body.board-page .facilities-view__header .facilities-btn{margin-top:22px;}
    body.board-page .facilities-view__title{font-size:32px;word-break:break-word;}
    body.board-page .facilities-view-nav{grid-template-columns:1fr;}
    body.board-page .facilities-view-nav__item{min-height:auto;padding:22px 0;border-right:0;}
    body.board-page .facilities-view-nav__item+.facilities-view-nav__item{border-top:1px solid var(--line);}
    body.board-page .facilities-view-nav__item--next{text-align:left;}
    body.board-page .facilities-actions{flex-wrap:wrap;}
    body.board-page .facilities-actions .facilities-btn{flex:1;}
    body.board-page .facilities-write__header h2{font-size:31px;}
    body.board-page .facilities-simple-form{padding:24px 18px;}
    body.board-page .facilities-current-image{align-items:flex-start;flex-direction:column;}
    body.board-page .facilities-current-image img{width:100%;}
    body.board-page .facilities-form-actions .facilities-btn{flex:1;}
}

@media (max-width: 820px) {
    body.board-page .default-board .board-title,
    body.board-page .default-board .view-subject,
    body.board-page .dmi-sec-head h3,
    body.board-page .media-view-head h2,
    body.board-page .media-write h2,
    body.board-page .jw-news-view__title,
    body.board-page .jw-inquiry-write__head h2,
    body.board-page .facilities-intro__title,
    body.board-page .facilities-view__title,
    body.board-page .facilities-write__header h2{
        font-size: 30px;
    }
}

@media (max-width: 520px) {
    body.board-page .default-board .board-title,
    body.board-page .default-board .view-subject,
    body.board-page .dmi-sec-head h3,
    body.board-page .media-view-head h2,
    body.board-page .media-write h2,
    body.board-page .jw-news-view__title,
    body.board-page .jw-inquiry-write__head h2,
    body.board-page .facilities-intro__title,
    body.board-page .facilities-view__title,
    body.board-page .facilities-write__header h2{
        font-size: 27px;
    }
}