@charset "utf-8"; 
body:has(#user_index){background: #FFF3EC;}
body:has(#user_index) #ft{display: none;}
body:has(#user_index) #wrapper{min-height: 100vh;}
body:has(#subbox){background: #FFF3EC;}
#hd{display: none;}
#container_wr{margin: 0;}
#wrapper{margin: 0 auto 0;max-width: 780px; width: 100%; color: #333;}
#ft{display: block; background: unset; margin-top: 3.5rem; font-size: .75rem; line-height: 1.5; min-width: unset; width: 100%; text-align: left;padding: 0 16px 0; margin-bottom: 2.5rem; max-width: 780px; letter-spacing: -.5px;}
#ft b{font-family: 'GB'; line-height: 1; font-size: 14px; width: unset;}
#ft #ft_wr{margin-top: 12px; opacity: .5;padding: 0; display: block; width: auto;}
#ft a{text-decoration: underline; opacity: .7; display: block; margin-top: 8px;}
#ft #ft_copy{margin-top: 12px;margin-bottom: 40px; border: 0; text-align: left;width: unset; padding: 0;}

/*인덱스*/
#user_index{border:3px solid white; width: calc(100% - 2rem); height: calc(100vh - 1rem - 3.25rem); margin: 1rem auto 0; position: relative;}
#wrapper:has(#user_index) .main_logo{max-width: calc(100% - 2rem); display: flex; justify-content: center; margin-top: 0.75rem;margin-left: 1rem;}
#wrapper:has(#user_index) .main_logo img{height: 20px; width: auto; margin: 0 4px 0;}
#user_index .logo1{position: absolute; top: 1rem; right: 1rem;}
#user_index .logo2{margin: 45% auto 3.25rem; width: 100%; text-align: center;}
#user_index p{font-family: 'GB'; font-size: 40px; text-align: center; color: #333; line-height: 1; margin-bottom: 16px;}
#user_index a{display: flex; width: 240px; line-height: 50px; border-radius: 25px; text-align: center; color: white; font-family: 'GB'; height: 50px; background: #0DBBB9; font-size: 16px; align-items: center; justify-content: center; gap: 8px; margin: 0 auto 0;}

/*서브공통*/
h1{margin: 24px 16px 16px; display: block;}
h1 img{height: 45px !important; width: auto !important;}
#subbox{margin: 0 16px 0;}
#subbox .full_btn{display: block; height: 50px; line-height: 50px; font-size: 16px; font-family: 'GM'; background: #0DBBB9; border-radius: 25px; color: white; text-align: center; margin-top: 16px; cursor: pointer;}
#subbox .half_btn{display: inline-block; height: 50px; line-height: 50px; font-size: 16px; font-family: 'GM'; background: #888; border-radius: 25px; color: white; text-align: center; margin-top: 16px; cursor: pointer; width: calc((100% - 10px) / 2);}
#subbox .half_btn.cta{background: #0DBBB9; float: right;}

/*동의*/
#subbox .agree_box_wrap{padding: 12px; background: white;}
#subbox .agree_box{background: white; padding:12px; line-height: 1.7; font-size: 14px;overflow-y: auto; scrollbar-width: thin;scrollbar-color: #ddd; height: 520px;}
#subbox.agree2 .agree_box{height: 320px;}
#subbox.agree3 .agree_box,#subbox.agree4 .agree_box{height: 440px;}
#subbox .agree_box .co_title{font-size: 20px; font-family: 'GB'; line-height: 1.3; margin-bottom: 24px;}
#subbox .agree_box::-webkit-scrollbar{width: 4px;}
#subbox .agree_box::-webkit-scrollbar-thumb{background: #ddd;border-radius: 2px;}
#subbox.agree2 .form_wrap .form_group input[type="text"]{width: 100%; height: 50px; padding-left: 44px; border: 1px solid #ddd; box-shadow: none;font-size: 16px; color: #333;}
#subbox.agree2 .form_wrap .form_group input[type="text"]::placeholder{opacity: .5; letter-spacing: -1px;}
#subbox.agree2 .form_wrap .form_group input[type="text"]#userName{background: url(./img/icon_agree_name.png) no-repeat left 16px center white;}
#subbox.agree2 .form_wrap .form_group input[type="text"]#userPhone{background: url(./img/icon_agree_tel.png) no-repeat left 16px center white; margin-top: 4px;}
#subbox.agree2 .form_wrap .agree_check{font-size: 16px; margin-top: 16px; margin-bottom: 40px;}
.modal.agree2{position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 1000;}
.modal.agree2 .modal_overlay{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5);}
.modal.agree2 .modal_content{position: relative; background: #fff; padding-top: 32px; padding-bottom: 24px; border-radius: 8px; z-index: 1001; text-align: center; min-width: 320px; display: flex; flex-direction: column;align-items: center;}
.modal.agree2 .modal_content img{margin-bottom: 16px;}
.modal.agree2 .modal_content p{line-height: 1.5; font-size: 1rem;}
.modal.agree2 .modal_buttons button{margin: 16px 4px 0; border: none; cursor: pointer; width: 118px; line-height: 40px; text-align: center; font-size: 16px;}
.modal.agree2 .modal_buttons button#modalCheckButton{background: #ddd; color: #333;}
.modal.agree2 .modal_buttons button#modalNextButton{background: #0DBBB9; color: white;}
#subbox.agree3 .form_wrap .agree_check{font-size: 16px; margin-top: 16px;}
#subbox.agree4 .form_wrap .agree_check{font-size: 16px; margin-top: 16px;}
#subbox.privacy .agree_box table{border-top: 1px solid #ddd; margin-top: 8px; margin-bottom: 8px; border-spacing: 0; border-collapse: collapse;}
#subbox.privacy .agree_box table tr th,#subbox.privacy .agree_box table tr td{border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 4px; line-height: 1.3; letter-spacing: -0.5px;}
#subbox.privacy .agree_box table tr th{background: #f7f7f7; color: #222; font-weight: normal; word-break: keep-all; text-align: left;}
#subbox.privacy .agree_box table tr td{color: #555;}
#subbox.privacy .agree_box table tr th:last-child, #subbox.privacy .agree_box table tr td:last-child{border-right: 0;}

/*완료페이지*/
#subbox.info.wan{margin-top: 56px;}
#subbox.info.wan h2{display: block; text-align: center; font-family: 'GB'; line-height: 1; margin-bottom: 12px; font-size: 20px;}
#subbox.info.wan p{display: block; font-size: 16px; text-align: center; margin-bottom: 56px;}
#subbox.info.wan .btn_wrap div:has(.btn1){display: flex; justify-content: space-between; margin-bottom: 8px;}
#subbox.info.wan .btn_wrap .btn1,#subbox.info.wan .btn_wrap .btn2{width: calc((100% - 10px) / 2); text-align: center; padding: 64px 0 24px; font-size: 18px; font-family: 'GB'; line-height: 1.3; border: 1px solid #0DBBB9; border-radius: 8px; cursor: pointer;}
#subbox.info.wan .btn_wrap .btn1{background: url(./img/icon_link1x2.png) no-repeat top 24px center white; background-size: 24px !important;}
#subbox.info.wan .btn_wrap .btn2{background: url(./img/icon_link2x2.png) no-repeat top 24px center white; background-size: 24px !important;}
#subbox.info.wan .btn_wrap .btn3,#subbox.info.wan .btn_wrap .btn4{border-radius: 8px; height: 70px; color: #FFFFA2; font-family: 'GB'; background: #0DBBB9; font-size: 18px;display: flex; align-items: center; gap: 8%;justify-content: center; cursor: pointer; text-decoration: none !important;}
#subbox.info.wan .btn_wrap .btn3{margin-bottom: 8px;}
#subbox.info.wan .btn_wrap img{margin-right: 6px;}
#subbox.info.wan .btn_wrap span{float: right; width: 125px;}
#subbox.info.wan .btn_wrap span img{width: 20px !important;}
#subbox.info.wan .btn_wrap .btn3::before{content: '정신건강 상담전화'; color: white; display: inline-block;}
#subbox.info.wan .btn_wrap .btn4::before{content: '자살예방 상담전화'; color: white; display: inline-block;}

#subbox.info.wan2{min-height: 240px; padding-top: 40px;}
#subbox.info.wan2 img.wan_img{width: 52px; margin: 0 auto 32px; display: block;}

/*설문결과조회*/
#subbox.survery_auth{margin-top: 56px;}
#subbox.survery_auth h3{text-align: center; font-family: 'GB'; font-size: 20px; line-height: 1; margin-bottom: 16px;}
#subbox.survery_auth p{text-align: center; line-height: 1.3; font-size: 16px; color: #333;}
#subbox.survery_auth form{margin-top: 24px;}
#subbox.survery_auth form label{display: none;}
#subbox.survery_auth form input{width: 100%; border-radius: 0; border: 1px solid #ddd; height: 50px; padding: 0; padding-left: 12px;}
#subbox.survery_auth form input:nth-child(2){margin-bottom: 8px;}
#subbox.survery_auth form button[type='submit']{width: 100%; line-height: 52px; height: 50px; background: #0DBBB9; color: white; border: 0; border-radius: 25px; margin-top: 40px;}
#subbox.survery_auth form .error{display: flex; gap: 4px; margin-top: 8px;align-items: flex-start;}
#subbox.survery_auth form .error::before{content: "!"; font-family: "GB"; font-size: 12px; color: red; display: inline-block; height: 18px; width: 18px; border-radius: 50%; border: 2px solid red; padding: 0; margin: 0; text-align: center;}
#subbox.survery_auth form .error strong{color: red; font-weight: normal; line-height: 20px; width: calc(100% - 24px); word-break: keep-all;}

/*설문결과보기*/
#subbox.survey_result{margin-top: 8px;}
#subbox.survey_result h3{display: none;}
#subbox.survey_result .mybox{background: white; border: 2px solid #0DBBB9; padding: 32px 24px 32px; text-align: center; font-family: 'GB'; font-size: 20px; line-height: 1.3; word-break: keep-all; margin-bottom: 32px;}
#subbox.survey_result .mybox span{color: #0DBBB9;}
#subbox.survey_result .ranges{margin-top: 56px;}
#subbox.survey_result .ranges:nth-child(2){margin-top: 0;}
#subbox.survey_result .ranges div{padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid #ddd;}
#subbox.survey_result .ranges div p{font-size: 16px; text-align: justify;}
#subbox.survey_result .ranges div p:first-child{font-family: "GB"; color: #0DBBB9; line-height: 1; display: block; margin-bottom: 12px;}
#subbox.survey_result .info_text{color: #888; font-family: 'GM'; line-height: 1.3;}
#subbox.survey_result a:last-child{line-height: 52px; height: 50px; width: 100%; display: block; text-align: center; background: #0DBBB9; color: white; border-radius: 25px; font-size: 16px; margin-top: 40px;}

/*설문완료*/
.user_completed{margin-top: 112px; padding: 0 16px 0; text-align: center;}
.user_completed img{margin-bottom: 24px;}
.user_completed p{display: block;}
.user_completed p:nth-child(2){font-family: 'GB'; font-size: 20px; line-height: 1; margin-bottom: 16px;}
.user_completed p:nth-child(3){font-size: 16px; line-height: 1.5; color: #333;}
.user_completed a{margin-top: 128px; border-radius: 25px; width: 100%; display: block; background: #0DBBB9; line-height: 52px; color: white; font-size: 16px;}