/**/
/* AOS 기본 이동 거리 축소 */
[data-aos="fade-up"]{transform:translate3d(0,12px,0);}
[data-aos="fade-down"]{transform:translate3d(0,-12px,0);}
body {background: #111111}
body{position:relative;}
body:before {position:fixed;top:0;right:0;bottom:0;left:0;z-index:1; width: 100%; height: 150px; content: ''; background: linear-gradient(180deg,#111111 0,#11111100 100%);}

@media(max-width:768px){
    body:before {height: 100px;}
}
body.popup-open{overflow:hidden}
body.popup-open > *:not(.popup-wrap){pointer-events:none}


input[type=text]:hover, input[type=password]:hover, input[type=submit]:hover, input[type=number]:hover, input[type=image]:hover, textarea:hover, select:hover,
input[type=text]:focus, input[type=password]:focus, input[type=submit]:focus, input[type=number]:focus, input[type=image]:focus, textarea:focus, select:focus {
    transition: all .3s ease;
    border-color: #fff!important;
}


/* search  */
.search-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:.3s}
.search-overlay.open{opacity:1;visibility:visible}
.search-box{width:600px;max-width:90%}
.search-box input{width:100%;height:70px;border:0;background:#fff;padding:0 25px;border-radius:6px; font-size: 1.2em!important;}
.search-close{position:absolute;top:40px;right:40px;background:none;border:0;color:#fff;font-size:32px;cursor:pointer}
.search-box form{position:relative}
.search-submit{position:absolute;right:18px;top:50%;transform:translateY(-50%);border:0;background:none;font-size:22px;color:#333;cursor:pointer}
/* popup  */
.popup-wrap{position:fixed;top:0;left:0;width:100%;height:100%;background:#0008;display:none;align-items:center;justify-content:center;z-index:10000}
.popup-wrap.is-open{display:flex}
.popup-box{width:360px;background:#111;border-radius:14px;overflow:hidden;text-align:center;color:#fff;box-shadow:0 10px 30px #0004}
.popup-slider{position:relative;padding:0;overflow:hidden;min-height:100px;cursor:grab;user-select:none;-webkit-user-select:none}
.popup-slider:active{cursor:grabbing}
.popup-slide img{width:100%;margin:0 auto 10px;pointer-events:none;-webkit-user-drag:none}
.popup-slide{position:absolute;top:0;left:0;width:100%;display:flex;flex-direction:column;gap:10px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s ease,visibility .45s ease}
.popup-slide.active{position:relative;opacity:1;visibility:visible;pointer-events:auto;z-index:2}
.popup-slide img{width:100%;margin:0 auto 10px}
.popup-slide h3{font-size:18px;font-weight:700;color:#fff}
.popup-slide p{font-size:13px;line-height:1.6;color:#fff}
.popup-dots{display:flex;gap:6px;justify-content:center;margin:20px 0}
.popup-dots .dot{width:8px;height:8px;background:#fff8;border-radius:20px;cursor:pointer;transition:all .3s ease}
.popup-dots .dot.active{width:18px;background:#fff}
.popup-foot{display:flex;background:#111;border-top:1px solid #333}
.popup-foot button{flex:1;height:44px;font-size:13px;border:0;border-radius:0;background:#454545;cursor:pointer}
.popup-foot button+button{background:#fff;color:#000;border-left:1px solid #333}
/* modal  */

.modal-content{background:#111;color:#fff}
.modal-header{background:#111}
.modal-header .close{color:#fff}
.modal-title{background:#111;border-bottom:1px solid rgba(255,255,255,.15);color:#fff}
.modal-body{background:#111;color:#fff}
.modal-body .box-gray{background:#222}
.modal-footer{background:#111;display: flex}
.modal .btn{flex: 1; height: 48px}
.modal .btn-primary{background:#fff;color:#111}
.modal .btn-secondary{background: #2b2b2c;color:#fff}


.board-list{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.abl-search{display:flex;gap:20px;margin-bottom:30px}
.abl-search .date,.abl-search .keyword{display:flex;align-items:center;gap:8px}
.abl-search .keyword{margin-right: auto}
.abl-search input,.abl-search select{background:#111;border:1px solid rgba(255,255,255,.2);color:#fff;height:40px;padding:0 10px}
.abl-search .btn-search{background:none;border:0;color:#fff;font-size:16px}

.abl-table{display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.2)}
.abl-row{display:flex;flex-direction:column;gap:8px;padding:18px 10px;border-bottom:1px solid rgba(255,255,255,.15);color:#fff!important;transition:.2s}
.abl-row:hover{background:rgba(255,255,255,.03)}
.abl-row.fixed{background:rgba(255,255,255,.05)}

.abl-row .meta{display:flex;gap:8px;font-size:12px}
.abl-row .cat{color:rgba(255,255,255,.6)}
.abl-row .badge{background:#111;border: 1px solid #fff;color:#fff;padding:2px 6px;font-size:11px}
.abl-row .badge.done{background:#fff;color:#111;padding:2px 6px;font-size:11px}

.abl-row .title{font-size:16px;font-weight:600}
.abl-row .info{display:flex;gap:12px;font-size:12px;color:rgba(255,255,255,.5)}

.abl-empty{padding:20% 0;text-align: center;font-size: 12px !important;opacity: 0.8;}


@media(max-width:768px){
    .app-board-list{padding:100px 25px}
    .abl-search{flex-direction:column}
    .abl-row .title{font-size:15px}
}

.faq-list{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff; min-height: 800px}
.faq-search .row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.faq-search input,.faq-search select{height:40px;background:#111;border:1px solid rgba(255,255,255,.25);color:#fff;padding:0 10px}
.faq-search button{background:none;border:0;color:#fff;font-size:16px}

.faq-items{border-top:1px solid rgba(255,255,255,.2); min-height: 400px}
.faq-item{border-bottom:1px solid rgba(255,255,255,.15)}
.faq-q{width:100%;display:flex;align-items:center;gap:12px;padding:18px 10px;background:none;border:0;color:#fff;text-align:left;font-size:16px}
.faq-q .q{font-weight:700}
.faq-q i{margin-left:auto;transition:.2s}
.faq-item.open .faq-q i{transform:rotate(180deg)}

.faq-a{display:none;padding:0 10px 20px 34px;font-size:14px;line-height:1.7;color:rgba(255,255,255,.75)}
.faq-item.open .faq-a{display:block}

.faq-empty{text-align:center;padding:60px 0;color:rgba(255,255,255,.5)}

@media(max-width:768px){
    .faq-list{padding:120px 16px 80px}
    .faq-q{font-size:15px}
}


.board-btns{display:flex;justify-content:flex-end;gap:8px;margin-bottom:20px}

.board-view{max-width:1400px;margin:0 auto;padding:40px;;border:1px solid rgba(255,255,255,.15);border-radius:12px}

.bv-head{border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:20px;margin-bottom:30px}
.bv-head .badge{background:#111;border: 1px solid #fff;color:#fff;padding:2px 6px;font-size:11px}
.bv-head .badge.done{background:#fff;color:#111;padding:2px 6px;font-size:11px}
.bv-title{font-size:26px;font-weight:700;line-height:1.4}
.bv-title .badge{background:#fff;color:#111;font-size:12px;padding:3px 6px;margin-right:6px}

.bv-info{display:flex;gap:16px;margin-top:10px;font-size:13px;color:rgba(255,255,255,.6)}
.bv-info b{color:#fff;font-weight:400}

.bv-content{font-size:15px;line-height:1.8;color:#eaeaea;min-height: 400px}
.bv-content img{max-width:100%;height:auto}

.bv-files{margin-top:40px;padding-top:20px;border-top:1px dashed rgba(255,255,255,.2)}
.bv-files strong{display:block;margin-bottom:10px;font-size:14px}
.bv-files ul{display:flex;flex-direction:column;gap:6px}
.bv-files a{font-size:14px;color:#fff}
.bv-files a:hover{text-decoration:underline}

.cs-answer{margin-top:40px;padding:24px;border:1px solid rgba(255,255,255,.15);background:#111;border-radius: 8px}
.qa-item-head {margin-top: 20px}
.qa-head{display:flex;justify-content:space-between;margin-bottom:12px;font-size:14px;color:#aaa}
.qa-head strong{color:#fff}
.qa-body{font-size:15px;line-height:1.6;color:#eee}


@media(max-width:768px){
    .board-list{padding:100px 25px}
    .board-view{padding:24px}
    .bv-title{font-size:20px}
    .bv-info{flex-direction:column;gap:4px}
}
/* summernote dark */
.note-editor.note-frame{background:#111;border:1px solid rgba(255,255,255,.15);}
.note-editor.note-frame .note-toolbar{padding:10px;background:#0d0d0d;border-bottom:1px solid rgba(255,255,255,.1);}
.note-editor.note-frame .note-statusbar{background:#0d0d0d;border-top:1px solid rgba(255,255,255,.1);}
.note-editor.note-frame .note-editing-area .note-editable{background:#111;color:#fff;min-height:320px;}
.note-editor.note-frame .note-editing-area .note-editable p,
.note-editor.note-frame .note-editing-area .note-editable span,
.note-editor.note-frame .note-editing-area .note-editable div{color:#fff;}

.note-editor.note-frame .note-btn-group{margin-right:6px;}
.note-editor.note-frame .note-btn{
    height:32px;
    padding:0 12px;
    background:#1a1a1a;
    border:1px solid rgba(255,255,255,.15);
    color:#fff;
    border-radius:4px;
}
.note-editor.note-frame .note-btn:hover,
.note-editor.note-frame .note-btn:focus,
.note-editor.note-frame .note-btn.active{
    background:#2a2a2a;
    border-color:rgba(255,255,255,.3);
    color:#fff;
}
.note-editor.note-frame .note-btn i,
.note-editor.note-frame .note-btn span,
.note-editor.note-frame .note-btn svg{color:#fff;}

.note-editor.note-frame .dropdown-menu{
    background:#151515;
    border:1px solid rgba(255,255,255,.12);
}
.note-editor.note-frame .dropdown-item,
.note-editor.note-frame .note-dropdown-menu a{
    color:#fff;
}
.note-editor.note-frame .dropdown-item:hover,
.note-editor.note-frame .note-dropdown-menu a:hover{
    background:#222;
    color:#fff;
}

.note-editor.note-frame .note-placeholder{color:rgba(255,255,255,.35);}
.note-editor.note-frame .note-resizebar{background:#0d0d0d;}
.note-editor.note-frame .note-form-label{color:#fff;}
.note-editor.note-frame .note-input,
.note-editor.note-frame .note-form-control{
    background:#111;
    border:1px solid rgba(255,255,255,.2);
    color:#fff;
}
.board-form{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.bf-head{display:flex;gap:10px;margin-bottom:30px}
.bf-option{margin-bottom:16px;font-size:14px;color:rgba(255,255,255,.7)}
.bf-title{    border-radius: 3px;width:100%;height:54px;padding:0 16px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:16px}
.bf-card{    border-radius: 3px;margin:20px 0;padding:20px;border:1px solid rgba(255,255,255,.15)}
.bf-editor{    border-radius: 3px;margin:20px 0;padding:20px;border:1px solid rgba(255,255,255,.15)}
.bf-row{display:flex;flex-direction:column;gap:6px;margin-bottom:0px}
.bf-row label{font-size:14px;color:rgba(255,255,255,.7)}
.bf-row select{height:44px;padding:0 12px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff; width: 100%}
.bf-help{font-size:12px;color:rgba(255,255,255,.5)}
.bf-editor textarea{width:100%;min-height:260px;padding:16px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff}
.cs-answer textarea{width:100%;min-height:260px;padding:16px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff}
.bf-file{display:flex;gap:10px;margin:20px 0}
.bf-file > * {width: 100%;}
.bf-file input{width: 100%;height:44px;background:#111;border:1px solid rgba(255,255,255,.3);color:#aaa;padding:0 12px}
.bf-file button{height:44px;}
.qa-item-btns {display: flex; justify-content: end; gap: 10px; align-items: center; margin-top: 10px}

@media(max-width:768px){
    .board-form{padding:120px 16px 80px}
    .bf-head{flex-direction:column}
}
/* layout */
#wrapper{max-width:1500px;margin:0 auto;}
.container{padding:0;margin:0;}
.lnb_wrapper{display:grid;grid-template-columns:220px 1fr;gap:60px;}

/* header */
header{position:fixed;top:50px;left:50%;transform:translate(-50%,0);padding:20px 30px;width:95%;min-width:calc(100% - 200px);z-index:9999;transition:.3s ease;}
header.fixed{top:30px;background:rgba(68,68,68,.4);border-radius:12px;z-index:999;backdrop-filter: blur(10px)}
header:hover{top:30px;background:rgba(68,68,68,.4);border-radius:12px;z-index:999;backdrop-filter: blur(10px)}
header h1{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
header h1 img{height:30px;transition:.3s ease;}
header>.mobile{display:none;}

/* header lang */
header .lang{position:relative;}
header .lang-layer{display:none;position:absolute;top:100%;right:0;padding-top:12px;z-index:1000;}
header .lang-layer.open{display:block;}
header .lang-layer {display:none;position:absolute;top:90%;left:-130%;padding-top:25px;z-index:1000;}
header .lang-layer .depth2 {list-style:none;margin:0;padding:10px;border-radius:12px;background:rgba(105,105,105,.25);width:max-content;}
header .lang-layer .depth2 a{padding:10px;}

[data-tooltip]:before,[data-tooltip]:after{visibility:hidden;opacity:0;position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;transition:all .2s ease;font-size:11px;font-family:dotum;letter-spacing:-1px;}
[data-tooltip]:before{content:attr(data-tooltip);line-height:1em;top:calc(100% + 8px);padding:5px 10px;border-radius:5px;color:#fff;background:#484951;box-shadow:0 3px 8px rgba(165,165,165,.5);}
[data-tooltip]:after{content:'';top: calc(100% + 3px);left: 50%;transform: translateX(-50%);border-left: 5px solid transparent;border-right: 5px solid transparent;border-bottom: 5px solid #484951;border-top: 0;}
[data-tooltip]:hover:before,[data-tooltip]:hover:after{visibility:visible;opacity:1;}

/* gnb pc */
@media screen and (min-width:1200px){
    #gnb{font-size:1.1em;color:#fff;}
    #gnb .depth1{display:flex;align-items:center;gap:16px;}
    #gnb .depth1>li{position:relative;}
    #gnb .depth1>li>a{display:block;padding:0;font-family:"Montserrat",sans-serif;font-size:14px;font-weight:600;color:#fff;text-decoration:none;transition: all 0.15s ease}
    #gnb .depth1>li:hover>a{font-weight:800;color:rgba(255,255,255,.5) !important}
    #gnb .depth1>li:hover>a{font-weight:600;color:#fff;transition:.3s;}
    #gnb .depth2-wrapper{display:none;position:absolute;top:80%;left:50%;transform:translateX(-50%);padding-top:25px;z-index:1000;}
    #gnb .depth2{list-style:none;margin:0;padding:10px;border-radius:12px;background:rgba(105,105,105,.25);width:max-content;backdrop-filter: blur(10px)}
    #gnb .mobile_my{display:none;}
}

/* gnb depth2 */
#gnb .depth2 li a{display:block;padding:5px 20px;text-align:center;white-space:nowrap;font-family:"Montserrat",sans-serif;font-weight:400;color:#fff;text-decoration:none;}
#gnb .depth2 li a:hover{font-weight:600;}

/* tnb */
.tnb{display:flex;align-items:center;justify-content:space-between; gap: 6px}
.tnb a{color:#fff;}
.tnb li i{font-size: 16px;transition: ease 0.15s all}
.tnb li i:hover {color:rgba(255,255,255,.5)}
.tnb .hd_count{display:none;}
.tnb .hd_count li{line-height:1.2em;}
.tnb .mobile{display:none;}
.mobile_menu{display:none;}
.tnb a{position:relative}
.tnb a:hover::before{visibility: visible;opacity: 1;}

/* lnb */
.lnb .mypage{padding:3rem 1rem;margin-bottom:10px;border-radius:20px;background:#eeeeee56;text-align:center;}
.lnb .mypage p{font-size:1.15em;}
.lnb .mypage span{font-size:.9em;}
.lnb>ul{padding:0 1rem;margin-bottom:20px;}
.lnb a{display:flex;align-items:center;justify-content:space-between;line-height:3em;font-size:1.1em;}
.lnb a.active{color:#fff;font-weight:600;}

/* mobile ≤1200 */
@media screen and (max-width:1200px){
    header>.mobile{display:flex;align-items:center;justify-content:space-between;gap:4px;padding-top:0;}
    header>.mobile>a{width:100%;}
    header h1 img{height:20px;}

    .tnb{width:100%;}
    .tnb>ul{display:none!important;}
    .tnb .btn_colorline{display:none;}
    .tnb .hd_count{display:block;}
    .tnb .mobile{display:inline-block;}
    .tnb .btn_line{display:none;}

    .mobile_menu{display:block;}
    .mobile_menu i{width:25px;height:25px;line-height:25px;font-size:1.2em;color:#fff;text-align:center;}

    /* gnb mobile */
    /* mobile menu full overlay */
    #gnb{margin-top: -10px;position:fixed;top:0;left:50%;transform:translateX(100%);width:100vw;height:100vh;padding:1.5rem;background:#323232;overflow-y:auto;z-index:9999;transition:transform .35s ease}
    #gnb.open{transform:translateX(-50%)}
    #gnb .depth2{display:block;padding:1rem 1.6rem;margin-bottom:1rem}

    /* main menu */
    #gnb .depth1{display:block;margin-top:40px}
    #gnb .depth1>li>a{display:block;padding:18px 10px;font-size:1.4em;font-weight:600;border-bottom:1px solid rgba(255,255,255,.08)}

    /* submenu vertical */
    #gnb .depth2{display:block;padding:10px 20px;margin-bottom:15px}
    #gnb .depth2 li a{display:block;padding:8px 0;font-size:1.2em;text-align:left;color:#ddd}
    #gnb .lang .depth2 li a{padding:3px 0;font-size:1.6em; text-align: center}

    /* lang size fix */
    .lang-layer .depth2 a{font-size:1rem;font-weight:500;padding:8px 14px}
    header .lang-layer {display:none;position:absolute;top:80%;left:50%;transform:translateX(-50%);padding-top:25px;z-index:1000;}

    .overlay{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;height:100vh;z-index:2;}
    .overlay.show{display:block;}

    #gnb .depth1>li>a{display:flex;align-items:center;padding:1.2rem 1rem;font-family:"Montserrat",sans-serif;font-size:1.2em;font-weight:600;color:#fff;transition: ease 0.15s all;}
    /*#gnb .depth2{display:grid;grid-template-columns:1fr 1fr;padding:1rem 1.6rem;margin-bottom:1rem;}*/
    #gnb .mobile_my{display:block;padding:1rem;}
    #gnb .mobile_my .btn{margin-bottom:0;}
    #gnb .mobile_my .close-btn{margin-bottom:50px;width:25px;height:25px;line-height:25px;font-size:1.2em;color:#fff;cursor:pointer;}
    #gnb .lnb{margin-top:10px;}
    #gnb .lnb .mypage{padding:10px 0;}
    #gnb .lnb .mypage span{color:#333;}
    #gnb .lnb a{display:flex;align-items:center;font-size:.9em;line-height:1.8em;border-bottom:0;}
    #gnb .lnb a:after{content:"";display:inline-block;width:1px;height:12px;margin:0 4px;background:#ccc;}
    #gnb .lnb a:last-child:after{display:none;}

    .container{padding:0 1rem;}
    .fnb>.flex{display:block!important;}
    .fnb>.flex li{display:inline-block;}
    .lnb_wrapper{display:block!important;}
    .lnb_wrapper .lnb{display:none;}
    #wrapper h3.flex span.txt14{font-size:12px;}
}

/* mobile ≤992 */
@media screen and (max-width:992px){
    header{top:10px!important;padding:13px 10px;}
    header .flex.jc-sb{justify-content:end;}
}

/* gnb tnb inside */
#gnb .tnb{display:grid;grid-template-columns: repeat(5, 1fr);padding:20px 0; gap: 0}
#gnb .tnb > *{display:inline-block;width:100%;font-size:.6em;text-align:center;border-right:1px solid #eeeeee20; margin: 0}
#gnb .tnb > *:first-child{border-left: 1px solid #eeeeee20}
#gnb .tnb a i{display:block;font-size:2em;}

/* mobile ≤1200 */
@media screen and (max-width:1200px){
    header .lang-layer {transform: unset;left: unset;right: 0;}
}
/**/

footer{min-height: 250px; background: url('../img/main/footer.jpg') bottom no-repeat #111111;}
footer > div {  padding: 50px 100px 40px; display: flex; align-items: center;gap: 30px;}
footer .flex.gap15 {  gap: 15px;}
footer > div.gap50 {  gap: 50px; font-family: "Montserrat", sans-serif;}
footer > div.gap50 li:first-child{  margin-bottom: 15px; }
footer > div.gap50 li{  font-family: "Montserrat", sans-serif;}
footer > div.gap50 li a.tel{  font-family: "Montserrat", sans-serif; font-size: 1.5em}
footer img {height: 135px}
footer div.flex {width: 100%;}
footer .flex {color: #fff; font-weight: 300; gap: 275px;white-space: nowrap; font-size: 14px;letter-spacing: -5%;font-family: "Montserrat", sans-serif;}
footer .flex span {font-family: "Montserrat", sans-serif;}
footer .flex a{font-family: "Montserrat", sans-serif;color: #fff; font-weight: 400; font-size: 16px}
footer .flex .fa-pipe {margin: 0 5px}
@media screen and (max-width:1750px){
    #ft .logo svg{width:100%}
}
@media screen and (max-width:1400px){
    #ft > div{padding:0px; flex-direction: column; gap: 0}
    #ft .logo svg{width:720px;height:auto}
    #ft .flex{gap:40px}
    #ft .flex ul li{font-size:14px;line-height:1.6}
    #ft .flex ul.txt-right li{font-size:13px}
    #ft .flex ul.txt-right li > *{font-size:13px}
    footer .flex a{font-size:13px;}
}
@media screen and (max-width:768px){
    #ft{padding:60px 24px; background-size: contain;}
    #ft .logo{margin-bottom:40px}
    #ft .logo svg{width:100%;max-width:420px}
    #ft .flex:not(.gap15){flex-direction:column;align-items:flex-start;gap:32px; width: 100%}
    #ft .flex.gap15{margin-bottom: 15px}
    #ft .flex ul{gap:10px}
    #ft .flex ul li{font-size:11px;line-height:1.6}
    #ft .flex ul.txt-right{margin-left: auto;}
    #ft .flex ul.txt-right li{font-size:10px;line-height:1.6}
    #ft .flex ul.txt-right li > * {font-size:10px;line-height:1.6}
    footer .flex a{font-size:10px;}
}


/*account*/
.signup-page{max-width:520px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.signup-page h2{font-size:28px;font-weight:600;margin:10px 0 30px}
.signup-page .txt-blue{font-size:14px;color:#6aa9ff}
.signup-page .form-wrap{display:grid;grid-template-columns:1fr;row-gap:14px}
.signup-page dt label{font-size:13px;color:rgba(255,255,255,.7)}
.signup-page dd input{width:100%;height:46px;padding:0 14px;background:#111;border:1px solid rgba(255,255,255,.25);color:#fff;font-size:14px}
.signup-page dd input::placeholder{color:#666}
.signup-page dd .flex{display:flex;gap:8px}
.signup-page dd .btn{height:46px;padding:0 14px;background:#222;color:#fff;border:1px solid rgba(255,255,255,.25)}
.signup-page select{width: 100%;height: 44px;background: #1a1a1a;border: 1px solid rgba(255, 255, 255, .2);color: #fff;padding: 0 12px;border-radius: 6px;}
.signup-page .select{margin:20px 0}
.signup-page .select input{display:none}
.signup-page .select label{display:block;padding:12px 14px;border:1px solid rgba(255,255,255,.25);cursor:pointer}
.signup-page .select input[type=checkbox]+label {background-color: #5f5f5f;color: #fff;border: 1px solid #C9C9C9;}
.signup-page .select input:checked+label{background:#fff;color:#000}
.signup-page .box-gray{background:#0f0f0f;padding:16px 25px;border:1px solid rgba(255,255,255,.15)}
.signup-page .box-gray>div{display:flex;align-items:center;font-size:13px;padding:8px 0;gap: 5px}
.signup-page .box-gray label{cursor:pointer;color: #666; margin-right: auto}
.signup-page .box-gray input:checked+label{color:#fff}
.signup-page .box-gray a{font-size:12px;color:#999}
.signup-page button[type=submit]{width:100%;height:52px;font-size:16px;font-weight:600;background:#fff;color:#000;border:0;margin-top:20px}

@media(max-width:768px){
    .signup-page{padding:120px 25px 80px}
    .signup-page h2{font-size:24px}
}

.login-page{min-height:100vh;background:#111;display:flex;align-items:center;justify-content:center;color:#fff}
.login-wrap{width:100%;max-width:420px;padding:40px 24px;text-align:center}

.logo img{height:36px;margin-bottom:10px}
.logo p{font-size:14px;letter-spacing:2px;color:#aaa}

.login-tabs{display:flex;margin:30px 0;border-bottom:1px solid rgba(255,255,255,.2)}
.login-tabs button{flex:1;height:44px;background:none;border:0;border-radius:0;color:#777;font-size:14px}
.login-tabs button.active{color:#fff;border-bottom:2px solid #fff}

.login-tab{display:none}
.login-tab.active{display:block}

.login-tab form{display:flex;flex-direction:column;gap:12px}
.login-tab input{height:48px;padding:0 14px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff}
.login-tab button{height:48px}

.login-links{display:flex;justify-content:space-between;margin-top:14px;font-size:13px}
.login-links a{color:#aaa}

.sns-area{margin-top:30px}
.sns-line{display:flex;align-items:center;gap:10px;color:#777;font-size:12px}
.sns-line:before,
.sns-line:after{content:"";flex:1;height:1px;background:rgba(255,255,255,.15)}

.sns-list{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.sns{height:44px;border:0;font-weight:600}
.sns.naver{background: #05ab4e;color:#000}
.sns.kakao{background:#fce300;color:#000}

.guest-help{margin-top:14px;font-size:13px;color:#777}

.policy-text{margin-top:30px;font-size:12px;color:#777;line-height:1.6}
.copyright{margin-top:20px;font-size:11px;color:#555}

@media(max-width:768px){
    .login-wrap{padding:30px 25px}
}


.find-page{min-height:100vh;background:#111;display:flex;align-items:center;justify-content:center;color:#fff}
.find-wrap{width:100%;max-width:420px;padding:40px 24px;text-align:center}

.find-head h1{font-size:22px;margin-bottom:8px}
.find-head p{font-size:13px;color:#777;line-height:1.6}

.find-tabs{display:flex;margin:30px 0;border-bottom:1px solid rgba(255,255,255,.2)}
.find-tabs button{flex:1;height:44px;background:none;border:0;border-radius: 0;color:#777;font-size:14px}
.find-tabs button.active{color:#fff;border-bottom:2px solid #fff}
.find-tab{display:none}
.find-tab.active{display:block}
.find-tab form{display:flex;flex-direction:column;gap:12px}
.find-tab input{height:48px;padding:0 14px;background:#111;border:1px solid rgba(255,255,255,.3);color:#fff}
.auth-row{display:flex;gap:8px}
.auth-row input{flex:1}
.auth-box{display:none;position:relative}
.auth-box.active{display:block}
.auth-box .timer{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:12px;color:#f55}
.find-result{display:none;margin-top:28px;padding:24px 20px;border:1px solid rgba(255,255,255,.15);background:#0f0f0f;text-align:center}
.find-result.active{display:block}
.result-title{font-size:15px;color:#aaa;margin-bottom:10px}
.result-main{font-size:16px;line-height:1.6;margin-bottom:14px}
.result-main strong{color:#fff;font-size:18px}
.result-sub{font-size:13px;color:#777;margin-bottom:18px}
.result-actions{display:flex;gap:10px;justify-content:center}
.find-foot{margin-top:24px;font-size:13px}
.find-foot a{color:#aaa}

@media(max-width:768px){
    .find-wrap{padding:30px 25px}
}
/*main*/

.logo-fixed{position:relative;height:calc(600px * 4);}
.logo-fixed > div.logo-wrap{position:relative;overflow:hidden;}
.logo-stage{position:fixed;top:0;left:50%;transform:translate3d(-50%,0,0);width:135%;aspect-ratio:4128/750;opacity:0.1;will-change:transform,opacity}
.logo-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .35s ease;pointer-events:none}
.logo-img.active{opacity:1}
.logo-stage.is-released{position:absolute;bottom:0;top:auto;transform:translateX(-50%)}

.blank-box {display: flex; align-items: center; justify-content: center}
.blank-box p {font-family: "Poiret One", sans-serif;color: #fff;font-size: 80px;padding: 275px 0 95px;line-height: 1em;}
.main-slider{aspect-ratio: 1920 / 950; margin: 0 auto; position: sticky; top:135px; z-index:1; padding: 0 35px; max-width: 1470px}
.main-slider .main-swiper {width: 100%;height: 100%; border-radius: 20px; overflow: hidden;}
.main-slider .swiper-slide {text-align: center;font-size: 18px;background: #fff; display: flex;justify-content: center;align-items: center;}
.main-slider .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.main-slider .swiper-slide img.mobile{display: none;}
.main-slider .swiper-slide iframe.pc{display: block;}
.main-slider .swiper-slide iframe.mobile {display: none;}
.main-slider .swiper-button-next,
.main-slider .swiper-button-prev{background-color: #fff!important; border-radius: 50%; opacity: 1; box-shadow:none;
width: 70px!important; height: 70px!important; top: 50%; transform: translateY(-50%); z-index: 2;}
.main-slider .swiper-button-next:after,
.main-slider .swiper-button-prev:after{color: #555555; font-size: 1.4em!important;}
.main-slider .swiper-button-next{right: 0px;}
.main-slider .swiper-button-prev{left: 0px;}
.main-slider .swiper-pagination-fraction{color: #fff;}


.slider-ui{position:absolute;left:100px;bottom:40px;display:flex;align-items:center;gap:10px;color:#fff;font-size:14px;z-index:10;}
.slider-ui .current{min-width:10px;text-align:center;opacity:.9;}
.slider-ui .total{min-width:10px;text-align:center;opacity:.4;}
.slider-ui .pipe{min-width:5px;text-align:center;opacity:.9;}
.slider-ui .progress{position:relative;width:220px;height:2px;background:rgba(255,255,255,.3);overflow:hidden;margin: 0}
.slider-ui .progress .bar{position:absolute;left:0;top:0;height:100%;width:0%;background:#fff;transition:width .4s ease;}
.slider-ui .nav{display:flex;gap:10px;}
.slider-ui .nav button{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;opacity:.8;}
.slider-ui .nav button:hover{opacity:1;}
@media (max-width:1400px){
    .logo-fixed{height:calc(500px * 6)}
    .blank-box p{font-size:64px;padding:220px 0 80px}
    .main-slider{top:60px;padding:0 24px}
    .slider-ui{left:60px;bottom:30px}
    .slider-ui .progress{width:180px}
}
@media (max-width:768px){
    .logo-fixed{height:calc(420px * 6)}
    .blank-box p{font-size:25px;padding:100px 0 60px;text-align:center}
    .main-slider{aspect-ratio: 1 / 1;top:25vh;padding:0 25px;border-radius:14px;}
    .main-slider .main-swiper{border-radius:14px}
    .main-slider .swiper-slide img.mobile {display: block;width: 100%;height: 100%;object-fit: cover;}
    .main-slider .swiper-slide img.pc{display: none;}
    .main-slider .swiper-slide iframe.mobile {display: block;}
    .main-slider .swiper-slide iframe.pc{display: none;}
    .main-swiper .swiper-slide{opacity:0;transition:opacity .5s ease;}
    .main-swiper .swiper-slide-active{opacity:1;}
    .slider-ui{left:20px;right:20px;bottom:20px;gap:8px;font-size:12px;justify-content: center}
    .slider-ui .progress{width:100px}
    .slider-ui .nav button{font-size:16px}
    .slider-ui .nav:last-child:after {display:none;}
}
.where-section {aspect-ratio:  1920 / 2094; background: url('../img/main/where-section.jpg') center center no-repeat #111111;padding-top: 390px}
.where-section img:not(.shop-hover, .shop-hover2) {max-width: 100%;transition: all .3s ease;position: relative;border-radius: 30px;overflow: hidden;aspect-ratio: 1 / 1;object-fit: cover;}
.where-section .grid2 {gap: 20px; max-width: 1400px; margin: 0 auto 118px; position: relative; grid-template-columns: 0.85fr 1.15fr}
.where-section .grid2 img.where{transition: all 0.3s ease; border-radius: 30px; overflow: hidden;transform: translate3d(0,var(--parallax,0),0);}
.where-section .grid2 img.where:hover{transform: translate3d(0,var(--parallax,0),0) scale(1.01); filter: brightness(0.8)}
.where-section .grid2 > div {display: flex; align-items: start; justify-content: end; flex-direction: column}
.where-section .grid2 > div h2 {flex-direction: column;mix-blend-mode: exclusion;z-index: 2;color: rgba(255, 255, 255, 0.8);text-align: left;font-family: "Poiret One", sans-serif;font-size: 160px;line-height: 120px;font-weight: 400;display: flex;align-items: flex-start;justify-content: flex-start;position: absolute;top: 00px;right: 100px;    text-shadow: 0 10px 20px rgb(0 0 0 / 50%);}
.where-section .grid2 .text {display: flex;flex-direction: column;gap: 33px;align-items: flex-start;justify-content: flex-start;position: relative; padding: 40px}
.where-section .grid2 .text h6 {color: #ffffff;text-align: left;font-size: 20px;letter-spacing: -0.05em;font-weight: 400;position: relative;align-self: stretch;display: flex;align-items: center;justify-content: flex-start;}
.where-section .grid2 .text .line {margin-top: -0.5px;border-style: solid;border-color: rgba(255, 255, 255, 0.5);border-width:0 0.5px 0 0;flex-shrink: 0;width: 1px;height: 40px;position: relative;transform-origin: 0 0;}
.where-section .grid2 .text p {color: rgba(255, 255, 255, 0.5);text-align: left;font-size: 15px;line-height: 150%;letter-spacing: -0.05em;font-weight: 300;position: relative;align-self: stretch;display: flex;align-items: center;justify-content: flex-start;}


.where-section.v2 {aspect-ratio: unset; background: url('../img/main/where-section2.jpg') top center no-repeat #111111;padding-top: 200px}
.where-section.v2 .grid2 {grid-template-columns: 1.15fr 0.85fr }
.where-section.v2 .grid2.v2 {grid-template-columns:0.85fr 1.15fr }
.where-section.v2 .grid2 > div {align-items: end;}
.where-section.v2 .grid2 > div h2 {left: 74px;right: unset;justify-content: end;text-align: right;}
.where-section.v2 .grid2 .text {align-items: flex-end}
.where-section.v2 .grid2 .text h6{align-items: flex-end;justify-content: end;text-align: right;}
.where-section.v2 .grid2 .text p{align-items: flex-end;text-align: right}
.where-title{position:relative;display:inline-block}
.where-title{position:relative;display:inline-block;line-height: 1.2;}
.where-title .line{position:relative;display:inline-block;width:max-content;}
.where-title .base{color:rgba(255,255,255,0.25);font-family:"Poiret One",sans-serif;line-height: 1.05;}
.where-title .fill{position:absolute;left:0;top:0;color:#fff;overflow:hidden;white-space:nowrap;width:0%;font-family:"Poiret One",sans-serif;line-height: 1.05;}



.where-section .shop-wrap{max-width:1400px;margin:0 auto 145px;position:relative}
.where-section .shop-wrap .panel{display:flex;justify-content:space-between;align-items:end;margin:0 auto 50px;position:relative}
.where-section .shop-wrap .panel h2{color:#fff;text-align:center;font-family:"Poiret One",sans-serif;font-size:90px;line-height:96px;font-weight:400;display:flex;align-items:center;justify-content:center}
.where-section .shop-wrap .panel ul{display:flex;align-items:center;justify-content:center;gap:5px}
.where-section .shop-wrap .panel ul li,.where-section .shop-wrap .panel ul li a{font-size:20px;letter-spacing:-.01em;font-weight:100;color:rgba(255,255,255,.5);transition:.3s}
.where-section .shop-wrap .panel ul li a.active,.where-section .shop-wrap .panel ul li a:hover{text-decoration:underline;text-underline-offset:4px;font-weight:400;color:#fff}
.where-section .shop-wrap .swiper-wrapper{display:flex;gap: 0}
.where-section .shop-wrap .swiper-slide{width:auto}
.where-section .shop-wrap .swiper-slide a{gap:37px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.where-section .shop-wrap .swiper-slide a p{gap:20px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}
.where-section .shop-wrap .shop-img{transition:.3s;position:relative;border-radius:30px;overflow:hidden}
.where-section .shop-wrap .shop-img:hover{transform:scale(1.01)}
.where-section .shop-wrap .shop-img:after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;background:rgba(0,0,0,.5);opacity:0;transition:.3s}
.where-section .shop-wrap .shop-img:hover:after{opacity:1}
.where-section .shop-wrap .shop-hover,.where-section .shop-wrap .shop-hover2{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:.3s}
.where-section .shop-wrap .shop-hover2{height:40px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(4px)saturate(120%);border-radius:50px;z-index:3}
.where-section .shop-wrap .shop-hover{height: 40px;z-index:4}
.where-section .shop-wrap .shop-img:hover .shop-hover,.where-section .shop-wrap .shop-img:hover .shop-hover2{opacity:1}
.where-section .shop-wrap .swiper-slide{width:calc((100% - 40px) / 3)!important}
.where-section .shop-wrap .shop-progress{position:absolute;left:20px;right:20px;bottom:-10px;height:3px;background:rgba(255,255,255,.1);border-radius:10px;overflow:hidden}
.where-section .shop-wrap .shop-progress span{display:block;height:100%;width:0;background:#fff;transition:width .3s ease}
.where-section .shop-wrap .swiper{overflow:hidden;padding-bottom:30px}
/*.where-section .shop-wrap .swiper::-webkit-scrollbar{height:4px}*/
/*.where-section .shop-wrap .swiper::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:10px}*/
/*.where-section .shop-wrap .swiper::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:10px}*/
/*.where-section .shop-wrap .swiper::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25)}*/

.where-section .shop-wrap .shop-nav{position:absolute;bottom:40%;left:50%;width:110%;display:flex;justify-content:space-between;transform:translate(-50%, -50%);z-index:10;pointer-events:none; padding: 0px}
.where-section .shop-wrap .shop-nav button{color: #fff;display: flex;align-items: center;justify-content: center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.1);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.3);cursor:pointer;pointer-events:auto;position:relative}


@media (max-width:1400px){
}

@media screen and (max-width: 1400px) {

    .where-section .grid2 { margin: 0 auto}
    .where-section{ padding: 0 20px; padding-top:280px!important;}
    .where-section.v2{padding-top:80px!important;}
    .where-section .grid2{margin-bottom:90px}
    .where-section .grid2>div h2{font-size:130px;line-height:120px;top:100px;right:40px}
    .where-section .grid2 .text{padding:60px;gap:24px}
    .where-section .grid2 .text h6{font-size:22px}
    .where-section .grid2 .text p{font-size:18px}
    .where-section .shop-wrap{margin-bottom:110px}
    .where-section .shop-wrap .shop-nav{width:100%;}

}

@media screen and (max-width:768px){
    .where-section .grid2 {grid-template-columns: 1fr!important; margin: 0 auto; gap: 80px}
    .where-section{padding-top:180px!important;background-size: contain;}
    .where-section.v2{ padding: 0 20px; padding-top:0px!important;background-size: contain;}
    .where-section .grid2{margin-bottom:20px}
    .where-section .grid2 img.where{border-radius:20px}
    .where-section .grid2>div h2{position:static;font-size:64px;line-height:1.1;text-align:left;margin-bottom:24px; z-index: 0}
    .where-section .grid2 .text{padding:24px 0;gap:18px}
    .where-section .grid2 .text h6{font-size:18px}
    .where-section .grid2 .text p{font-size:15px;line-height:1.6}
    .where-section .shop-wrap{margin-top:110px; }
    .where-section .shop-wrap .panel{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:30px}
    .where-section .shop-wrap .panel h2{font-size:48px;line-height:1}
    .where-section .shop-wrap .panel ul{flex-wrap:wrap;gap:6px}
    .where-section .shop-wrap .panel ul li,
    .where-section .shop-wrap .panel ul li a{font-size:14px}
    .where-section .shop-wrap li a p{font-size:15px;gap:12px; flex-direction: column}
    .where-section .shop-wrap li a {gap: 10px}
    .where-section .shop-wrap li a .shop-img .shop-hover2 {height: 30px;}
    .where-section .shop-wrap li a .shop-img .shop-hover {height: 30px;}
    .where-section .shop-wrap .swiper-slide{width:100%!important}
}


.where-section .spot-image {position: relative;width: 100%;}
.where-section .spot-item {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 0;height: 0;}
.where-section .spot-image img {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);object-fit: contain;will-change: transform;pointer-events: none;}
.spot-image img.c1 { animation: spot-spin 380s linear infinite; }
.spot-image img.c2 { animation: spot-spin-rev 520s linear infinite; }
.spot-image img.t1 { left:0!important; transform: translate(15%, -70%);}
.spot-image img.t2 { left:0!important; transform: translate(160%, -20%);}

/* visible 클래스 (fade-in용) */
.spot-image img {opacity: 0;transition: opacity 1.2s ease-out;}
.spot-image img.visible {opacity: 1;}
.orbit-text{position:absolute;inset:0;animation:spin 30s linear infinite;}
@keyframes spot-spin {
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes spot-spin-rev {
    to {
        transform: translate(-50%, -50%) rotate(-360deg);
    }
}

@keyframes spin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}


@media screen and (max-width: 1400px) {
    .where-section.v2 .grid2 > div.spot-image {aspect-ratio: 1/1;}

    .spot-image img { width: 80%}
    .spot-image img.c1 { width: 60%}
    .spot-image img.c2 { width: 80%}
    .spot-image img.t1 { width: 40%; transform: translate(25%, -70%);}
    .spot-image img.t2 { width: 30%; transform: translate(200%, -20%);}
}

@media screen and (max-width:768px){
}
.video-section{position:relative}
.video-section{max-width:1400px;margin:0 auto 120px;padding:0 20px}
.video-section .video-inner{display:flex;align-items:center;gap:80px}
.video-section .video-left{flex:1}
.video-section .video-left iframe{width:100%;aspect-ratio:16/9;border-radius:20px}
.video-section .video-right{flex:1;color:#fff}
.video-section .video-right .sub{display:block;font-size:14px;color:#aaa;margin-bottom:10px}
.video-section .video-right h3{font-size:36px;line-height:36px;margin-bottom:20px}
.video-section .video-right p{font-size:16px;line-height:1.6;color:#ccc;margin-bottom:30px}
.video-section .video-right .btn{display:inline-block;padding:12px 28px;border:1px solid #fff;border-radius:30px;color:#fff;background: #fff0}
.video-section .video-left,.video-section .video-right{opacity:0;transform:translateY(40px);transition:all .8s ease}
.video-section .swiper-slide-active .video-left{opacity:1;transform:translateY(0)}
.video-section .swiper-slide-active .video-right{opacity:1;transform:translateY(0);transition-delay:.2s}
.video-pagination{    align-items: end;position:absolute;right:20px;top:50%;transform:translateY(-50%);z-index:10;display:flex;flex-direction:column;gap:10px}
.video-pagination .swiper-pagination-bullet{width:10px;height:10px;background:#fff;opacity:.3}
.video-pagination .swiper-pagination-bullet-active{opacity:1}
@media (max-width:1400px){
    .video-section .video-inner{gap:40px}
    .video-section .video-right h3{line-height:28px;font-size:28px}
}

@media (max-width:768px){
    .video-section{margin:100px auto 120px;}
    .video-section .video-left,.video-section .video-right{width: 100%}
    .video-section .video-inner{flex-direction:column;gap:30px}
    .video-section .video-right{text-align:center}
    .video-section .video-right h3{line-height:24px;font-size:24px}

    .video-section .video-left,.video-section .video-right{opacity:0;transform:translateX(40px);transition:all .8s ease}
    .video-section .swiper-slide-active .video-left{opacity:1;transform:translateX(0)}
    .video-section .swiper-slide-active .video-right{opacity:1;transform:translateX(0);transition-delay:.2s}
}

.visual-wrap{position:relative;width:100%;height:100vh;overflow:hidden;margin: 100px 0 60px;background: linear-gradient(180deg, rgba(1, 1, 1, 0) 0%, rgba(38, 38, 38, 1) 46.15384638309479%, rgba(3, 3, 3, 0) 100%);}
.bg-circle-wrap{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;}
.bg-circle{display:block;}
.bg-circle.c1{animation:spin 140s linear infinite;}
.bg-circle.c2{animation:spin-rev 155s linear infinite;}
.product{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;}
@keyframes spin{to{rotate:360deg;}}
@keyframes spin-rev{to{rotate:-360deg;}}

.wave-text-container{position:absolute;top:0;width:100%;max-width:1920px;margin:0 auto;overflow:hidden;transform:translateY(-50px)}
.wave-text-container svg{width:100%;height:100%;display:block;overflow:visible}
.flowing-text{font-family:"Montserrat",sans-serif;font-size:10px;letter-spacing:2px;font-weight:200;fill:#fff;opacity:.7;white-space:pre;dominant-baseline:middle;text-anchor:start}
.flowing-text.bottom{transform:translateY(-20px)}

.ludol-3d-scene {position:absolute;top: 0;width: 100%;height: 100vh;overflow: hidden;perspective: 1200px;perspective-origin: 50% 40%;display: grid;place-items: center;z-index: 3}
.ludol-3d-container {position: relative;width: 300px;height: 300px;transform: rotateX(24deg) rotateZ(10deg); /* 살짝 더 기울임 조정 */transform-style: preserve-3d;}
.ludol-product {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 450px;height: auto;z-index: 10;pointer-events: none;}
.ludol-text-ring.top-ring {position: absolute;width: 100%;height: 100%;transform-style: preserve-3d;animation: ludol-ring-spin 24s linear infinite;}
.ludol-text-ring.bottom-ring {position: absolute;width: 100%;height: 100%;transform-style: preserve-3d;animation: ludol-ring-spin 24s linear infinite;}
.ludol-text-ring .char {position: absolute;left: 50%;top: 50%;font-family: "Montserrat", sans-serif;font-size: 70px; letter-spacing: 0px; font-weight: 700;color: #fff; text-shadow: 0 0 10px rgba(0, 0, 20px, 0.5);
    white-space: pre;transform-origin: 0 0;transform: translate(-50%, -50%) rotateY(calc(var(--angle) * 1deg)) translateZ(230px); /* 원 반지름 */}

@keyframes ludol-ring-spin {
    from {
        transform: rotateY(0deg);
    }
    to {
        transform: rotateY(360deg);
    }
}


@media screen and (max-width:1400px){
    .visual-wrap{height:100vh}
    .bg-circle-wrap{transform:translate(-50%,-50%) scale(.85)}
    .ludol-3d-container{width:260px!important;height:260px!important;transform:rotateX(22deg) rotateZ(8deg)!important;}
    .ludol-product{width:380px!important;}
    .ludol-text-ring .char{font-size:58px!important;transform:translate(-50%,-50%) rotateY(calc(var(--angle) * 1deg)) translateZ(200px)!important;}
    .wave-text-container{max-width:1400px;transform:translateY(-30px)}
    .flowing-text{font-size:15px;letter-spacing:1.6px}

    .wave-text-container{width:100vw;height:100vh;overflow:hidden}
    .wave-text-container svg{width:100vw;height:100vh}
}
@media screen and (max-width:768px){
    .visual-wrap{height:100vh;margin:60px 0 40px}
    .bg-circle-wrap{transform:translate(-50%,-50%) scale(.52)}
    .ludol-3d-scene{perspective:900px;perspective-origin:50% 45%}
    .ludol-3d-container{width:180px!important;height:180px!important;transform:rotateX(18deg) rotateZ(6deg)}
    .ludol-product{width:300px!important;}
    .ludol-text-ring .char{font-size:40px!important;transform:translate(-50%,-50%) rotateY(calc(var(--angle) * 1deg)) translateZ(125px)!important;}
    .wave-text-container{max-width:100%;transform:translateY(-10px)}
    .flowing-text{font-size:20px;letter-spacing:1.2px;opacity:.55}
    .flowing-text.bottom{transform:translateY(-10px)}
    .wave-text-container svg{width:200vw;height:100vh;  margin-left: -50%;}
}
@media screen and (max-width:350px){
    .visual-wrap{height:100vh;margin:60px 0 40px}
    .bg-circle-wrap{transform:translate(-50%,-50%) scale(.4)}
    .ludol-3d-scene{perspective:400px;perspective-origin:50% 50%}
    .ludol-3d-container{width:150px!important;height:150px!important;transform:rotateX(18deg) rotateZ(6deg)}
    .ludol-product{width:300px!important;}
    .ludol-text-ring .char{font-size:40px!important;transform:translate(-50%,-50%) rotateY(calc(var(--angle) * 1deg)) translateZ(100px)!important;}
    .wave-text-container{max-width:100%;transform:translateY(-10px)}
    .flowing-text{font-size:20px;letter-spacing:1.2px;opacity:.55}
    .flowing-text.bottom{transform:translateY(-10px)}
    .wave-text-container svg{width:200vw;height:100vh;  margin-left: -50%;}
}

.visual-wrap{will-change:transform;}
.bg-circle-wrap,
.wave-text-container,
.ludol-3d-scene{will-change:transform;}


/**/

.brand-story{background:#111;color:#fff;font-family:'Noto Sans KR',sans-serif;overflow-x:hidden}
.brand-story .bg-texture{position:fixed;top:0;left:0;width:100%;height:100%;background:url('https://www.transparenttextures.com/patterns/stardust.png');opacity:.05;pointer-events:none;z-index:50}

.brand-story .hero-section{font-family:'Poiret One';height:100vh;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(circle,#222 0%,#111 100%);overflow:hidden}
.brand-story #hero-canvas{position:absolute;top:55%;left:0;width:100%;height:120%;z-index:1}
.brand-story .hero-content{z-index:10;text-align:center;margin-top:-8vh}
.brand-story .hero-title{font-size:clamp(4rem,12vw,10rem);line-height:1;letter-spacing:-.02em}
.brand-story .hero-sub{letter-spacing:12px;font-size:12px;opacity:.4;margin-top:30px;margin-bottom: 80px;}

.brand-story section{padding:160px 0;position:relative}
.brand-story .container{max-width:1400px;margin:0 auto;padding:0 20px}
.brand-story .grid2{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.brand-story .grid2.v2{max-width:1200px;margin:80px auto 0}
.brand-story .center{text-align:center;margin-bottom:80px}
.brand-story .section-title {font-size: 60px;position:relative;display:inline-block;line-height: 1.2;letter-spacing:-.02em}
.brand-story .section-title .line{position:relative;display:inline-block;width:max-content}
.brand-story .section-title .base{color:rgba(255,255,255,0.25);font-family:"Poiret One",sans-serif; }
.brand-story .section-title .fill{position:absolute;left:0;top:0;color:#fff;overflow:hidden;white-space:nowrap;width:0%;font-family:"Poiret One",sans-serif;transition:width 1.2s ease;}
.brand-story .section-subtitle{font-size:14px;letter-spacing:.3em;color:rgba(255,255,255,.5);margin-bottom:1.5rem;display:block}
.brand-story  h2 + .desc-p{margin-top: 60px}
.brand-story .desc-p{font-size:16px;line-height:1.7;color:rgba(255,255,255,.5);font-weight:300;}
.brand-story .desc-p b{color:#fff}
.brand-story .highlight{margin-top:30px;font-family:'Poiret One';letter-spacing:.2em;text-transform:uppercase}
.brand-story .bg-v2{background:#161616}
.brand-story .img-container{border-radius:20px;overflow:hidden;background:#1a1a1a;position:relative;height:500px}
.brand-story .img-container.img1{background: url("../img/brand/img1.png") center center no-repeat; background-size: cover}
/*.brand-story .img-container.img2{background: url("../img/brand/img2.png") center center no-repeat}*/
.brand-story .img-container.img3{background: url("../img/brand/img3.png") center center no-repeat; background-size: cover}
.brand-story .img-container.full{grid-column:1/3;height:400px}
.brand-story .overlay-text{font-family: "Montserrat", sans-serif;text-transform: uppercase;;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:.5;font-size:20px;letter-spacing:.2em}
.brand-story .hr-line{width:1px;height:100px;background:rgba(255,255,255,.1);margin:0 auto}
.brand-story #heroDrawSvg{width:100%;max-width:900px;height:auto;display:block;margin:0 auto;}
.brand-story .hero-content{width:100%;padding:0 20px;}

.brand-story .img-container.img2{position:relative;overflow:hidden;background:none !important;}
.brand-story .img-container.img2 .slice{
    position:absolute;--slot: calc(90% / var(--total));width:calc(var(--slot) - var(--gap));left:calc(50% - 45% + (var(--slot) * var(--i)));
    background:url("../img/brand/img2.png") center/cover no-repeat; background-size: cover;border-radius:20px;opacity:0;transform:translateY(80px) scale(0.9);transition:all .7s cubic-bezier(.2,.8,.2,1);}
.brand-story .img-container.img2.active .slice{opacity:1;transform:translateY(0) scale(1)}
.brand-story .img-container:not(.img2){position:relative;overflow:hidden;transition:all .6s cubic-bezier(.2,.8,.2,1);}
.brand-story .img-container:not(.img2):hover{transform:scale(1.03);}
.brand-story .img-container:not(.img2)::after{content:"";position:absolute;inset:0;
    background:radial-gradient(circle at var(--x,50%) var(--y,50%), rgba(255,255,255,0.28), rgba(255,255,255,0.1) 40%, transparent 70%);opacity:0;transition:opacity .4s ease;pointer-events:none;}
.brand-story .img-container:not(.img2):hover::after{opacity:1;}

@media (max-width:1400px){
    .brand-story .grid2{gap:40px}
    .brand-story section{padding:120px 0}
    .brand-story .section-title {font-size: 50px;}
}

@media (max-width:768px){
    .brand-story .grid2{grid-template-columns:1fr}
    .brand-story section{padding:100px 0px}
    .brand-story .section-title{font-size:36px}
    .brand-story .img-container{height:320px}
    .brand-story .img-container.full{grid-column:auto;height:280px}
    .brand-story .hero-sub{letter-spacing:6px}
    .brand-story #heroDrawSvg{max-width:100%;transform:scale(1.05);}
    .brand-story .hero-title{font-size:0;}
    .brand-story .img-container.img2 .slice{
        position:absolute;--slot: calc(90% / var(--total));width:calc(var(--slot) - var(--gap));left:calc(50% - 45% + (var(--slot) * var(--i)));
        background:url("../img/brand/img2.png") center/cover no-repeat; background-size: cover;border-radius:8px;opacity:0;transform:translateY(80px) scale(0.9);transition:all .7s cubic-bezier(.2,.8,.2,1);}

}

/*sub*/

.product-list{max-width:1400px;margin:0 auto;padding:200px 20px 120px}
.product-list-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:60px}
.product-list-head h2{font-family:"Poiret One",sans-serif;font-size:90px;color:#fff;font-weight:400; line-height: 1em}
.product-list-head .category{display:flex;align-items:center;gap:6px}
.product-list-head .category li,
.product-list-head .category a{font-size:16px;color:rgba(255,255,255,.5);font-weight:300}
.product-list-head .category a{transition:.3s}
.product-list-head .category a.active,
.product-list-head .category a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}

.product-list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product-list-grid .item{display:flex;flex-direction:column;align-items:center;gap:24px;color:#fff}
.product-list-grid .item .icon{font-family: "Montserrat", sans-serif;font-weight:800;width: fit-content;border: 1px solid #fff; height: 24px; line-height: 12.5px;padding: 5px 6px;}
.product-list-grid .item{align-items:flex-start}
.product-list-grid .item .info{width:100%;display:flex;flex-direction:column;gap:6px;color:#fff}
.product-list-grid .item .info .name{font-family: "Montserrat", sans-serif;font-size:18px;font-weight:400;line-height:1.3}
.product-list-grid .item .info .desc{font-size:14px;color:rgba(255,255,255,.5);line-height:1.4}
.product-list-grid .item .info .volume{font-size:14px;color:rgba(255,255,255,.8)}
.product-list-grid .item .info .price{font-family: "Montserrat", sans-serif;font-weight:400;margin-top:6px;font-size:16px;}

.product-list .product-list-grid .item .thumb{transition:all .3s ease;position:relative;border-radius:30px;overflow:hidden; width: 100%; aspect-ratio: 1/1}
.product-list .product-list-grid .item .thumb img:not(.hover){transition:all .3s ease;position:relative;border-radius:30px;overflow:hidden; width: 100%; aspect-ratio: 1/1; object-fit: cover}
.product-list .product-list-grid .item .thumb:hover{transform:scale(1.01)}
.product-list .product-list-grid .item .thumb .hover{height: 40px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(4px)saturate(120%);-webkit-backdrop-filter:blur(14px)saturate(120%);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);border-radius:50px;transition:all .3s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3}
.product-list .product-list-grid .item .thumb:hover .hover{opacity:1}
.product-list .product-list-grid .item .thumb:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;background:rgba(0,0,0,.5);opacity:0;transition:all .3s ease}
.product-list .product-list-grid .item .thumb:hover:after{opacity:1}


.empty-product{grid-column: 1 / -1;width: 100%;padding: 100px 20px;text-align: center;font-size: 18px;color: #fff;letter-spacing: 0.02em;}
.empty-product::before{content:"\f290";font-family:"Font Awesome 6 Pro";font-weight:300;display:block;font-size:40px;margin-bottom:20px;opacity:.6}


@media(max-width:1400px){
    .product-list{padding:120px 20px 100px}
    .product-list-head h2{font-size:72px}
    .product-list-grid{gap:16px}
}


@media(max-width:768px){
    .product-list{padding:100px 25px 80px}
    .product-list-head{flex-direction:column;align-items:flex-start;gap:20px}
    .product-list-head h2{font-size:48px}
    .product-list-head .category,
    .product-list-head .category li,
    .product-list-head .category a{font-size:14px}
    .product-list-grid{grid-template-columns:1fr;gap:28px}
    .product-list-grid .item .info .name{font-size:17px}
    .product-list-grid .item .info .desc{font-size:13px}
    .product-list-grid .item .info .price{font-size:15px}
    .product-list .product-list-grid .item .thumb .hover{height: 30px}
}

.product-view{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.product-view-top{display:grid;grid-template-columns:repeat(2,1fr);gap:80px}
.pv-info{display:flex;flex-direction:column;gap:16px}
.pv-info .icon{font-family: "Montserrat", sans-serif;font-weight:800;width: fit-content;border: 1px solid #eee; height: 24px; line-height: 12.5px;padding: 5px 6px!important;}
.pv-info .name{font-family: "Montserrat", sans-serif;font-size:36px;font-weight:400;line-height: 1.4}
.pv-info .short-desc{font-size:16px;color:rgba(255,255,255,.6)}
.pv-info .price{font-size:24px;font-family: "Montserrat", sans-serif;font-weight:400;margin:10px 0}
.pv-info .price > * {font-size:24px;font-family: "Montserrat", sans-serif;font-weight:400;margin:10px 0}
.pv-info .price > .txt-gray {font-size:16px;text-decoration:line-through; opacity:.5;}
.pv-info img{max-width:100% !important}

.product-view .buy-box{margin-top:24px;border-top:1px solid rgba(255,255,255,.2);padding-top:24px;display:flex;flex-direction:column;gap:16px}
.product-view .buy-row{display:flex;flex-direction:column;gap:6px}
.product-view .buy-row label{font-size:14px;color:rgba(255,255,255,.7)}
.product-view .buy-row select{width: 100%;height: 44px;background: #1a1a1a;border: 1px solid rgba(255, 255, 255, .2);color: #fff;padding: 0 12px;border-radius: 6px;}

.product-view .buy-qty{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.product-view .qty{display:flex;border:1px solid rgba(255,255,255,.3);border-radius:6px;overflow:hidden}
.product-view .qty button{width:36px;background:none;color:#fff;font-size:18px}
.product-view .qty input{width:40px;text-align:center;background:none;color:#fff;border:0; height: 50px}
.product-view .total-price strong{font-size:18px;font-family: "Montserrat", sans-serif;font-weight:400;}

.product-view .buy-buttons{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.product-view .btn{height:48px;border-radius:8px;font-size:15px}
.product-view .btn.npay{background:#05ab4e;color:#fff;font-weight:700}
.pv-accordion{border-top:1px solid rgba(255,255,255,.2);margin-top:30px}
.pv-accordion .item{border-bottom:1px solid rgba(255,255,255,.2)}
.pv-accordion .tit{width:100%;background:none;border:0;color:#fff;padding:18px 0;text-align:left;font-size:15px;display: flex; align-items: center; justify-content: space-between}
.pv-accordion .cont{display:none;padding:0 15px 18px;color:rgba(255,255,255,.6);font-size:14px;line-height:1.6}
.pv-accordion .item.open .cont{display:block}

.product-view-detail{margin-top:120px}
.product-view-detail img{width:100%;display:block;margin-bottom:40px}
.product-view-detail p{font-size:15px;line-height:1.7;color:rgba(255,255,255,.7)}

.pv-gallery{width:100%}
.pv-gallery-inner{overflow-y:auto;padding-right:6px}
.pv-gallery-inner::-webkit-scrollbar{width:6px}
.pv-gallery-inner::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:10px}
.pv-gallery-inner::-webkit-scrollbar-track{background:transparent}
.pv-gallery .swiper-wrapper{display:block}
.pv-gallery .swiper-slide{width:100%!important;margin-bottom:20px}
.pv-gallery .pv-item img{width:100%;height:auto;object-fit:contain;border-radius:30px}

@media(max-width:768px){

    .pv-gallery-inner{overflow-y:auto;padding-right:0px}
    .pv-gallery-inner{max-height:none;overflow:hidden}
    .pv-gallery .swiper-wrapper{display:flex}
    .pv-gallery .swiper-slide{margin-bottom:0}
}
@media(max-width:1400px){
    .product-view{padding:120px 20px}
    .product-view-top{gap:60px}
}


@media(max-width:768px){
    .product-view{padding:100px 25px}
    .product-view-top{grid-template-columns:1fr;gap:40px}
    .pv-info .name{font-size:26px}
    .product-view-detail{margin-top:80px}
    .product-view .btn{height:46px;font-size:14px}
}
.product-review {max-width:1400px;margin:120px auto 0;padding:0 0px;color:#fff}
.product-review .review-title{font-size:28px;margin-bottom:40px;font-weight: 400;font-family: "Poiret One", sans-serif;}
.product-review .review-list{display:flex;flex-direction:column}
.product-review .review-item{display:grid;grid-template-columns: 1fr 100px;gap:24px;padding:30px;margin:20px 0px;}
.product-review .review-item:has(.empty){grid-template-columns: 1fr}
.product-review .review-item:not(:has(img)){display:grid;grid-template-columns: 1fr;}
.product-review .review-left{}
.review-img{width:100px;height:100px;object-fit:cover;border-radius:10px}
.review-right{display:flex;flex-direction:column;gap:8px}
.review-rating{color:#ffb400;font-size:14px}
.review-text{font-size:14px;line-height:1.6}
.review-meta{display:flex;gap:10px;font-size:12px;color:rgba(255,255,255,.5); margin-top: 20px}
.review-slide img{width: 100%}



@media(max-width:768px){
    .product-review{margin:80px auto 0;padding:0 px}
    .review-title{font-size:22px;margin-bottom:30px}
    .review-item{grid-template-columns:80px 1fr;gap:14px;padding:20px 0}
    .review-img{width:70px;height:70px;border-radius:8px}

    .product-review .review-item{display:grid;grid-template-columns: 1fr 70px;}
    .review-text{font-size:13px}
    .review-meta{font-size:11px;flex-direction: column; gap: 0}
}

.product-view .b-pagination-outer {margin-top: 10px;}
.product-view .qna-title{font-size:28px;margin-bottom:40px;font-weight: 400;font-family: "Poiret One", sans-serif;display:flex;justify-content: space-between;align-items:center}
.product-view .qna-title a{font-size:14px; height: fit-content}
.qna-list {display:flex;flex-direction:column;margin-top: 30px}
.qna-item{padding:20px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.qna-left{display:flex;flex-direction:column;gap:6px}
.qna-top{display:flex;gap:6px}
.qna-list .title{font-size:15px;font-weight:500}
.qna-list .title a{color:#fff;}
.qna-meta{display:flex;gap:12px;font-size:12px;color:rgba(255,255,255,.5)}
.qna-item.lock .qna-title{color:rgba(255,255,255,.4)}
.qna-item .badge{background:#111;border: 1px solid #fff;color:#fff;padding:2px 6px;font-size:11px}
.qna-item .badge.done{background:#fff;color:#111;padding:2px 6px;font-size:11px}


@media(max-width:768px){
    .product-view .qna-title{font-size:22px;margin-bottom:30px}

}

.order-cart {max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.order-title{font-size:36px;font-weight: 400;font-family: "Poiret One", sans-serif;margin-bottom:40px; color: #fff}
.cart-list{display:flex;flex-direction:column;gap:24px}
.cart-item{display:grid;grid-template-columns:40px 100px 1fr 40px;gap:20px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.15);align-items:center}
.cart-check{display:flex;justify-content:center;align-items:center}
.cart-check input{appearance:none;width:18px;height:18px;border:1.5px solid rgba(255,255,255,.5);border-radius:4px;background:none;cursor:pointer;position:relative; background: #ffffff20!important;}
.cart-check input:checked{border-color:#000; background: #fff!important;}
.cart-check input:after{content:"";position:absolute;left:5px;top:1px;width:6px;height:10px}
.cart-check input:checked:after{content:"";position:absolute;left:5px;top:1px;width:6px;height:10px;border:2px solid #000!important;;border-top:0!important;;border-left:0!important;;transform:rotate(45deg)}
.cart-item .thumb img{width:100%;border-radius:14px;aspect-ratio:1/1;max-width:100px;object-fit:cover}
.cart-item .info{display:flex;flex-direction:column;gap:6px}
.cart-item .name{font-family:"Montserrat",sans-serif;font-size:20px;font-weight:700}
.cart-item .option{font-size:14px;color:rgba(255,255,255,.55);display: flex;align-items: center;gap: 10px}
.cart-item .qty-price{font-family:"Montserrat",sans-serif;display:flex;gap:14px;align-items:center;margin-top:6px}
.order-cart .qty{display:flex;border:1px solid rgba(255,255,255,.25);border-radius:6px;overflow:hidden}
.order-cart .qty button{width:32px;background:none;color:#fff;font-size:15px}
.order-cart .qty input{width:36px;text-align:center;background:none;border:0;color:#fff;height:38px}
.order-cart .price{font-size:16px;font-family:"Montserrat",sans-serif}
.order-cart .unit_price{font-size:13px;font-family:"Montserrat",sans-serif;opacity:.45;margin-right:auto}
.order-cart .btn-del{margin-bottom: auto;background:none;border:0;color:rgba(255,255,255,.5);font-size:20px;cursor:pointer}

.cart-summary{margin-top:40px;padding-top:20px;display:flex;flex-direction:column;gap:14px}
.cart-summary div{display:flex;justify-content:space-between;font-size:15px}
.cart-summary div>*{font-family:"Montserrat",sans-serif}
.cart-summary .total{font-size:20px}

.cart-buttons{margin-top:30px;display:flex;gap:12px}
.cart-buttons .btn{height:48px;border-radius:8px;font-size:14px}

@media(max-width:768px){
    .cart-item{grid-template-columns:50px 1fr 26px;grid-template-rows:auto auto;gap:10px;align-items:start}
    .cart-check{grid-column:1;grid-row:1; justify-content: start}
    .order-cart .btn-del{grid-column:3;grid-row:1;justify-self:end}
    .cart-item .thumb{grid-column:1/2;grid-row:2}
    .cart-item .thumb img{max-width:70px;border-radius:12px}
    .cart-item .info{grid-column:2/4;grid-row:2}
    .cart-item .name{font-size:17px}
    .cart-item .option{font-size:13px}
    .cart-item .qty-price{flex-wrap:wrap;gap:8px}
    .order-cart{padding:80px 20px}
    .order-title{font-size:24px}
}
.order-list {max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#111}

.order-tabs{display:flex;border-bottom:1px solid #ddd;margin-bottom:30px}
.order-tabs button{flex:1;padding:16px 0;border-radius: 6px 6px 0 0;background:none;font-size:15px;display:flex;justify-content:center;gap:8px;color:#fff;border-color:#000;border: 0}
.order-tabs button.active{font-weight:700;background:#fff;color: #111}
.order-tabs .count{background: #232323;color:#fff;font-size:12px;padding:0px 8px;border-radius:20px}
.order-tab-content{display:none}
.order-tab-content.active{display:block}

.order-status{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}
.order-status.plus{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
.order-status.other{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
.order-status.other.plus{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:24px}
.order-status button{height:44px;border-radius:6px;background:none;color:#fff;border: 1px solid #4a4a4a}
.order-status button  .count{background:#fff;color:#000;font-size:10px;padding:2px 8px;border-radius:20px}
.order-status button.active{border: 1px solid #fff;}
input[type="date"]{height:36px!important;line-height:36px!important;}
.order-filter{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:20px}
.order-filter .range{display:flex;gap:8px}
.order-filter .range button{height:36px;padding:0 14px;border-radius:6px;background:none;color:#fff;border: 1px solid #4a4a4a}
.order-filter .range button.active{border: 1px solid #fff;}
.order-filter .dates{display:flex;align-items:center;gap:8px;color:#fff}
.order-filter input{height:36px;padding:0 10px;background: #fff0;border-radius:6px;color: #fff;line-height:36px;padding:0 10px;border: 1px solid #4a4a4a;border-radius:6px;box-sizing:border-box;-webkit-appearance:none;}
.btn-search{height:36px;padding:0 16px;border-radius:6px;background:#000;color:#fff;width: fit-content}

.order-guide{font-size:13px;color:#666;margin-bottom:30px}

.order-items{display:flex;flex-direction:column;gap:24px}
.order-item{border-bottom:1px solid #e5e5e530;padding-bottom:24px}
.item-head{display:flex;justify-content:space-between;font-size:14px;margin-bottom:14px;color: #fff}
.order-list .status{font-weight:600;color: #fff}
.order-list .status.preparing{color:#ff9800}
.order-list .status.delivery{color:#4caf50}

.order-list .item-body{display:grid;grid-template-columns:100px 1fr auto;gap:20px;align-items:center}
.order-list .thumb img{width:100%;border-radius:16px;aspect-ratio: 1/1; overflow: hidden; object-fit: cover;background: #1a1a1a}
.order-list .info{display:flex;flex-direction:column;gap:6px}
.order-list .info .name{font-size:16px;font-family: "Montserrat", sans-serif;font-weight:400;color: #fff}
.order-list .info .option{font-size:13px;color:#777}
.order-list .info .price{font-size:14px;font-family: "Montserrat", sans-serif;font-weight:400;color: #fff}
.order-list .info .order-no{font-size:12px;font-weight:400;color: #8e8e8e}

.order-list .actions{display:flex;gap:8px}
.order-list .actions button{height:34px;padding:0 14px;border-radius:6px;}

.order-list .order-empty{padding:80px 0;text-align:center;color:#999}


@media(max-width:768px){
    .order-list{padding:100px 25px}
    .order-filter{flex-direction:column;align-items:flex-start}
    .order-list .item-body{grid-template-columns:60px 1fr!important;gap: 10px !important;align-items: flex-start !important;}
    .order-list .thumb img {border-radius: 8px;}
    .order-status{grid-template-columns:repeat(2,1fr);}
    .order-tabs button {font-size: 0.95em}
    .order-tabs .count {font-size: 0.75em;padding: 0px 8px;display: inline-flex;}
    .order-status button {font-size: 0.95em}
    .order-filter .range button {font-size: 0.95em}
    .order-status.plus{grid-template-columns:repeat(2,1fr);}
    .order-status.other{grid-template-columns:repeat(2,1fr);}
    .order-status.other.plus{grid-template-columns:repeat(2,1fr);}
    .order-list .actions{grid-column:2; justify-content: end}
    .order-filter .dates {flex-wrap: wrap}
    .order-filter .dates  input{width: fit-content}
    .order-list .info {gap: 0px}
    .order-list .info .name{font-size:13px;}
    .order-list .info .option{font-size:12px;}
    .order-list .info .price{font-size:12px;}
    .order-list .info .order-no{font-size:10px;}
}

.order-sheet{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.order-grid{display:grid;grid-template-columns:1fr 420px;gap:40px}
.order-left{display:flex;flex-direction:column;gap:40px}
.os-card{border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:30px;position:relative;}
.os-card h3{font-size:20px;font-weight:400;margin-bottom:20px}
.os-radio{display:flex;gap:20px;margin-bottom:20px;font-size:14px;flex-wrap: wrap}
.os-form{display:flex;flex-direction:column;gap:12px}
.os-form input:not([type="checkbox"]),.os-form select{width: 100%;height:44px;background:#1a1a1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:0 12px;border-radius:6px}
.os-form button{height:44px;border-radius:6px}
.os-form .addr{display:flex;gap:10px}
.os-form .addr button{width:110px;background:#fff;color:#000;border-radius:6px}
.os-form .tel{display:grid;grid-template-columns:80px 1fr 1fr;gap:8px}

.pay-section{display:flex;flex-direction:column;gap:30px}
.pay-block{display:flex;flex-direction:column;gap:12px}
.pay-head{display:flex;justify-content:space-between;align-items:center}
.pay-head strong{font-size:15px}
.pay-head .hint{font-size:12px;color:rgba(255,255,255,.5)}

.pay-row{display:flex;gap:10px}
.pay-row input,.pay-row select{flex:1;height:44px;background:#1a1a1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:0 12px;border-radius:6px;
    display:inline-block;width:100%;overflow: hidden;text-overflow: ellipsis;vertical-align:middle;word-break: break-all;white-space: nowrap;}
.pay-row button{height:44px;border-radius:6px}

.pay-method{display:flex;gap:18px;font-size:14px;flex-wrap: wrap}
.pay-box{display:none}
.pay-box.active{display:block}
.pay-box input,.pay-box select{width:100%;height:44px;background:#1a1a1a;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:6px;padding:0 12px}

.pay-guide{font-size:13px;color:rgba(255,255,255,.6); text-align: center; padding: 20px 0 0}

.easy-pay{display:flex;gap:10px}
.easy-pay button{flex:1;height:44px;border-radius:6px;font-weight:700}
.easy-pay .npay{background:#05ab4e;color:#000}
.easy-pay .kpay{background: #fce300;color:#000}
.easy-pay .tpay{background:#3182f6;color:#fff}

.order-right{position:sticky;top:120px;height:fit-content}
.order-summary{border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:30px;margin-bottom: 30px}
.order-summary h4{font-size:18px;margin-bottom:20px}
.sum-item{display:grid;grid-template-columns:70px 1fr;gap:14px;align-items:center;margin-bottom:20px}
.sum-item img{width:70px;border-radius:10px;height: 70px; border-radius: 8px; object-fit: cover}
.sum-item strong{ font-family: "Montserrat", sans-serif;}
.sum-item b{ font-family: "Montserrat", sans-serif;}
.sum-item span{font-size:13px;color:rgba(255,255,255,.6)}
.sum-price{ font-family: "Montserrat", sans-serif;border-top:1px solid rgba(255,255,255,.2);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.sum-price b{ font-family: "Montserrat", sans-serif;}
.sum-price div{ font-family: "Montserrat", sans-serif;display:flex;justify-content:space-between;font-size:14px}
.sum-price .total{font-size:18px}
.btn-pay{margin-top:24px;height:52px;border-radius:8px;background:#fff;color:#000;font-weight:700}


@media(max-width:768px){
    .order-sheet{padding:120px 25px}
    .order-grid{grid-template-columns:1fr}
    .order-right{position:static}
}
.order-view{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}

.ov-card{background:#1a1a1a;border-radius:14px;padding:24px;margin-bottom:20px}
.ov-card h3{font-size:18px;margin-bottom:20px}
.ov-head{display:flex;gap:30px;flex-wrap:wrap}
.ov-head div{font-size:14px}
.ov-head strong{display:block;font-size:12px;color:rgba(255,255,255,.5)}

.ov-grid{display:grid;grid-template-columns:1fr 360px;gap:30px}
.ov-item{display:flex;gap:20px;margin:20px 0px;height:100px;align-items: center}
.ov-item.grid{display: grid;grid-template-columns: 100px 1fr;;gap:10px;margin:20px 0px;height:fit-content;align-items: center}
.ov-item.grid > div:first-child {grid-column: 1 / 3}
.ov-item img{width:100px;border-radius:12px; object-fit: cover;aspect-ratio: 1 / 1}
.ov-item input{appearance:none;width:18px;height:18px;border:1.5px solid rgba(255,255,255,.5);border-radius:4px;background:none;cursor:pointer;position:relative; background: #ffffff20!important;}
.ov-item input:checked{border-color:#000; background: #fff!important;}
.ov-item input:after{content:"";position:absolute;left:5px;top:1px;width:6px;height:10px}
.ov-item input:checked:after{content:"";position:absolute;left:5px;top:1px;width:6px;height:10px;border:2px solid #000!important;;border-top:0!important;;border-left:0!important;;transform:rotate(45deg)}

.ov-item .info{display:flex;flex-direction:column;gap:6px; justify-content: center}
.ov-item strong{font-family: "Montserrat", sans-serif}
.ov-item b{font-size:16px;font-family: "Montserrat", sans-serif}

.ov-info{display:flex;flex-direction:column;gap:10px;font-size:14px}
.ov-info div{display:flex;justify-content:space-between}
.ov-info span{color:rgba(255,255,255,.5)}

.ov-summary{position:sticky;top:120px}
.ov-summary + div {position:sticky;top:420px}
.ov-price{display:flex;flex-direction:column;gap:10px;font-size:14px}
.ov-price div{display:flex;justify-content:space-between}
.ov-price div> *:last-child{font-family: "Montserrat", sans-serif;font-weight: 400}
.ov-price .total{font-size:18px;margin-top:10px}
.ov-price .total > *:last-child{font-family: "Montserrat", sans-serif;font-weight: 400}

.ov-actions{display:flex;gap:10px;margin-top:20px}
.ov-actions .btn{flex:1;height:48px;border-radius:8px}

.order-swal .swal2-input {     margin: .3125em;}

@media(max-width:768px){
    .order-view{padding:100px 25px}
    .order-title{font-size:26px}
    .ov-grid{grid-template-columns:1fr}
    .ov-summary{position:static}
    .ov-summary + div {position:static}
    .ov-item.grid{display: grid;grid-template-columns: 65px 1fr;;gap:10px;margin:20px 0px;height:100px;align-items: center}
    .ov-item .info {gap: 0}
    .ov-item img{width:65px;border-radius:8px; object-fit: cover;aspect-ratio: 1 / 1}
}
.mypage-nav{border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:60px}
.mypage-nav ul{display:flex;justify-content:center;gap:40px;border-top: 0!important;}
.mypage-nav a{display:block;padding:18px 0;font-size:15px;color:rgba(255,255,255,.5);transition:.3s;position:relative}
.mypage-nav a.active,
.mypage-nav a:hover{color:#fff;font-weight:600}
.mypage-nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#fff}


@media(max-width:768px){
    .mypage-nav ul{gap:20px;overflow-x:auto;justify-content:flex-start;overflow-y: hidden}
    .mypage-nav a{font-size:14px;white-space:nowrap}
}
.mypage-main{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff; min-height: 800px}
.mp-section{display:none; margin-bottom:50px}
.mp-section.active{display:block}

.mp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}
.mp-head h2{font-family:"Poiret One",sans-serif;font-size:36px;line-height: 1em}

.mp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.mp-card{background:#1a1a1a;border-radius:14px;padding:24px}
.mp-card a {color: #ffffff90; display: flex; justify-content: space-between; align-items: center; transition: all .3s ease}
.mp-card a:hover {color: #fff;}
.mp-card h3{font-size:18px;margin-bottom:14px}
.mp-direct{position:relative;}
.mp-link-list {display: grid; grid-template-columns: 1fr 1fr 1fr;gap:20px}

.mp-info{display:flex;flex-direction:column;gap:10px;font-size:14px}
.mp-info #viewMbAddr{    text-align: right;}
.mp-info li{display:flex;justify-content:space-between}
.mp-info span{color:rgba(255,255,255,.5)}

.mp-value{font-size:16px}
.mp-value b{font-size:22px}

.mp-link{display:inline-block;font-size:13px;color:rgba(255,255,255,.6)}

.mp-form{display:flex;flex-direction:column;gap:16px}
.mp-form .row{display:flex;flex-direction:column;gap:6px;margin: 0}
.mp-form label{font-size:13px;color:rgba(255,255,255,.6)}
.mp-form input{height:44px;background:#111;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:6px;padding:0 12px}
.coupon-list,.point-list{display:flex;flex-direction:column;gap:14px}
.coupon-list li,.point-list li{display:grid;grid-template-columns: 1fr 200px 80px;align-items:center;font-size:14px}
.coupon-list li:not(:last-child),.point-list li:not(:last-child){padding-bottom: 14px;border-bottom:1px solid rgba(255,255,255,.2)}
.coupon-list b,.point-list b{ text-align: right}
.coupon-list em,.point-list em{font-size:12px;color:rgba(255,255,255,.4);font-style: normal; text-align: right}
.coupon-list .disabled{opacity:.4}
.point-list b.minus{color:#ff6b6b}

@media(max-width:768px){
    .mypage-main{padding:100px 25px}
    .mp-head h2{font-size:26px}
    .mp-grid{grid-template-columns:1fr}
    .mp-link-list{grid-template-columns:1fr}
}

.mypage-review{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.review-head{margin-bottom:40px}
h2.board-titile{font-family:"Poiret One",sans-serif;font-size:36px; line-height: 1em; margin-right: auto}
.review-head h2{font-family:"Poiret One",sans-serif;font-size:36px; line-height: 1em}

.review-list{display:flex;flex-direction:column;gap:20px}
.review-item{display:grid;grid-template-columns:100px 1fr auto;gap:20px;background:#1a1a1a;border-radius:14px;padding:20px}
.review-item .thumb img{width:100%;border-radius:12px}
.review-item .info{display:flex;flex-direction:column;gap:8px}
.review-item .info strong{font-size:16px}
.review-item .info p{font-size:14px;color:rgba(255,255,255,.7)}
.review-item .date{font-size:12px;color:rgba(255,255,255,.4)}
.review-item .actions{display:flex;align-items:center}
.review-text{position:relative;font-size:15px;line-height:1.6;max-height:4.8em;overflow:hidden}
.review-text-inner{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.6;
    word-break: break-word;
}
.review-text.open{max-height:none}
.review-more{position:absolute;right:0;bottom:0;background:#1a1a1a;color:#aaa;border:0;font-size:13px;padding-left:6px;cursor:pointer}
.review-more.hide{display:none}
.review-text.open .review-text-inner{
    display: block;
    overflow: visible;
}


.rm-product{display:grid;grid-template-columns:72px 1fr;gap:16px;margin-bottom:20px}
.rm-product .thumb img{width:100%;border-radius:10px}
.rm-product .meta{display:flex;flex-direction:column;gap:8px}
.rm-product .name{font-size:16px;font-weight:700}
.rm-product .detail{display:flex;flex-direction:column;gap:4px}
.rm-product > .detail{grid-column: 1 / 3}
.rm-product .detail li{display:flex;gap:8px;font-size:13px;color:rgba(255,255,255,.7)}
.rm-product .detail span{min-width:70px;color:rgba(255,255,255,.4)}
.rm-product .detail b{font-weight:500;color:#fff}

#reviewEditModal textarea.form-control {margin-top: 10px; background: #ffffff10; color: #fff}
#reviewEditModal .review-star{display:flex;gap:4px;font-size:24px;color:#ccc;cursor:pointer;margin-top: 10px}
#reviewEditModal .review-star span.active{color:#ffb400}
#reviewEditModal .review-upload{margin-top:10px}
#reviewEditModal .review-preview{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
#reviewEditModal .review-preview .item{position:relative;width:80px;height:80px}
#reviewEditModal .review-preview img{width:100%;height:100%;object-fit:cover;border-radius:6px}
#reviewEditModal .review-preview button{position:absolute;top:-6px;right:-6px;background:#000;color:#fff;border:0;width:20px;height:20px;border-radius:50%;font-size:12px;cursor:pointer}

@media(max-width:768px){
    .mypage-review{padding:100px 25px}
    .review-head h2{font-size:26px}
    .review-item{grid-template-columns:80px 1fr}
}

.policy-page{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff}
.policy-head{margin-bottom:60px}
.policy-head h2{font-size:42px;font-weight:400;line-height: 1em}
.policy-meta{margin-top:12px;font-size:14px;color:rgba(255,255,255,.6)}

.policy-history{margin-top:80px;padding-top:30px;border-top:1px solid rgba(255,255,255,.15)}
.policy-history h3{margin-bottom:12px;font-size:18px;font-weight:700}
.policy-history ul{padding-left:16px}
.policy-history li{font-size:14px;line-height:1.7;color:rgba(255,255,255,.75);list-style:disc}
.policy-body{display:flex;flex-direction:column;gap:48px}

.policy-section h3{margin-bottom:12px;font-size:20px;font-weight:700}
.policy-section p{font-size:15px;line-height:1.8;color:rgba(255,255,255,.85)}
.policy-section ul{padding-left:18px}
.policy-section li{font-size:15px;line-height:1.8;color:rgba(255,255,255,.85);list-style:disc}


@media(max-width:1400px){
    .policy-page{padding:140px 25px 100px}
    .policy-head h2{font-size:60px}
}


@media(max-width:768px){
    .policy-page{padding:120px 25px 80px}
    .policy-head h2{font-size:42px}
    .policy-section h3{font-size:18px}
    .policy-section p,
    .policy-section li{font-size:14px}
}

.search-page{max-width:1400px;margin:0 auto;padding:200px 20px 120px;color:#fff;min-height: 1000px}
.search-head form{display:flex;gap:10px}
.search-head input{flex:1;height:54px;padding:0 16px;background:#111;border: 0;border-bottom:1px solid rgba(255,255,255,.3);color:#fff;font-size:16px}
.search-head button{width:90px;background:#fff0;color:#fff;font-weight:600;border:0}
.search-summary{margin:20px 0;font-size:14px;color:rgba(255,255,255,.7)}
.search-tabs{display:flex;gap:8px;margin-bottom:30px}
.search-tabs button{padding:10px 16px;background:#111;border:1px solid rgba(255,255,255,.2);color:#aaa}
.search-tabs button span.cnt{background: #232323;color:#fff;font-size:12px;padding:2px 8px;border-radius:20px}
.search-tabs button.active{background:#fff;color:#000}
.sr-group{margin-bottom:40px}
.sr-group h3{font-size:18px;margin-bottom:12px}
.sr-product{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.sr-product li a{display:flex;gap:12px;align-items:center}
.sr-product img{width:80px;height:80px;object-fit:cover;background:#222;border-radius: 10px;}
.sr-product strong{font-size:16px;display:block; color: #fff;font-family:"Montserrat",sans-serif;font-weight:400;}
.sr-product span{font-size:14px;color:#aaa}

.sr-board li{padding:25px 0;margin-top: 12px;padding: 20px;background: #1a1a1a;border-radius: 14px;}
.sr-board a{font-size:16px;display:flex;gap: 10px;color:#fff;align-items: center}
.sr-board span{font-size:13px;color:#777;margin-left: auto}
.sr-tab{display:none}
.sr-tab.active{display:block}
.search-empty-guide{display:none;text-align:center;padding:120px 0;color:rgba(255,255,255,.6)}
.search-empty-guide.active{display:block}
.search-empty-guide i{font-size:48px;margin-bottom:20px;opacity:.6}
.search-empty-guide p{font-size:16px;line-height:1.6}
@media(max-width:768px){
    .search-head button {width: fit-content;}
    .sr-product img{width:60px;height:60px;object-fit:cover;border-radius: 8px;}
    .sr-product strong{font-size:13px;}
    .sr-product span{font-size:12px;}
    .search-page{padding:120px 25px 80px}
    .sr-product{flex-direction:column}
    .sr-product{grid-template-columns:repeat(1,1fr);  gap: 10px;}
    .search-tabs button{font-size: 0.95em;padding: 7px 10px;}
    .search-tabs{overflow:auto}
}

.addr-line{display:flex;align-items:center;gap:10px;}
.addr-line input{flex:1;}

#btnOpenAddressModal{
    position: absolute;
    right: 30px;
    top: 20px;
}

.address-modal{position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999}
.address-modal-dim{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.5)}
.address-modal-content{position:relative;width:90%;max-width:600px;max-height:80vh;overflow:auto;background:#fff;margin:5vh auto;border-radius:12px;padding:20px}
.address-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.address-item{border:1px solid #e5e5e5;border-radius:10px;padding:15px;margin-bottom:12px}
.address-item-top{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.badge-default{display:inline-block;padding:2px 8px;font-size:12px;border-radius:20px;background:#111;color:#fff}
.address-item-info p{margin:4px 0}
.address-item-btns{display:flex;gap:3px;flex-wrap:wrap;margin-top:12px;justify-content: flex-end}
.address-empty{padding:30px 0;text-align:center;color:#777}

.guest-order-check{min-height: calc(100vh - 120px);padding: 140px 20px 80px;margin : 100px 0px;box-sizing: border-box;background: #f8f8f8;}
.guest-order-check .inner{max-width: 1200px;margin: 0 auto;}
.guest-order-check .goc-box{max-width: 520px;margin: 0 auto;background: #fff;border: 1px solid #e5e5e5;border-radius: 16px;padding: 40px 30px;box-shadow: 0 10px 30px rgba(0,0,0,0.06);}
.guest-order-check .goc-box h2{margin: 0 0 12px;font-size: 28px;font-weight: 700;color: #111;text-align: center;}
.guest-order-check .desc{margin: 0 0 30px;font-size: 15px;line-height: 1.6;color: #666;text-align: center;}
.guest-order-check .goc-info{margin-bottom: 24px;padding: 18px 20px;background: #fafafa;border: 1px solid #eee;border-radius: 12px;}
.guest-order-check .goc-info p{margin: 0;font-size: 14px;line-height: 1.7;color: #333;}
.guest-order-check .goc-info p + p{margin-top: 8px;}
.guest-order-check .goc-form{display: flex;flex-direction: column;gap: 12px;}
.guest-order-check .goc-form input[type="password"]{width: 100%;height: 52px;padding: 0 16px;border: 1px solid #ddd;border-radius: 10px;font-size: 15px;box-sizing: border-box;outline: none;background: #fff;}
.guest-order-check .goc-form input[type="password"]:focus{border-color: #111;}
.guest-order-check .goc-form .btn{width: 100%;height: 52px;border-radius: 10px;font-size: 15px;font-weight: 600;}

@media (max-width: 768px){
    .guest-order-check{min-height: auto;padding: 110px 16px 50px;}
    .guest-order-check .goc-box{padding: 28px 20px;border-radius: 12px;}
    .guest-order-check .goc-box h2{font-size: 24px;}
    .guest-order-check .desc{font-size: 14px;margin-bottom: 24px;}
}

/************** 리뷰 이미지 슬라이드 팝업 ***********/
.review-image-popup{position: fixed;inset: 0;z-index: 9999;}
.review-image-dim{position: absolute;inset: 0;background: rgba(0,0,0,0.82);}
.review-image-modal{position: relative;z-index: 2;width: calc(100% - 40px);max-width: 960px;height: calc(100% - 80px);margin: 40px auto;display: flex;align-items: center;justify-content: center;}
.review-image-close{position: absolute;top: 0;right: 0;z-index: 20;width: 42px;height: 42px;border: 0;border-radius: 50%;background: rgba(255,255,255,0.18);color: #fff;font-size: 24px;cursor: pointer;}
.review-popup-swiper{width: 100%;height: 100%;}
.review-popup-swiper .swiper-slide{display: flex;align-items: center;justify-content: center;}
.review-popup-swiper .swiper-slide img{max-width: 100%;max-height: 100%;object-fit: contain;}
.review-popup-swiper .swiper-button-prev,
.review-popup-swiper .swiper-button-next{color: #fff;}
.review-popup-swiper .swiper-pagination-bullet{background: rgba(255,255,255,0.6);opacity: 1;}
.review-popup-swiper .swiper-pagination-bullet-active{background: #fff;}

/************ 상품 상세 QNA ***************/
.qna-toggle-btn{display: block;width: 100%;padding: 0;border: 0;background: none;text-align: left;font: inherit;color: inherit;cursor: pointer;}
.qna-detail{margin-top: 12px;     padding: 20px; background: #1a1a1a;border-radius: 14px;}
.qna-answer-box{display: flex;gap: 12px;padding: 10px 0;}
.qna-answer-label{width: 24px;min-width: 24px;font-weight: 700;}
.qna-answer-content{flex: 1;line-height: 1.6;color: #ffffff90;word-break: break-word;}

/************ CS 문의상세 주문내역, 상품 노출 **************/
.bv-related { margin: 30px 0; }
.bv-related-box { border-radius: 8px; padding: 24px;
    border: 1px solid rgba(255, 255, 255, .15);}
.related-product-list {display: grid;grid-template-columns:1fr 1fr;flex-direction: column;gap: 12px;}
.related-product-item {display: flex;gap: 12px;align-items: flex-start;}
.related-product-item .thumb {width: 70px;height: 70px;overflow: hidden;border-radius: 8px;flex: 0 0 70px;}
.related-product-item .thumb img {width: 100%;height: 100%;object-fit: cover;}
.related-product-item .info a {color: #FFF;font-size: 13px;line-height: 1.5;}
.related-product-item .info .name {display: inline-block;font-weight: 700;margin-bottom: 4px;}
.related-product-item .info .desc {color: #888;font-size: 11px;line-height: 1.5;}
@media (max-width:1400px){
    .related-product-list{grid-template-columns:1fr 1fr}
}
@media (max-width:768px) {
    .related-product-list{grid-template-columns:1fr}
}
/********************* 주문내역 리스트 슬라이드 ******************/

.order-items-slide-wrap{max-height:0;overflow:hidden;opacity:0;padding:0 16px;border-top:0 solid transparent;transition:max-height .35s ease,opacity .25s ease,padding .25s ease,border-top-color .25s ease}
.order-item.open .order-items-slide-wrap{max-height:800px;opacity:1;padding:16px 16px;margin-top: 15px;border-top:1px solid #222;background:#0d0d0d}
.order-items-slide{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.order-slide-card{display:flex;gap:12px;background:none;border:0;border-radius:0;padding:0;color:#fff;text-decoration:none; align-items: center}
.order-slide-thumb{width:60px;height:60px;flex-shrink:0;border-radius:8px;overflow:hidden;background:#1a1a1a}
.order-slide-thumb img{width:100%;height:100%;object-fit:cover}
.order-slide-info{flex:1;display:flex;flex-direction:column;font-size:10px;gap:0px}
.order-slide-info strong{font-size:12px;color:#fff;line-height:1.4;font-family: "Montserrat", sans-serif;font-weight: 400}
.order-slide-info  span{font-size:9px;color:#888}
.order-slide-info > span{font-size:9px;color:#888;line-height: 10px;margin-top: 5px}
.order-slide-info b{margin-top:4px;font-size:12px;color:#fff;font-family: "Montserrat", sans-serif;font-weight: 400}
.item-body-expandable{cursor:pointer;position:relative}
.order-list .info .name.plus::after{margin-left: 5px;display: inline-flex;content:'';width:10px;height:10px;border-right:2px solid #666;border-bottom:2px solid #666;transform:translateY(-50%) rotate(45deg);transition:.25s}
.order-item.open .item-body-expandable::after{transform:translateY(-50%) rotate(225deg);border-color:#fff}
.order-more-hint{display:block;margin-top:6px;font-size:12px;color:#666}
@media (max-width:1400px){
    .order-items-slide{grid-template-columns:1fr 1fr}
}
@media (max-width:768px) {
    .order-items-slide {grid-template-columns:1fr}
}

.policy-section table{border-collapse:collapse;width:100%; margin: 5px 0}
.policy-section table th,.policy-section table td{border:1px solid #3a3a3a;padding:8px 12px;color:#d4d4d4}
.policy-section table thead tr{background-color:#2a2a2a}
.policy-section table tbody tr{background-color:#1e1e1e}
.policy-section table tbody tr:nth-child(even){background-color:#252525}