@charset "utf-8";

@font-face {
    font-family: 'Pretendard Variable';
    font-weight: 45 920;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/PretendardVariable.ttf') format('woff2-variations');
}



.display_pc_only{display:block;}
.display_tablet_only{display:none;}

/* 기본 레이아웃: 헤더, 메인, 푸터 */
.site-header{
    position:sticky;
    top:0;
    z-index:999;
    background:rgba(0,0,0,0.8);
}

.header-inner{
    width:min(var(--container), calc(100% - 40px));
    margin:0 auto;
}

.header-row--top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:var(--h-pc);
    gap:38px;
}

.logo{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-width:220px; /* 왼쪽 로고 공간(PC에서 가운데 메뉴 정렬 안정) */
}
.logo img{
    height:50px; /* 로고 이미지에 맞게 조절 */
    width:auto;
    display:block;
}

/* PC 메뉴 */
.nav--pc{
    flex:1 1 auto;
    display:flex;
    justify-content:end;
}
.nav--pc ul{
    list-style:none;
    display:flex;
    align-items:center;
    gap:56px;             /* 이미지처럼 넓게 */
    margin:0;
    padding:0;
}
.nav-link{
    color:#fff;
    font-weight:500;
    font-size:20px;
}
.nav-link:hover{opacity:1}

/* CTA 버튼(우측) */
.cta-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:42px;
    padding:0 18px;
    border-radius:var(--radius);
    font-weight:500;
    font-size:16px;
    color:#fff;
    background:linear-gradient(135deg, var(--cta1), var(--cta2));
    box-shadow: 0 10px 22px rgba(47,184,255,.18);
    white-space:nowrap;
}

/* 모바일 하단 메뉴바(기본은 숨김) */
.nav--mo{display:none}

/* 부드러운 스크롤(기본) */
html{scroll-behavior:smooth}

/* 앵커 위치 보정(고정헤더 높이만큼) */
section{scroll-margin-top: var(--h-pc);}

.container{max-width:1500px;  width:100%; margin:auto;}

.main0{
    position:relative;
    overflow:hidden;
    width:100%;
    min-height:915px;   /* ? 이걸 반드시 넣어야 높이가 잡힘 */
    margin:-100px 0 0 0;
}

/* 영상 */
.main0__bg{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    /* cover 는 모바일에서만
    object-fit:cover;*/
    object-fit: contain;   /* cover → contain */
    background:#000;       /* 남는 여백 색 */
    z-index:0;
}

.main0__img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    /* cover 는 모바일에서만
    object-fit:cover;*/
    object-fit: contain;   /* cover → contain */
    background:#000;       /* 남는 여백 색 */
    z-index:0;
}

/* 오버레이 */
.main0__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.35);
    z-index:1;
}

/* ? 텍스트 래퍼도 높이를 부모 기준으로 확보 */
.main0 .text-wrap{
    max-width:1500px;
    margin:0 auto;
    position:relative;
    z-index:2;
    height:100%;        /* ? */
    min-height:915px;   /* ? (부모와 동일하게) */
}

/* 텍스트 */
.main0 .in_text{
    position:absolute;
    top:50%;
    left:60%;
    transform:translate(-50%, -50%);
    width:min(1500px, calc(100% - 40px));
    color:#fff;
    font-weight:300;
    line-height:1.25;
    font-size:30px;
    white-space:nowrap;
}

.main0 .in_text .t01{font-size:50px; font-weight:500;}
.main0 .in_text .t02{font-size:30px; font-weight:300; margin:20px 0 0 0;    line-height: 1.4;}

.sec-attendance{
    background:#fff;
    padding:120px 0 84px;
}
.sec-attendance .sec-attendance__wrap{
    width:100%;
    margin:0 auto;
    padding:0 0px;
}

/* title */
.sec-attendance .sec-attendance__title{

    margin:0 auto 75px;
    font-size:60px;
    font-weight:400;
    letter-spacing:-0.03em;
    color:#111;
    line-height:1.25;
    text-align:left;
}
.sec-attendance .sec-attendance__title b{font-weight:700}

/* PC grid */
.sec-attendance .line_box{background:#f5f5f5; padding:75px 0;}
.sec-attendance .sec-attendance__grid{
    margin-top:44px;
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap:40px;
    align-items:start;
}

/* card */
.sec-attendance .sec-attendance__card{margin:0}
.sec-attendance .sec-attendance__thumb{
    position:relative;
    display:block;
    border-radius:22px;
    overflow:hidden;
    background:#eee;
}
.sec-attendance .sec-attendance__thumb img{
    width:100%;
    height:340px;
    object-fit:cover;
    display:block;
    border-radius:22px;
}

/* overlay title (default hidden on PC) */
.sec-attendance .sec-attendance__overlayTitle{
    display:none;
}

/* source */
.sec-attendance .sec-attendance__source{
    position:absolute;
    right:14px;
    bottom:12px;
    color:#fff;
    font-size:14px;
    font-weight:300;
    text-shadow: 0 2px 10px rgba(0,0,0,.45);
    z-index:2;
}

/* caption under image (PC) */
.sec-attendance .sec-attendance__cap{
    margin-top:25px;
    text-align:center;
    font-weight:400;
    color:#111;
    font-size:25px;
    letter-spacing:-0.02em;
}

/* gradient line */
.sec-attendance .sec-attendance__grad{
    margin:55px auto 0;
    font-size:33px;
    font-weight:700;
    letter-spacing:-0.03em;
    line-height:1.2;
    text-align:left;
}
.sec-attendance .sec-attendance__grad span,
.sec-attendance .sec-attendance__grad b{
    background: linear-gradient(90deg, #1f6fff 0%, #ff4fd8 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}


#section-attendance.sec-attendance .sec-attendance__wrap2{
    padding:70px 0 0px;
    background:#fff;
}

/* 전체 레이아웃 */
#section-attendance .sec-attendance__wrap2 .att2__grid{
    display:grid;
    grid-template-columns: 1.15fr .85fr;
    gap:28px;
    align-items:stretch;
}

/* LEFT hero */
#section-attendance .sec-attendance__wrap2 .att2__hero{
    position:relative;
    border-radius:24px;
    overflow:hidden;
    background:#eee;
    min-height:420px;
}
#section-attendance .sec-attendance__wrap2 .att2__heroImg{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    filter:saturate(.98);
}
#section-attendance .sec-attendance__wrap2 .att2__heroText{
    position:absolute;
    left:50px;
    bottom:50px;
    color:#fff;
    text-shadow: 0 4px 18px rgba(0,0,0,.35);
}
#section-attendance .sec-attendance__wrap2 .att2__pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:52px;
    padding:0 26px;
    border-radius:999px;
    background:linear-gradient(90deg,#7b61ff,#1bb6ff);
    font-size:25px;
    font-weight:600;
    letter-spacing:-.02em;
}
#section-attendance .sec-attendance__wrap2 .att2__headline{
    margin:30px 0 25px;
    font-size:55px;
    line-height:1.05;
    letter-spacing:-.04em;
    font-weight:300;
}

#section-attendance .sec-attendance__wrap2 .att2__headline b{font-weight:600;}
#section-attendance .sec-attendance__wrap2 .att2__sub{
    margin:0;
    font-size:22px;
    font-weight:400;
    letter-spacing:-.02em;
}

