:root {
    --bg-color:#0e0e0e;
}
.noDrag { -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
#submit_layer .pop-layer-inner.s26formLayer {padding: 0;}
.pop-layer-inner .qa_table.deliveryForm {padding:0; gap:0;}
.s26formLayer .pageHeader { padding: 0; justify-content: right; background: #0e0e0e;}
.pop-layer-inner.s26formLayer button {position: absolute; width:auto; height:auto; border: none; background: none; font-family: "Pretendard"; padding: 0; right: 26.66667px; top: 26.66667px;}
.pop-layer-inner.s26formLayer .agreeToggleBtn {position:static; padding-right:4px;}}
.s26formLayer .btn_close {position:absolute; right: 26.66667px; top: 26.66667px; }
.s26formLayer .btn_close > img {max-width:16px; width:2.5vw;}

#s26formBox { background: var(--bg-color); color: #fff; font-size: 24.13331px; font-weight: 600; padding: 16.47693px 53.12708px 72.87859px;}
.s26formRow {display:flex; flex-direction: column;}
.s26formRow input[type="radio"] {display:none;}
.s26formTitle {margin-bottom:27.8819px;}

.formTitleWrap { flex-grow: 1; display: flex; align-items: center; justify-content: center; color: #fff; padding: 40px 0 27.0461px; gap: 10px; font-size: 40px; font-weight: 600; }
.formTitleWrap .formTitleImg {width:36.25vw; max-width:232px; height:7.03125vw; max-height:45px;}
.formTitleWrap .formTitleText {line-height: 1; position: relative; top: -6px;}

.popParentRow {margin-top:42.55251px;}
/* .preorderTypeRow {margin-top:124px; gap:20px;} */
.preorderTypeRow {margin-top:21.03162px; gap:10px;}
.popUserRow .s26formTitle {display:flex; justify-content: space-between; align-items:flex-end;}

.inputParentCheck {font-weight:normal; font-size:.7em; cursor:pointer;}
.inputParentCheck input[type="checkbox"] {display:none;}
.inputParentCheck input[type="checkbox"] + span { display: flex; gap: 12px; align-items: center;}
.inputParentCheck input[type="checkbox"] + span:before {content:""; display:inline-block; width:18.2225px; height:18.2225px; 
    background-image:url(https://onyouimage.cafe24.com/model/s26/form/form_checko.png); background-repeat: no-repeat; background-size:contain;}
.inputParentCheck input[type="checkbox"]:checked + span:before {background-image:url(https://onyouimage.cafe24.com/model/s26/form/form_checki.png?v0);}

.s26formLayer .s26_datas[type="text"] { max-height:74.1232px; height: 11.58175vw; padding: 22.6593px 29.0519px; border-radius: 10px; font-size: .9em; border: 3px solid #fff;}
.s26formLayer .s26_datas[type="text"]:focus {border-color:#d25ef5;}
.s26formLayer .s26_datas[type="text"]::placeholder {color:#a5a5a5;}
.s26formLayer .s26_datas[type="text"] + .s26_datas[type="text"] {margin-top:10.62861px;}

/* ul-li customSelector */
.preorderTypeRow .s26formTitle {margin:0; display:flex; align-items: flex-end; gap:18.13331px;}
.preorderTypeRow .s26formTitle .s26subtitle { font-size: 0.76em; font-weight: normal; letter-spacing: -1px;}
.preorderTypeRow .s26formTitle .s26subtitle span { background: linear-gradient(225deg, #99b5fe, #e38ffe, #ffeeff); background-clip: text; color: transparent; font-weight: bold;}
.customSelectWrap {position:relative; color:#0e0e0e; border-radius: 20px 20px 0 0;}
.customSelectorTextWrap {background: #fff; font-weight: 600; max-height:74.13333px; height:11.58333vw; padding:2.66669px; border-radius: 10.66669px; overflow:hidden; cursor:pointer; position:relative;}
.customSelectorText { padding: 0 26.6669px; width: 100%; background: #fff; height: 100%; display: flex; align-items: center; border-radius:8px; font-size:.9em; }
.customSelectorText[data-value=""] {color:#a4a4a4; }
.customSelectorText:after {content: ""; display: block; position: absolute; right: 22.9333px; top: 50%; transform: translate(0, -50%); transition:transform 0.3s ease;
    background: url(https://onyouimage.cafe24.com/icon/bottom_arrow_b.png) no-repeat; background-size: contain; max-width: 18.6667px; max-height: 9.6px; width:2.91667vw; height:1.5vw;}
.customSelectList {position:absolute; top:100%; left:0; width:100%; overflow:overlay; z-index: 1; background:#fff; border-radius: 0 0 20px 20px; font-size:.9em; display:none; }
.customSelectList li { color: inherit; font-weight: normal; max-height:64px; height: 10vw; display: flex; align-items: center; padding: 0 29.3333px; cursor:pointer;}
.customSelectList li:hover {background:#f0f0f0;}
.customSelectList li + li {border-top: 2px solid #dbdbdb;}
.customSelectList li.before_select {color:#3617ce; font-weight: 600;}

.customSelectWrap.active {background:#fff;}
.customSelectWrap.active .customSelectorTextWrap { background: linear-gradient(to bottom, #9aaaff, #ffd9fe); }
.customSelectWrap.active .customSelectorText:after {transform:translate(0, -50%) rotate(180deg);}
.customSelectWrap.active .customSelectList {display:block;}

.s26formRow.popAgree {margin-top:23.4759px; font-size: 0.85em;}
.popAgree .s26formTitle {padding-bottom:20.224px; margin-bottom:0; border-bottom:2px solid #454545; display: flex; justify-content: space-between; align-items:center;}
.inputAgreeCheck {cursor:pointer;}
.inputAgreeCheck input[type="checkbox"] {display:none;}
.inputAgreeCheck input[type="checkbox"] + span { display: flex; gap: 12px; align-items: center; font-size:.7em;}
.inputAgreeCheck input[type="checkbox"] + span:before {content:""; display:inline-block; max-width:22.0948px; max-height:22.0948px; width:3.45232vw; height:3.45232vw;
    background-image:url(https://onyouimage.cafe24.com/model/s26/form/form_agreeo.png); background-repeat: no-repeat; background-size:contain;}
.inputAgreeCheck input[type="checkbox"]:checked + span:before {background-image:url(https://onyouimage.cafe24.com/model/s26/form/form_agreei.png);}
.agreeToggleBtn {padding:0 20px;}
.agreeToggleBtn img { transform: rotate(90deg); transition:transform .3s ease; display:inline-block; max-width: 10.2214px; max-height: 18.2091px; width:1.5971vw; height:2.84517vw; }
.popAgree.active .agreeToggleBtn img { transform: rotate(270deg);}
.agreeList {font-weight: normal; font-size:.6em; margin:20.224px 0; display: none;}
.agreeList .agreeRow + .agreeRow {margin-top:11.8444px;}
.popAgree.active .agreeList {display:block;}

.preorderTypeWrap {display:flex; gap:11.6797px; margin-top: 15px;}
.preorderTypeWrap > label {width:0; flex-grow:1; position:relative;}
.preorderTypeWrap > label:active {top:1px;}
.s26_datas + .radio_box {max-height:95.93754px; height:14.99024vw; background-repeat: no-repeat; background-size:contain; cursor:pointer;}
.s26_datas[value="SKT"] + .radio_box {background-image:url(https://onyouimage.cafe24.com/model/s26/form/tel_skt_n.png);}
.s26_datas[value="SKT"]:checked + .radio_box {background-image:url(https://onyouimage.cafe24.com/model/s26/form/tel_skt_y.png);}
.s26_datas[value="타사"] + .radio_box {background-image:url(https://onyouimage.cafe24.com/model/s26/form/tel_other_n.png);}
.s26_datas[value="타사"]:checked + .radio_box {background-image:url(https://onyouimage.cafe24.com/model/s26/form/tel_other_y.png);}
.s26_datas[value="타사"]:disabled + .radio_box{background-image:url(https://onyouimage.cafe24.com/form/othertel_none.png);}

#form_submit { width: 100%; color: inherit; font-size: 1.335em; margin-top: 20.224px; border-radius: 10.6667px; font-weight: 600; padding: 16.1592px 0; cursor:pointer;
    background: #333; letter-spacing: -2px; position: relative; top:0;left:0; }
#form_submit:active {top:1px;}
#form_submit[data-state="done"] {background: center / contain no-repeat url(https://onyouimage.cafe24.com/model/s26/form/submit_btn.png);}
.btn_text { position: relative; left: -8px;}
.btnArrow {height:28.6984px; position:absolute; right:75.1156px; top:50%; transform:translate(0, -50%);}

.s26ShareRow {background:var(--bg-color); color:#fff; display:flex; align-items: center; padding: 0 100px 51px; gap:16px;}
.s26ShareBtn { position: relative; display: flex; color: inherit; font-size: 46px; font-weight: 500; letter-spacing: -0.5px; align-items: center; justify-content: space-between; width: 100%;}
.s26ShareBtn:active {top:1px;}
.s26ShareBtn img { width:9.16667vw; height:9.16667vw; max-width:110px; max-height:110px;}

#layerPopup { position: fixed; width: 100%; height: 100%; background: #00000099; top: 0; left: 0; z-index: 999;}
#layerPopupClose {position: absolute; right: 18.6667px; top: 18.6667px; max-width: 22.9333px; max-height: 22.9333px; width: 3.58333vw; height: 3.58333vw;}
#layerPopupClose:active {top:19.6667px;}
.layerPopupContent {border-radius: 28px; background:#fff; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); }
.layerPopupContent {min-width:100px; min-height:100px; max-width: 510px; max-height: 400px; width:79.6875vw; height:62.4vw; border-radius: 14.9333px;}
.layerPopupContent[data-type="apply"] .layerPopupItem { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 30.9333px; text-align: center; gap: 19.7333px; padding: 0 29.8667px; }
.applyDoneIcon {max-width:75.7333px; max-height:75.7333px; width:11.83333vw; height:11.83333vw; margin-top:9.06669px;}
.applyDoneTitle {font-weight: 600; line-height:1.2;}
.applyDoneText { font-size: 0.63em; color: #575757; font-weight: 500;}
.applyDoneBtn {display: flex; max-height: 64.5333px; height: 10.08333vw; background: #3617ce; color: #fff; width: 100%; align-items: center; justify-content: center; 
    border-radius: 16px; font-size:.7em; position:relative; cursor:pointer;}
.applyDoneBtn:active {top:1px;}

@media screen and (max-width:640px){
    .pop-layer-inner.s26formLayer button.btn_close {right:4.16667vw; top:4.16667vw;}

    #s26formBox { font-size: 4.08333vw; padding: 2.57452vw 8.301106vw 11.38728vw; }
    .s26formTitle {margin-bottom:4.356547vw;}
    .formTitleWrap {padding:6.25vw 0 4.22596vw; gap:1.5625vw; font-size: 6.25vw;}
    .formTitleWrap .formTitleText {top:-0.9375vw;}

    .inputParentCheck input[type="checkbox"] + span {gap:1.044494vw;}
    .inputParentCheck input[type="checkbox"] + span:before {width:2.847269vw; height:2.847269vw;}
    
    .popParentRow {margin-top:6.64883vw;}
    .preorderTypeWrap {gap:1.98121vw; margin-top:3.52941vw;}
    
    .s26formLayer .s26_datas[type="text"] { padding: 3.17357vw 4.06889vw; border-radius: 1.66667vw; border-width: 0.42719vw; }
    .s26formLayer .s26_datas[type="text"] + .s26_datas[type="text"] {margin-top:1.66072vw;}
    .radio_box {height:14.93079vw; border-radius:1.66667vw;}
    .radioBoxTextWrap {border-radius:1.5vw; gap:1.16667vw;}

    .preorderTypeRow {margin-top:3.28619vw; gap:1.66667vw;}
    .preorderTypeRow .s26formTitle {gap:2.83333vw;}
    .customSelectWrap {border-radius:1.66667vw 1.66667vw 0 0;}
    .customSelectorTextWrap {padding:0.41667vw; border-width:0.41667vw; border-radius: 1.66667vw;}
    .customSelectorText {padding:0 4.16667vw; border-radius:1.25vw;}
    .customSelectorText:after {right:3.58333vw;}
    .customSelectList {border-radius:0 0 1.66667vw 1.66667vw;}
    .customSelectList li {padding:0 4.58333vw;}
    .customSelectList li + li {border-top-width:0.16667vw;}

    .s26formRow.popAgree {margin-top:3.66811vw;}
    .popAgree .s26formTitle {padding-bottom:3.16vw;}
    .agreeToggleBtn {padding:0 1.66667vw;}
    .agreeList { margin:3.16vw 0;}
    .agreeList .agreeRow {letter-spacing: -1px;}
    .agreeList .agreeRow + .agreeRow {margin-top:1.85069vw;}

    #form_submit {padding: 2.52487vw 0; border-radius: 1.66667vw; margin-top:3.16vw;}
    .btnArrow {height:4.48412vw; right:11.73682vw;}

    .s26ShareRow {gap: 1.33333vw; padding: 0 8.301106vw 4.15vw;}
    .s26ShareBtn {font-size:3.83333vw;}

    #layerPopupClose { right:2.91667vw; top:2.91667vw; }
    #layerPopupClose:active {top:calc(2.91667vw + 1px);}
    .layerPopupContent {border-radius: 2.33333vw;}
    .layerPopupContent[data-type="apply"] .layerPopupItem  { gap: 3.08333vw; padding:0 4.66667vw; font-size:4.83333vw; }
    .applyDoneIcon {margin-top:1.41667vw;}
    .applyDoneBtn {border-radius:2.5vw;}
}
@media screen and (max-width:500px){
    .s26_datas[type="text"] {border-width:2px;}
    #form_submit {letter-spacing: -0.5px;}
    
    .popAgree .s26formTitle {border-bottom-width: 1px;}
}