header {position: fixed; top: 0; left: 0; width: 100%; height: 86px; background: var(--wt); z-index: 7777;}
header .container {display: flex; align-items: center; justify-content: space-between; height: 100%;}
header .logo {width: 197px; height: auto;}
header .logo img {width: 100%; height: auto;}

header .link_btn {display: flex; align-items: center; justify-content: center; width: 148px; height: 46px; border-radius: 15px; background: var(--pr2); font-size: 15px; font-weight: bold; line-height: 1; color: var(--black_1);}

/* fixed_btn */
.fixed_btn {position: fixed; top: 50%; right: 50px; transform: translateY(-50%); z-index: 5;}
.fixed_btn .popup_btn {animation: heartbeat 1.5s ease-in-out infinite both; width: 60px; height: auto; aspect-ratio: 1;}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
.fixed_btn .popup_btn img {width: 100%; height: auto;}

/* sec_new */
.sec_new {position: fixed; top: 50%; right: -450px; transform: translateY(-50%); overflow: hidden; z-index: 8888; max-width: 450px; width: 100%; height: auto; padding: 25px 25px 80px; box-sizing: border-box; border-radius: 20px 0 0 20px; background-image: linear-gradient(to bottom, #0000ed, #000087); transition: all .5s;}
.sec_new.open {right: 0;}

.sec_new .container {overflow: hidden;}

.sec_new .popup_top {display: flex; align-items: center; justify-content: space-between; margin-bottom: 35px;}
.sec_new .popup_top .tit {font-size: 32px; font-weight: bold; line-height: 1; color: #00de6e;}
.sec_new .popup_top .close_btn {width: 24px; height: auto;}
.sec_new .popup_top .close_btn img {width: 100%; height: auto;}

.sec_new .form-box {max-height: calc(100vh - 190px); height: auto; padding-bottom: 20px; overflow: auto; overflow-x: hidden;}
.sec_new .form-box form {padding-bottom: 20px;}
.sec_new .form-box::-webkit-scrollbar,
.sec_new .form-box::-webkit-scrollbar-thumb,
.sec_new .form-box::-webkit-scrollbar-track {display:none;}

.sec_new .form-box .input-box {display: none; flex-flow: column; align-items: flex-start; margin-bottom: 30px;}
.sec_new .form-box .input-box.on {display: flex;}
.sec_new .form-box .input-box:last-of-type {margin-bottom: 0;}
.sec_new .form-box .input-box .tit {margin-bottom: 15px; font-size: 18px; font-weight: bold; line-height: 1; color: var(--wt);}
.sec_new .form-box .input-box .tit small {display: block; margin-top: 10px; font-size: 15px; font-weight: 400; line-height: 110%; color: var(--wt);}
.sec_new .form-box .input-box .tit .red {color: #ff3636;}

.sec_new .form-box .input-box .d-flex {width: 100%; margin-bottom: 10px;}
.sec_new .sub_form {margin-bottom: 30px;}
.sec_new .form-box .input-box .d-flex:last-of-type {margin-bottom: 0;}
.sec_new .form-box .input-box input[type="text"] {width: 100%; height: 46px; padding: 0 15px; margin-bottom: 10px; box-sizing: border-box; border-radius: 15px; font-size: 15px; font-weight: 500; line-height: 1; color: var(--black_1); border: 1px solid var(--wt); box-sizing: border-box; background: var(--wt);}
.sec_new .form-box .input-box select {width: 100%; height: 46px; padding: 0 15px; margin-bottom: 10px; box-sizing: border-box; border-radius: 15px; font-size: 15px; font-weight: 500; line-height: 1; color: var(--black_1); border: 1px solid var(--wt); box-sizing: border-box; background: url(./../img/popup_select.png)no-repeat calc(100% - 15px) 50%; background-size: 14px; background-color: var(--wt); appearance: none;}
.sec_new .form-box .input-box input[type="text"]:last-of-type {margin-bottom: 0;}
.sec_new .form-box .input-box input[type="text"]::placeholder {color: #C9C9C9;}
.sec_new .form-box .input-box textarea {width: 100%; height: 100px; padding: 15px; margin-bottom: 10px; box-sizing: border-box; border-radius: 15px; font-size: 15px; font-weight: 500; line-height: 1; color: var(--black_1); border: 1px solid var(--wt); box-sizing: border-box; background: var(--wt); resize: none;}
.sec_new .form-box .input-box .ckd-box {display: flex; align-items: center; gap: 10px; width: 100%; flex-wrap: wrap;}

.sec_new .form-box .input-box .ckd-box.vcheck {position: relative; display: grid; grid-template-columns: 31.53% 1fr 1fr; grid-template-rows: 83px auto;}
.sec_new .form-box .input-box .ckd-box.vcheck.on {padding-bottom: 56px;}
.sec_new .form-box .input-box .ckd-box.vcheck input {position: absolute; bottom: 0; width: 100%;}
.sec_new .form-box .input-box .ckd-box.vcheck label {width: 100%;}

.sec_new .form-box .input-box .ckd-box.wacheck {position: relative; display: grid; grid-template-columns: 31.53% 1fr 1fr; grid-template-rows: 83px auto;}
.sec_new .form-box .input-box .ckd-box.wacheck.on {padding-bottom: 56px;}
.sec_new .form-box .input-box .ckd-box.wacheck input {position: absolute; bottom: 0; width: 100%;}
.sec_new .form-box .input-box .ckd-box.wacheck label {width: 100%;}

.sec_new .form-box .input-box:not(.radio_box) input[type="radio"] {display: none;}
.sec_new .form-box .input-box:not(.radio_box) input[type="checkbox"] {display: none;}
.sec_new .form-box .input-box:not(.radio_box) label {position: relative; display: flex; align-items: center; justify-content: center; width: calc((100% - 20px) / 3); height: 78px; border-radius: 10px; -webkit-backdrop-filter: blur(20px); border: solid 1px var(--wt); font-size: 15px; font-weight: bold; line-height: 1; color: var(--wt); box-sizing: border-box;}
.sec_new .form-box .input-box:not(.radio_box) label img {position: absolute; bottom: -47px; width: auto; height: 64px;}
.sec_new .form-box .input-box:not(.radio_box) input[type="radio"]:checked + label {background: #00de6e; border-color: #00de6e;}
.sec_new .form-box .input-box:not(.radio_box) input[type="checkbox"]:checked + label {background: #00de6e; border-color: #00de6e;}

.sec_new .form-box .submit-btn {position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; width: calc(100% - 40px); height: 50px; margin: 0 auto; background: var(--pr2); border-radius: 15px; font-size: 18px; font-weight: bold; line-height: 1; color: var(--black_1); z-index: 2; box-shadow: 0px -10px 25px 20px #010190;}
.sec_new .form-box .submit-btn:disabled {opacity: 0.5;}
/* .sec_new .form-box .submit-btn:before {position: absolute; bottom: 45px; left: 0; content: ''; display: block; width: 100%; height: 1px; background: transparent; box-shadow: 0px -20px 20px 20px rgba(0, 0, 237, 1); z-index: -1;} */

.tip_area {display: none; position: fixed; top: 57%; right: 0; transform: translateY(-50%); max-width: 450px; width: 100%; height: auto; z-index: 9999;}
.tip_area img {opacity: 0; position: absolute; top: 58%; width: auto; height: 64px;}
.tip_area img.on {}
.tip_area img:nth-child(1) {left: 84px;}
.tip_area img:nth-child(2) {left: 30%; transform: translateX(-50%);}
.tip_area img:nth-child(3) {right: 90px;}

/* an */
.tip_area.open {opacity: 1; animation: opacity_00 0.5s 5s linear both;}
.tip_area.off {display: none !important;}
@keyframes opacity_00 {
        0% {opacity: 1;}
        100% {opacity: 0;}
}
.tip_area.open img:nth-child(1) {animation: opacity_01 2s linear both;}
@keyframes opacity_01 {
        0% {opacity: 0;}
        10% {opacity: 1;}
        80% {opacity: 1;}
        100% {opacity: 0;}
}
.tip_area.open img:nth-child(2) {animation: opacity_02 2s 2s linear both;}
@keyframes opacity_02 {
        0% {opacity: 0;}
        10% {opacity: 1;}
        80% {opacity: 1;}
        100% {opacity: 0;}
}
.tip_area.open img:nth-child(3) {animation: opacity_03 2s 4s linear both;}
@keyframes opacity_03 {
        0% {opacity: 0;}
        10% {opacity: 1;}
        80% {opacity: 1;}
        100% {opacity: 0;}
}

/* dim */
.dim2 {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); z-index: 7777;}

/*  */
.sec_new .form-box .input-box.radio_box .ckd-box {display: flex; align-items: center; gap: 10px;}
.sec_new .form-box .input-box.radio_box .ckd-box input[type="checkbox"] {display: none;}
.sec_new .form-box .input-box.radio_box .ckd-box label {display: flex; align-items: center; justify-content: center; width: 241px; height: 60px; border-radius: 30px; border: 1px solid #d4d4d4; background: var(--wt); box-sizing: border-box; text-align: center; font-size: 16px; font-weight: 500; line-height: 1.19; color: var(--gray_69);}
.sec_new .form-box .input-box.radio_box .ckd-box input[type="checkbox"]:checked + label {border-color: var(--pr); background: #e5efff; color: var(--pr);}
.sec_new .form-box .input-box.radio_box .ckd-box input[type="radio"]:checked + label {border-color: var(--pr); background: #e5efff; color: var(--pr);}

.sec_new .form-box .input-box.radio_box {margin-top: -10px; padding-bottom: 20px;}
.sec_new .form-box .input-box.radio_box input[type="radio"] {display: none;}
.sec_new .form-box .input-box.radio_box .radio_tit {display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 400; line-height: 1.28; color: var(--wt);}
.sec_new .form-box .input-box.radio_box .radio_tit button {font-size: 16px; font-weight: 400; line-height: 1.28; color: var(--wt);}
.sec_new .form-box .input-box.radio_box .radio_tit:before {content: ''; display: block; width: 20px; height: auto; aspect-ratio: 5/5; background: url(./../img/nckd_off2.png)no-repeat 50% 50%; background-size: cover;}
.sec_new .form-box .input-box.radio_box input[type="radio"]:checked + .radio_tit:before {content: ''; display: block; width: 20px; height: auto; aspect-ratio: 5/5; background: url(./../img/nckd_on2.png)no-repeat 50% 50%; background-size: cover;}


/* popup */
.dim {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index: 10;}
.agreement-popup {display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 500px; width: 100%; height: 80vh; padding-bottom: 100px; background: var(--wt); border-radius: 16px; box-sizing: border-box; overflow: hidden; z-index: 9999;}
.agreement-popup .popup-hd {position: relative; background: var(--pr); padding: 20px; box-sizing: border-box;}
.agreement-popup .popup-hd .tit {font-size: 18px; font-weight: bold; line-height: 1.3; color: var(--wt); text-align: center;}
.agreement-popup .popup-hd .close-btn {position: absolute; top: 50%; right: 20px; transform: translateY(-50%); width: 20px; height: auto;}
.agreement-popup .popup-content {width: 100%; height: 100%; overflow: auto; overflow-x: hidden; padding: 20px; box-sizing: border-box; font-size: 15px; font-weight: 400; line-height: 1.3; color: var(--black_1);}
.agreement-popup .popup-content b {display: block; margin-bottom: 10px; font-size: 16px; font-weight: bold; line-height: 1.2; color: var(--black);}
.agreement-popup .popup-content table {width: 100%; height: auto; margin-bottom: 20px; margin-top: 10px; border: 1px solid var(--gray_69);}
.agreement-popup .popup-content table tr {}
.agreement-popup .popup-content table th {width: 150px; height: 35px; font-size: 16px; font-weight: bold; color: var(--black); vertical-align: middle; border-bottom: 1px solid var(--gray_69); border-right: 1px solid var(--gray_69);}
.agreement-popup .popup-content table td {padding: 10px; font-size: 16px; font-weight: bold; color: var(--black); vertical-align: middle; border-bottom: 1px solid var(--gray_69); line-height: 1.2;}

/* toggle_tit */
.toggle_tit2 {text-decoration: underline; cursor: pointer;}
.toggle_ct2 {display: block; margin-top: 5px;font-weight: 400;}