@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;}

/* common */
.none{
    display:none;
}
.section{
    position:relative;
    max-width:1080px;
    margin:0px auto;
}
.section>img{
    width:100%;
}

.contents1{
    position:absolute;
    top:29%;
    left:0px;
    width:100%;
    text-align:center;
}
.diagram_btn{
    cursor:pointer;
    width:40%;
}
.contents2{
    position:absolute;
    bottom:18%;
    left:0px;
    width:100%;
    text-align:center;
    padding:0px 10%;
}
.contents2 img{
    width:40%
}
.contents2 .oracle{
    margin-left:10%;
}
.survey_btn_wrap{
    margin-top:10%;
}

/* 설문조사 */
.survey{
    position:absolute;
    top:2%;
    left:0px;
    width:100%;
    padding:0px 5%;
}
.surveylist{
    margin-top:12%;
}
.surveylist .title{
    font-size:2em;
    font-weight:bold;
    line-height:1.5em;
    padding-left:70px;
    background-size:56px;
}
.scale_wrap p {
    background:url("../images/num1.png") left center no-repeat;
}
.use_wrap p {
    background:url("../images/num2.png") left center no-repeat;
}
.plan_wrap p {
    background:url("../images/num3.png") left center no-repeat;
}
.budget_wrap p {
    background:url("../images/num4.png") left center no-repeat;
}
.schedule_wrap p {
    background:url("../images/num5.png") left center no-repeat;
}
.need_wrap p {
    background:url("../images/num6.png") left center no-repeat;
}
.join_wrap p {
    background:url("../images/num7.png") left center no-repeat;
}
.question_wrap p {
    background:url("../images/num8.png") left center no-repeat;
}
.consult_wrap p {
    background:url("../images/num9.png") left center no-repeat;
}
.question_wrap>div{
    padding-left:7%;
}

/* 사용자정보 */
.info_wrap{
    background-color:#ff4848;
    padding:5% 5% 10%;
    margin-top:5%
}
.info_wrap .textbox{
    color:#fff;
    font-weight:bold;
    font-size:0px;
}
.info_wrap .textbox label{
    display:inline-block;
    width:20%;
    line-height:120px;
    font-size:2rem;
}
.info_wrap .textbox input{
    width:80%;
    height:100px;
    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:100%;
}
.radio_wrap .radio_contents{
    display:inline-block;
    margin:0px 30px 20px 0px;
    line-height:30px;
    font-size:1.5em;
}
.use_wrap textarea{
    border:0;
    resize:none;
    height:35px;
    line-height:30px;
    vertical-align:middle;
}
.question_wrap textarea{
    border:1px solid #b6b6b6;
    background-color:#f4f4f4;
    width:100%;
    height:300px;
}
.agree_contents{
    font-size:1.5em;
    padding:2% 2%;
}
.agree_contents input{
    display:none;
}
.agree_contents .checked{
    display:inline-block;
    width:40px;
    height:40px;
    border:2px solid #d9d9d9;
    text-indent: -9999em;
}
.agree_contents .text .red{
    color:#d9d9d9;
}
.agree_contents .slide{
    color:#d9d9d9;
}
.agree_contents input:checked + .checked + .text .red{
    color:#ff4848;
}
.agree_contents input:checked + .checked{
    background:url(../images/check.png) center no-repeat;
}
.last_agree{
    margin-top:10%;
}
.submit{
    margin-top:10%;
    text-align:center;
}

.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%;
}

.popup{
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    text-align:center;
    background-color:rgba(0,0,0,0.5);
}
.popup>div{
    position:absolute;
    top:50%;
    left:50%;
    transform:translateY(-50%) translate(-50%);
}
.popup .info{
    width:100%;
}
.popup .close_btn{
    position:absolute;
    top:-5%;
    right:0px;
    width:3%;
    cursor:pointer;
}
.agree_text_wrap{
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.5);
}
.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){
    .popup .close_btn{
        top:-10%;
        width:5%;
    }
    .surveylist{
        margin-top:5%;
    }
    .surveylist .title{
        font-size:3vw;
        padding-left:10%;
        background-size:5vw;
    }
    .radio_wrap .radio_contents{
        font-size:3vw;
    }
    .question_wrap textarea{
        height:20vw;
    }
    .info_wrap .textbox input{
        height:10vw;
    }
    .info_wrap .textbox label{
        font-size:3vw;
        line-height:15vw;
    }
    .radio_wrap .checked{
        width:5vw;
        height:5vw;
    }
    .info_wrap .textbox input{
        font-size:3vw;
    }
    .info_wrap{
        padding:3% 3% 5%;
    }
    .footer .ft_con a{
        font-size:2vw;
    }
    .agree_contents{
        font-size:2vw;
        line-height:40px;
    }
    .agree_contents input:checked + .checked{
        background-size:100%;
    }
}
@media all and (max-width:768px){
    .agree_text_wrap .agree_text{
        width:90%;
    }
    .surveylist{
        margin-top:0px;
    }
    .survey{
        top:0px;
    }
    .use_wrap textarea{
        width:30%;
    }
    .footer .ft_con{
        top:45%;
    }
    .popup>div{
        width:80%;
    }
}
@media all and (max-width:480px){
    .radio_wrap .radio_contents{
        line-height:3vw;
        margin:1% 1% 1% 0px;
    }
    .agree_contents {
        font-size:2vw;
        line-height:5vw;
    }
    .agree_contents .checked{
        width:6vw;
        height:6vw;
    }
    .submit{
        margin-top:5%;
    }
    .submit img{
        width:60%;
    }
    .footer .ft_con{
        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){
    .submit{
        margin:0;
    }
}