@charset "UTF-8";

/* normalize */
*{box-sizing:border-box; font-family: 'Noto Sans KR', sans-serif;}
body{margin:0px; background-color:rgb(41, 41, 41);}
ul{margin:0; padding:0;}
img{vertical-align:middle;}
li{list-style:none;}
li img{cursor:pointer;}
input[type="button"]{display:none;}
::selection{background-color:#0b927d; color:#fff;}

/* common */
.mobile{display:none;}
.page1 .contents{
    position:absolute;
    left:0px;
    text-align:center;
    width:100%;
}
.page1 .con1{
    top:2%;
}
.page1 .con2{
    bottom:2%;
}
.page1 .contents img{
    width:100%;
    max-width:736px;
    margin-bottom:3%;
}
.page1 .contents a:last-child img{
    margin-bottom:0;
}
.none{
    display:none;
}
.section{
    position:relative;
    max-width:1080px;
    margin:0px auto;
}
.section>img{
    width:100%;
}
.diagram_btn{
    cursor:pointer;
    width:40%;
}
.survey_btn_wrap{
    margin-top:10%;
}

/* 설문조사 */
.survey{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    padding:0px 7%;
}
.surveylist{
    margin-top:8%;
}
.surveylist .title{
    font-size:1.5em;
    line-height:2.5em;
    padding-left:70px;
}
.surveylist .title span{
    background-color:#e8f7f1;
}
.form_wrap {
    background:url("../images/num1.png") left 0px no-repeat;
}
.direct_wrap{
    background:url("../images/num2.png") left 0px no-repeat;
}
.need_wrap{
    background:url("../images/num3.png") left 0px no-repeat;
}
.reason_wrap{
    background:url("../images/num4.png") left 0px no-repeat;
}
.necessary_wrap{
    background:url("../images/num5.png") left 0px no-repeat;
}
.counsellor_wrap{
    background:url("../images/num6.png") left 0px no-repeat;    
}
.form_wrap, .direct_wrap, .need_wrap, .reason_wrap, .necessary_wrap, .counsellor_wrap{
    background-size:4em;
}
.surveylist>div{
    padding-left:7%;
}
.radio_wrap .etc{
    display:inline-block; 
    height:3em;
}
/* 사용자정보 */
.info_wrap{
    padding:0px 5%;
    margin-top:5%
}
.info_wrap .title{
    text-align:center;
    position:relative;
    margin:5% 0px;
}
.info_wrap .title span{
    position:relative;
    font-size:1.5em;
    font-weight:bold;
    z-index:10;
}
.info_wrap .title:after{
    position:absolute;
    bottom:0px;
    left:50%;
    transform:translate(-50%);
    content:"";
    width:6em;
    height:1em;
    background-color:#e8f7f1;
    z-index:1;
}
.info_wrap .textbox{
    color:#000;
    font-weight:bold;
    font-size:0px;
    border-bottom:1px solid #ccc;
}
.info_wrap .textbox label{
    display:inline-block;
    width:30%;
    line-height:100px;
    font-size:1.5rem;
}
.info_wrap .textbox input{
    width:70%;
    height:50px;
    font-size:2rem;
}
/* form 디자인 */
.radio_wrap input{
    display:none;
}
.radio_wrap .checked{
    text-indent:-9999px;
    display:inline-block;
    width:30px;
    height:30px;
    border:2px solid #b6b6b6;
    border-radius:50%;
}
.radio_wrap input:checked + .checked{
    background:url("../images/radio_check.png") center no-repeat;
    background-size:70%;
}
.radio_wrap .radio_contents{
    display:inline-block;
    margin:0px 3% 0px 0px;
    line-height:30px;
    font-size:1.3em;
}
.radio_wrap .radio_contents .text{
    line-height:3em;
}
.surveylist textarea{
    border:1px solid #b6b6b6;
    width:93%;
    height:100px;
    resize:none;
}
.agree_contents{
    font-size:1.5em;
    line-height:40px;
    color:#000;
}
.agree_contents input{
    display:none;
}
.agree_contents .checked{
    display:inline-block;
    width:40px;
    height:40px;
    border:2px solid #d9d9d9;
    border-radius:50%;
    text-indent: -9999em;
}
.agree_contents .slide{
    font-size:0.7em;
    line-height:1em;
    color:#ccc;
    cursor:pointer;
    border-bottom:1px solid #aaa;
}
.agree_contents .text{
    margin-right:30%;
}
.agree_contents input:checked + .checked{
    background:url("../images/radio_check.png") center no-repeat;
    background-size:70%;
}
.submit{
    margin-top:5%;
    text-align:center;
}
.submit img{
    width:100%;
}

.footer{
    position:relative;
    max-width:1080px;
    margin:0px auto;
    background-color:#4f5052;
}
.footer .ft_con{
    position:absolute;
    top:48%;
    left:50%;
    width:80%;
    transform:translate(-50%);
    font-size:0px;
    text-align:center;
}
.footer .ft_con a{
    color:#fff;
    text-decoration:none;
    padding:0px 3%;
    border-right:1px solid #fff;
    font-size:1vw;
}
.footer .ft_con a:last-child{
    border:0;
    padding:0px 0px 0px 3%;
}
.footer .ft_con a:first-child{
    padding:0px 3% 0px 0px;
}
.footer img{
    width:100%;
}



/* 고정, 팝업 */
.fixed{
    position:fixed;
    bottom:0px;
    left:0px;
    width:100%;
    background-color:#d32f2c;
    text-align:center;
    padding:10px 0px;
}
.fixed img{
    margin:0px 1%;
}

.agree_text_wrap{
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.5);
    z-index:100;
}
.agree_text_wrap .agree_text{
    position:absolute;
    top:50%;
    left:50%;
    width:50%;
    transform:translate(-50%) translateY(-50%);
    background-color:#fff;
    padding:5%;
}
.agree_text_wrap .agree_text span br{
    display:none;
}
.agree_text_wrap .agree_text_close{
    position:absolute;
    top:-50px;
    right:0px;
    cursor:pointer;
}