/* RIGHT cards */
#section-attendance .sec-attendance__wrap2 .att2__right{
    display:flex;
    flex-direction:column;
    gap:20px;
}
#section-attendance .sec-attendance__wrap2 .att2__item{
    display:grid;
    grid-template-columns: 110px 1fr;
    gap:18px;
    background:#f5f5f5;
    border-radius:20px;
    padding:26px 26px;
}
#section-attendance .sec-attendance__wrap2 .att2__icon{
    display:flex;
    align-items:center;
    justify-content:center;
}
#section-attendance .sec-attendance__wrap2 .att2__icon img{
    width:80px;
    height:80px;
    object-fit:contain;
    display:block;
}

#section-attendance .sec-attendance__wrap2 .att2__body{display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;}

#section-attendance .sec-attendance__wrap2 .att2__title{
    margin:0;
    font-size:30px;
    font-weight:700;
    letter-spacing:-.03em;
    color:#111;
    line-height:1.15;
}

/* toggle */
#section-attendance .sec-attendance__wrap2 .att2__toggle{
    margin-top:10px;
    background:transparent;
    border:0;
    padding:0;
    color:#333;
    font-size:16px;
    font-weight:600;
    letter-spacing:-.02em;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
}
#section-attendance .sec-attendance__wrap2 .att2__chev{
    display:flex;
    transform:translateY(-1px);
    transition:transform .2s ease;
}
#section-attendance .sec-attendance__wrap2 .att2__chev img{width:20px;}
#section-attendance .sec-attendance__wrap2 .att2__toggle[aria-expanded="true"] .att2__chev{
    transform:rotate(180deg) translateY(1px);
}

/* panel animation */
#section-attendance .sec-attendance__wrap2 .att2__panel{
    overflow:hidden;
    height:0;
    transition:height .22s ease;
}
#section-attendance .sec-attendance__wrap2 .att2__desc{
    margin:10px 0 0;
    color:#666;
    font-size:15px;
    line-height:1.65;
    letter-spacing:-.01em;
}


#section-feature.sec-feature{
    background:#fff;
    padding:120px 0;
}

/* 블록 간격 */
#section-feature .sec-feature__block + .sec-feature__block{
    margin-top:120px;
}

#section-feature .sec-feature__wrap, .sec-feature .sec-feature__wrap{
    max-width:1500px;
    margin:0 auto;
}

#section-feature .sec-feature__wrap2, .sec-feature .sec-feature__wrap2{
    max-width: 1850px;
    width: 95%;
    margin:0 auto;
}

/* 공통 타이틀 */
#section-feature .sec-feature__head, .sec-feature .sec-feature__head{
    text-align:center;
    margin-bottom:70px;
}
#section-feature .sec-feature__badge, .sec-feature .sec-feature__badge{
    display:inline-block;
    padding:13px 22px;
    border-radius:999px;
    background:linear-gradient(90deg,#7b7cff,#1bb6ff);
    color:#fff;
    font-size:25px;
    font-weight:500;
    margin-bottom:30px;
}
#section-feature .sec-feature__title, .sec-feature .sec-feature__title{
    margin:0;
    font-size:60px;
    font-weight:700;
    letter-spacing:-0.03em;
    line-height: 1.4;
}
#section-feature .sec-feature__desc, .sec-feature .sec-feature__desc{
    margin-top:25px;
    font-size:22px;
    color:#9c9b9b;
    line-height: 1.4;
}

#section-feature .sec-feature__desc span, .sec-feature .sec-feature__desc span{color:#000;}

/* 공통 컨텐츠 영역(디자인별로 안쪽에서 자유롭게) */
#section-feature .sec-feature__content{
    width:100%;
}

/* ===== 기능 01 전용 스타일(필요한 것만) ===== */
#section-feature .feature01__item{
    text-align:center;
}
#section-feature .feature01__item img{
    width:100%;
    height:560px;
    object-fit:cover;
    border-radius:28px;
    display:block;
}
#section-feature .feature01__item figcaption{
    margin-top:28px;
    font-size:24px;
    font-weight:600;
    letter-spacing:-0.02em;
}

/* swiper 여백 */
#section-feature .swiper-feature01{
    padding-bottom:40px;
}

#section-feature .swiper-button-next:after, #section-feature .swiper-button-prev:after{color:#000; font-size:20px;}
#section-feature .swiper-button-next, #section-feature .swiper-button-prev{width: 35px;
    height: 35px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100px;    top: 42%;}





#section-feature #feature-02{background:#f5f5f5; padding:65px 0;}
#section-feature #feature-02 .f02{padding:0;}
#section-feature #feature-02 .f02__grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:32px;
    align-items:stretch;
}

/* LEFT image */
#section-feature #feature-02 .f02__imgBox{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    background:#eee;
    height:100%;
    min-height:420px;
}
#section-feature #feature-02 .f02__imgBox img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* speech bubble */
#section-feature #feature-02 .f02__bubble{
    position:absolute;
    left:26%;
    top:28%;
    transform:translateX(-50%);
    background:linear-gradient(90deg,#5c7cff,#1bb6ff);
    color:#fff;
    font-weight:700;
    font-size:18px;
    padding:10px 18px;
    border-radius:999px;
    box-shadow:0 10px 24px rgba(0,0,0,.18);
    white-space:nowrap;
}

/* bottom caption on image */
#section-feature #feature-02 .f02__caption{
    position:absolute;
    left:55px;
    bottom:38px;
    color:#fff;
    text-shadow:0 8px 20px rgba(0,0,0,.45);
}
#section-feature #feature-02 .f02__capTitle{
    margin:0;
    font-size:52px;
    font-weight:600;
    letter-spacing:-0.03em;
    line-height:1.15;
}

/* RIGHT card */
#section-feature #feature-02 .f02__card{
    height:100%;
    min-height:420px;
    border-radius:28px;
    background:#fff;
    padding:65px 135px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

#section-feature #feature-02 .f02__icon img{
    width:104px;
    /*height:109px;*/
    object-fit:contain;
    display:block;
    border-radius:16px;
}

/* chips */
#section-feature #feature-02 .f02__chips{
    margin-top:65px;
    display:flex;
    flex-wrap:wrap;
    gap:14px 14px;
    width: 85%;
}
#section-feature #feature-02 .f02__chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:55px;
    padding:0 30px;
    background:#f8f8f8;
    border-radius:999px;
    font-size:24px;
    font-weight:500;
    color:#111;
    box-shadow:2px 3px 5px rgba(0,0,0,.08);
}

/* gradient sentence */
#section-feature #feature-02 .f02__grad{
    margin:65px 0 0;
    font-size:40px;
    font-weight:700;
    letter-spacing:-0.04em;
    line-height:1.15;
}
#section-feature #feature-02 .f02__grad span,
#section-feature #feature-02 .f02__grad b{
    background: linear-gradient(90deg, #1f6fff 0%, #ff4fd8 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
#section-feature #feature-02 .f02__grad b{font-weight:900}



#section-feature #feature-03 .f03{padding:0;}

/* PC grid: 3 columns */
#section-feature #feature-03 .f03__grid{
    display:grid;
    grid-template-columns: 1fr 1fr 2.15fr;
    gap:48px;
    align-items:start;
}

/* item */
#section-feature #feature-03 .f03__item{margin:0;}
#section-feature #feature-03 .f03__img{
    background:transparent;
}
#section-feature #feature-03 .f03__img img{
    width:100%;
    height:auto;
    display:block;
}

