@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
.lovetest_page{font-family: "Pretendard Variable";}
.lovetest_page *{font-family: "Pretendard Variable";}
/* form */
a{cursor: pointer;}
.tac{text-align: center;}
.form_box{position: relative;width: 560px;margin: 0 auto;display: flex;flex-flow: wrap row;gap:10px; color: #252525;}
.form_paging{text-align: center;font-size: 16px;color: #B3B3B3;letter-spacing: 1px;}
.form_paging span{font-weight: 700;}
/* txt */
.form_tit1{font-weight: 700;font-size: 38px;text-align: center;margin: 35px auto 40px;line-height: 1.4;}
.form_tit2{font-weight: 500;font-size: 22px;text-align: center;margin-bottom: 15px;}
.row_box{display: flex;align-items: center;flex-flow: nowrap row;width: 100%;}
/* input_box */
.input_box{position: relative;width: 100%;}
.input_box input{width: 100%;height: 75px;background-color: #f7f8fa;border: 1px solid #f7f8fa;padding: 0 20px;font-weight: 400;font-size: 20px;border-radius: 6px;border: none;}
.input_box input::placeholder{color: #252525;}
.tel_box{display: flex;align-items: center;flex-flow: nowrap;width: 100%;gap:8px;}
.tel_box .select_box{width: 165px;}
.tel_box select{width: 100%;font-weight: 400;font-size: 20px;height: 75px;border-radius: 6px;background-color: #f7f8fa;padding: 0 20px;padding-right: 50px;}
.tel_box input{width: calc(50% - 95px); height: 75px;background-color: #f7f8fa;border: 1px solid #f7f8fa;padding: 0 20px;font-weight: 400;font-size: 20px;border-radius: 6px;border: none;flex:1;}
/* radio_box */
.radio_harf{display: flex;align-items: center;position: relative;user-select: none;}
.radio_harf.w50p{gap:1px;}
.radio_harf input[type="radio"]{position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;}
.radio_harf label{display: inline-block;position: relative;width: 50%;height: 75px;line-height: 73px;text-align: center;background-color: #f7f8fa;border: 1px solid #f7f8fa;cursor: pointer;font-weight: 400;font-size: 20px;}
.radio_harf input:checked + label{background-color: #42414C;border: 1px solid #42414C; color: #fff;}
.radio_harf label:nth-child(2){border-radius: 6px 0 0 6px;}
.radio_harf label:nth-child(4){border-radius: 0 6px 6px 0;}
.radio_box{position: relative;width: 100%;user-select: none;}
.radio_box input[type="radio"]{position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;}
.radio_box label{display: inline-block;position: relative;width: 100%;height: 75px;line-height: 73px;text-align: center;border-radius: 6px;background-color: #f7f8fa;border: 1px solid #f7f8fa;cursor: pointer;font-weight: 400;font-size: 20px;}
.radio_box label::after{content: '';display: block;position: absolute;top: 50%;right: 20px;transform: translateY(-50%);width: 20px;height: 16px;z-index: 1;background: url('https://www.duo.co.kr/img/form/ic-check2.svg') no-repeat center / cover;}
.radio_box input:checked + label{border: 1px solid #252525;font-weight: 700;color: #252525;}
.radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-c.svg') no-repeat center / cover;}
/* check_box */
.check_box{position: relative;width: 100%;user-select: none;}
.check_box input[type="checkbox"]{position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;}
.check_box label{display: inline-block;position: relative;width: 100%;height: 75px;line-height: 73px;text-align: center;border-radius: 6px;background-color: #f7f8fa;border: 1px solid #f7f8fa;cursor: pointer;font-weight: 400;font-size: 20px;}
.check_box label::after{content: '';display: block;position: absolute;top: 50%;right: 20px;transform: translateY(-50%);width: 20px;height: 16px;z-index: 1;background: url('https://www.duo.co.kr/img/form/ic-check.svg') no-repeat center / cover;}
.check_box input:checked + label{font-weight: 700;color: #252525;}
.check_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-c.svg') no-repeat center / cover;}
.agree_wrap{width: 100%;user-select: none;}
.agree_check{position: relative;width: 100%;text-align: left;margin-top: 15px;}
.agree_check input[type="checkbox"]{position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;}
.agree_check label{display: block;position: relative;width: 100%;font-weight: 400;font-size: 14px;padding-left: 25px;line-height: 20px;}
.agree_check label b{font-weight: 400;}
.agree_check label small{font-weight: 300;color: #808080;font-size: 14px;padding-left: 5px;}
.agree_check label::before{content: '';display: block;width: 20px;height: 20px;border-radius: 4px;background: #f7f8fa url('https://www.duo.co.kr/img/form/ic-checkbox.svg?ver=1') no-repeat center / 65%;position: absolute;top: 50%;left: 0;transform: translateY(-50%);z-index: 1;cursor: pointer;}
.agree_check input:checked + label::before{background: #f7f8fa url('https://www.duo.co.kr/img/form/ic-checkbox-on.svg') no-repeat center / cover;}
.agree_check .agree_link{position: absolute;top: 4px;right: 0;text-decoration: underline;font-weight: 300;font-size: 13px;color: #808080;}
/* select_box */
.select_box{position: relative;width: 100%;user-select: none;}
.select_box::after{content: '';display: block;position: absolute;top: 50%;right: 20px;transform: translateY(-50%);width: 20px;height: 11px;z-index: 1;background: url('https://www.duo.co.kr/img/form/ic-select.svg') no-repeat center / cover;}
.select_box select{width: 100%;font-weight: 400;font-size: 20px;height: 75px;border-radius: 6px;background-color: #f7f8fa;padding: 0 20px;padding-right: 50px;}
.select_box .ic-select{position: absolute;top: 50%;right: 20px;transform: translateY(-50%);}
/* textarea_box */
.textarea_box{position: relative;width: 100%;}
.textarea_box textarea{width: 100%;height: 150px;background-color: #f7f8fa;padding: 0 20px;font-weight: 400;font-size: 20px;border-radius: 6px;border: none;resize: none;padding: 30px 20px;font-weight: 400;font-size: 20px;color:#252525;}
.textarea_box textarea::placeholder{font-weight: 400;font-size: 20px;color:#252525;}

/* btn_box */
.lovetest_page .btn_box{width: 100%;margin-top: 30px;}
.lovetest_page .btn_box .btn_next{display: inline-block;position: relative;width: 100%;text-align: center;height: 80px;line-height: 80px;background-color: #252525;color: #fff;font-weight: 600;font-size: 24px;border-radius: 6px;cursor: pointer;}
.lovetest_page .btn_box .btn_next::after{content: '';display: block;position: absolute;top: 50%;right: 20px;transform: translateY(-50%);width: 22px;height: 15px;background: url('https://www.duo.co.kr/img/form/ic-arrow-w.svg') no-repeat center / cover;}
.lovetest_page .step00 .btn_box .btn_next{height: 85px;line-height: 85px;font-size: 28px;}
/* prev_btn */
.form_prev{width: 100%; margin-top: 40px;font-weight: 300;font-size: 18px;color: #252525;}
.form_prev img{width: 16px;margin-right: 8px;vertical-align: middle;margin-bottom: 4px;}
.w50p{width: calc(50% - 5px);}
/* text */
.love_tit1{font-weight: 700;font-size: 80px;margin: 20px auto 15px;line-height: 1.15;}
.love_tit2{font-weight: 500;font-size: 28px;}
.love_tit3{font-weight: 300;font-size: 16px;}
.love_btn1{width: 410px;height: 85px; line-height: 85px;text-align: center;border-radius: 6px;font-weight: 600;font-size: 28px;color: #fff;}
/* step_type */
.step_type{display: flex;margin: 0 auto 25px;justify-content: center;align-items: center;user-select: none;}
.step_type span{display: inline-block;width: 135px;border: 1px solid #EABB00;text-align: center;height: 35px;line-height: 33px;font-weight: 300;font-size: 16px;color: #907200;}
.step_type span.on{background-color: #EABB00;font-weight: 500;color: #252525;}
.step_type span + span{border-left: none;}
.step_type span:first-child{border-radius: 5px 0 0 5px;}
.step_type span:last-child{border-radius: 0 5px 5px 0;}
/* TYPE */
/* type_a (#006cd1) */
.type_a .form_tit2{color: #026ED1;}
.type_a .form_paging span{color: #026ED1;}
.type_a .love_btn1{background-color: #006cd1;}
.type_a .radio_box input:checked + label{border: 1px solid #006cd1;font-weight: 700;color: #006cd1;background-color: #fff;}
.type_a .radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-a.svg') no-repeat center / cover;}
.type_a .btn_box .btn_next{background-color: #006cd1;}
.type_a .check_box input:checked + label{font-weight: 700;color: #006cd1;}
.type_a .check_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-a.svg') no-repeat center / cover;}
/* type_b (#580de2)*/
.type_b .love_tit1{color: #580de2;}
.type_b .form_tit2{color: #580de2;}
.type_b .form_paging span{color: #580de2;}
.type_b .love_btn1{background-color: #580de2;}
.type_b .radio_box input:checked + label{border: 1px solid #580DE2;font-weight: 700;color: #580de2;background-color: #fff;}
.type_b .radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-b.svg') no-repeat center / cover;}
.type_b .btn_box .btn_next{background-color: #580de2;}
.type_b .check_box input:checked + label{border: 1px solid #580DE2;font-weight: 700;color: #580de2;background-color: #fff;}
.type_b .check_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-b.svg') no-repeat center / cover;}
/* type_c (#1cf1e4)*/
.type_c .love_tit1{color: #1cf1e4;}
.type_c .love_tit2{color: #fff;}
.type_c .love_tit3{color: #fff;}
.type_c .form_tit1{color: #fff;}
.type_c .form_tit2{color: #1CF1E4;}
.type_c .form_paging{color: #C5BFEF;}
.type_c .form_paging span{color: #1cf1e4;}
.type_c .form_prev{color: #fff;}
.type_c .tel_box{color: #fff;}
.type_c .step_type span{border: 1px solid #8476E3;border-left: none;border-right: none; color: #B0ACD3;}
.type_c .step_type span:first-child{border-left: 1px solid #8476E3;}
.type_c .step_type span:last-child{border-right: 1px solid #8476E3;}
.type_c .step_type span + span{border-left: 1px solid #8476E3;}
.type_c .step_type span.on + span{border-left: none;}
.type_c .step_type span.on{border: 1px solid #564AAA; background-color: #564AAA;color: #fff;}
.type_c .agree_check label small{color: #fff;}

.type_c .love_btn1{background-color: #1cf1e4;color: #252525;}
.type_c .radio_box input:checked + label{border: 1px solid #1cf1e4;background-color: #1cf1e4;font-weight: 700;color: #252525;}
.type_c .radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-c.svg') no-repeat center / cover;}
.type_c .btn_box .btn_next{background-color: #1cf1e4;color: #252525;}
.type_c .btn_box .btn_next::after{background: url('https://www.duo.co.kr/img/form/ic-arrow-b.svg') no-repeat center / cover;}
.type_c .agree_check label{color: #fff;}
.type_c .agree_check label small{font-weight: 100;}
.type_c .agree_check .agree_link{color: #fff;}
/* type_d (#ed0002)*/
.type_d .love_btn1{background-color: #ed0002;}
.type_d .form_paging span{color: #FF4500;}
.type_d .radio_box input:checked + label{border: 1px solid #ff733f;color: #ff4500;font-weight: 700;background-color: #fff;}
.type_d .radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-d.svg') no-repeat center / cover;}
.type_d .check_box input:checked + label{font-weight: 700;color: #EE4000;border: 1px solid #EE0003;background-color: #fff;}
.type_d .check_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-d.svg') no-repeat center / cover;}
.type_d .btn_box .btn_next{background-color: #ed0002;}
.type_d .btn_box .btn_next::after{background: url('https://www.duo.co.kr/img/form/ic-arrow-w.svg') no-repeat center / cover;}
/* type_e (#002B56)*/
.type_e .love_tit1{color: #002B56;}
.type_e .love_tit2{color: #002B56;}
.type_e .love_tit3{color: #002B56;}
.type_e .form_tit2{color: #002B56;}
.type_e .love_btn1{background-color: #002B56;}
.type_e .radio_box input:checked + label{border: 1px solid #002B56;color: #002B56;font-weight: 700;}
.type_e .radio_box input:checked + label::after{background: url('https://www.duo.co.kr/img/form/ic-check-d.svg') no-repeat center / cover;}
.type_e .btn_box .btn_next{background-color: #002B56;}
.type_e .btn_box .btn_next::after{background: url('https://www.duo.co.kr/img/form/ic-arrow-w.svg') no-repeat center / cover;}

/* counseling_box */
.lovetest_page .counseling_wrap{background-color: #006CD1;padding: 90px 0 130px;}
.counseling_tit{font-weight: 700;font-size: 42px;color: #fff;margin-bottom: 30px;text-align: center;}
.counseling_txt{font-weight: 400;font-size: 18px;color: #fff;text-align: center;line-height: 1.8;}
.counseling_wrap .form_box{margin-top: 50px;gap: 14px;}
.counseling_wrap .w50p{width: calc(50% - 7px);}
.counseling_wrap .btn_box{margin-top: 6px;}
.counseling_wrap .btn_box .btn_next{background-color: #252525;}

.lovetest_page .counseling_wrap.type_white{background-color: #fff;}
.type_white .counseling_tit{color: #252525;}
.type_white .counseling_txt{color: #252525;}
.counseling_wrap.type_white .btn_box .btn_next{background-color: #006CD1;}

/* complete_wrap */
.lovetest_page .complete_wrap{padding-bottom: 100px;background-color: #fff;}
.complete_wrap{width: 560px;margin: 0 auto;color: #252525;text-align: center;}
.complete_txt1{font-weight: 700;font-size: 38px;margin: 30px auto;}
.complete_txt2{font-weight: 400;font-size: 18px;margin-bottom: 50px;}
.result_page .complete_wrap .btn_box .btn_next{background-color: #006CD1;}
/* À¯Æ©ºê ÆË¾÷ */
.lovetest_page .youtube_wrap{text-align: center;background-color: #F7F8FA;color: #252525;padding: 100px 0 140px;}
.youtube_thum{position: relative;width: 560px;margin: 30px auto;border-radius: 10px;overflow: hidden;}
.youtube_thum .thum_img{width: 100%;}
.youtube_thum .youtube_play{display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;}
.youtube_play::after{content: '';display: block;width: 91px;height: 64px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); background: url('https://www.duo.co.kr/img/form/ic-youtube02.svg');z-index: 1;cursor: pointer;}
.youtube_wrap .youtube_tit1{font-weight: 700;font-size: 38px;}
.youtube_wrap .youtube_tit2{font-weight: 700;font-size: 30px;margin-bottom: 10px;}
.youtube_wrap .date_box{display: flex;flex-flow: wrap row;justify-content: center;align-items: center;}
.youtube_wrap .youtube_view{font-weight: 400;font-size: 16px;}
.youtube_wrap .youtube_date{position: relative;font-weight: 400;font-size: 16px;padding-left: 10px;margin-left: 10px;}
.youtube_wrap .youtube_date::before{content: '¤ý';position: absolute;top: 50%;left: -6px;transform: translateY(-50%);}
.youtube_wrap .contact_box{width: 560px;margin: 50px auto 0;padding-top: 50px;border-top: 1px solid #CECECE;}
.youtube_wrap .contact_txt1{font-weight: 500;font-size: 20px;margin-bottom: 10px;}
.youtube_wrap .contact_txt2{font-weight: 700;font-size: 32px;}
.video-play__btn,.yt-recommended .youtube__wrap--header--btn {width: 72px;height: 50px;position: absolute;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);cursor: pointer;top: 50%;left: 50%;background-image: url(/img/assets/ic_youtube_btn.png);background-position: center top;background-repeat: no-repeat;background-size: 100%}
.video {position: fixed;width: 50%;top: 50%;-webkit-transform: translateX(-50%) translateY(-50%);transform: translateX(-50%) translateY(-50%);left: 50%;z-index: 110;}
.video__header {padding-bottom: 2rem;text-align: right;}
.video__inner {width: 100%;}
.video.video_pop_area {z-index: 1002;}
.video__dim--box {position: fixed;width: 100%;height: 100%;background: rgba(0,0,0,0.8);z-index: 1001;left: 0;top: 0}
.ic_btn--video {display: inline-block;position: relative;width: 40px;height: 30px;cursor: pointer}
.ic_btn--video::before,.ic_btn--video::after {content: "";position: absolute;top: 50%;left: 0;width: 100%;height: 2px;background-color: #fff}
.ic_btn--video::before {-webkit-transform: translateY(-50%) rotate(45deg);transform: translateY(-50%) rotate(45deg)}
.ic_btn--video::after {-webkit-transform: translateY(-50%) rotate(135deg);transform: translateY(-50%) rotate(135deg)}


@media (max-width:1560px) {
    .love_tit1{font-size: 58px;}
    .love_tit2{font-size: 22px;}
    .lovetest_page .step00 .btn_box .btn_next{height: 70px;line-height: 70px;font-size: 22px;}
    .form_tit1{font-size: 32px;margin: 30px auto 35px;}
    .form_tit2{font-size: 18px;}
    .form_paging{font-size: 14px;}
    .form_box{width: 475px;}
    .input_box input{height: 65px;font-size: 17px;}
    .tel_box input{height: 65px;font-size: 17px;}
    .select_box select{height: 65px;font-size: 17px;}
    .select_box::after{width: 17px;height: 9.35px;}
    .check_box label{height: 65px;line-height: 63px;font-size: 17px;}
    .radio_box label{height: 65px;line-height: 63px;font-size: 17px;}
    .radio_harf label{height: 65px;line-height: 63px;font-size: 17px;}
    .radio_box label::after{width: 17px;height: 13.6px;}
    .form_prev{font-size: 15px;margin-top: 30px;}
    .form_prev img{width: 14px;}
    .lovetest_page .btn_box{margin-top: 25px;}
    .lovetest_page .btn_box .btn_next{height: 70px;line-height: 68px;font-size: 20px;}
    .lovetest_page .btn_box .btn_next::after{width: 18.7px;height: 12.75px;}
    .agree_check label{font-size: 12px;line-height: 17px;}
    .agree_check label::before{width: 17px;height: 17px;}    
    .agree_check label small{font-size: 12px;}
    .agree_check .agree_link{font-size: 12px;}
    
    .counseling_tit{font-size: 35px;margin-bottom: 25px;}
    .counseling_txt{font-size: 16px;line-height: 1.7;}
    .lovetest_page .counseling_wrap{padding: 75px 0 110px;}
    .lovetest_page .counseling_wrap .btn_box{margin-top: 0;}
    .complete_wrap{width: 475px;}
    .lovetest_page .complete_wrap > img{max-width: 50px;}
    .complete_txt1{font-size: 32px;margin: 25px auto;}
    .complete_txt2{font-size: 16px;margin-bottom: 40px;}
    .youtube_wrap .youtube_tit1{font-size: 32px;}
    .youtube_wrap .youtube_tit1 img{width: 115px;}
    .youtube_thum{width: 475px;}
    .youtube_play::after{width: 77.35px;height: 54.4px;background-size: cover;}
    .youtube_wrap .youtube_tit2{font-size: 25px;margin-bottom: 8px;}
    .youtube_wrap .youtube_view{font-size: 14px;}
    .youtube_wrap .youtube_date{font-size: 14px;}
    .youtube_wrap .contact_box{width: 475px;margin: 40px auto 0;padding-top: 40px;}
    .youtube_wrap .contact_txt1{font-size: 17px;margin-bottom: 8px;}
    .youtube_wrap .contact_txt2{font-size: 27px;}
}