﻿@charset "UTF-8";
html,body{background-color:#fff;}
.body-skin-st01{background:url(/assets/images/body_back.png)right -130px top -20px no-repeat; background-size:contain;}
.body-skin-st02{background:#F5F5F5;}

/**font-color**/
.point1{color:#000 !important;}
.point2{color:#0078FF !important;}

/**bg-color**/
.bg-point1{background-color:#0078FF !important;}
.bg-point2{background-color:#000 !important;}

/** margin-type**/
.mt-10{margin-top:10px !important;}
.mt-15{margin-top:15px !important;}
.mt-20{margin-top:20px !important;}
.mt-25{margin-top:25px !important;}
.mt-30{margin-top:30px !important;}
.mt-35{margin-top:35px !important;}
.mt-40{margin-top:40px !important;}
.mt-50{margin-top:50px !important;}
.mt-60{margin-top:60px !important;}
.mt-70{margin-top:70px !important;}
.mt-80{margin-top:80px !important;}
.mt-1{margin-top:-1px !important;}
.ml-1{margin-left:-1px !important;}
.ml-10{margin-left:10px !important;}
.ml-20{margin-left:20px !important;}
.ml-30{margin-left:30px !important;}

/** padding-type**/
.pd-0{padding:0 !important;}
.pd-20{padding:20px !important;}
.pd-side40{padding:0 40px !important;}

/** text-type **/
.fw-300{font-weight:300 !important;}
.fw-400{font-weight:400 !important;}
.fw-500{font-weight:500 !important;}
.fw-700{font-weight:700 !important;}

.t-small{font-size:13px !important;}
.t-line{text-decoration: underline;}

/** width-type **/
.w-120{width:120px !important;}
.w-140{width:140px !important;}
.w-150{width:150px !important;}
.w-160{width:160px !important;}
.w-180{width:180px !important;}
.w-200{width:200px !important;}
.w-240{width:240px !important;}
.w-280{width:280px !important;}
.w-320{width:320px !important;}
.w-340{width:340px !important;}
.w-400{width:400px !important;}
.w-460{width:460px !important;}
.w-480{width:480px !important;}
.w-520{width:520px !important;}
.w-600{width:600px !important;}
.w-700{width:700px !important;}
.w-800{width:800px !important;}
.w-1200{width:1200px !important;}
.w-50{width:50% !important;}

/** button-type **/
button{border:0 none;background-color:transparent;}
input:focus{outline:#999 dotted 1px;}

.btn-basic[class*='bg-']{color:#fff;}
[class^="btn"]{background-repeat:no-repeat;background-position:center;display:inline-flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;text-decoration:none;box-sizing:border-box;-webkit-appearance:none;transition:border 0.4s;border-radius:10px;}
[class^="btn"]{transition:background-color 0.3s;}
[class^="btn"].md{width:230px;height:60px;border-radius:10px;}
[class^="btn"].full{width:100%;height:70px;font-size:16px;font-weight:500;line-height:1.2;}
[class^="btn"].ic{padding:0 20px 0 55px;height:50px;min-width:140px;border-radius:10px;font-size:14px;background-position:left 24px center;}
[class^="btn"].ic span{margin-top:5px;}
[class^="btn"].primary{border:1px solid #ddd;background:#fff;transition:border-color 0.4s;}
[class^="btn"].secondary{border:1px solid #eee;color:#999;transition:background 0.4s;}
[class^="btn"].tertiary{border:1px solid #eee;color:#000;transition:border-color 0.4s;}
[class^="btn"].primary:hover{border-color:#666 !important;}
[class^="btn"].secondary:hover{background-color:rgba(0,0,0,0.03) !important;}
[class^="btn"].tertiary:hover{background-color:rgba(0,0,0,0.03) !important;}
[class^="btn"].quaternary:hover{background-color:rgba(7,27,59,0.1);}
[class^="btn"].bg-point1:hover{background:#2FA9D9 !important;}
[class^="btn"].bg-point4:hover{opacity:0.9;}
.btn-box{width:100%;box-sizing:border-box;position:relative;}
.btn-box [class^="btn"]{margin: 0 10px;}
.btn-box.ic-group{width:auto;margin-right:-5px;}
.btn-box.ic-group .btn{margin:0 5px;}
.bg-point2:hover {background-color:rgba(0,0,0,0.8) !important;}
.btn-half button + button {margin-left:20px;}

/** ico **/
[class^="ic"]{display:inline-block;background-repeat:no-repeat;background-position:center;background-size:100%;vertical-align:middle;}
.ic-result{width:20px;height:18px;background-image:url(/assets/images/ic_result.png);background-size:20px auto;}
.ic-review{width:20px;height:18px;background-image:url(/assets/images/ic_commentary.png);background-size:20px auto;}
.ic-view{width:20px;height:18px;background-image:url(/assets/images/ic_test_view.png);background-size:20px auto;}
.ic-link{width:20px;height:18px;background-image:url(/assets/images/ic_test_link.png);background-size:20px auto;}
.ic-notice{width:20px;height:20px;background-image:url(/assets/images/ic_notice.png);background-size:20px auto;}
.ic-dvr{width:22px;height:18px;background-image:url(/assets/images/ic_dvr.png);background-size:22px auto;}
.ic-submit{width:21px;height:20px;background-image:url(/assets/images/ic_submit.png);background-size:21px auto;}
.ic-timer{width:18px;height:20px;background-image:url(/assets/images/ic_timer.png);background-size:18px auto;}
.ic-question{width:20px;height:15px;background-image:url(/assets/images/ic_question.png);background-size:20px auto;}
.ic-save{background-image:url(/assets/images/ic_save.png);}
.ic-delete{background-image:url(/assets/images/ic_delete.png);}
.ic-setting{background-image:url(/assets/images/ic_settings.png);}

/** align-type **/
.ta-center{text-align:center;}
.ta-left{text-align:left;}
.ta-right{text-align:right;}
.flex{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; }
.flex1{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap:wrap;}
.flex2{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flex3{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
.flex4{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-end; -ms-flex-align:flex-end; align-items:flex-end; -webkit-justify-content: center; justify-content: center;}
.flex5{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-start; -ms-flex-align:flex-start; align-items:flex-start;}
.flex6{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-end; -ms-flex-align:flex-end; align-items:flex-end;}
.ellipsis{text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
hr{margin:0;border:0;width:100%;}

/** alert-type **/
.sm-info{font-size:14px;line-height:22px;color:#747983;margin-top:10px;padding-left:10px;text-indent:-10px;}

/** form **/
input{border: 0 none;width:100%;height:100%;vertical-align:middle;padding:0;font-size:1rem;color:#333;box-sizing:border-box;-webkit-appearance: none;-moz-appearance: none; background: transparent;-webkit-border-radius: 0;box-shadow: none !important;}
input:disabled {background:#e1e4e8;opacity:0.7;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset;}
input[type="radio"]{width:0;height:0;vertical-align:top;overflow:hidden;}
textarea, select{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none !important;}
select::-ms-expand {display:none}

/** forms **/
.input-box{position:relative;display:inline-block;}
.input-box label{display:block;position:relative;font-size:14px;font-weight:500;margin-bottom:12px;line-height:1;}
.input-box input{padding:15px 24px;height:70px;line-height:1;border:1px solid #eee;transition:border 0.2s;background-color:#fff;position:relative;font-size:15px;font-weight:300;border-radius:10px;}
.input-box input::-webkit-input-placeholder {color:#999;}
.input-box input::-moz-placeholder {color:#999;}
.input-box input:-ms-input-placeholder {color:#999;}
.input-box input:-moz-placeholder {color:#999;}
.input-box input::placeholder {color:#999;}
.input-box.file label{position:absolute;width:100%;height:100%;top:0;left:0;text-indent:-9999px;overflow:hidden;}
.input-box.file input{background-color:#fff;border-color:#d8dadd;text-align:left;}
.input-box.file input::-webkit-input-placeholder {color:#ADB2bb;}
.input-box.file input::-moz-placeholder {color:#ADB2bb;}
.input-box.file input:-ms-input-placeholder {color:#ADB2bb;}
.input-box.file input:-moz-placeholder {color:#ADB2bb;}
.input-box.file input::placeholder {color:#ADB2bb;}
.input-box.file label{top:50%;margin-top:-17px;left:auto;right:9px;width:85px;text-indent:0;text-align:center;height:34px;line-height:32px;border:1px solid #ddd;background-color:#F9F9F9;font-size:14px;z-index:2;}
.input-box.file input:focus{border-color:#609FF7;outline:none;z-index:1;}
.input-box.file .file-upload{top:0;left:0;}
.input-box.date input{background:url(/assets/images/ic-calendar.svg)17px center no-repeat;padding:15px 20px 15px 47px;}
.input-box.finder input{border-color:#fff;height:50px;font-size:15px;width:340px;margin-left:10px;}
.input-box input:focus{border-color:#006CFF;outline:none;z-index:1;}
.input-box.error input{border-color:#BE0000;z-index:2;}
.input-box.total input{border-color:#1766E5;color:#1766E5;}
.input-box.w-button input{padding-right:100px;box-sizing:border-box;}
.input-box.w-button button{position:absolute;top:50%;margin-top:-17px;right:9px;width:85px;text-indent:0;text-align:center;height:34px;line-height:32px;border:1px solid #ddd;background-color:#F9F9F9;font-size:14px;z-index:10;}
.input-block{position:relative;}
.input-block input:focus{border-color:#609FF7;outline:none;z-index:3;}
.noti{font-size:13px;font-weight:300;line-height:1.2;color:#006CFF;margin-top:20px;padding-left:20px;background:url(/assets/images/ic_input_warning.png)left -1px no-repeat;}
.feedback{font-size:14px;color:#BE0000;margin-top:12px;}
.feedback i{vertical-align:-3px;margin-right:5px;}
.essential{display:inline-block;margin-left:5px;color:#BE0000;}

/** textarea **/
.textarea-box{display:block;width:100%;}
.textarea-box textarea{border:1px solid #ddd;padding:20px;width:100%;height:126px;;box-sizing:border-box;resize:none;transition:border 0.2s;font-size:15px;}
.textarea-box textarea::placeholder{color:#999;line-height:normal;font-size:15px;}
.textarea-box textarea:focus{outline:none;border-color:#609FF7;z-index:2;position:relative;}
.textarea-box.error textarea{border-color:#be0000;z-index:2;}
.textarea-box.v-2{position:relative;}
.textarea-box.v-2:after{content:'';position:absolute;width:30px;height:16px;bottom:-16px;left:15px;background:url(/assets/images/ic-ballon.svg)center center no-repeat;}
.textarea-box.v-2 textarea{height:250px !important;background-color:#071B3B;border-radius:12px;color:#fff;}
.textarea-box.v-2 textarea::placeholder{color:#fff;}
.textarea-box.v-2 .max-length{right:0 !important;bottom:-47px !important;}
.textarea-box.v-3 textarea{padding:0;height:50px;min-height:50px;padding:16px;line-height:1.2;}

/** checkbox **/
.form-label-group{margin-bottom:20px;}
.ac-label{display:block;position:relative;font-size:18px;font-weight:500;line-height:1;}
.ac-sub-label{display:block;position:relative;font-size:15px;font-weight:500;margin-top:12px;color:#555;}
.check-box{display:inline-block;position:relative;}
.check-box label{display:inline-block;position:relative;padding-left:34px;cursor:pointer;min-width:20px;min-height:20px;font-size:15px;margin-top:2px;}
.check-box label:before{content:'';position:absolute;top:1px;left:0;width:20px;height:20px;background:url(/assets/images/ic_check_off.png)no-repeat;}
.check-box input{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}
.check-box input:checked + label:before{background:url(/assets/images/ic_check_on.png)no-repeat;} 
.check-box input:disabled + label{color:#c4c7cd;}
.check-box.check-all{margin-top:-1px;}
.check-box.check-all label{background-color:#E7EDF4;border:1px solid #E7EDF4 !important;white-space:nowrap;}
.check-box.file label{background:url(/assets/images/ic-file.svg)no-repeat right 12px center;}
.check-box.type label{background:url(/assets/images/ic-type.svg)no-repeat right 12px center;}
.check-box.all label{background-color:#DEE5ED;height:50px;line-height:50px;padding:0 20px 0 60px;border-radius:10px;transition:background 0.3s;}
.check-box.all label:hover{background-color:#C7D5E6;}
.check-box.all label:before{top:13px;left:20px;}
.check-box.btn{width:100%;}
.check-box.btn label{padding:0;width:100%;height:60px;background-color:#EEE;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:500;color:#777;margin-top:0;transition:background-color 0.3s, color 0.3s;}
.check-box.btn label:hover{color:#000;}
.check-box.btn label:before{content:none;}
.check-box.btn input:checked + label{background-color:#32B6EA;color:#fff;}
.check-wrap .check-block{margin-right:54px;}
.check-wrap.v-2 .check-block{margin:0;flex-grow:1;}
.check-group .check-box{width:100%;}
.check-group .check-box label{border:1px solid #ddd;width:100%;padding:12px 20px 12px 64px;box-sizing:border-box;margin-top:0;}
.check-group .check-box label:before{top:50%;margin-top:-13px;left:12px;}
.check-group .check-box input:checked + label{background-color:#fff;}
.check-group .check-wrap{flex-grow:1;}
.check-group .check-wrap .check-block{margin-right:0;margin-left:-1px;}
.check-group.v-1 .check-wrap .check-block{margin-top:-1px;width:20%;}
.check-group.v-2 .check-wrap .check-box{min-width:150px;}
.check-group.v-3 .check-wrap .check-block{margin-top:10px;margin-left:10px;width:calc((100% - 60px) / 7);}
.check-group.v-3 .check-wrap .check-block:first-child{margin-left:0;}
.check-group.v-3 .check-wrap .check-block:nth-child(8n){margin-left:0;}
.check-group.v-3 .check-wrap .check-block:nth-child(-n+7){margin-top:0;}
.check-group.v-3 .check-wrap .check-box{min-width:auto;}
.check-group.v-3 .check-wrap .check-box label{font-size:13px;padding:12px 5px 12px 45px}

/** radiobox **/
.radio-box{display:inline-block;position:relative;}
.radio-box label{display:inline-block;font-size:15px;position:relative;padding-left:44px;cursor:pointer;}
.radio-box label:before{content:'';position:absolute;top:0px;left:0;width:24px;height:24px;border-radius:100%;box-sizing:border-box;background-color:#fff;border:1px solid #ddd;}
.radio-box label:after{content:'';position:absolute;width:12px;height:12px;border-radius:100%;left:6px;top:6px;}
.radio-box input{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}
.radio-box input[type="radio"]:checked + label:before{background:#fff;border:1px solid #32B6EA;}
.radio-box input[type="radio"]:checked + label:after{background-color:#32B6EA;}
.radio-wrap.flex .radio-block{margin-right:54px;}

/** select **/
.select-block{display:block;}
.select-block label{display:block;position:relative;font-size:16px;font-weight:700;margin-bottom:18px;line-height:1;}
.select-box{position:relative;}
.select-box:after{content:'';position:absolute;z-index:2;top:50%;margin-top:-4px;right:15px;width:12px;height:8px;background:url(/assets/images/ic_expand_more.png)no-repeat;}
.select-box select{width:100%;height:35px;padding:5px 40px 5px 14px;border:1px solid #ddd;transition:border 0.2s;position:relative;box-sizing:border-box;background:#fff;font-size:13px;border-radius:0;line-height:28px;}
.select-box.finder select{border-color:#fff;height:50px;font-size:15px;width:120px;padding:13px 40px 14px 24px;border-radius:10px;}
.select-box.lengthSelect select{width:150px;border-color:#ddd !important;height:50px;font-size:15px;padding:13px 40px 14px 64px !important;background:#fff url(/assets/images/ic-length.svg)15px center no-repeat !important;}
.select-box select:focus{border-color:#609FF7;outline:none;z-index:1;}
.select-box.error select{border-color:#BE0000;z-index:2;}

/** info txt*/
.info-msg{font-size:14px;color:#1766E5;}
.info-msg i{vertical-align:-3px;margin-right:5px;}

/** popup **/
.dim{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.6);opacity:0;transition:opacity 0.2s;}
.pop-wrap{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99;display:none;}
.pop-wrap *{font-size:15px;}
.pop-in{position:relative;width:100%;height:100%;max-width:100%;max-height:100%;overflow-y:auto;display:flex;align-items:center;justify-content:center;}
.pop-in .pop-cont{position:relative;z-index:3;max-height:90%;width:auto;min-width:540px;opacity:0;transition:opacity 0.2s;}
.pop-in .pop-header{position:relative;background:#071B3B;border-radius:15px 15px 0 0;height:70px;width:100%;box-sizing:border-box;z-index:4;padding:0 30px;}
.pop-in .pop-header span{font-size:20px;color:#fff;font-weight:500;}
.pop-in .pop-header .close{position:absolute;right:20px;top:50%;transform:translate(0,-52%);cursor:pointer}
.pop-in .pop-body{position:relative;background:#fff;z-index:3;border-radius:15px;}
.pop-wrap.active .dim{opacity:1;}
.pop-wrap.active .pop-in .pop-cont{opacity:1;transition:opacity 0.2s;}

/*pagination*/
.pagination-group{display:flex;align-items:center;justify-content:center;text-align:center;margin-top:38px;}
.pagination-group .paginate_button{display:inline-block;box-sizing:border-box;text-align:center;width:35px;height:35px;line-height:35px;position:relative;color:#999;font-size:15px;margin:0 5px;}
.pagination-group .paginate_button:hover{color:#32B6EA;}
.pagination-group .paginate_button.previous{border:1px solid #eee;background-color:#F9F9F9}
.pagination-group .paginate_button.previous:before{content:'';position: absolute;right: 10px;top: 50%;margin-top: -5px;border: solid #999;border-width: 0 1px 1px 0;display: inline-block;padding: 4px;transform: rotate(135deg);}
.pagination-group .paginate_button.next{border:1px solid #eee;background-color:#F9F9F9;}
.pagination-group .paginate_button.next:before{content:'';position: absolute;left: 10px;top: 50%;margin-top: -5px;border: solid #999;border-width: 0 1px 1px 0;display: inline-block;padding: 4px;transform: rotate(-45deg);}
.pagination-group .paginate_button.disabled{pointer-events: none;background-color:#fff;}
.pagination-group .paginate_button.disabled:before{background-color:#fff;}
.pagination-group .paginate_button.current{color:#32B6EA;font-weight:700;}

/*toast-pop*/
.toast-pop{position:fixed;top:30px;left:50%;padding:38px 28px;transform:translate(-50%, 10px);border-radius:10px;overflow:hidden;font-size:15px;opacity:0;visibility:hidden;transition: opacity .5s, visibility .5s, transform .5s;background: #071B3B;color: #fff;z-index: 10000;}
.toast-pop.v-2{position:static;display:inline-block;transform: translate(0,0) !important;left:0;top:0;}
.toast-pop > span{position:relative;padding-left:25px;display:block;}
.toast-pop > span:before{content:'';width:18px;height:18px;background:url(/assets/images/ic-pop-warning.svg)center center no-repeat;position:absolute;left:0;top:3px;}
.toast-pop.reveal {opacity: 1;visibility: visible;transform: translate(-50%, 0)}

[data-cont]{display:none;}
[data-cont].active{display:block;}