/* caption */
#section-feature #feature-03 .f03__cap{
    margin-top:22px;
    text-align:center;
    font-size:22px;
    font-weight:600;
    letter-spacing:-0.02em;
    color:#111;
}

#section-feature #feature-04{background:#f5f5f5; padding:65px 0;}
#section-feature .feature04__item{
    text-align:center;
}
#section-feature .feature04__item img{
    width:100%;
    /*height:575px;*/
    object-fit:cover;
    border-radius:28px;
    display:block;
}
#section-feature .feature04__item figcaption{
    margin-top:28px;
    font-size:24px;
    font-weight:600;
    letter-spacing:-0.02em;
}

/* swiper 여백 */
#section-feature .swiper-feature04{
    padding-bottom:60px;
}

#section-feature #feature-04 .sec-feature__content{max-width: 1280px; margin:auto;}

#section-feature #feature-04 .sec-feature__content2{text-align: right; font-size: 18px;}


#section-price #feature-05 .sec-feature__content{max-width: 1020px;
    margin: auto;}
#section-price #feature-05 .f05{padding:0;}

/* cards grid (PC) */
#section-price #feature-05 .f05__grid{
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap:48px;
    align-items:stretch;
}

/* card */
#section-price #feature-05 .f05__card{
    background:#fff;
    border-radius:26px;
    padding:44px 28px;
    box-shadow:0 22px 44px rgba(0,0,0,.08);
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    min-height:260px;
}

#section-price #feature-05 .f05__icon img{
    width:100px;
    height:80px;
    object-fit:contain;
    display:block;
}

/* text */
#section-price #feature-05 .f05__text{margin-top:22px;}

#section-price #feature-05 .f05__big{
    margin:0;
    font-size:20px;
    font-weight:500;
    letter-spacing:-0.03em;
    line-height:1.35;
    color:#111;
}
#section-price #feature-05 .f05__strike{
    color:#888;
    text-decoration:line-through;
    text-decoration-thickness:3px;
    text-decoration-color:#ff3b3b;
    margin:0 6px 0 4px;
}
#section-price #feature-05 .f05__blue{
    color:#2a44fb;
    font-size:28px;
    font-weight:700;
}

#section-price #feature-05 .f05__small{
    margin:14px 0 0;
    font-size:18px;
    font-weight:500;
    color:#222;
    letter-spacing:-0.02em;
}

/* big quote cards */
#section-price #feature-05 .f05__big2{
    margin:0;
    font-size:30px;
    font-weight:700;
    letter-spacing:-0.04em;
    line-height:1.25;
    color:#111;
}



/* 사용방법 */
#section-guide.sec-guide{
    background:#fff;
    padding:120px 0;
}
#section-guide .only-mo{display:none;}

/* track (PC는 grid) */
#section-guide .guide__track{
    display:grid;
    grid-template-columns: 380px 1.25fr 1fr;
    gap:34px;
    align-items:stretch;
    position:relative;
}

/* card */
#section-guide .guide__card{
    background:#f3f3f3;
    border-radius:26px;
    padding:38px 36px;
    min-height:520px;
    display:flex;
    flex-direction:column;
    margin:0;
}
#section-guide .guide__step{
    font-weight:700;
    font-size:26px;
    letter-spacing:-0.02em;
    background: linear-gradient(90deg, #1f6fff 0%, #ff4fd8 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
#section-guide .guide__ttl{
    margin:14px 0 0;
    font-size:28px;
    font-weight:700;
    letter-spacing:-0.03em;
    line-height:1.25;
    color:#111;
}

#section-guide .guide__inner{margin-top:45px;}

/* step1 device box */
#section-guide .guide__deviceBox{
    background:#fff;
    border-radius:20px;
    padding:28px 22px 20px;
}
#section-guide .guide__deviceTitle{
    font-size:25px;
    font-weight:600;
    letter-spacing:-0.02em;
    margin-bottom:16px;
    color:#111;
}
#section-guide .guide__store{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    padding:16px 0;
    border-top:1px solid #eee;
}
#section-guide .guide__store:first-of-type{border-top:0;}

#section-guide .guide__store2{position: relative;}
#section-guide .guide__store2:before{content:'곧 오픈예정';    position: absolute;
    height: 100%;
    width: 109%;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    left: -13px;
    top: 0;}

#section-guide .guide__badgeImg{
    max-width: 150px;
    width: 100vw;
    height:auto;
    display:block;
    margin-bottom:10px;
}
#section-guide .guide__os{
    font-weight:600;
    font-size:18px;
    color:#111;
}
#section-guide .guide__osDesc{
    margin-top:6px;
    font-size:14px;
    line-height:1.4;
    color:#666;
}
#section-guide .guide__download{
    margin-top:12px;
    font-weight:700;
    font-size:13px;
    color:#111;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    flex-direction: column;
    gap:8px;
}
#section-guide .guide__download:before{
    content:"";
    display:inline-block;
    width:20px;          /* 이미지 크기 */
    height:20px;
    margin-left:6px;     /* 텍스트와 간격 (필요시 조절) */
    background:url("../img/download.png") no-repeat center / contain;
    vertical-align:middle;
}

/* step2 placeholders */
#section-guide .guide__inner--split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    align-items:start;
}
#section-guide .guide__phBox{
    width:100%;
    aspect-ratio: 1 / 1;
    border-radius:18px;
    background:#4c7fe0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#111;
    font-weight:800;
}
#section-guide .guide__phCap{
    margin-top:20px;
    font-size:22px;
    font-weight:500;
    text-align:center;
    color:#111;
}

/* step3 image + talk card */
#section-guide .guide__img{
    width:100%;
    border-radius:18px;
    display:block;
}
#section-guide .guide__talk{
    background:#fff;
    border-radius:18px;
    padding:24px 18px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:90%;
}
#section-guide .guide__talkIcon{
    width:83px;
    height:auto;
    display:block;
    margin-bottom:12px;
}
#section-guide .guide__talkTitle{
    font-size:22px;
    font-weight:600;
    color:#111;
    margin:10px 0 10px;
}
#section-guide .guide__talkDesc{
    font-size:18px;
    color:#545454;
    line-height:1.4;
    text-align:center;
}

#section-guide .guide__arrow{display:none;}

#section-guide .guide__track{
    position:relative; /* 화살표 absolute 기준 */
}

/* 기존 grid 사이 칸으로 넣었던 화살표는 숨김(있다면) */
#section-guide .guide__arrowImg{display:none;}

/* 겹쳐지는 화살표 2개 */
#section-guide .guide__arrowFloat{
    position:absolute;
    top:50%;
    transform:translate(-50%,-50%);
    z-index:5; /* 카드 위로 */
    pointer-events:none; /* 클릭 방해 X */
}
#section-guide .guide__arrowFloat img{
    width:56px;     /* 시안 크기에 맞게 조절 */
    height:auto;
    display:block;
}

/* 1번: STEP1~STEP2 사이 */
#section-guide .guide__arrowFloat.is-1{
    left:395px;
}
/* 2번: STEP2~STEP3 사이 */
#section-guide .guide__arrowFloat.is-2{
    left:66.666%;
}

#section-guide .guide__card2 .guide__inner--split{    grid-template-columns: 1.25fr 1fr;    width: 87%; margin:45px auto 0;}

