@charset "utf-8";

@font-face {
	font-family: 'malgun';
	src: url(../font/malgun.eot);
	src: url(../font/malgun.woff) format('woff'),
	     url(../font/malgun.ttf) format('truetype'),
	     url(../font/malgun.eot?#iefix) format('embedded-opentype');
	font-style: normal;
	font-weight: normal;
}

/* Common */
html{overflow-y: scroll}
html,body{width:100%;height:100%}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, button{margin:0;padding:0}
body,input,textarea,select,button,table{font-family:"맑은 고딕", Malgun Gothic,'malgun','돋움',dotum,'굴림',Gulim,Helvetica,sans-serif;font-size:16px;color:#222;line-height:180%;font-weight:normal}
img,fieldset{border:0}
img{/*max-width:100%;*/max-height: 100%;vertical-align:top}

ul,ol{list-style:none}
em,address{font-style:normal}
a{color:#333;text-decoration:none}
a:hover,a:active,a:focus{color:#666;/*text-decoration:underline*/}
a[href^="tel"]{ font-style:normal}

.clearfix{*zoom:1}
.clearfix:after{content:'';display:block;clear:both}

/*  Form  */
input, button, select, textarea{font-family: inherit; font-size: inherit; line-height: inherit;}
input{margin:0;padding:0;box-sizing:border-box;vertical-align:middle; border-radius:0; outline:0;border:1px solid #ccc}
fieldset {border:0 none;}
caption,legend,.hidden{position:absolute;top:0;left:-999em;visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;text-align:left}
/* add */
input,label{vertical-align:middle}
input[type="radio"]{/* *width:13px;*height:13px; margin:0 5px 0 0;*/border:none;/*-webkit-appearance:none*/}
input[type="text"], input[type="password"]{-webkit-appearance:none}
input[type="text"]:focus,input[type=password]:focus,input[type="tel"]:focus,input[type="email"]:focus,select:focus,textarea:focus{border:1px solid #acc7ef;background:#f5f8fd;/* outline:1px solid #ff2c5a */}
input[type="text"], input[type="password"]{-webkit-appearance:none}
input[type="checkbox"]{-webkit-appearance:none;-webkit-border-radius:0}
input:checked[type="checkbox"]{-webkit-appearance:checkbox}
button,input[type="button"],input[type="submit"],input[type="reset"],input[type="file"]{-webkit-appearance:button;border-radius:0}
textarea {width:100%;padding:10px;border:1px solid #d2d2d2;font-size:1em;color:#333;line-height:1.6;box-sizing:border-box;-webkit-appearance:none;overflow-x:hidden;vertical-align:middle;text-align:left}
input[type=file]{width:99.5%;height:30px;border:1px solid #d2d2d2;background:#fff}
select{-webkit-appearance:menulist-text}

table{border-collapse:collapse;border-spacing:0}
hr{display:none;clear:both}

.skip a{position: absolute; left:0; top: -9999em; z-index: 9999; width: 100%; background-color: navy;color:#FFF; font-size: 1.3em; text-align: center; line-height: 2}
.skip a:focus, .skip a:hover, .skip a:active{top:0;}

.ellipsis {display: inline-block;width: 95%; text-overflow: ellipsis;white-space: nowrap;overflow: hidden;vertical-align: middle;}

.inpRadio input[type="radio"]{width:18px;height:18px;}
/* layout */
#wrap{width:100%;}
#header{position:relative;width:100%;min-height:75px;border-bottom:1px solid #ccc;}
.headerIn{width:1000px;height:75px;margin:0 auto;line-height:75px;}
.headerIn h1{float:left;width:224px;height:33px;padding-top:22px;}
.headerIn p{float:right;font-size:18px;font-weight:700;color:#333;}
.headerInfor{width:100%;background:#ebebeb;border-top:1px solid #ccc;}
.headerInfor .headerInforIn{width:1000px;height:38px;margin:0 auto;padding-left:20px;box-sizing:border-box;line-height:38px;overflow:hidden;}
.headerInfor .headerInforIn .psInfor{float:left;}
.headerInfor .headerInforIn .psInfor li{float:left;padding-right:30px;font-size:14px;color:#333;font-weight:700}
.headerInfor .headerInforIn .timeInfor {float:left;height:38px;line-height:32px;}
.headerInfor .headerInforIn .timeInfor span, .timeInfor a{display:inline-block;vertical-align:middle;}
.headerInfor .headerInforIn .timeInfor .tx{padding-left:25px;background:url(./img/header_time.png) no-repeat 0 8px;}
.headerInfor .headerInforIn .timeInfor .tm{padding-left:15px;color:#1561ae;font-size:18px;font-weight:700}
.headerInfor .headerInforIn .timeInfor a{width:62px;height:25px;margin-left:15px;background:url(./img/btnSave.png) no-repeat 0 0}

#container{width:100%;}
#content{position:relative;width:1000px;margin:0 auto;padding:40px 0 60px;}
#login_content{position:relative;width:1000px;margin:0 auto;padding:10px 0 60px;}
#footer{width:100%;height:58px;background:#ebebeb;border-top:1px solid #ccc;}
.footerIn{width:1000px;margin:0 auto;text-align:center;font-size:13px;color:#333;line-height:57px;overflow:hidden}

@media all and (min-width:768px) and (max-width:1024px) {
	#header.sticky{z-index:999;}
	#header.sticky .headerIn{position:absolute;top:-75px;}
	#header.sticky .headerInfor{position:fixed;top:0;opacity:1}

}

@media all and (min-width:320px) and (max-width:376px) {
	.headerIn{width:100%;padding:0 10px;box-sizing:border-box;}
	#content{width:100%;padding:30px 10px;box-sizing:border-box;}
	.footerIn{width:100%;padding:0 10px;box-sizing:border-box;}
}
@media all and (min-width:377px) and (max-width:1024px) {
	.headerIn{width:100%;padding:0 15px;box-sizing:border-box;}
	#content{width:100%;padding:30px 15px;box-sizing:border-box;}
	.footerIn{width:100%;padding:0 15px;box-sizing:border-box;}
}
@media all and (min-width:320px) and (max-width:375px) {
	#content{width:100%;padding:30px 10px;box-sizing:border-box;}
}
@media all and (min-width:320px) and (max-width:767px) {
	#header{min-height:100px;height:auto;border-bottom:0;}
	.headerIn{height:65px;line-height:100%;}
	.headerIn h1{float:none;width:150px;height:auto;margin:0 auto 5px;padding-top:12px;}
	.headerIn p{float:none;padding-bottom:5px;text-align:center;font-size:14px;line-height:1.5;letter-spacing:-1px}
	.headerInfor{position:relative;height:63px;background:none;font-weight:700;}
	.headerInfor .headerInforIn{height:auto;padding:0;line-height:100%}
	.headerInfor .headerInforIn .psInfor{float:none;width:100%;height:25px;padding:5px 15px 5px;background:#ebebeb;line-height:100%;box-sizing:border-box;overflow:hidden;}
	.headerInfor .headerInforIn .psInfor li{font-size:12px;}
	.headerInfor .headerInforIn .timeInfor{display:block;width:100%;padding:0;background:url(./img/bg_headerIn.png) repeat 0 0;clear:both;}
	.headerInfor .headerInforIn .timeInfor span{color:#fff !important;}
	.headerInfor .headerInforIn .timeInfor .tx{margin-left:15px;padding-left:18px;background:url(./img/header_time2.png) no-repeat 0 10px;background-size:14px 14px;}
	.headerInfor .headerInforIn .timeInfor .tm{margin-top:0;}
	.headerInfor .headerInforIn .timeInfor a{position:absolute;bottom:7px;right:15px;margin-top:0;}

	#header.sticky{z-index:999;}
	#header.sticky .headerIn{position:absolute;top:-65px;}
	#header.sticky .headerInfor{position:fixed;top:0;opacity:1}
	#header.sticky .scrollToTop.mo{display:block;position:fixed;top:63px;left:50%;margin-left:-20px;}
	.scrollToTop.mo{display:block;width:50px;height:27px;/* width:40px;height:27px; */margin:-1px auto 0;background:url(./img/toTopMo.png) no-repeat 0 0;background-size:50px 27px}

	/* #header.headerMo{min-height:auto;}
	#header.headerMo .headerInfor{height:auto;}
	#header.headerMo .headerInfor {border-top:1px solid #ccc;border-bottom:1px solid #ccc;}
	#header.headerMo .headerInfor .headerInforIn .psInfor{}
	#header.headerMo .timeInfor{position:fixed;bottom:0;opacity:1;z-index: 99} */

	#header.headerMo.sticky{}
	#header.headerMo.sticky .headerIn{position:static;}
	#header.headerMo.sticky .headerInfor{position:static;}
	#header.headerMo.sticky .headerInfor .timeInfor{position:fixed;bottom:0;opacity:1}
	#header.headerMo.sticky .scrollToTop.mo{display:block;position:fixed;top:auto;bottom:36px;left:50%;margin-left:-20px;background:url(./img/toTopMo2.png) no-repeat 0 0;background-size:50px 27px}

}

/* =========== 버튼 =========== */
.btnArea{margin-top:40px;text-align:center}
.btnArea.mt{}
.btn + .btn{margin-left:10px;}
.btnArea a:first-child{margin-left:0;}
.btn{display:inline-block;text-align:center;font-weight:700;box-sizing:border-box;}
.btn.black{background:#000;font-size:24px;font-weight:700;line-height:72px;color:#fff;}
.btn.black2{width:154px;background:#000;font-size:18px;font-weight:400;line-height:55px;color:#fff;}
.btn.white{width:154px;background:#fff;border:1px solid #ccc;font-size:18px;font-weight:400;line-height:55px;color:#333;}
@media all and (min-width:320px) and (max-width:767px) {
	.btn.black{height:50px;font-size:18px;line-height:50px;}
	.btnArea.v2{overflow:hidden;}
	.btnArea.v2 a{float:left;width:48%;}
	.btnArea.v2 a + a{float:right;}
}

/* =========== 로그인 =========== */
.loginPage{margin:0 0 200px;text-align:center}
.loginPage .logo2{margin:0 auto;margin-bottom:20px;}
.loginPage .logo2 img{max-width:1000px;max-height: 550px;}

.loginPage .loginTxt{padding:25px 0 50px;font-size:24px;color:#333;}
.loginPage .loginArea{width:430px;margin:0 auto;}
.loginPage .loginArea .idInp{margin-bottom:20px;}
.loginPage .loginArea .pwInp{margin-bottom:30px;}
.loginPage .loginArea input.inp{width:100%;height:42px;padding-left:20px;}
.loginPage .loginArea .loginBtn .btn{width:100%;}
.icoSky{display:inline-block;margin-top:30px;padding-left:20px;background:url(./img/ico_sky.png) no-repeat 0 2px;font-size:14px;line-height:1.5}

@media all and (min-width:768px) and (max-width:1024px) {

}
@media all and (min-width:320px) and (max-width:767px) {
	.loginPage{margin:40px 0 80px;}
	.loginPage .logo2{}
	.loginPage .logo2 img{}
	.loginPage .loginTxt{padding:20px 0 30px;font-size:18px;letter-spacing:-2px}
	.loginPage .loginArea{width:100%;}
	.loginPage .loginArea .idInp{margin-bottom:10px;}
	.loginPage .loginArea .pwInp{margin-bottom:20px;}
}

/* =========== 진단 notice =========== */
.notice_bg{background:url(./img/bg_notice.png) no-repeat 50% 0;}
.noticePage{margin:40px 0 60px;}
.noticePage h2{text-align:center;font-size:34px;margin-bottom:15px;}
.noticePage h3{text-align:center;font-size:18px;margin-bottom:30px;}
.noticePage .ntImgArea{padding:30px 40px;background:#FFF;border:1px solid #CCC;}
.point_txt{color:#ec630e; font-weight:bold}
.noticePage .btnArea a{width:165px;}
.lst_dot li{padding-left:15px;background:url(./img/ico_dot.png) no-repeat 0 8px; padding-bottom:8px;}

@media all and (min-width:320px) and (max-width:767px) {
	.notice_bg{background-position:50% 50%; background:url(./img/bg_notice.png) no-repeat 50% 0;}

}

/* =========== 진단 인성검사 table =========== */
.tbSty{}
.tbSty table{width:100%;text-align:center}
.tbSty table thead th{height:50px;background:#000;color:#fff;font-size:15px;font-weight:400;line-height:150%}
.tbSty table td{padding:10px 0;border-bottom:1px solid #ccc;font-size:15px;color:#333;letter-spacing:-1px;line-height:150%}
.tbSty table td.lft{text-align:left}
.tbSty table td.fst{}
.tbSty table th.lat, .tbSty table td.lat{padding-right:10px;}
.tbSty table tr:nth-child(even) td{background:#ebebeb}
.moNum{display:none;}
.tbSty.response .selectArea2 label{display:none;}
.tbSty.response .selectArea2 input{width:21px;height:21px;}
input.inpR{width:18px;height:18px;}
@media all and (min-width:320px) and (max-width:767px) {
	.tbSty.response{text-align:left}
	.tbSty.response table{}
	.tbSty.response thead th{display:none;}
	.tbSty.response td{display:block;}
	.tbSty.response table tr:nth-child(even) td{background:#fff}
	.tbSty.response td.fst{position:absolute;left:-999em;width:0;margin-left:-999em;visibility:hidden;vertical-align:top;}
	.tbSty.response td.selectArea2{display:inline-block;float:left;width:20%;padding-bottom:20px;}
	.tbSty.response td.lft{position:relative;padding:10px 5px 10px 20px;border-top:1px solid #ccc;background:#ebebeb !important}
	.tbSty.response td .moNum{position:absolute;top:9px;left:7px;}
	.tbSty.response .selectArea2 label{display:inline-block;visibility:visible;width:auto;height:auto;font-size:12px;letter-spacing:-1.5px}

	input[type="radio"], input.inpR{width:auto;height:auto;}
	.moNum{display:inline-block;height:100%;vertical-align:top}
}

/* =========== 진단 인성검사 ul =========== */
.tbLst{}
.tbLst .tit{height:50px;padding:0 10px;box-sizing:border-box;background:#000;color:#fff;line-height:1.3;font-size:14px;overflow:hidden;text-align:center}
.tbLst .tit p{display:table;float:left;height:50px;text-align:center;}
.tbLst .tit .tt1{width:5%;}
.tbLst .tit .tt2{width:55%;}
.tbLst .tit .tt3{width:8%;}
.tbLst .tit .tt4{width:8%;}
.tbLst .tit .tt5{width:8%;}
.tbLst .tit .tt6{width:8%;}
.tbLst .tit .tt7{width:8%;}
.tbLst .tit span{display:table-cell;width:100%;height:50px;text-align:center;vertical-align:middle;}
.tbLst .Lcont > li{width:100%;padding:10px 5px;border-bottom:1px solid #ccc;overflow:hidden;text-align:center;box-sizing:border-box;}
.tbLst .Lcont > li:nth-child(even){background:#ebebeb}
.tbLst .Lcont li span{display:block;float:left;}
.tbLst .Lcont li .qsArea{float:left;width:60%;}
.tbLst .Lcont li .numb{width:5%;padding-left:5px;box-sizing:border-box;}
.tbLst .Lcont li .tCon{width:95%;padding:0 8px 0 5px;font-size:13px;text-align:left;box-sizing:border-box;}
.tbLst .Lcont li .selectArea{float:left;width:40%;padding-right:0;box-sizing:border-box;}
.tbLst .Lcont li .selectArea ul{float:left;width:100%;}
.tbLst .Lcont li .selectArea ul li{float:left;width:20%;}
.tbLst .Lcont li .selectArea ul li label{display:none;}
.tbLst .Lcont li .selectArea {}
.tbLst .Lcont li .selectArea input[type="radio"]{width:18px;height:18px;}

@media all and (min-width:320px) and (max-width:767px) {
	.tbLst{border-top:1px solid #ddd;}
	.tbLst .tit{display:none;}
	.tbLst .Lcont > li{padding:0;}
	.tbLst .Lcont > li:nth-child(even){background:none}
	.tbLst .Lcont li .qsArea{float:none;width:100%;padding:10px;box-sizing:border-box;background:#ebebeb}
	.tbLst .Lcont li .qn{width:5%;padding-left:0;text-align:left}
	.tbLst .Lcont li .qs{float:none;width:95%;padding-left:5%;padding-right:0;text-align:left}
	.tbLst .Lcont li .selectArea{padding:10px 0 20px 0;}
	.tbLst .Lcont li .selectArea ul li label{display:inline-block;padding-left:1px;font-size:12px;letter-spacing:-1.2px}
	.tbLst .Lcont li .selectArea{width:100%;}
}
@media all and (max-width:320px){
	.tbLst .Lcont li .selectArea ul li label{display:inline-block;padding-left:0;font-size:11px;letter-spacing:-2.2px}
}

/* =========== 진단 적성검사 =========== */
.examArea{margin-top:40px;}
.exam{margin-bottom:40px;font-size:15px;}
.exam .qsArea{padding-bottom:13px;}
.exam .qsArea span{display:inline-block;}
.exam .qsArea .qn{font-size:16px; font-weight:bold; padding-right:5px;}
.exam .qsArea ~ .descBox{margin-top:3px;}
.descBox{margin-bottom:25px;padding:18px 20px;border:1px solid #ccc;}
.descBox span{display:block;margin-top:15px;}
.descBox span:first-child{margin-top:0;}
.descBox.v2{text-align:center}
.exam .selectArea{padding:0 20px;}
.exam .selectArea ul{overflow:hidden;}
.exam .selectArea ul li{margin-top:6px;}
.exam .selectArea ul li:first-child{margin-top:0;}
.exam .selectArea ul li input{margin-right:5px;}
.exam .selectArea.v2 ul{overflow:hidden;}
.exam .selectArea.v2 ul li{float:left;width:25%;margin-top:0;}

.exam .selectArea.n2 ul li{float:left;width:50%;margin-top:0;}
.exam .selectArea.n3 ul li{float:left;width:33.33%;margin-top:0;}
.exam .selectArea.n4 ul li{float:left;width:25%;margin-top:0;}
.exam .selectArea.n5 ul li{float:left;width:20%;margin-top:0;}


.examSection{margin-bottom:44px;}
.examSection .titH{margin-bottom:27px;font-weight:700}
.examSection .titH .qn{font-size:16px; font-weight:bold; padding-right:5px;}
.examSection .exam{margin-bottom:30px;}

/* .guideSection .exam{margin-top:34px;} */
@media all and (min-width:320px) and (max-width:767px) {
	.exam ul{padding:0;}
	.exam .selectArea ul li{float:none !important;width:100% !important;}
}

/* =========== 퀵메뉴 ============= */
.scrollToTop.mo{display:none;}
.quickMenu{position:fixed;top:150px;left:50%;margin-left:520px;width:88px;}
.quickMenu .quick{margin-bottom:2px;padding-left:8px;height:155px;font-size:13px;color:#1561ae;background:url(./img/quick_bg.png) no-repeat 0 0;text-align:center}
.quickMenu .quick span{display:block;font-weight:bold}
.quickMenu .quick .tx{padding:10px 0 10px;}
.quickMenu .quick .time{padding-top:30px;font-size:16px;background:url(./img/quick_time.png) no-repeat 50% 0;}
.quickMenu .quick .btnSave{display:block;width:62px;height:25px;margin:10px auto 0;background:url(./img/btnSave.png) no-repeat 0 0;}
.quickMenu .scrollToTop{display:none;width:80px;height:40px;padding-left:8px;}
.quickMenu .scrollToTop a{display:block;height:100%;background:url(./img/quick_top.jpg) no-repeat 0 0;}
@media all and (min-width:320px) and (max-width:767px) {
	.quickMenu{display:none;}
}

/* =========== 진단 종료 =========== */
.endPage{margin:120px 0 60px;}
.endPage .ntImgArea{padding:60px 40px;background:#FFF;border:1px solid #CCC;}
.end_tit{font-size:30px; color:#ec630e; font-weight:bold; text-align:center; line-height:2;}
.end_txt{font-size:24px; font-weight:bold; text-align:center;}
.endPage .btnArea a{width:165px;}

@media all and (min-width:320px) and (max-width:767px) {
	.endPage{margin:0 0 60px;}
	.end_tit{font-size:30px; color:#ec630e; font-weight:bold; text-align:center; line-height:1.2; margin-bottom:10px;}
	.end_txt{font-size:24px; font-weight:bold; text-align:center;}
}