/* mobile */
@media all and (max-width:1024px){
    .pc{display:none;}
    .mobile{display:block;}
    .form_wrap, .direct_wrap, .need_wrap, .reason_wrap, .necessary_wrap, .counsellor_wrap{
        background-size:7vw;
    }
    .surveylist .title{
        font-size:3vw;
        padding-left:10%;
    }
    .radio_wrap .radio_contents{
        font-size:3vw;
        margin-bottom:2%;
    }
    .radio_wrap .radio_contents .text{
        line-height:3.5vw;
    }
    .info_wrap .title:after{
        width:16vw;
        height:3vw;
    }
    .info_wrap .textbox input{
        height:8vw;
    }
    .info_wrap .textbox label{
        font-size:3vw;
        line-height:11vw;
    }
    .radio_wrap .checked{
        width:5vw;
        height:5vw;
        vertical-align:middle;
    }
    .info_wrap .textbox input{
        font-size:3vw;
    }
    .info_wrap{
        padding:3% 3% 5%;
    }
    .info_wrap .title span{
        font-size:4vw;
    }
    .agree_contents{
        font-size:3vw;
        line-height:40px;
    }
    .submit{
        margin-top:12%;
    }
    .footer .ft_con a{
        font-size:2vw;
    }
}
@media all and (max-width:768px){
    .page1 .contents img{
        width:80%;
    }
    .surveylist{
        margin-top:8%;
    }
    .agree_text_wrap .agree_text{
        width:90%;
    }
    .use_wrap textarea{
        width:30%;
    }
    .submit{
        margin-top:4%;
    }
}
@media all and (max-width:480px){
    .survey{
        top:1%;
    }
    .surveylist{
        margin-top:4%;
    }
    .surveylist textarea{
        height:15vw;
    }
    .radio_wrap .etc{
        height:7vw;
        width:50%;
    }
    .info_wrap{
        margin:0;
    }
    .agree_contents {
        font-size:3vw;
        line-height:5vw;
    }
    .agree_contents .checked{
        width:6vw;
        height:6vw;
    }
    .footer .ft_con{
        top:45%;
        width:90%;
    }
    .footer .ft_con a{
        padding:0px 1%;
    }
    .footer .ft_con a:last-child{
        padding:0px 0px 0px 1%;
    }
    .footer .ft_con a:first-child{
        padding:0px 1% 0px 0px;
    }
    .agree_text_wrap .agree_text span br{
        display:block;
    }
    @media all and (max-width:320px){
        .surveylist .title{
            margin:0;
        }
    }
}