#section-guide .guide__card3 .guide__inner--split{}


#section-guide2.sec-guide2{
    background:#fff;
    padding:120px 0;
}

#section-guide2.sec-guide2 .swiper-button-next:after, #section-guide2.sec-guide2 .swiper-button-prev:after{color:#000; font-size:20px;}
#section-guide2.sec-guide2 .swiper-button-next, #section-guide2.sec-guide2 .swiper-button-prev{width: 35px;
    height: 35px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100px;    }

/* 탭 */
#section-guide2 .g2-tabs{
    margin:44px auto 34px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
}
#section-guide2 .g2-tab{
    border:0;
    background:#f2f2f2;
    color:#111;
    font-weight:800;
    font-size:18px;
    padding:14px 26px;
    border-radius:999px;
    cursor:pointer;
}
#section-guide2 .g2-tab.is-active{
    background:#2b2b2b;
    color:#fff;
}

/* swiper/slide */
#section-guide2 .g2-swiper{
    overflow:hidden;
    padding:0;
}
#section-guide2 .g2-slide{height:auto;}
#section-guide2 .g2-card{
    border-radius:26px;
    background:#eee;
    overflow:hidden;
}
#section-guide2 .g2-card img{
    width:100%;
    object-fit:cover;
    display:block;
}

/* PC: 슬라이드가 3개 나란히 보이게(스크립트의 1025 브레이크포인트 3개와 맞춤) */
@media (min-width:1025px){
    #section-guide2 .g2-swiper{
        max-width: 845px;
        margin: auto;
    }
    #section-guide2 .g2-card img{

    }

    /* 화살표 숨기고 싶으면 주석 해제 */
    /* #section-guide2 .swiper-button-prev-feature04,
       #section-guide2 .swiper-button-next-feature04{display:none;} */
}


#section-trial.sec-trial{
    background:#333;
    padding:110px 0 0;
    color:#fff;
}
#section-trial .sec-trial__inner{
    text-align:center;
    padding-bottom:34px;
}
#section-trial .sec-trial__eyebrow{
    margin:0 0 35px;
    font-size:40px;
    font-weight:500;
    color:#7f8cff;
    letter-spacing:-0.02em;
}
#section-trial .sec-trial__title{
    margin:0 0 45px;
    font-size:60px;
    font-weight:700;
    line-height: 1.4;
    letter-spacing:-0.03em;
}
#section-trial .sec-trial__desc{
    margin:0;
    font-size:22px;
    line-height:1.7;
    color:#fff;
}

#section-trial .sec-trial__desc span{font-size:30px; line-height: 1.4;}

/* marquee */
#section-trial .sec-trial__marquee{
    width:100%;
    overflow:hidden;
    background: linear-gradient(90deg, #6a67ff 0%, #11a7c9 100%);
}
#section-trial .sec-trial__marqueeTrack{
    display:flex;
    gap:100px;
    padding:12px 0;
    white-space:nowrap;
    will-change:transform;
    animation: trialMarquee 14s linear infinite;
}
#section-trial .sec-trial__marqueeTrack span{
    color:#fff;
    font-size:20px;
    font-weight:500;
    letter-spacing:-0.01em;
    cursor: pointer;
}

@keyframes trialMarquee{
    0%{ transform:translateX(0); }
    100%{ transform:translateX(-50%); }
}

/* video box */
#section-trial .sec-trial__videoWrap{
    text-align:center;
    padding:46px 0 70px;
}
#section-trial .sec-trial__videoBox{
    max-width:980px;
    margin:0 auto;
    background:#2a2a2a;
    border-radius:28px;
    padding:0;
    overflow:hidden;
}

#section-trial .sec-trial__videoBox{
    /*height:585px;*/
}

/* ? video가 박스 꽉 채우기 */
#section-trial .sec-trial__video{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}
#section-trial .sec-trial__videoPh{
    height:420px;
    background:#cfcfcf;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:36px;
    font-weight:900;
    color:#111;
}
#section-trial .sec-trial__cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:50px auto 50px;
    padding:16px 44px;
    border-radius:999px;
    background:#2d56ff;
    color:#fff;
    text-decoration:none;
    font-weight:500;
    font-size:25px;
}
#section-trial .sec-trial__note{
    margin:0;
    font-size:20px;
    color:rgba(255,255,255,.75);
}

/* event2 (white) */
#section-trial .sec-trial__event2{
    background:#fff;
    color:#111;
    padding:86px 0 96px;
    text-align:center;
}
#section-trial .sec-trial__eyebrow2{
    margin:0 0 18px;
    font-size:22px;
    font-weight:800;
    color:#7f8cff;
}
#section-trial .sec-trial__title2{
    margin:0 0 28px;
    font-size:46px;
    font-weight:900;
    letter-spacing:-0.03em;
}
#section-trial .sec-trial__chips{
    display:flex;
    gap:14px;
    align-items:center;
    justify-content:center;
    margin-bottom:22px;
}
#section-trial .sec-trial__chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#2d56ff;
    color:#fff;
    padding:8px 14px;
    border-radius:8px;
    font-weight:700;
    font-size:30px;
}
#section-trial .sec-trial__chip2{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#2d56ff;
    font-weight:700;
    font-size:40px;
}
#section-trial .sec-trial__price{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    background:#f4f4f4;
    border-radius:14px;
    padding:28px 26px;
    margin: 45px auto 60px;
    max-width: 400px;
}
#section-trial .sec-trial__old{
    font-size: 45px;
    font-weight: 400;
    color:#666;
    text-decoration:line-through;
    text-decoration-color:#ff3b3b;
    text-decoration-thickness:3px;
}
#section-trial .sec-trial__arrow{
    font-size:18px;
    font-weight:900;
    color:#666;
}
#section-trial .sec-trial__new{
    font-size: 58px;
    font-weight: 700;
    color:#cc0000;
}
#section-trial .sec-trial__cta2{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:16px 54px;
    border-radius:999px;
    background:#2d56ff;
    color:#fff;
    text-decoration:none;
    font-weight: 500;
    font-size: 25px;
}

#section-faq{
    background:#f9f9f9;
    padding:110px 0 120px;
}

#section-faq .sec-feature__content{max-width: 1125px; margin:auto;}

/* tabs */
#section-faq .faq-tabs{
    margin:52px auto 0;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:13px;
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:10px;
}
#section-faq .faq-tabs::-webkit-scrollbar{height:6px;}
#section-faq .faq-tabs::-webkit-scrollbar-thumb{background:#ddd;border-radius:999px;}

#section-faq .faq-tab{
    border:0;
    background:transparent;
    font-size:18px;
    font-weight:600;
    padding:12px 10px;
    border-radius:999px;
    cursor:pointer;
    color:#111;
    white-space:nowrap;
}
#section-faq .faq-tab.is-active{
    background:#000;
    color:#fff;
}

#section-faq .faq-divider{
    margin-top:10px;
    border-bottom:2px solid #111;
}

/* panels */
#section-faq .faq-panel{display:none;}
#section-faq .faq-panel.is-active{display:block;}

#section-faq .faq-acc{
    padding-top:28px;
}

