@charset "utf-8";


/* SUB(COMMON) */
.sub_wrap{width:100%; height:100%; position:relative;}
.sub_wrap.type01{background:url(../images/contents/sub_bg01.jpg) no-repeat center top;}
.sub_wrap.type02{background:url(../images/contents/sub_bg02.jpg) no-repeat center top;}
.sub_wrap.type03{background:url(../images/contents/sub_bg03.jpg) no-repeat center top;}
.sub_wrap.stretch{height:auto;}
.sub_wrap.stretch .sub_con{height:auto !important;}

.sub_top{width:100%; max-width:1060px; margin:0 auto; padding:27px 30px; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;}
.sub_top .title{display:flex; align-items:flex-end;}
.sub_top .title .logo{line-height:0; margin-right:15px;}
.sub_top .title h2{font-size:1.857em; letter-spacing:-0.08em; color:#fff;}
.sub_top .notice{font-size:1.286em; font-weight:500; letter-spacing:-0.03em; color:#fff;}

.sub_con{width:100%; max-width:1060px; height:calc(100% - 190px); margin:0 auto; padding:0 30px; position:relative; z-index:10;}
.sub_con .frame{height:50px; background:url(../images/contents/contents_top.png) repeat-x top;}
.sub_con .paper{height:calc(100% - 50px); padding:30px 20px; background:url(../images/contents/contents_bg.jpg) repeat-y top; border-radius:0 0 30px 30px; position:relative;}
.sub_con .paper.survey{padding:30px 20px 120px 20px;}
.sub_con .paper.result{border-radius:30px;}
.sub_con .box{height:100%; position:relative; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.sub_con .box *{-ms-overflow-style:-ms-autohiding-scrollbar; scrollbar-width:thin; scrollbar-color:#8846c3;}
.sub_con .box::-webkit-scrollbar{width:0.4rem; height:0.4rem; position:absolute; top:0; right:30px;}
.sub_con .box::-webkit-scrollbar-thumb{background-color:#8846c3; border-radius:0.4rem;}
.sub_con .box::-webkit-scrollbar-track{background-color:#d8d8d8; border-radius:0.4rem;}


/* SUB(정보입력) */
.input_box{padding:30px 40px;}

.input_box dl{margin-bottom:20px; display:flex; flex-wrap:wrap;}
.input_box dl:last-child{margin-bottom:0;}
.input_box dt{width:110px; font-size:1.286em; font-weight:500; letter-spacing:-0.03em; line-height:21px; padding:17px 5px 0 0;}
.input_box dt sup{font-size:1.333em; color:#d100ff; line-height:0;}
.input_box dd{width:calc(100% - 110px); display:flex; flex-wrap:wrap; align-items:center;}
.input_box dd input[type="text"]{width:100%; max-width:425px; height:55px; border-radius:55px; font-size:1.286em; padding:10px 20px;}
.input_box dd input[type="email"]{width:100%; max-width:425px; height:55px; border-radius:55px; font-size:1.286em; padding:10px 20px;}
.input_box dd select{width:130px; height:55px; margin-right:5px; border-radius:55px; font-size:1.286em; padding:10px 52px 10px 20px; background-size:32px;}
.input_box dd select:last-child{margin-right:0;}
.input_box dd input.full{max-width:100%;}
.input_box dd select.year{width:190px;}
.input_box dd textarea{width:100%; border-radius:30px; font-size:1.286em; line-height:1.3em; color:#555; padding:20px;}
.input_box dd .chk_group{margin-right:5px;}
.input_box dd .chk_group:last-child{margin-right:0;}
.input_box dd .chk_adress{width:100%; margin-top:15px; border-radius:30px; background-color:#fff; border:1px solid #c3c3c3; overflow:hidden;}
.input_box dd .chk_adress ul{display:flex; flex-wrap:wrap; align-items:flex-start; padding:20px;}
.input_box dd .chk_adress ul li{width:20%; padding:10px;}
.input_box dd .chk_adress .adress_txt{padding:20px; background-color:#f5f5f5; display:flex; flex-wrap:wrap; align-items:center;}
.input_box dd .chk_adress .adress_txt label{display:inline-block; width:110px; padding-left:10px; font-size:1.286em;}
.input_box dd .chk_adress .adress_txt input[type="text"]{max-width:calc(100% - 110px);}
.input_box dd .privacy_agree{margin-top:10px;}


/* SUB(연령선택) */
.age_box{padding:20px 30px;}

.age_box .age_select{padding-bottom:50px;}
.age_box .age_select .title{padding:50px 0; display:flex; align-items:center; justify-content:center;}
.age_box .age_select .title object{width:35px; filter:invert(33%) sepia(11%) saturate(3409%) hue-rotate(195deg) brightness(94%) contrast(91%); margin-right:10px;}
.age_box .age_select .title h2{font-size:2.571em; letter-spacing:-0.07em;}
.age_box .age_select .list{display:flex; flex-wrap:wrap; justify-content:space-between;}
.age_box .age_select .list .inner{width:calc(33.33% - 20px); height:360px; display:flex; flex-flow:column wrap; align-items:center; background-color:#fff; padding:20px; border-radius:30px; border:1px solid #d3cabe; position:relative; transition:all 0.3s;}
.age_box .age_select .list .inner .img{width:70%; max-width:134px; line-height:0;}
.age_box .age_select .list .inner .img img{width:100%;}
.age_box .age_select .list .inner h3{font-size:1.714em; line-height:1.2em; letter-spacing:-0.03em; padding:20px 0 10px;}
.age_box .age_select .list .inner p{font-size:1.143em; letter-spacing:-0.03em; color:#464646; text-align:center;}
.age_box .age_select .list .inner a{display:flex; align-items:center; justify-content:space-between; width:80%; max-width:150px; padding:10px 20px; background-color:#434ea8; border-radius:30px; box-shadow:10px 10px 10px rgba(0,0,0,0.2); font-size:1.286em; font-weight:500; line-height:20px; color:#fff; position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); opacity:0;}
.age_box .age_select .list .inner a object{width:10px; filter:invert(99%) sepia(85%) saturate(0%) hue-rotate(195deg) brightness(120%) contrast(100%);}
.age_box .age_select .list .inner:hover, .age_box .age_select .list .inner.active{border:3px solid #434ea8; box-shadow:10px 10px 10px rgba(0,0,0,0.2); transition:all 0.3s;}
.age_box .age_select .list .inner:hover a, .age_box .age_select .list .inner.active a{opacity:1; transition:all 0.3s;}

.age_box .age_type{background-color:#fff; border-radius:30px; border:1px solid #d3cabe; padding:50px;}
.age_box .age_type .title{display:flex; align-items:flex-end; justify-content:space-between; padding-bottom:30px; margin-bottom:30px; border-bottom:1px dashed #ddd;}
.age_box .age_type .title h2{font-size:2.143em; line-height:1em;}
.age_box .age_type .title p{font-size:1.143em; line-height:1.2em; letter-spacing:-0.07em; color:#464646;}
.age_box .age_type .list{display:flex; flex-wrap:wrap;}
.age_box .age_type .list .inner{width:calc(25% - 11.25px); margin-right:15px;}
.age_box .age_type .list .inner:nth-child(4n){margin-right:0;}
.age_box .age_type .list .inner a{display:block; width:100%; height:180px; display:flex; align-items:center; justify-content:center; border-radius:30px; border:3px solid #ececec; background-color:#ececec; transition:all 0.3s;}
.age_box .age_type .list .inner a img{width:80%; max-width:58px;}
.age_box .age_type .list .inner a:hover{border-color:#8846c3; background-color:#fff; box-shadow:10px 10px 10px rgba(0,0,0,0.2); transition:all 0.3s;}
.age_box .age_type .list .inner p{text-align:center; margin:20px 0; font-size:1.429em; font-weight:500; line-height:1em;}


/* SUB(설문) */
.survey_box{padding:20px 30px;}

.survey_box .list_info{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding-bottom:25px; border-bottom:1px solid rgba(0,0,0,0.2);}
.survey_box .list_info dl{display:flex; align-items:center;}
.survey_box .list_info dt, .survey_box .list_info dd{font-size:1.286em; line-height:20px; display:flex; align-items:center;}
.survey_box .list_info dt{padding-right:20px; position:relative;}
.survey_box .list_info dt:after{content:''; width:1px; height:14px; background-color:#acacac; position:absolute; top:3px; right:10px;}
.survey_box .list_info dt object{width:16px; height:16px; margin-right:5px;}
.survey_box .list_info dt b{font-weight:500;}
.survey_box .list_info dd span.badge{display:inline-block; padding:0 10px; margin-left:5px; border-radius:26px; font-size:1.071rem; font-weight:500; line-height:26px;}
.survey_box .list_info dd span.badge.complete{background-color:#4b4b4b; color:#e3e3e3;}
.survey_box .list_info dd span.badge.incomplete{background-color:#f12727; color:#fff;}

.survey_box .list_btn .title{padding:60px 0 30px; text-align:center;}
.survey_box .list_btn .title h2{font-size:2.571em; line-height:1em; letter-spacing:-0.06em;}
.survey_box .list_btn .title ul{margin-top:15px; display:flex; align-items:center; justify-content:center;}
.survey_box .list_btn .title ul li{font-size:1.286em; line-height:1.2em; position:relative;}
.survey_box .list_btn .title ul li.date{padding:0 20px;;}
.survey_box .list_btn .title ul li.date:after{content:''; width:1px; height:14px; background-color:#acacac; position:absolute; top:4px; right:10px;}
.survey_box .list_btn .title ul li.date object{width:16px; height:16px; position:absolute; top:4px;left:0;}
.survey_box .list_btn .link .link_unit{padding:12px 50px 12px 30px; margin-bottom:5px; border:1px solid #a2a2a2; border-radius:55px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; position:relative; cursor:pointer; transition:all 0.3s;}
.survey_box .list_btn .link .link_unit:last-child{margin-bottom:0;}
.survey_box .list_btn .link .link_unit p{font-size:1.286em; letter-spacing:-0.03em; line-height:30px;}
.survey_box .list_btn .link .link_unit object.arrow{width:10px; position:absolute; top:50%; right:30px; margin-top:-8px; filter:invert(67%) sepia(10%) saturate(6%) hue-rotate(318deg) brightness(88%) contrast(92%);}
.survey_box .list_btn .link .link_unit:hover, .survey_box .list_btn .link .link_unit:active{border-color:#434ea8; background-color:#434ea8;}
.survey_box .list_btn .link .link_unit:hover p, .survey_box .list_btn .link .link_unit:active p{font-weight:500; color:#fff; transition:all 0.3s;}
.survey_box .list_btn .link .link_unit:hover object.arrow, .survey_box .list_btn .link .link_unit:active object.arrow{filter:invert(100%) sepia(0%) saturate(7494%) hue-rotate(251deg) brightness(98%) contrast(100%);}
.survey_box .list_btn .link .link_unit.complete{border-color:#4b4b4b !important; background-color:#4b4b4b !important;}
.survey_box .list_btn .link .link_unit.complete p{font-weight:500 !important; color:#fff !important;}
.survey_box .list_btn .link .link_unit.complete object.arrow{filter:invert(93%) sepia(0%) saturate(1%) hue-rotate(156deg) brightness(83%) contrast(80%) !important;}
.survey_box .list_btn .link .link_unit.complete ul{display:flex; align-items:center;}
.survey_box .list_btn .link .link_unit.complete li{font-size:1.143em; line-height:20px; color:#e3e3e3;}
.survey_box .list_btn .link .link_unit.complete li span{float:left; position:relative;}
.survey_box .list_btn .link .link_unit.complete li span.date{padding:0 16px 0 18px;}
.survey_box .list_btn .link .link_unit.complete li span.date:after{content:''; width:1px; height:12px; background-color:#818181; position:absolute; top:4px; right:8px;}
.survey_box .list_btn .link .link_unit.complete li span.date object{width:14px; height:14px; position:absolute; top:3px; left:0; filter:invert(60%) sepia(1%) saturate(3928%) hue-rotate(44deg) brightness(111%) contrast(96%);}
.survey_box .list_btn .link .link_unit.complete li.badge{padding:3px 10px; border-radius:20px; border:1px solid #a5a5a5; margin-left:10px;}

.survey_box .list_chk .title h2{font-size:2.143em; line-height:1em; text-align:center; letter-spacing:-0.06em;}
.survey_box .list_chk .title .tit_btn{display:flex; align-items:center; justify-content:center; padding:15px 0 25px;}
.survey_box .list_chk .title .tit_btn button{padding:10px 20px; margin-right:5px; border-radius:25px; border:1px solid; display:flex; align-items:center; justify-content:center; font-size:1.286em; font-weight:400;}
.survey_box .list_chk .title .tit_btn button:last-child{margin-right:0;}
.survey_box .list_chk .title .tit_btn button object{width:16px; margin-right:5px;}
.survey_box .list_chk .title .tit_btn button.btn_menu{border-color:#5c5c5c; color:#2e2e2e; margin-right:5px;}
.survey_box .list_chk .title .tit_btn button.btn_menu object{filter:invert(14%) sepia(0%) saturate(7454%) hue-rotate(111deg) brightness(105%) contrast(93%);}
.survey_box .list_chk .title .tit_btn button.btn_save{border-color:#2d2d2d; background-color:#2d2d2d; color:#fff;}
.survey_box .list_chk .title .tit_btn button.btn_save object{filter:invert(99%) sepia(85%) saturate(0%) hue-rotate(195deg) brightness(120%) contrast(100%);}
.survey_box .list_chk .title p{font-size:1.286em; line-height:1.4em; letter-spacing:-0.06em; text-align:center; word-break:keep-all;}
.survey_box .list_chk .ask{margin:60px 0; padding:50px 30px; border:2px dashed #8846c3; position:relative;}
.survey_box .list_chk .ask .progress{border-radius:30px; background-color:#8846c3; position:absolute; top:-20px; left:50%; transform:translateX(-50%); padding:10px 20px 10px 45px;}
.survey_box .list_chk .ask .progress span.icon{display:inline-block; padding:7px 10px; line-height:0; border-radius:30px; background-color:#fff;position:absolute; top:5px; left:5px;}
.survey_box .list_chk .ask .progress span.icon object{width:10px; height:16px; filter:invert(40%) sepia(37%) saturate(1698%) hue-rotate(238deg) brightness(81%) contrast(93%);}
.survey_box .list_chk .ask .progress p{display:flex; align-items:center;}
.survey_box .list_chk .ask .progress p span{display:inline-block; font-family:Arial, Helvetica, sans-serif; font-size:1.286rem; color:#fff; line-height:20px;}
.survey_box .list_chk .ask .progress p span.current{font-weight:bold;}
.survey_box .list_chk .ask .progress p span.bar{font-size:1.071rem; color:rgba(255,255,255,0.5); margin:0 3px;}
.survey_box .list_chk .ask h2{font-size:2.143em; letter-spacing:-0.08em; line-height:1.3em; text-align:center; word-break:keep-all;}
.survey_box .list_chk .ask h3{font-size:1.63em; letter-spacing:-0.08em; line-height:1.3em; text-align:center; word-break:keep-all;}
.survey_box .list_chk .answer{display:flex; flex-wrap:wrap; padding:0 30px;}
.survey_box .list_chk .answer .chk_group{width:calc(50% - 10px); margin:5px;}

.survey_box .survey_tab{margin-top:40px;}
.survey_box .survey_tab ul{display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.survey_box .survey_tab li{margin:5px 2px;}
.survey_box .survey_tab li a{display:block; padding:15px 30px; border-radius:50px; font-size:1.286em; line-height:25px; color:#fff; background-color:#626262;}
.survey_box .survey_tab li.active a{background-color:#8846c3; font-weight:500;}

.survey_btn{width:100%; display:flex; align-items:center; position:absolute; bottom:0; left:0; border-radius:0 0 30px 30px; overflow:hidden;}
.survey_btn button{width:50%; height:100px; display:flex; align-items:center; justify-content:center; font-size:2.143em; font-weight:600; color:#fff; border-radius:0;}
.survey_btn button:hover{opacity:0.8;}
.survey_btn button object{width:20px; filter:invert(99%) sepia(85%) saturate(0%) hue-rotate(195deg) brightness(120%) contrast(100%);}
.survey_btn button.btn_prev{background-color:#8846c3; border-right:1px solid #4b2270;}
.survey_btn button.btn_next{background-color:#5e2a8c; border-left:1px solid #7e55a3;}


/* SUB(결과) */
.result_box{padding:20px 30px;}

.result_box .score{display:flex; align-items:center; justify-content:center; margin-top:40px; font-size:2.143em; line-height:1em;}
.result_box .score h2{font-size:1.333em;}
.result_box .score span{display:inline-block; margin:0 10px; font-size:0.867em; color:#a1a1a1;}
.result_box .score p{font-size:1em;}
.result_box .result_tit{padding:40px 0 20px; font-size:2.143em; font-weight:300; line-height:1em; letter-spacing:-0.06em; text-align:center;}
.result_box .result_tit b{font-weight:600;}
.result_box .result_txt{font-size:1.429em; line-height:1.3em; letter-spacing:-0.03em; text-align:center; word-break:keep-all;}
.result_box .result_txt b{font-weight:500;}

.result_box .info{display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:center;}
.result_box .info dl{width:25%; text-align:center; padding:15px 0; border-right:1px dashed #b1afac;}
.result_box .info dl:last-child{border-right:0;}
.result_box .info dt{font-size:1.429em; font-weight:600; line-height:1em;}
.result_box .info dd{font-size:2.571em; line-height:1.2em; margin-top:10px;}

.result_box .rate{padding:60px 0;}
.result_box .rate *{letter-spacing:-0.06em;}
.result_box .rate h1{font-size:2.571em; line-height:1em; text-align:center;}
.result_box .rate .bar{height:34px; border-radius:34px; background-color:#ddd; margin-top:30px;}
.result_box .rate .bar .value{text-align:center; font-size:1.286em; font-weight:600; color:#fff; line-height:34px; border-radius:34px; background:linear-gradient(90deg,#c146c3,#434ea8); position:relative;}
.result_box .rate .bar .value:after{content:''; width:24px; height:24px; border-radius:24px; background:url(../images/contents/ic_down.svg) no-repeat center #fff; background-size:10px; position:absolute; top:50%; right:5px; margin-top:-12px;}

.result_box .summarize{padding:30px; border-radius:30px; background-color:#927e64; position:relative;}
.result_box .summarize:after{content:''; width:252px; height:90px; background:url(../images/contents/clip.png) no-repeat center; background-size:cover; position:absolute; top:-25px; left:50%; transform:translateX(-50%);}
.result_box .summarize .inner{padding:60px 30px; border-radius:20px; background-color:#fff;}
.result_box .summarize .img{line-height:0; text-align:center;}
.result_box .summarize .img img{width:40%; max-width:130px;}

.result_box .detail{margin-top:20px; padding:50px; background-color:#fff; border-radius:30px; border:1px solid #c3c3c3;}
.result_box .detail .result_tab{display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.result_box .detail .result_tab li{margin:5px 2px;}
.result_box .detail .result_tab li a{display:block; padding:15px 30px; border-radius:50px; font-size:1.286em; line-height:25px; color:#fff; background-color:#626262;}
.result_box .detail .result_tab li.active a{background-color:#8846c3; font-weight:500;}
.result_box .detail .result_con .score{border-bottom:1px dashed #b2b2b2; padding-bottom:40px;}

.result_box .result_btn{margin-top:40px;}
.result_box .result_btn button{width:70%; max-width:300px; margin:0 auto; padding:20px; border-radius:50px; display:flex; align-items:center; justify-content:center; font-size:1.714em; font-weight:600; color:#fff; line-height:30px; background-color:#434ea8;}
.result_box .result_btn button object{width:20px; margin-right:5px; filter:invert(99%) sepia(85%) saturate(0%) hue-rotate(195deg) brightness(120%) contrast(100%);}


/* CHECKBOX */
.chk_group{position:relative;}
.chk_hidden{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.chk_hidden + label.chk_design01{display:inline-block; padding:15px 30px; position:relative; font-size:1.286em; line-height:25px; color:#fff; border-radius:55px; background-color:#626262; cursor:pointer; user-select:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
.chk_hidden:checked + label.chk_design01{background-color:#434ea8; font-weight:500;}
.chk_hidden + label.chk_design02{display:inline-block; padding-left:20px; font-size:1.286em; line-height:1.3em; letter-spacing:-0.03em; cursor:pointer; position:relative;}
.chk_hidden + label.chk_design02:before{content:''; display:inline-block; width:16px; height:16px; border-radius:16px; border:3px solid #cacaca; background-color:#cacaca; box-sizing:border-box; position:absolute; top:3px; left:0;}
.chk_hidden:checked + label.chk_design02:before{background-color:#000;}
.chk_hidden + label.chk_design03{display:block; padding:15px 60px 15px 30px; border-radius:30px; border:1px solid #a2a2a2; font-size:1.429em; line-height:24px; letter-spacing:-0.03em; cursor:pointer; position:relative;}
.chk_hidden:checked + label.chk_design03{background-color:#434ea8; border-color:#434ea8; font-weight:500; color:#fff;}
.chk_hidden:checked + label.chk_design03:before{content:''; width:30px; height:30px; background:url(../images/contents/ic_check.svg) no-repeat center; background-size:cover; opacity:0.8; position:absolute; top:50%; right:13px; margin-top:-15px;}


/* OBJECT */
.object01 img, .object02 img{width:100%;}
.object01{width:21%; max-width:390px; position:absolute; bottom:26%; left:4.5%; z-index:11;}
.object02{width:31%; max-width:588px; position:absolute; bottom:0; right:0; z-index:9;}


/* FOOTER */
.footer{width:100%; max-width:1060px; margin:0 auto; padding:35px 30px;}
.footer p{font-size:1.143em; text-align:center; line-height:20px; letter-spacing:-0.03em; color:rgba(255,255,255,0.6);}



/* RESPONSIVE */
@media screen and (max-width : 1600px){
	/* OBJECT */
	.object01{display:none;}
}


@media screen and (max-width : 1280px){
	/* SUB(정보입력) */
	.input_box{padding:30px 20px;}
	
	
	/* OBJECT */
	.object02{width:40%;}
}


@media screen and (max-width : 960px){	
	/* SUB(COMMON) */
	.sub_wrap.type01{background-size:auto 100%;}
	.sub_wrap.type02{background-size:auto 100%;}
	
	.sub_top{padding:30px 30px 10px; justify-content:center;}
	.sub_top .title{margin-bottom:15px;}
	.sub_top .title .logo img{height:42px;}
	.sub_top .title h2{font-size:1.714em;}
	.sub_top .notice{font-size:1.143em; line-height:20px; width:100%; text-align:right;}
	
	.sub_con{height:calc(100% - 197px);}
	.sub_con .frame{height:30px; background-size:auto 30px;}
	.sub_con .paper{height:calc(100% - 30px); padding:20px;}
	.sub_con .paper.survey{padding:20px 20px 100px;}
	
	
	/* SUB(정보입력) */
	.input_box{padding:20px;}
	
	.input_box dt{width:100px; font-size:1.143em; line-height:20px; padding:15px 5px 0 0;}
	.input_box dd{width:calc(100% - 100px);}
	.input_box dd input[type="text"]{height:50px; font-size:1.143em;}
	.input_box dd select{width:calc(30% - 5px); max-width:130px; height:50px; font-size:1.143em;}
	.input_box dd select.year{width:40%; max-width:190px;}
	.input_box dd textarea{font-size:1.143em; border-radius:20px;}
	.input_box dd .chk_adress{border-radius:20px;}
	.input_box dd .chk_adress ul{padding:10px;}
	.input_box dd .chk_adress ul li{width:33.33%;}
	.input_box dd .chk_adress .adress_txt label{width:90px; font-size:1.143em; padding-left:0;}
	.input_box dd .chk_adress .adress_txt input[type="text"]{max-width:calc(100% - 90px);}
	
	
	/* SUB(연령선택) */
	.age_box{padding:20px;}
	
	.age_box .age_select .title{padding:30px 0;}
	.age_box .age_select .title object{width:30px;}
	.age_box .age_select .title h2{font-size:2.143em;}
	.age_box .age_select .list .inner{width:calc(33.33% - 10px); height:auto; padding:20px 20px 60px;}
	.age_box .age_select .list .inner h3{font-size:1.571em;}

	.age_box .age_type{padding:30px;}
	.age_box .age_type .title{padding-bottom:20px; margin-bottom:20px;}
	.age_box .age_type .title h2{font-size:1.857em;}
	.age_box .age_type .list .inner a{padding:20px; height:auto;}
	.age_box .age_type .list .inner a img{height:70px;}
	.age_box .age_type .list .inner p{margin:15px 0; font-size:1.286em;}
	
	
	/* SUB(설문) */
	.survey_box{padding:20px;}
	
	.survey_box .list_info{flex-direction:column; justify-content:center;}
	.survey_box .list_info dl{margin-bottom:10px;}
	.survey_box .list_info dl:last-child{margin-bottom:0;}
	.survey_box .list_info dt, .survey_box .list_info dd{font-size:1.143em;}
	
	.survey_box .list_btn .title{padding:40px 0 20px;}
	.survey_box .list_btn .title h2{font-size:2.286em;}
	.survey_box .list_btn .title ul li{font-size:1.143em;}
	.survey_box .list_btn .title ul li.date:after{top:3px;}
	.survey_box .list_btn .title ul li.date object{top:2px;}
	.survey_box .list_btn .link .link_unit p{font-size:1.143em;}
	.survey_box .list_btn .link .link_unit.complete li{font-size:1em;}
	
	
	.survey_box .list_chk .title h2{font-size:1.857em;}
	.survey_box .list_chk .title .tit_btn button{font-size:1.143em;}
	.survey_box .list_chk .title p{font-size:1.143em;}
	.survey_box .list_chk .ask{margin:40px 0; padding:30px;}
	.survey_box .list_chk .ask .progress span.icon{padding:6px 9px;}
	.survey_box .list_chk .ask .progress p span{font-size:1.143rem; line-height:18px;}
	.survey_box .list_chk .ask h2{font-size:1.857em;}
	.survey_box .list_chk .answer{padding:0 20px;}
	
	.survey_box .survey_tab{margin-top:30px;}
	.survey_box .survey_tab li a{font-size:1.143em; line-height:20px; padding:15px 20px;}
	
	.survey_btn button{height:80px; font-size:1.857em;}
	
	
	/* SUB(결과) */
	.result_box{padding:20px;}
	
	.result_box .score{font-size:1.857em; margin-top:30px;}
	.result_box .result_tit{padding:30px 0 20px; font-size:1.857em;}
	.result_box .result_txt{font-size:1.286em;}
	
	.result_box .info dl{width:auto; padding:15px;}
	.result_box .info dt{font-size:1.286em;}
	.result_box .info dd{font-size:2.143em;}
	
	.result_box .rate{padding:40px 0 60px;}
	.result_box .rate h1{font-size:2.286em;}
	.result_box .rate .bar .value{font-size:1.143em;}
	
	.result_box .summarize{padding:20px;}
	.result_box .summarize:after{width:200px; height:72px;}
	.result_box .summarize .inner{padding:40px 20px;}
	
	.result_box .detail{padding:30px;}
	.result_box .detail .result_tab li a{font-size:1.143em; line-height:20px; padding:15px 20px;}
	.result_box .detail .result_con .score{padding-bottom:30px;}
	
	.result_box .result_btn{margin-top:30px;}
	.result_box .result_btn button{font-size:1.429em; line-height:25px;}
	
	
	/* CHECKBOX */
	.chk_hidden + label.chk_design01{padding:15px 25px; line-height:20px; font-size:1.143em;}
	.chk_hidden + label.chk_design02{font-size:1.143em;}
	.chk_hidden + label.chk_design03{padding:15px 50px 15px 25px; line-height:20px; font-size:1.143em;}
	.chk_hidden:checked + label.chk_design03:before{right:11px;}
	
	
	/* FOOTER */
	.footer{padding:30px;}
}


@media screen and (max-width : 640px){
	/* SUB(COMMON) */
	.sub_top{padding:30px 4.5% 10px;}
	.sub_top .title{flex-direction:column; align-items:center; margin-bottom:10px;}	
	.sub_top .title .logo{margin-right:0; margin-bottom:10px;}
	.sub_top .title .logo img{height:32px;}
	.sub_top .title h2{font-size:1.571em; line-height:28px;}
	.sub_top .notice{font-size:1em;}
	
	.sub_con{height:calc(100% - 220px); padding:0 4.5%;}
	.sub_con .frame{height:20px; background-size:auto 20px;}
	.sub_con .paper{height:calc(100% - 20px); padding:10px; border-radius:0 0 20px 20px;}
	.sub_con .paper.survey{padding:10px 10px 70px;}
	
	
	/* SUB(정보입력) */
	.input_box{padding:10px;}
	
	.input_box dt{width:100%; font-size:1rem; line-height:1.3em; padding:0; margin-bottom:10px;}
	.input_box dt sup{font-size:1.143em;}
	.input_box dd{width:100%;}
	.input_box dd input[type="text"]{height:45px; padding:10px 15px; font-size:1rem;}
	.input_box dd select{height:45px; padding:10px 30px 10px 15px; font-size:1rem; background-size:22px;}
	.input_box dd textarea{font-size:1rem; border-radius:15px; padding:10px;}
	.input_box dd .chk_adress{border-radius:15px;}
	.sub_con .input_box dd .chk_adress ul li{padding:5px; font-size:1rem;}
	.input_box dd .chk_adress .adress_txt{padding:15px;}
	.input_box dd .chk_adress .adress_txt label{width:100%; margin-bottom:10px; font-size:1rem;}
	.input_box dd .chk_adress .adress_txt input[type="text"]{max-width:100%;}
	
	
	/* SUB(연령선택) */
	.age_box{padding:10px;}
	
	.age_box .age_select{padding-bottom:30px;}
	.age_box .age_select .title object{width:18px; margin-right:5px;}
	.age_box .age_select .title h2{font-size:1.429em;}
	.age_box .age_select .list .inner{width:100%; padding:15px 15px 25px; margin-bottom:15px; border-radius:20px;}
	.age_box .age_select .list .inner:last-child{margin-botto:0;}
	.age_box .age_select .list .inner .img{max-width:100px;}
	.age_box .age_select .list .inner h3{font-size:1.286em; padding:15px 0 5px;}
	.age_box .age_select .list .inner p{font-size:1em;}
	.age_box .age_select .list .inner a{max-width:120px; opacity:1 !important; position:relative; bottom:auto; left:auto; transform:translateX(0); box-shadow:none !important; margin-top:20px; font-size:1.143em; line-height:18px;}
	.age_box .age_select .list .inner:hover, .age_box .age_select .list .inner.active{box-shadow:7px 7px 7px rgba(0,0,0,0.2);}
	
	.age_box .age_type{padding:20px 15px; border-radius:20px;}
	.age_box .age_type .title{flex-wrap:wrap; padding-bottom:15px; margin-bottom:15px;}
	.age_box .age_type .title h2{font-size:1.429em;}
	.age_box .age_type .title p{font-size:1em; margin-top:5px;}
	.age_box .age_type .list .inner{width:calc(50% - 5px); margin-right:10px;}
	.age_box .age_type .list .inner:nth-child(2n){margin-right:0;}
	.age_box .age_type .list .inner a{border-radius:15px;}
	.age_box .age_type .list .inner p{margin:10px 0 15px; font-size:1.143em;}
	
	
	/* SUB(설문) */
	.survey_box{padding:10px;}
	
	.survey_box .list_info{padding-bottom:20px;}
	.survey_box .list_info dl{margin-bottom:8px;}
	.survey_box .list_info dt, .survey_box .list_info dd{font-size:1rem; line-height:18px;}
	.survey_box .list_info dt{padding-right:16px;}
	.survey_box .list_info dt:after{height:12px; top:4px; right:7px;}
	.survey_box .list_info dt object{width:14px; height:14px; margin-right:3px;}
	.survey_box .list_info dd span.badge{padding:0 7px; font-size:0.857em;}
	
	.survey_box .list_btn .title{padding:30px 0 15px;}
	.survey_box .list_btn .title h2{font-size:1.857em;}
	.survey_box .list_btn .title ul li{font-size:1rem;}
	.survey_box .list_btn .title ul li.date{padding:0 16px;}
	.survey_box .list_btn .title ul li.date:after{height:12px; right:7px;}
	.survey_box .list_btn .title ul li.date object{width:14px; height:14px;}
	
	.survey_box .list_btn .link .link_unit{padding:12px 40px 12px 20px;}
	.survey_box .list_btn .link .link_unit p{font-size:1rem; line-height:20px;}
	.survey_box .list_btn .link .link_unit object.arrow{width:8px; right:20px; margin-top:-6px;}
	.survey_box .list_btn .link .link_unit.complete{border-radius:23px;}
	.survey_box .list_btn .link .link_unit.complete li{font-size:0.857em;}
	.survey_box .list_btn .link .link_unit.complete li.badge{line-height:18px; padding:0 10px;}
	
	.survey_box .list_chk .title h2{font-size:1.571em;}
	.survey_box .list_chk .title .tit_btn{padding:10px 0 20px;}
	.survey_box .list_chk .title .tit_btn button{font-size:1rem; padding:7px 15px;}
	.survey_box .list_chk .title .tit_btn button object{width:12px;}
	.survey_box .list_chk .title p{font-size:1rem;}
	.survey_box .list_chk .ask{padding:30px 15px;}
	.survey_box .list_chk .ask .progress{padding:8px 15px 8px 35px; top:-17px;}
	.survey_box .list_chk .ask .progress span.icon{padding:6px 8px;}
	.survey_box .list_chk .ask .progress span.icon object{width:8px; height:12px;}
	.survey_box .list_chk .ask .progress p span{font-size:1rem;}
	.survey_box .list_chk .ask .progress p span.bar{font-size:0.857rem;}
	.survey_box .list_chk .ask h2{font-size:1.286em;}
	.survey_box .list_chk .answer{padding:0; max-width:480px; margin:0 auto;}
	.survey_box .list_chk .answer .chk_group{width:100%; margin:0 0 10px;}
	.survey_box .list_chk .answer .chk_group.survey_box .list_chk .answer button:last-child{margin-bottom:0;}
	
	.survey_box .survey_tab{margin-top:20px;}
	.survey_box .survey_tab li{margin:2px;}
	.survey_box .survey_tab li a{font-size:1em; padding:8px 15px;}
	
	.survey_btn{border-radius:0 0 20px 20px;}
	.survey_btn button{height:50px; font-size:1.286em;}
	.survey_btn button object{width:16px;}
	
	
	/* SUB(결과) */
	.result_box{padding:10px;}
	
	.result_box .score{margin-top:20px; font-size:1.571em;}
	.result_box .result_tit{font-size:1.429em; padding:20px 0 10px;}
	.result_box .result_txt{font-size:1.143em;}
	
	.result_box .info dl{width:50%; border-bottom:1px dashed #b1afac;}
	.result_box .info dl:nth-child(2n){border-right:0;}
	.result_box .info dl:nth-child(3), .result_box .info dl:nth-child(4){border-bottom:0;}
	.result_box .info dt{font-size:1.143em;}
	.result_box .info dd{font-size:1.571em; margin-top:7px;}
	
	.result_box .rate{padding:30px 0 50px;}
	.result_box .rate h1{font-size:1.571em;}
	.result_box .rate .bar{margin-top:20px; height:30px;}
	.result_box .rate .bar .value{line-height:30px; font-size:1em;}
	.result_box .rate .bar .value:after{width:20px; height:20px; margin-top:-10px; background-size:6px;}
	
	.result_box .summarize{padding:15px; border-radius:20px;}
	.result_box .summarize:after{width:140px; height:51px; top:-20px;}
	.result_box .summarize .inner{padding:30px 15px; border-radius:10px;}
	
	.result_box .detail{padding:30px 15px; border-radius:20px; margin-top:15px;}
	.result_box .detail .result_tab li{margin:2px;}
	.result_box .detail .result_tab li a{font-size:1em; padding:8px 15px;}
	.result_box .detail .result_con .score{padding-bottom:20px;}
	
	.result_box .result_btn{margin-top:15px;}
	.result_box .result_btn button{max-width:220px; font-size:1.143em; line-height:20px; padding:15px;}
	.result_box .result_btn button object{width:16px;}
	
	
	/* CHECKBOX */
	.chk_hidden + label.chk_design01{font-size:1rem; line-height:15px;}
	.chk_hidden + label.chk_design02{font-size:1rem; padding-left:18px;}
	.chk_hidden + label.chk_design02:before{width:14px; height:14px;}
	.chk_hidden + label.chk_design03{font-size:1rem; line-height:18px; padding:13px 46px 13px 20px;}
	.chk_hidden:checked + label.chk_design03:before{width:26px; height:26px; right:10px; margin-top:-13px;}
	
	
	/* FOOTER */
	.footer{padding:20px 4.5% 30px;}
	.footer p{font-size:0.928em; line-height:15px;}
	
}