/* /join/ only. Uses BEOM brand tokens. Does not load third-party CSS. */
.ec-page{
    --ec-green:var(--ntelecom-primary);
    --ec-soft:var(--ntelecom-primary-soft);
    --ec-border:var(--ntelecom-primary-border);
    --ec-dark:#172019;
    color:var(--ec-dark);
    background:#fff;
    overflow-x:clip;
    font-family:var(--ntelecom-font);
    font-weight:500;
    letter-spacing:-.035em;
    word-break:keep-all;
}
.ec-page *,
.ec-page *::before,
.ec-page *::after{box-sizing:border-box}
.ec-container{
    width:min(1180px,calc(100% - 40px));
    max-width:100%;
    margin:0 auto;
}
.ec-page h1,
.ec-page h2,
.ec-page h3,
.ec-method strong,
.ec-faq-q span,
.ec-notice summary{
    font-weight:800;
    letter-spacing:-.045em;
}
.ec-mobile-only{display:none}

.ec-hero{padding:48px 0 36px;background:#fff}
.ec-hero h1{margin:0;font-size:clamp(32px,4vw,46px);line-height:1.25}
.ec-hero h1 em{color:var(--ec-green);font-style:normal}
.ec-lead{margin:12px 0 24px;color:#66706a;font-size:16px;line-height:1.75}
.ec-methods{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ec-method{
    position:relative;
    min-height:148px;
    padding:22px 24px;
    text-align:left;
    border:2px solid var(--ec-border);
    border-radius:20px;
    background:#fff;
    color:var(--ec-dark);
    cursor:pointer;
    transition:.2s;
}
.ec-method:hover,
.ec-method.is-active{
    transform:translateY(-2px);
    border-color:var(--ec-green);
    box-shadow:0 14px 32px var(--ntelecom-primary-shadow,rgba(181,62,16,.14));
}
.ec-method.is-active:after{
    content:'선택됨';
    position:absolute;
    right:16px;
    top:16px;
    padding:6px 10px;
    border-radius:99px;
    background:var(--ec-green);
    color:#fff;
    font-size:12px;
    font-weight:800;
}
.ec-method strong,
.ec-method>span:not(.ec-logo-row){display:block}
.ec-method strong{margin:12px 0 4px;font-size:20px;line-height:1.4}
.ec-method>span:not(.ec-logo-row){color:#637067;font-size:15px;font-weight:600}
.ec-method>i{position:absolute;right:22px;bottom:18px;font-style:normal;font-size:22px}
.ec-logo-row{display:flex;gap:8px;height:28px}
.ec-logo-row img{width:28px;height:28px;object-fit:contain;border-radius:7px}
.ec-logo-row-single img{width:auto;max-width:110px}

.ec-panel{padding:8px 0 0}
.ec-panel[hidden]{display:none!important}

.ec-action-banner{
    width:100%;
    min-height:230px;
    padding:36px 0;
    border-radius:0;
    overflow:hidden;
    color:#fff;
    background:linear-gradient(120deg,var(--ntelecom-primary-dark,var(--ec-green)),var(--ec-green));
    scroll-margin-top:calc(var(--ntelecom-header-offset,80px) + 12px);
}
.ec-banner-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
}
.ec-banner-copy{flex:1;min-width:0}
.ec-action-banner p{margin:0 0 8px;font-size:17px}
.ec-action-banner p em{color:#fff;font-style:normal;font-weight:800}
.ec-action-banner h2{margin:0 0 22px;font-size:clamp(28px,3vw,42px);line-height:1.3;font-weight:800}
.ec-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:stretch;
}
.ec-button{
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex:1 1 150px;
    min-height:46px;
    max-width:210px;
    padding:11px 18px;
    border:1px solid rgba(255,255,255,.45);
    border-radius:999px;
    background:rgba(255,255,255,.12);
    color:#fff;
    font-family:var(--ntelecom-font);
    font-size:14px;
    font-weight:800;
    letter-spacing:-.04em;
    text-decoration:none;
}
.ec-button span{flex:0 0 auto}
.ec-button-primary{border-color:rgba(255,255,255,.95);background:rgba(0,0,0,.16)}
.ec-button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.ec-banner-art{
    flex:0 0 220px;
    display:flex;
    align-items:center;
    justify-content:center;
    height:180px;
}
.ec-sim-art img{display:block;width:190px;height:190px;object-fit:contain}
.ec-app-art{position:relative;width:220px}
.ec-app-art img{
    position:relative;
    width:112px;
    height:112px;
    border:7px solid rgba(255,255,255,.92);
    border-radius:27px;
    object-fit:cover;
    box-shadow:0 18px 34px rgba(0,0,0,.22);
}
.ec-app-art img:first-child{z-index:2;transform:translateX(14px) rotate(-9deg)}
.ec-app-art img:last-child{z-index:1;margin-left:-24px;transform:translateY(13px) rotate(10deg)}

.ec-hours{padding:36px 0 12px}
.ec-hours h2{margin:0 0 14px;font-size:24px}
.ec-hours-card{
    padding:22px 26px;
    border-radius:18px;
    background:#f6f7f6;
    color:#2f3832;
}
.ec-hours-card ul{margin:0;padding:0;list-style:none}
.ec-hours-card li{margin:8px 0;font-size:16px;line-height:1.7}
.ec-hours-card li span,
.ec-hours-card p{color:#66706a}
.ec-hours-card p{margin:12px 0 0;font-size:15px;line-height:1.75}
.ec-hours-card a{color:var(--ec-green);font-weight:700;border-bottom:1px solid currentColor}

.ec-guide{scroll-margin-top:110px;padding:28px 0 8px}
.ec-section-heading{text-align:center;margin-bottom:22px}
.ec-section-heading h2{margin:0;font-size:clamp(28px,3.4vw,36px);line-height:1.35}
.ec-section-heading h2 em{color:var(--ec-green);font-style:normal}
.ec-section-heading p{margin:10px 0 0;color:#727a75}

.ec-guide-slider{
    position:relative;
    width:100%;
    min-height:420px;
    padding:28px 72px 48px;
    border-radius:0;
    background:var(--ec-soft);
    overflow:hidden;
    touch-action:pan-y;
}
.ec-guide-track{position:relative;min-height:360px}
.ec-guide-slide{display:none}
.ec-guide-slide.is-active{
    display:grid;
    grid-template-columns:minmax(180px,245px) minmax(0,1fr);
    column-gap:48px;
    align-items:center;
    justify-content:center;
    max-width:820px;
    margin:0 auto;
}
.ec-guide-image{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:245px;
    height:360px;
    margin:0;
    overflow:hidden;
    border-radius:24px 24px 0 0;
}
.ec-guide-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:top center;
    filter:drop-shadow(0 14px 22px rgba(23,45,29,.14));
}
.ec-guide-image-channel{
    height:auto;
    overflow:visible;
}
.ec-guide-image-channel img{
    width:100%;
    height:auto;
    object-fit:contain;
}
.ec-guide-copy{min-width:0;padding-top:12px}
.ec-guide-copy em{
    display:block;
    margin-bottom:10px;
    color:var(--ec-green);
    font-style:normal;
    font-size:14px;
    font-weight:800;
    letter-spacing:.08em;
}
.ec-guide-copy h3{margin:0 0 12px;color:var(--ec-green);font-size:clamp(24px,3vw,32px);line-height:1.35}
.ec-guide-copy .ec-guide-intro{margin:0 0 12px;color:#222;font-size:18px;font-weight:800;line-height:1.55}
.ec-guide-copy p{margin:0;color:#57635b;font-size:15px;line-height:1.7}
.ec-guide-copy .ec-guide-note{display:block;margin-top:12px;color:#69726d;font-size:13px;font-weight:700;line-height:1.65}

.ec-slider-arrow{
    position:absolute;
    z-index:2;
    top:50%;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    padding:0;
    border:1px solid #bbc4be;
    border-radius:50%;
    background:#fff;
    color:var(--ec-dark);
    cursor:pointer;
    transform:translateY(-50%);
}
.ec-slider-arrow svg{display:block;width:18px;height:18px}
.ec-slider-arrow:focus-visible{outline:3px solid var(--ec-green);outline-offset:2px}
.ec-prev{left:16px}
.ec-next{right:16px}
.ec-slider-count{
    position:absolute;
    right:24px;
    bottom:16px;
    z-index:3;
    padding:8px 16px;
    border-radius:99px;
    background:#28322c;
    color:#fff;
    font-size:14px;
    font-weight:800;
}

.ec-network-section{padding:8px 0 36px}
.ec-network-grid{display:grid;gap:12px}
.ec-network-card{
    display:grid;
    grid-template-columns:180px 1fr;
    align-items:center;
    min-height:190px;
    padding:25px 38px;
    border:1px solid var(--ec-border);
    border-radius:24px;
    background:#fff;
}
.ec-network-card h3{margin:6px 0;font-size:23px;line-height:1.38}
.ec-network-card p{margin:5px 0;color:#66706a;font-size:15px}
.ec-network-card a{display:inline-block;margin-top:9px;color:var(--ec-green);font-weight:800;font-size:14px}
.ec-network-icon{
    display:grid;
    place-items:center;
    width:112px;
    height:112px;
    overflow:hidden;
    border-radius:30px;
    background:var(--ec-green);
}
.ec-network-icon img{display:block;width:100%;height:100%;object-fit:cover}
.ec-store-buttons{display:flex;gap:10px}
.ec-store-buttons a{
    min-width:130px;
    padding:10px 15px;
    border-radius:10px;
    background:#172019;
    color:#fff!important;
    text-align:center;
    font-weight:800;
}

.ec-common{padding:42px 0 48px;background:#fff}
.ec-faq{margin-bottom:46px}
.ec-faq-item{
    margin:12px 0;
    border:1px solid var(--ec-border);
    border-radius:16px;
    background:#fff;
    overflow:hidden;
}
.ec-faq-item h3{margin:0;font-size:inherit;font-weight:inherit}
.ec-faq-q{
    display:flex;
    align-items:center;
    gap:16px;
    width:100%;
    min-height:66px;
    padding:16px 24px;
    border:0;
    background:transparent;
    color:inherit;
    font-family:inherit;
    font-size:16px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
}
.ec-faq-q b,
.ec-answer>b{
    display:grid;
    place-items:center;
    flex:0 0 26px;
    width:26px;
    height:26px;
    border-radius:50%;
    background:var(--ec-green);
    color:#fff;
    font-size:13px;
}
.ec-faq-q span{flex:1;min-width:0}
.ec-faq-q i{
    flex:0 0 auto;
    width:12px;
    height:12px;
    margin-left:auto;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg) translate(-2px,-2px);
    font-style:normal;
}
.ec-faq-item.is-open .ec-faq-q{
    background:var(--ec-green);
    color:#fff;
}
.ec-faq-item.is-open .ec-faq-q b{background:#fff;color:var(--ec-green)}
.ec-faq-item.is-open .ec-faq-q i{transform:rotate(-135deg) translate(-2px,-2px)}
.ec-faq-q:focus-visible{outline:3px solid var(--ec-green);outline-offset:-3px}
.ec-answer{display:none;gap:16px;padding:20px 28px 23px}
.ec-faq-item.is-open .ec-answer{display:flex}
.ec-answer p{margin:0;font-size:15px;line-height:1.7;font-weight:500}

.ec-notice>h2{margin:0 0 18px;padding-bottom:18px;border-bottom:1px solid #d6ddd8;font-size:25px}
.ec-notice details{background:#fff;border-radius:12px;overflow:hidden}
.ec-notice summary{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:21px 28px;
    font-size:18px;
    cursor:pointer;
    list-style:none;
}
.ec-notice summary::-webkit-details-marker{display:none}
.ec-notice summary i{font-style:normal}
.ec-notice details>div{padding:24px 38px;background:#f8f9f8}
.ec-notice li{margin:7px 0;color:#626b65;font-size:15px;line-height:1.55}

@media(max-width:1024px){
    .ec-action-banner{padding:28px 0}
    .ec-guide-slider{padding:24px 60px 44px}
}

@media(max-width:767px){
    .ec-container{width:min(100% - 28px,560px)}
    .ec-mobile-only{display:inline}
    .ec-hero{padding:28px 0 22px}
    .ec-hero h1{font-size:30px}
    .ec-lead{margin:8px 0 16px;font-size:14px}
    .ec-methods{grid-template-columns:1fr}
    .ec-method{min-height:118px;padding:17px 19px}
    .ec-method strong{font-size:17px}
    .ec-method.is-active:after{right:14px;top:14px}
    .ec-action-banner{min-height:0;padding:24px 0}
    .ec-banner-inner{display:block}
    .ec-action-banner h2{margin-bottom:18px;font-size:27px}
    .ec-banner-art{display:none!important}
    .ec-actions{display:grid;grid-template-columns:1fr}
    .ec-button{max-width:none;white-space:normal}
    .ec-hours{padding:24px 0}
    .ec-hours h2{font-size:21px}
    .ec-hours-card{padding:17px 18px}
    .ec-hours-card li,
    .ec-hours-card p{font-size:14px}
    .ec-hours-card li span{display:block}
    .ec-guide{padding:24px 0 0}
    .ec-section-heading{margin-bottom:16px}
    .ec-section-heading h2{font-size:27px}
    .ec-guide-slider{min-height:500px;padding:18px 48px 48px}
    .ec-guide-slide.is-active{
        grid-template-columns:1fr;
        justify-items:center;
        row-gap:14px;
    }
    .ec-guide-image{width:178px;height:275px;max-width:62vw}
    .ec-guide-image-channel{height:auto}
    .ec-guide-copy{width:100%;max-width:340px;text-align:center;padding:0 8px}
    .ec-guide-copy h3{font-size:21px}
    .ec-guide-copy .ec-guide-intro{font-size:15px}
    .ec-guide-copy p{font-size:13px}
    .ec-slider-arrow{top:168px;width:40px;height:40px}
    .ec-prev{left:8px}
    .ec-next{right:8px}
    .ec-network-section{padding:2px 0 26px}
    .ec-network-card{grid-template-columns:76px 1fr;gap:16px;padding:19px;min-height:0}
    .ec-network-icon{width:76px;height:76px;border-radius:20px}
    .ec-network-card h3{font-size:18px}
    .ec-network-card p,
    .ec-network-card a{font-size:13px}
    .ec-store-buttons a{min-width:0;flex:1;padding:9px 7px;font-size:12px}
    .ec-common{padding:32px 0 24px}
    .ec-faq{margin-bottom:36px}
    .ec-faq-q{min-height:60px;padding:15px;font-size:14px}
    .ec-answer{padding:18px}
    .ec-notice>h2{font-size:22px}
    .ec-notice summary{padding:18px;font-size:16px}
    .ec-notice details>div{padding:18px 21px}
    .ec-notice li{font-size:13px}
    .ec-page{padding-bottom:24px}
}

@media(max-width:359px){
    .ec-hero h1{font-size:26px}
    .ec-action-banner h2{font-size:22px}
    .ec-button{font-size:13px;padding:10px 12px}
}