/* Q row */
#section-faq .faq-item{
    border-bottom:1px solid #e8e8e8;
    padding:22px 0;
}
#section-faq .faq-q{
    width:100%;
    border:0;
    background:transparent;
    display:flex;
    gap:10px;
    align-items:flex-start;
    justify-content:flex-start;
    text-align:left;
    cursor:pointer;
    padding:0;
}
#section-faq .faq-q__q{
    font-weight:900;
    font-size:20px;
    color:#111;
    flex:0 0 auto;
}
#section-faq .faq-q__txt{
    font-weight:700;
    font-size:22px;
    color:#111;
    line-height:1.35;
}

/* A box */
#section-faq .faq-a{
    margin-top:18px;
}
#section-faq .faq-a__box{
    background:#fff;
    border-radius:14px;
    padding:20px 22px;
    display:flex;
    gap:10px;
    align-items:center;
}
#section-faq .faq-a__a{
    font-weight:600;
    font-size:18px;
    color:#111;
    flex:0 0 auto;
    margin-top:1px;
}
#section-faq .faq-a__txt{
    margin:0;
    color:#111;
    font-size:17px;
    line-height:1.7;
}

/* empty */
#section-faq .faq-empty{
    padding:36px 0 18px;
    color:#777;
    font-weight:700;
}



.site-footer{
    background:#fff;
    padding:90px 0 90px;
}
.site-footer__inner{
    display:grid;
    grid-template-columns: 175px  348px 1fr; /* PC: 로고 / 회사정보 / 고객센터 */
    gap:60px;
    align-items:start;
    max-width: 1280px;
}

/* brand */
.site-footer__brand .logo_bottom img{
    height:58px; /* 시안 느낌으로 크게 */
    display:block;
}

/* links (회사소개 · 이용약관 · 개인정보취급방침) */
.site-footer__links{
    display:flex;
    align-items:center;
    gap:14px;
    font-size:18px;
    font-weight:700;
    color:#111;
    margin:6px 0 22px;
}
.site-footer__links a{color:#111; text-decoration:none;}
.site-footer__links a:hover{text-decoration:underline;}
.site-footer__links .dot{opacity:.5;}

/* company info */
.site-footer__info{
    font-size:14px;
    line-height:1.6;
    color:#111;
}
.site-footer__info .info-line{margin:2px 0;}

/* copy */
.site-footer__copy{
    margin-top:34px;
    font-size:14px;
    letter-spacing:.02em;
    color:#111;
}

/* cs */
.site-footer__cs{
    /*justify-self:end;*/
    text-align:left;
}
.site-footer__cs .cs-title{
    font-size:25px;
    font-weight:700;
    color:#111;
    margin-bottom:15px;
}
.site-footer__cs .cs-time{
    font-size:15px;
    color:#9c9b9b;
    font-weight:600;
    margin-bottom:16px;
}
.site-footer__cs .cs-mail{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 22px;
    border:1px solid #d7d7d7;
    border-radius:999px;
    background:#fff;
    color:#111;
    font-weight:600;
    text-decoration:none;
}
.site-footer__cs .cs-mail:hover{
    border-color:#bdbdbd;
}

.quick{
    width:55px;
    position:fixed;
    right:35px;
    bottom:90px;
    z-index:9;

    /* ? 배경 제거 */
    background:none;
    box-shadow:none;

    display:flex;
    flex-direction:column;
    gap:12px;
}

/* 버튼 */
.quick a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;

    /*background:#fff;*/
    border-radius:999px;
    padding:0px;
    box-shadow:0 8px 20px rgba(0,0,0,.15);
    transition:transform .2s ease, box-shadow .2s ease;
}

.quick a:hover{
    transform:translateX(-4px);
    box-shadow:0 12px 26px rgba(0,0,0,.2);
}

.quick a span{    font-size: 10px;
    text-align: center;
    padding: 5px 0;}

.quick img{
    width:55px;
    height:55px;
    object-fit:contain;
}

/* ===== hover 텍스트 ===== */
.quick a::before{
    content: attr(data-label);
    position:absolute;
    right:calc(100% + -55px);
    top:50%;
    transform:translateY(-50%);
    padding:19px 75px 19px 25px;
    border-radius:999px;
    background:#f4f4f4;
    color:#000;
    font-size:18px;
    font-weight:500;
    white-space:nowrap;
    opacity:0;
    visibility:hidden;
    transition:.2s ease;
    z-index: -1;
    min-width: 75px;
}

.quick a::after{
    /*content:"";
    position:absolute;
    right:calc(100% + 8px);
    top:50%;
    transform:translateY(-50%);
    border:6px solid transparent;
    border-left-color:#111;

    opacity:0;
    visibility:hidden;*/
}

.quick a:hover::before,
.quick a:hover::after{
    opacity:1;
    visibility:visible;
}

/* TOP 버튼 살짝 구분 */
.quick .q_top{
    background:#fff;
}


.link_info_popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 999;
}

.link_info_popup .close-popup{background: none; border: 0;}
.link_info_popup .close-popup img{width:20px;}

.link_info_popup h3{font-size: 22px; line-height: 35px; margin: 0 0 30px 0;}
.link_info_popup .name{font-size: 25px; font-weight: 600;    text-align: left; margin: 0 0 20px 0;}
.link_info_popup .popup-content {
    /*background-color:#f7f7f7;
    padding: 60px 55px;
    border-radius: 10px;
    width: 490px;*/
    text-align: center;
    position: relative;
}

.link_info_popup .popup-content .in_box{width:350px; border-radius: 5px;    background: #f5f5f5;    overflow: hidden;}
.link_info_popup .popup-content .in_box h2{    font-size: 20px;    font-weight: 600;
    padding: 10px 0;
    color: #fff;
    background: #000;}
.link_info_popup .popup-content .in_box .in_box_con{padding:15px 15px;}
.link_info_popup .popup-content .in_box .in_box_con .link1{}
.link_info_popup .popup-content .in_box .in_box_con .link1 a{font-size: 16px; color: #fff; background:#000; border-radius: 5px;    display: block;  padding: 10px 0;  }

#pop_price.link_info_popup .popup-content .in_box h2{background: #f6c845;}
#pop_price.link_info_popup .popup-content .in_box .in_box_con .text1{font-size: 22px;    padding: 20px 0 10px;}
#pop_price.link_info_popup .popup-content .in_box .in_box_con .text2{font-size: 25px; font-weight: 700;    padding: 5px 0 25px;}

#pop_trial.link_info_popup .in_box_all{    display: flex;   gap: 40px;}
#pop_trial.link_info_popup .popup-content .in_box{}
#pop_trial.link_info_popup .popup-content .in_box .in_box_con,
#pop_trial2.link_info_popup .popup-content .in_box .in_box_con,
#pop_trial3.link_info_popup .popup-content .in_box .in_box_con{    padding: 0;}
#pop_trial.link_info_popup .popup-content .in_box .in_box_con .img1{    margin: 20px 0;}
#pop_trial.link_info_popup .popup-content .in_box .in_box_con .img1 img,
#pop_trial2.link_info_popup .popup-content .in_box .in_box_con .img1 img,
#pop_trial3.link_info_popup .popup-content .in_box .in_box_con .img1 img{width:80%;}
#pop_trial.link_info_popup .popup-content .in_box .in_box_con .link1 a,
#pop_trial2.link_info_popup .popup-content .in_box .in_box_con .link1 a,
#pop_trial3.link_info_popup .popup-content .in_box .in_box_con .link1 a{border-radius: 0;    background: linear-gradient(135deg, var(--cta1), var(--cta2));}


#pop_cs.link_info_popup .popup-content .in_box h2{background: #4b8fe4;}
#pop_cs.link_info_popup .popup-content input {
    margin-bottom: 10px;
    padding: 5px 10px;
    width: 100%;
    font-size: 14px;
    border: 0;
    border-radius: 5px;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, .15);
}

#pop_cs.link_info_popup .popup-content textarea{border: 0;
    width: 100%;
    border-radius: 5px;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, .15);
    padding: 5px 10px;
    min-height: 110px;}
