@charset "utf-8";
@import url("fonts.css");
/* reset ==================*/
html,body{width:100%; height:100%; padding:0;margin:0; font-family:"NotoKR-Regular", "Arial", "Dotum", DotumChe, 돋움, 돋움체; font-size:16px; letter-spacing:-1px; -webkit-text-size-adjust:none; color:#333;}
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button,img,a,iframe,span,table,th,td{margin:0;padding:0}
fieldset,img{border:0 none; vertical-align: top;}
img {display:block;}
dl,ul,ol,menu,li{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none}
p{word-wrap:break-word;word-break:keep-all;}
a, a:hover, a:focus{text-decoration:none; color:#333333;}
input,select,textarea,button {vertical-align:middle;box-sizing:border-box;}
input[type=text]{color:#444; font-size:14px; border:1px solid #9c9c9c;}
button{border:0 none;border-radius:0;background-color:transparent;cursor:pointer}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
caption{height: 0;padding: 0;font-size: 0;text-indent: -9999px;}
table{clear:both;border-collapse:collapse;border-spacing:0px;border:0;}
:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
h1,h2,h3,h4,h5,h6 {font-weight: normal;}
/* a ======================*/
a {color: #333; text-decoration: none;}
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover {  text-decoration: none; }
a:active {  text-decoration: none; }
a:focus { text-decoration: none; }
select, input, textarea { font-size: 100%;vertical-align: middle ; font-family:"NotoKR-Regular", "맑은 고딕",  "돋음", dotum, sans-serif, Tahoma;}
input {margin: 0;padding: 0;outline: none;}
ol, ul {list-style: none;}
label {vertical-align:middle;}
legend, caption {position:relative; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; text-indent:-9999px;}
img {vertical-align: middle;image-rendering: -webkit-optimize-contrast;}

/* Form요소 기본설정 */
button {cursor: pointer; border: 0}
button,input {overflow: visible}
button,select {text-transform: none}
button,[type="button"],[type="reset"],[type="submit"] {-webkit-appearance: button}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
}
input, textarea, select, button{font-size:1rem; font-family: 'NotoKR-Regular', "맑은 고딕",  "돋음", dotum, sans-serif, Tahoma; color:#333;}
input:disabled, select:disabled { background-color:#ddd; }
input, select{vertical-align: middle; color:#666;}
select {
    border:1px solid #ccc;
    -webkit-appearance:none; /* 크롬 화살표 없애기 */
    -moz-appearance:none; /* 파이어폭스 화살표 없애기 */
    appearance:none; /* 화살표 없애기 */
    background: #fff url('../../images/select-arrow-down.png') no-repeat center right 10px;
    height: 40px;
    padding: 0 40px 0 10px;
    box-sizing: border-box;
    font-size: 1rem;
    letter-spacing: -1px;
}
select:focus {outline: 1px solid;/* outline: none;*//*border-color: #44465c*/}
select::-ms-expand {display: none;            /* 화살표 없애기 for IE10, 11*/}

input[type=radio], input[type=checkbox] {border:0px;vertical-align: middle;box-sizing: border-box;padding: 0}
input[type=button] {padding:0 10px;}
input[type=text], input[type=password] {height:40px;padding:0 10px;border:1px solid #cccccc;vertical-align:middle;background-color:#fff; box-sizing:border-box;
    -webkit-appearance:none;
    -moz-appearance:none;
    -o-appearance:none;
    font-size: 1rem;
}
input[type="radio"] {position: relative; /*-webkit-appearance: none;-moz-appearance: none; appearance: none; */background-color: #fff; cursor: pointer; outline: 0; width: 17px; height: 17px; vertical-align: middle;}
input[type="checkbox"] {position: relative; /*-webkit-appearance: none;-moz-appearance: none; appearance: none; */background-color: #fff; cursor: pointer; outline: 0; width: 17px; height: 17px; vertical-align: middle;}
/* input[type="checkbox"]::before {content: ''; display: block; width: 100%; height: 100%; border: 1px solid #ccc; position: absolute; top: 0; left: 0;}
input[type="checkbox"]::after {content: ''; border: solid #333; border-width: 0 2px 2px 0; display: none; width: 30%; height: 50%; left: 40%; position: absolute; top: 15%; transform: rotate(45deg); } */
input[type="checkbox"]:checked {background: #fff;}
/* input[type="checkbox"]:checked::after {display: block;} */

.radio > span {vertical-align: middle; margin-left: 3px;}
.radio {margin-right: 10px;}

[hidden] {display: none}
input::-ms-clear { display: none}

:disabled,
input:disabled,
[disabled],
input[disabled],
input[readonly] {background-color: #f3f3f3 !important; color: #6c6d73; border-color: #ccc !important}
input.disabled {background-color: #f3f3f3 !important; color: #6c6d73; border-color: #ccc !important}

button {vertical-align:middle; cursor:pointer;outline: none;}
button:focus {outline: 1px dotted #111 !important;}

textarea {border: 1px solid #ccc; padding: 10px; resize: none; vertical-align: middle; box-sizing: border-box;}
textarea::placeholder {}
textarea:-ms-input-placeholder {}
textarea::-ms-input-placeholder {}

input:focus,
select:focus,
textarea:focus {outline: 1px dotted #111;}

::placeholder {color: #666;opacity: 1}
:-ms-input-placeholder {color: #6c6d73}
::-ms-input-placeholder { color: #6c6d73}

/* float ==================*/
.fl {float:left !important;}
.fr {float:right !important;}
.fn {float:none !important;}
.clear{clear:both}
.clearBox:after,
.clearFix:after {content:""; display: block; clear: both;}

.hid, .hidden {position: absolute;width: 0;height: 0;visibility: hidden;font-size: 0;line-height: 0; top:-9999px}
.ir-hid{position: absolute; overflow: hidden; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0,0,0,0);}
/* 정렬 ==================*/
/* align */
.tal{text-align:left !important;}
.tac{text-align:center !important;}
.tar{text-align:right !important;}

.vat {vertical-align: top !important;}
.vam {vertical-align: middle !important;}
.vab {vertical-align: bottom !important;}

.inline {display:inline-block;}
.block {display:block;}
.block:after,
.inline:after {content:""; display:block; clear:both;}

/* border ====================*/
.bdn {border:none;}


/* margin ====================*/
.ml0 {margin-left:0px !important;}
.ml3{margin-left:3px !important; }
.ml5{margin-left:5px !important; }
.ml10{margin-left:10px !important; }
.ml15{margin-left:15px !important; }
.ml20{margin-left:20px !important; }
.ml50{margin-left:50px !important; }

.mr3{margin-right:3px !important; }
.mr5{margin-right:5px !important; }
.mr8{margin-right:8px !important; }
.mr10{margin-right:10px !important; }
.mr15{margin-right:15px !important; }
.mr17{margin-right:17px !important; }
.mr20{margin-right:20px !important; }
.mr30{margin-right:30px !important; }
.mr40{margin-right:40px !important; }

.mt3{margin-top:3px !important; }
.mt5{margin-top:5px !important; }
.mt10{margin-top:10px !important; }
.mt15{margin-top:15px !important; }
.mt16{margin-top:16px !important; }
.mt20{margin-top:20px !important; }
.mt25{margin-top:25px !important; }
.mt30{margin-top:30px !important; }
.mt40{margin-top:40px !important; }
.mt45{margin-top:45px !important; }
.mt50{margin-top:50px !important; }
.mt70{margin-top:70px !important; }
.mt90{margin-top:90px !important; }
.mt120{margin-top:120px !important; }
.mt150{margin-top:150px !important; }

.mb5{margin-bottom:5px !important; }
.mb7{margin-bottom:7px!important; }
.mb10{margin-bottom:10px !important; }
.mb15{margin-bottom:15px !important; }
.mb20{margin-bottom:20px !important; }
.mb35{margin-bottom:35px !important; }
.mb40{margin-bottom:40px !important; }
.mb50{margin-bottom:5% !important }
.mb65{margin-bottom:65px !important; }
.mb80{margin-bottom:80px !important; }

/* padding ====================*/
.pd0{padding:0 !important}
.pd5 {padding:5px !important}
.pd10 {padding:10px !important}
.pd20 {padding: 20px !important;}
.pd25 {padding: 25px !important;}
.pd30 {padding: 30px !important;}
.pd35 {padding: 35px !important;}
.pd40 {padding: 40px !important;}
.pd50 {padding:50px !important}

.pdtb5{padding:5px 0px !important}
.pdtb50{padding:50px 0px !important}

.pdl5{padding-left:5px !important; }
.pdl7{padding-left:7px !important; }
.pdl10{padding-left:10px !important; }
.pdl12{padding-left:12px !important; }
.pdl15{padding-left:15px !important; }
.pdl20{padding-left:20px !important; }
.pdl24{padding-left:24px !important; }
.pdl30{padding-left:30px !important; }
.pdl100{padding-left:100px !important; }

.pdt3{padding-top:3px !important;}
.pdt5{padding-top:5px !important;}
.pdt7{padding-top:7px !important;}
.pdt10{padding-top:10px !important;}
.pdt14{padding-top:14px !important;}
.pdt20{padding-top:20px !important;}
.pdt50{padding-top:50px !important;}

.pdr3{padding-right:3px !important;}
.pdr5{padding-right:5px !important;}
.pdr10{padding-right:10px !important;}
.pdr15{padding-right:15px !important;}
.pdr25{padding-right:25px !important;}

.pdb3{padding-bottom:3px !important;}
.pdb5{padding-bottom:5px !important;}
.pdb9{padding-bottom:9px !important;}
.pdb50{padding-bottom:5% !important;}
.pdb10{padding-bottom:1% !important;}
.pdb20{padding-bottom:2% !important;}
.pdb30{padding-bottom:3% !important;}


/* 컬러박스 ====================*/
#cboxOverlay {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 9999; overflow: hidden; background:#444;}
#colorbox {overflow: hidden; outline: 0; box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; opacity: 1; z-index: 9999; box-shadow:0px 0 11px 0px #000;}
#cboxContent {padding-top:50px; box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box;}
/* 타이틀 */
#cboxTitle {position:absolute; left:0; top:0; right:0; height:50px; line-height:50px; padding-left:10px; text-align:left; font-size:20px; background:#01b552; color:#fff; box-sizing: content-box; z-index: 1;}
#cboxLoadedContent  {margin:0;}
#cboxLoadedContent .cboxIframe {width: 100%; height: 100%; display: block; border: 0; padding: 0; margin: 0; background:#fff; box-sizing: content-box;}
#cboxClose {position:absolute; top:14px; right:10px; overflow: visible; width:25px; height:25px; background:url("../../images/pop-icon.png") no-repeat  5px 5px; z-index: 1; text-indent:-9999px; cursor: pointer;}
#cboxClose:hover {background:url("../../images/pop-icon.png") no-repeat  5px 5px;}

/* text overflow  ====================*/
.ellipsis {overflow: hidden;display: inline-block;max-width: 100%;white-space: nowrap;text-overflow: ellipsis}
.ellipsis-line2 {display: inline-block;max-height: 40px;line-height: 1.5;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}
.ellipsis-line3 {
    display: inline-block;
    max-height: 65px;
    line-height: 1.5;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden
}
.ellipsis-line4 {
    display: inline-block;
    max-height: 80px;
    line-height: 1.5;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden
}

/*==================넓이, 높이 시작======================*/
.w10pc {width: 10% !important}
.w20pc {width: 20% !important}
.w25pc {width: 25% !important}
.w30pc {width: 30% !important}
.w33pc {width: 33% !important}
.w34pc {width: 34% !important}
.w40pc {width: 40% !important}
.w44pc {width: 44% !important}
.w45pc {width: 45% !important}
.w50pc {width: 50% !important}
.w60pc {width: 60% !important}
.w70pc {width: 70% !important}
.w75pc {width: 75% !important}
.w80pc {width: 80% !important}
.w90pc {width: 90% !important}
.w100pc {width: 100% !important}

.w20px {width: 20px !important}
.w30px {width: 30px !important}
.w40px {width: 40px !important}
.w50px {width: 50px !important}
.w60px {width: 60px !important}
.w65px {width: 65px !important}
.w70px {width: 70px !important}
.w73px {width: 73px !important}
.w75px {width: 75px !important}
.w80px {width: 80px !important}
.w85px {width: 85px !important}
.w90px {width: 90px !important}
.w95px {width: 95px !important}
.w100px {width: 100px !important}
.w110px {width: 110px !important}
.w115px {width: 115px !important}
.w120px {width: 120px !important}
.w124px {width: 124px !important}
.w125px {width: 125px !important}
.w130px {width: 130px !important}
.w135px {width: 135px !important}
.w140px {width: 140px !important}
.w143px {width: 143px !important}
.w145px {width: 145px !important}
.w150px {width: 150px !important}
.w155px {width: 155px !important}
.w160px {width: 160px !important}
.w165px {width: 165px !important}
.w170px {width: 170px !important}
.w180px {width: 180px !important}
.w185px {width: 185px !important}
.w190px {width: 190px !important}
.w200px {width: 200px !important}
.w205px {width: 205px !important}
.w210px {width: 210px !important}
.w220px {width: 220px !important}
.w230px {width: 230px !important}
.w240px {width: 240px !important}
.w250px {width: 250px !important}
.w255px {width: 255px !important}
.w260px {width: 260px !important}
.w270px {width: 270px !important}
.w280px {width: 280px !important}
.w285px {width: 285px !important}
.w290px {width: 290px !important}
.w295px {width: 295px !important}
.w300px {width: 300px !important}
.w310px {width: 310px !important}
.w320px {width: 320px !important}
.w325px {width: 325px !important}
.w327px {width: 327px !important}
.w330px {width: 330px !important}
.w335px {width: 335px !important}
.w340px {width: 340px !important}
.w350px {width: 350px !important}
.w360px {width: 360px !important}
.w365px {width: 365px !important}
.w370px {width: 370px !important}
.w375px {width: 375px !important}
.w380px {width: 380px !important}
.w390px {width: 390px !important}
.w400px {width: 400px !important}
.w405px {width: 405px !important}
.w410px {width: 410px !important}
.w420px {width: 420px !important}
.w430px {width: 430px !important}
.w440px {width: 440px !important}
.w445px {width: 445px !important}
.w450px {width: 450px !important}
.w455px {width: 455px !important}
.w460px {width: 460px !important}
.w470px {width: 470px !important}
.w480px {width: 480px !important}
.w490px {width: 490px !important}
.w495px {width: 495px !important}
.w500px {width: 500px !important}
.w510px {width: 510px !important}
.w520px {width: 520px !important}
.w530px {width: 530px !important}
.w540px {width: 540px !important}
.w550px {width: 550px !important}
.w560px {width: 560px !important}
.w595px {width: 595px !important}
.w570px {width: 570px !important}
.w580px {width: 580px !important}
.w586px {width: 586px !important}
.w590px {width: 590px !important}
.w595px {width: 595px !important}
.w600px {width: 600px !important}
.w610px {width: 610px !important}
.w620px {width: 620px !important}
.w630px {width: 630px !important}
.w635px {width: 635px !important}
.w640px {width: 640px !important}
.w650px {width: 650px !important}
.w660px {width: 660px !important}
.w670px {width: 670px !important}
.w680px {width: 680px !important}
.w690px {width: 690px !important}
.w700px {width: 700px !important}
.w720px {width: 720px !important}
.w725px {width: 725px !important}
.w730px {width: 730px !important}
.w740px {width: 740px !important}
.w750px {width: 750px !important}
.w760px {width: 760px !important}
.w765px {width: 765px !important}
.w794px {width: 794px !important}
.w800px {width: 800px !important}
.w820px {width: 820px !important}
.w860px {width: 860px !important}
.w870px {width: 870px !important}
.w880px {width: 880px !important}
.w885px {width: 885px !important}
.w890px {width: 890px !important}
.w900px {width: 900px !important}
.w920px {width: 920px !important}
.w950px {width: 950px !important}

.h100pc {height: 100% !important}
.h20px {height: 20px !important}
.h25px {height: 25px !important}
.h32px {height: 32px !important}
.h36px {height: 36px !important}
.h40px {height: 40px !important}
.h50px {height: 50px !important}
.h60px {height: 60px !important}
.h80px {height: 80px !important}
.h100px {height: 100px !important}
.h101px {height: 101px !important}
.h110px {height: 110px !important}
.h111px {height: 111px !important}
.h120px {height: 120px !important}
.h140px {height: 140px !important}
.h150px {height: 150px !important}
.h151px {height: 151px !important}
.h160px {height: 160px !important}
.h170px {height: 170px !important}
.h180px {height: 180px !important}
.h200px {height: 200px !important}
.h210px {height: 210px !important}
.h211px {height: 211px !important}
.h215px {height: 215px !important}
.h220px {height: 220px !important}
.h222px {height: 222px !important}
.h240px {height: 240px !important}
.h250px {height: 250px !important}
.h270px {height: 270px !important}
.h295px {height: 295px !important}
.h300px {height: 300px !important}
.h320px {height: 320px !important}
.h330px {height: 330px !important}
.h360px {height: 360px !important}
.h380px {height: 380px !important}
.h425px {height: 425px !important}
.h450px {height: 450px !important}
.h500px {height: 500px !important}
.h-auto {height: auto !important}

@media(max-width:767px) {
    .m-w10pc {width: 10% !important}
    .m-w15pc {width: 15% !important}
    .m-w20pc {width: 20% !important}
    .m-w25pc {width: 25% !important}
    .m-w30pc {width: 30% !important}
    .m-w35pc {width: 35% !important}
    .m-w40pc {width: 40% !important}
    .m-w45pc {width: 45% !important}
    .m-w50pc {width: 50% !important}
    .m-w55pc {width: 55% !important}
    .m-w60pc {width: 60% !important}
    .m-w65pc {width: 65% !important}
    .m-w70pc {width: 70% !important}
    .m-w75pc {width: 75% !important}
    .m-w80pc {width: 80% !important}
    .m-w85pc {width: 85% !important}
    .m-w90pc {width: 90% !important}
    .m-w100pc {width: 100% !important}
    .m-pl00 {padding-left: 0 !important}
}

.pc-v {display: block !important}
.mobile-v {display: none !important}
.mobile-block {display: inline-block !important}

@media(max-width:767px) {
    .pc-v {display: none !important}
    .mobile-v {display: block !important}
    .mobile-block {display: block !important}
    .mobile-block + .mobile-block {margin-top: 5px} 
}