#submit_layer .submit_inner:has(.browserFormWrap) {max-width:680px; height: 100%; background: #0000; display: flex; align-items: center; padding:0 20px;}
#browserForm { position: fixed; width: 100%; height: 100%; left: 0; top: 0; display:flex; align-items: center; justify-content: center; z-index: 100; background: rgba(0, 0, 0, 0.3); padding: 20px; overflow-y: auto;}
.browserFormWrap { max-width: 640px; width: 100%; background: #fff; padding:79px 54px 72px; display: flex; align-items: center; justify-content: center; flex-direction: column; position:relative;}

.browserFormWrap .browserFormClose {max-width:26px; width:4.0625vw; max-height:26px; height:4.0625vw; position:absolute; top: 25px; right: 25px; }
.browserFormWrap .browserFormClose:active {top:26px;}

.browserFormWrap .browserFormTitleWrap {text-align:center; font-size: 48px; }
.browserFormWrap .browserFormTitle[data-type="main"]{font-weight: 500; line-height:1.2;}
.browserFormWrap .browserFormTitle[data-type="sub"]{ font-size: 0.46em; margin-top: 14px;}
.browserFormWrap .browserFormTitle .blueText {color:var(--page-color); font-weight:bolder;}

.browserFormWrap .browserFormInputWrap {display:flex; flex-direction:column; gap:8px; width:100%; font-size:24px; margin:32px 0;}
.browserFormWrap .browserFormInput {height: 11.25vw; max-height: 72px; padding:5px 29px; background:#f4f4f4; border:none; width: 100%; font-weight: 500; border-radius: 8px; }
.browserFormWrap label .browserFormInput {display:none;}
.browserFormWrap .browserFormInput::placeholder {color:#9d9d9d;}
.browserFormWrap .customSelectWrap { position: relative; color: #0e0e0e; height:11.25vw; max-height:72px; background:#f4f4f4; border-radius: 8px;}
.browserFormWrap .customSelectWrap .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;}
.browserFormWrap .customSelectWrap.active{background:#f4f4f4;}
.browserFormWrap .customSelectWrap.active .customSelectList { display: block; max-height: 10em; border-radius: 0;}
.browserFormWrap .customSelectorText { padding: 0 26.6669px; width: 100%; height: 100%; display: flex; align-items: center; cursor:pointer; 
    background: inherit; font-size: 1em; font-weight: normal; font-weight: 500; border-radius:6px;}
.browserFormWrap .customSelectorText[data-value=""] {color:#9d9d9d;}
.browserFormWrap .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;}
.browserFormWrap .customSelectWrap.active .customSelectorText:after {transform: translate(0, -50%) rotate(180deg);}
.browserFormWrap .customSelectWrap .customSelectList li { color: inherit; font-weight: normal; max-height: 64px; height: 10vw; display: flex; align-items: center; padding: 0 29.3333px; cursor: pointer;}
.browserFormWrap .customSelectList li.before_select { color: #3617ce; font-weight: 600; }
.browserFormWrap .customSelectList li:hover { background: #f0f0f0; }
.browserFormWrap .customSelectWrap .customSelectList li + li {border-top: 2px solid #dbdbdb;}

.browserFormWrap .browserFormAgreeWrap {width:100%; padding-bottom:19px; margin-bottom:19px; border-bottom: 2px solid #dfdfdf;}
.browserFormWrap .formAgreeTitle {display:flex; justify-content: space-between;}
.browserFormWrap .inputAgreeCheck { font-size: 32px; font-weight: 500; cursor: pointer;}
.browserFormWrap .inputAgreeCheck input[type="checkbox"] + span { display: flex; align-items: center; font-size: .7em; gap:8px;}
.browserFormWrap .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/icon/icon_form_checkbox_n.png); background-repeat: no-repeat; background-size: contain;}
.browserFormWrap .inputAgreeCheck input[type="checkbox"]:checked + span:before {background-image: url(https://onyouimage.cafe24.com/icon/icon_form_checkbox_y.png);}
.browserFormWrap .agreeToggleBtn { padding: 0 20px;}
.browserFormWrap .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; }
.browserFormWrap .popAgree.active .agreeToggleBtn img { transform: rotate(270deg);}
.browserFormWrap .agreeList { font-weight: normal; font-size: .6em; margin: 20.224px 0; display: none; }
.browserFormWrap .popAgree.active .agreeList { display: block; }
.browserFormWrap .agreeList .agreeRow + .agreeRow {margin-top: 11.8444px;}

.browserFormWrap .browserFormSubmit { max-height: 80px; height: 12.5vw; width: 100%; background: var(--page-color); color: #fff; font-size: 33px; font-weight: 600; border-radius: 10px; position: relative;
    display: flex; align-items: center; justify-content: center; gap:35px; padding-left:16px;}
.browserFormWrap .browserFormSubmit:active {top:1px;}
.browserFormWrap .btnArrow { position: static; transform: none; height: 25px; }

.browserDoneWrap { position: fixed; background: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; justify-content: center;}
.browserDoneWrap .browserDoneContent { min-width: 100px; min-height: 100px; max-width: 510px; max-height: 400px; width: 79.6875vw; height: 62.4vw; border-radius: 14.9333px; background: #fff; position: relative; }
.browserDoneWrap .applyDonePupupClose {position: absolute; right: 18.6667px; top: 18.6667px; max-width: 22.9333px; max-height: 22.9333px; width: 3.58333vw; height: 3.58333vw;}
.browserDoneWrap .applyDonePupupClose:active {top:19.6667px;}
.browserDoneWrap .browserDoneItem { 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;}
.browserDoneWrap .applyDonePopupBtn { 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;}
.browserDoneWrap .applyDonePopupBtn:active{top:1px;}

@media screen and (max-width:640px){
    #submit_layer .submit_inner:has(.browserFormWrap) {padding:0 3.125vw;}
    #browserForm { padding: 3.125vw;}
    .browserFormWrap { padding:12.34375vw 8.4375vw 11.25vw; }

    .browserFormWrap .browserFormClose { top: 3.90625vw; right: 3.90625vw; }
    .browserFormWrap .browserFormClose:active {top:4.0625vw;}
    
    .browserFormWrap .browserFormTitleWrap { font-size: 7.5vw; }
    .browserFormWrap .browserFormTitle[data-type="sub"]{ margin-top: 2.1875vw; }

    .browserFormWrap .browserFormInputWrap { gap:1.25vw; font-size:3.75vw; margin:5vw 0;}
    .browserFormWrap .browserFormInput { padding:0.78125vw 4.53125vw; border-radius: 1.25vw; }
    .browserFormWrap .customSelectWrap { border-radius: 1.25vw;}
    .browserFormWrap .customSelectorText { padding: 0 4.16667vw; border-radius:0.9375vw;}
    .browserFormWrap .customSelectorText:after { right: 3.58333vw;}

    .browserFormWrap .browserFormAgreeWrap { padding-bottom:2.96875vw; margin-bottom:2.96875vw; }
    .browserFormWrap .inputAgreeCheck { font-size: 5vw;}
    .browserFormWrap .inputAgreeCheck input[type="checkbox"] + span {gap:1.25vw;}
    .browserFormWrap .agreeToggleBtn { padding: 0 1.66667vw;}
    .browserFormWrap .agreeList { margin: 3.16vw 0; }
    .browserFormWrap .agreeList .agreeRow { letter-spacing: -1px; }
    .browserFormWrap .agreeList .agreeRow + .agreeRow { margin-top: 1.85069vw; }

    .browserFormWrap .browserFormSubmit { font-size: 5.15625vw; border-radius: 1.5625vw; gap:5.46875vw; padding-left:2.5vw;}
    .browserFormWrap .btnArrow { height: 3.90625vw; }

    .browserDoneWrap .browserDoneContent { border-radius: 2.33333vw;}
    .browserDoneWrap .applyDonePupupClose { right: 2.91667vw; top: 2.91667vw;}
    .browserDoneWrap .applyDonePupupClose:active {top:calc(2.91667vw + 1px);}
    .browserDoneWrap .browserDoneItem { gap: 3.08333vw; padding: 0 4.66667vw; font-size: 4.83333vw;}
    .browserDoneWrap .applyDonePopupBtn { border-radius: 2.5vw;}
}