#pop_cs.link_info_popup .popup-content button.btn_ok{font-size: 16px; color: #fff; background:#000; border-radius: 5px;    display: block;  padding: 10px 0;     border: 0;
    width: 100%;
    margin: 10px 0 15px 0; cursor: pointer;}
#pop_cs.link_info_popup .popup-content .btn2 a{font-size: 16px;     font-weight: 500;color: #000; background:#ffe812; border-radius: 5px;   padding: 10px 0;     border: 0;  width: 100%;    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px; width:350px;    margin: 15px 0 0 0;}
#pop_cs.link_info_popup .popup-content .btn2 a img{    width: 25px;}


#terms-of-service.link_info_popup .popup-content .in_box, #privacy-policy.link_info_popup .popup-content .in_box{width:100%; max-width:700px}

.link_info_popup .popup-content p{    max-height: 250px;  overflow-y: auto;     width: 95%;
    margin: 25px auto; text-align: left;font-size: 14px;
    line-height: 20px;}
.link_info_popup .popup-content p b{margin: 0px 0 5px; display: block;}

.link_info_popup .popup-content button.close-popup {
    border: none;
    border-radius: 0px;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: -35px;
}
.link_info_popup .popup-content button:hover {
    /*background-color: #020a37;*/
}





/* 미디어 쿼리: 화면 크기가 1024px 이하일 때 */
@media (max-width:1024px) {
    .display_pc_only{display:none;}
    .display_tablet_only{display:block;}
    .container{padding:0 10px;}

    .header-inner{
        width:100%;
        margin:0;
    }

    .header-row--top{
        width:calc(100% - 32px);
        margin:0 auto;
        height:var(--h-mo-top);
    }

    .logo{min-width:auto}
    .logo img{height:35px}

    .nav--pc{display:none}

    .cta-btn{
        height:38px;
        padding:0 14px;
        font-size:13px;
    }

    .site-header{}

    .nav--mo{
        display:block;
        background:transparent;
        border-top:1px solid #fff;
        border-bottom:1px solid #fff;
    }

    .nav--mo ul{
        list-style:none;
        margin:0;
        padding:0;
        display:grid;
        grid-template-columns: repeat(4, 1fr);
        height:var(--h-mo-nav);
    }

    .nav--mo li{
        display:flex;
        align-items:center;
        justify-content:center;
        /*border-right:1px solid var(--mo-divider);*/
    }
    .nav--mo li:last-child{border-right:none}

    .nav--mo .nav-link{
        font-size:14px;
        font-weight:600;
        opacity:1;
    }

    /* 모바일에서는 헤더 총 높이가 2줄 */
    section{scroll-margin-top: calc(var(--h-mo-top) + var(--h-mo-nav));}
    .wrap1500{
        max-width:1500px;
        margin:0 auto;
        padding:0 32px;
    }

    .main0{
        min-height:460px;
        margin: -105px 0 0 0;
    }
    .main0 .in_text{
        left:15px;
        top:140px;
        transform: translate(0%, 0%);
        font-size:26px;
        white-space:normal;
    }
    .main0 .in_text .t01 { font-size: 30px;}
    .main0 .in_text .t02 { font-size: 24px;    margin: 10px 0 0 0;}
    .main0 .text-wrap{min-height:615px;}

    .sec-attendance{
        padding:54px 0 60px;
    }
    .sec-attendance .sec-attendance__wrap{
        padding:0 0px;
    }
    .sec-attendance .sec-attendance__title{
        font-size:25px;
        line-height:1.22;
        margin: 0 auto 25px;
    }

    .sec-attendance .sec-attendance__grid{
        margin-top:26px;
        grid-template-columns: 1fr 1fr;
        gap:16px;
    }

    .sec-attendance .line_box{padding:25px 0 50px;}

    /* mosaic placement */
    .sec-attendance .sec-attendance__card:nth-child(1){grid-column:1; grid-row:1;}
    .sec-attendance .sec-attendance__card:nth-child(3){grid-column:1; grid-row:2;}
    .sec-attendance .sec-attendance__card:nth-child(2){grid-column:2; grid-row:1 / span 2;}

    /* heights */
    .sec-attendance .sec-attendance__card:nth-child(1) .sec-attendance__thumb img,
    .sec-attendance .sec-attendance__card:nth-child(3) .sec-attendance__thumb img{
        height:115px;
    }
    .sec-attendance .sec-attendance__card:nth-child(2) .sec-attendance__thumb img{
        height:250px;
    }

    /* radius slightly smaller on mobile */
    .sec-attendance .sec-attendance__thumb{border-radius:18px}
    .sec-attendance .sec-attendance__thumb img{border-radius:18px}

    /* mobile: show overlay title on image, hide below caption */
    .sec-attendance .sec-attendance__cap{display:none;}
    .sec-attendance .sec-attendance__overlayTitle{
        display:block;
        position:absolute;
        left:14px;
        top:14px;
        color:#fff;
        font-weight:600;
        font-size:16px;
        letter-spacing:-0.02em;
        text-shadow: 0 2px 12px rgba(0,0,0,.45);
        z-index:2;
    }

    .sec-attendance .sec-attendance__source{
        right:12px;
        bottom:10px;
        font-size:11px;
    }

    .sec-attendance .sec-attendance__grad{
        margin-top:26px;
        font-size:25px;
    }


    #section-attendance.sec-attendance .sec-attendance__wrap2{
        padding:38px 0 0px;
    }

    #section-attendance .sec-attendance__wrap2 .att2__grid{
        grid-template-columns: 1fr;
        gap:18px;
    }

    #section-attendance .sec-attendance__wrap2 .att2__hero{
        min-height:320px;
        border-radius:20px;
    }
    #section-attendance .sec-attendance__wrap2 .att2__heroText{
        left:22px;
        bottom:22px;
    }
    #section-attendance .sec-attendance__wrap2 .att2__pill{
        height:40px;
        padding:0 22px;
        font-size:18px;
    }
    #section-attendance .sec-attendance__wrap2 .att2__headline{
        font-size:35px;
        margin:25px 0 20px;
    }
    #section-attendance .sec-attendance__wrap2 .att2__sub{
        font-size:18px;
    }

    #section-attendance .sec-attendance__wrap2 .att2__item{
        grid-template-columns: 65px 1fr;
        padding:22px 20px;
        border-radius:18px;
        margin:0;
    }
    #section-attendance .sec-attendance__wrap2 .att2__icon img{
        width:58px; height:58px;
    }
    #section-attendance .sec-attendance__wrap2 .att2__title{
        font-size:22px;
    }

    #section-attendance .sec-attendance__wrap2 .att2__desc{font-size: 12px;}


    #section-feature.sec-feature{padding:60px 0;}
    #section-feature .sec-feature__block + .sec-feature__block{margin-top:55px;}
    #section-feature .sec-feature__head, .sec-feature .sec-feature__head{margin-bottom:40px;}
    #section-feature .sec-feature__title, .sec-feature .sec-feature__title{font-size:36px;}
    #section-feature .sec-feature__desc, .sec-feature .sec-feature__desc{font-size:16px; margin-top: 15px;}

    #section-feature .sec-feature__badge, .sec-feature .sec-feature__badge{font-size: 18px;    margin-bottom: 20px;}

    #section-feature .feature01__item img{
        height:auto;
        border-radius:22px;
    }
    #section-feature .feature01__item figcaption{
        font-size:18px;
        margin-top:15px;
    }


    #section-feature #feature-02 .f02__grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    #section-feature #feature-02 .f02__imgBox{
        min-height:235px;
        border-radius:26px;
    }

    #section-feature #feature-02 .f02__bubble{
        left:32%;
        top:38%;
        font-size:18px;
        padding:10px 18px;
    }

    #section-feature #feature-02 .f02__icon img {
        width: 60px;}

    #section-feature #feature-02 .f02__caption{
        left:22px;
        bottom:18px;
    }
    #section-feature #feature-02 .f02__capTitle{
        font-size:28px; /* 시안처럼 크게 */
        line-height:1.05;
    }

    #section-feature #feature-02 .f02__card{
        min-height:auto;
        border-radius:26px;
        padding:34px 26px 40px;
    }

    #section-feature #feature-02 .f02__chips{
        margin-top:22px;
        gap:14px;
    }
    #section-feature #feature-02 .f02__chip{
        height:40px;
        padding:0 22px;
        font-size:18px;
    }

    #section-feature #feature-02 .f02__grad{
        margin-top:34px;
        font-size:28px;
    }


    /* 2개는 위에 나란히, 1개는 아래 전체 */
    #section-feature #feature-03 .f03__grid{
        grid-template-columns: repeat(2, 1fr);
        gap:24px 18px;
    }

    /* 3번째(리더보드)는 아래로 크게 */
    #section-feature #feature-03 .f03__item--wide{
        grid-column: 1 / -1;
        margin-top:6px;
    }

    #section-feature #feature-03 .f03__cap{
        margin-top:16px;
        font-size:15px;
    }

    #section-feature .feature04__item img{

        border-radius:22px;
    }
    #section-feature .feature04__item figcaption{
        font-size:16px;
        margin-top:18px;
    }

    #section-feature #feature-04 .sec-feature__content2{font-size: 14px;}


    #section-price #feature-05 .only-mo{display:block;}

    /* 2개 위 + 1개 아래 크게 (시안 느낌) */
    #section-price #feature-05 .f05__grid{
        grid-template-columns: repeat(2, 1fr);
        gap:0px;
    }

    /* 카드 기본 */
    #section-price #feature-05 .f05__card{
        padding:20px 20px;
        border-radius:24px;
        min-height:185px;
    }

    #section-price #feature-05 .f05__icon img{
        width:85px;
        height:auto;
    }

    #section-price #feature-05 .f05__big2{
        font-size:20px;
    }

    /* 1번 카드(업계 최저가 9원) -> 아래 전체폭 */
    #section-price #feature-05 .f05__card:nth-child(1){
        grid-column: 1 / -1;
        order:3;
        min-height:135px;
        flex-direction: row;
        align-items: center;
    }
    #section-price #feature-05 .f05__card:nth-child(1) .f05__text{margin-top: 0;}

    #section-price #feature-05 .f05__text{margin-top: 20px;}

    /* 위쪽 두 카드 순서 유지 */
    #section-price #feature-05 .f05__card:nth-child(2){order:1;}
    #section-price #feature-05 .f05__card:nth-child(3){order:2;}

    #section-price #feature-05 .f05__big{
        font-size:20px;
    }
    #section-price #feature-05 .f05__blue{
        font-size:34px;
    }
    #section-price #feature-05 .f05__small{
        font-size:18px;
        margin: 5px 0 0;
    }

    #section-guide.sec-guide{padding:90px 0;}
    #section-guide .only-mo{display:block;}


    #section-guide .guide{        overflow-x: auto;}

    #section-guide .guide__track{
        width: 1408px;
        grid-template-columns: 295px 1.25fr 1fr;
        gap:18px;
        overflow-x:auto;
        padding:0 0px;
        scroll-snap-type:x mandatory;
        -webkit-overflow-scrolling:touch;
    }
    #section-guide .guide__card{
        flex:0 0 78%;
        scroll-snap-align:center;
        min-height:560px;
        padding:34px 26px;
    }
    #section-guide .guide__step{font-size:24px;}
    #section-guide .guide__ttl{font-size:24px;}
    #section-guide .guide__store{  flex-direction: column;}
    #section-guide .guide__store2:before{width:112%;}
    #section-guide .guide__download{    flex-direction: revert;    margin-top: 0px; }

    #section-guide .guide__deviceTitle { font-size: 20px;}

    #section-guide .guide__arrowFloat img { width: 40px;}
    #section-guide .guide__arrowFloat.is-1 { left: 310px;}
    #section-guide .guide__arrowFloat.is-2 { left: 65.366%;}

    /* 모바일에서는 화살표는 카드 사이에 한 개만(옵션) */
    #section-guide .guide__arrow{display:none;}

    /* step2 2개 박스는 그대로 */
    #section-guide .guide__phCap{font-size:16px;}
    #section-guide .guide__badgeImg{        max-width: 100%;    margin-bottom: 15px;}
    #section-guide .guide__talkIcon{width:92px;}
    #section-guide .guide__talkTitle{font-size:18px;}



    #section-guide2.sec-guide2{
        padding:90px 0;
    }

    #section-guide2 .g2-tabs{
        margin:28px auto 22px;
        gap:14px;
    }
    #section-guide2 .g2-tab{
        font-size:16px;
        padding:12px 18px;
    }

    #section-guide2 .g2-card{
        border-radius:26px;
    }
    #section-guide2 .g2-card img{
        height:420px;
    }

    /* 모바일 화살표(시안처럼 이미지 위에 겹치는 위치) */
    #section-guide2 .swiper-button-prev-feature04,
    #section-guide2 .swiper-button-next-feature04{
        width:56px;
        height:56px;
        border-radius:999px;
        background:rgba(255,255,255,.85);
        box-shadow:0 14px 28px rgba(0,0,0,.14);
    }
    #section-guide2 .swiper-button-prev-feature04:after,
    #section-guide2 .swiper-button-next-feature04:after{
        font-size:18px;
        font-weight:900;
        color:#111;
    }

    #section-trial .sec-trial__marqueeTrack{gap:50px;}
    #section-trial .sec-trial__marqueeTrack span{font-size: 16px;}
    #section-trial.sec-trial{padding:40px 0 0;}
    #section-trial .sec-trial__eyebrow{font-size:28px;    margin: 0 0 15px;}
    #section-trial .sec-trial__title{font-size:40px;    margin: 0 0 25px;}
    #section-trial .sec-trial__desc{font-size:18px;}
    #section-trial .sec-trial__desc span {
        font-size: 20px;}

    #section-trial .sec-trial__videoWrap{padding:36px 10px 56px;}
    #section-trial .sec-trial__videoPh{height:360px; font-size:30px;}

    #section-trial .sec-trial__videoBox{
        height:615px; position:relative;        width: 62%;
    }

    #section-trial .sec-trial__videoBox video{left: 50%;
        transform: translateX(-50%);
        position: absolute;}
    #section-trial .sec-trial__cta{font-size:20px; padding:15px 40px;}
    #section-trial .sec-trial__note{font-size:15px;}

    #section-trial .sec-trial__event2{padding:70px 0 74px;}
    #section-trial .sec-trial__title2{font-size:34px;}
    #section-trial .sec-trial__chip2{font-size:22px;}

    #section-trial .sec-trial__chip{font-size: 22px;}
    #section-trial .sec-trial__old {  font-size: 36px;}
    #section-trial .sec-trial__new {  font-size: 40px;}
    #section-trial .sec-trial__cta2{font-size: 18px;}



    #section-faq .sec-feature__wrap2{width:100%;}
    #section-faq .container{padding:0;}
    #section-faq{padding:60px 0 60px;}
    #section-faq .faq-tabs{
        display:grid;
        grid-template-columns: repeat(3, 1fr);
        gap:0;
        margin-top:30px;
        padding-bottom:0;
        overflow:visible;
        border-top: 1px solid #111;
        border-bottom:none;
    }
    #section-faq .faq-tab{
        border-radius:0;
        padding:10px 8px;
        font-size:16px;
        font-weight:600;
        border-right:1px solid #111;
        border-bottom:1px solid #111;
    }
    #section-faq .faq-tab:nth-child(3n){border-right:none;}
    #section-faq .faq-tab.is-active{
        background:#000;
        color:#fff;
    }
    #section-faq .faq-divider{display:none;}

    #section-faq .faq-q{padding:0 10px;}
    #section-faq .faq-a{padding:0 10px;    align-items: flex-start;}


    #section-faq .faq-q__txt{font-size:18px;}
    #section-faq .faq-a__txt{font-size:15px;}



    .site-footer{
        padding:54px 0 66px;
        margin:70px 0 0;
    }
    .site-footer__inner{
        grid-template-columns: 1fr;
        gap:26px;
    }

    /* 모바일은 로고가 맨 위 */
    .site-footer__brand .logo_bottom img{
        height:54px;
    }

    /* 고객센터가 2번째(시안처럼) */
    .site-footer__cs{
        justify-self:start;
        order:2;
    }

    /* 회사정보가 3번째 */
    .site-footer__company{
        order:3;
    }

    .site-footer__links{
        margin:16px 0 18px;
        font-size:14px;
        gap:10px;
        flex-wrap:wrap;
    }

    .site-footer__info{
        font-size:13px;
        line-height:1.85;
    }

    .site-footer__copy{
        margin-top:24px;
        font-size:12px;
    }


    .quick{
        width:40px;
        right:14px;
        bottom:115px;
    }
    .quick img{
        width:40px;
        height:40px;
    }
    .quick a{    border-radius: 100px 100px 20px 20px;    background: rgba(255, 255, 255, .8)}
    .quick a.n_text{background:transparent; border-radius: 100px}

    .quick a::before,
    .quick a::after{
        display:none;
    }


    .link_info_popup .popup-content{ }
    .link_info_popup .name { font-size: 20px;}
    .link_info_popup .popup-content input{font-size: 15px;}
    .link_info_popup .popup-content button{font-size: 18px;}
    .link_info_popup h3 { font-size: 20px; line-height: 30px; margin: 0 0 20px 0;}

    .link_info_popup .popup-content .in_box h2 { font-size: 18px;}
    #pop_trial.link_info_popup .popup-content .in_box .in_box_con .img1 img{    width: 80px;}

    #pop_trial.link_info_popup .popup-content .in_box_all{width:100%;}
    #pop_trial.link_info_popup .popup-content .in_box {  width: 145px; }



}

/* 미디어 쿼리: 화면 크기가 480px 이하일 때 */
@media (max-width: 480px) {
    /* 박스가 너무 좁아서(62%) 잘리므로 모바일은 꽉 쓰기 */
    #section-trial .sec-trial__videoBox{
        width: 100%;
    }
    .main0__bg{
        object-fit:cover;
    }
}



:root{
    --header-bg:#0b0b0c;       /* 상단(검정) */
    --mo-bar:#3a3a3c;          /* 모바일 메뉴바(진회색) */
    --mo-divider:#4a4a4d;
    --text:#ffffff;
    --muted:#d1d5db;

    --cta1:#6a5cff;
    --cta2:#2fb8ff;

    --container: 1500px;
    --radius: 999px;

    /* 고정헤더 높이(PC/모바일) */
    --h-pc: 100px;
    --h-mo-top: 64px;
    --h-mo-nav: 40px;
}

/* 2026-02-23 추가, 하단이벤트배너 */
/* 배너 전체 */
.bottom-signup-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(17, 24, 39, 0.95); /* 진한 반투명 */
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.15);
}

/* 내부 정렬 */
.bottom-signup-banner__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

/* 왼쪽 */
.bottom-signup-banner__left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.bottom-signup-banner__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #2f7cf6;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.2px;
}

.bottom-signup-banner__text {
    min-width: 0;
}

.bottom-signup-banner__title {
    margin: 0;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.2px;
}

.bottom-signup-banner__desc {
    margin: 2px 0 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

/* 오른쪽 버튼 영역 */
.bottom-signup-banner__right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.bottom-signup-banner__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    padding: 0 14px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    transition: transform 0.15s ease, opacity 0.15s ease, background-color 0.15s ease;
}

.bottom-signup-banner__btn:hover {
    transform: translateY(-1px);
}

.bottom-signup-banner__btn--primary {
    background: #22c55e;
    color: #fff;
}

.bottom-signup-banner__btn--primary:hover {
    opacity: 0.95;
}

.bottom-signup-banner__btn--ghost {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.bottom-signup-banner__btn--ghost:hover {
    background: rgba(255, 255, 255, 0.13);
}

/* 닫기 버튼 */
.bottom-signup-banner__close {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.bottom-signup-banner__close:hover {
    background: rgba(255, 255, 255, 0.08);
}

/* 숨김 상태 */
.bottom-signup-banner.is-hidden {
    display: none;
}

/* =========================
   반응형 (태블릿/모바일)
   ========================= */
@media (max-width: 900px) {
    body {
        padding-bottom: 132px;
    }

    .bottom-signup-banner__inner {
        padding: 12px 14px;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .bottom-signup-banner__left {
        align-items: flex-start;
    }

    .bottom-signup-banner__title {
        font-size: 15px;
    }

    .bottom-signup-banner__desc {
        font-size: 12px;
    }

    .bottom-signup-banner__right {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr auto;
        gap: 8px;
    }

    .bottom-signup-banner__btn {
        width: 100%;
        height: 40px;
        padding: 0 10px;
        font-size: 13px;
    }

    .bottom-signup-banner__close {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 480px) {
    body {
        padding-bottom: 144px;
    }

    .bottom-signup-banner__badge {
        height: 24px;
        font-size: 11px;
        padding: 0 8px;
    }

    .bottom-signup-banner__title {
        font-size: 14px;
    }

    .bottom-signup-banner__desc {
        font-size: 11px;
    }

    .bottom-signup-banner__right {
        grid-template-columns: 1fr auto;
    }

    .bottom-signup-banner__btn--ghost {
        display: none; /* 아주 작은 화면에서는 보조 버튼 숨김 */
    }
}