@charset "utf-8";

/* FONTS */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR'); /*'Noto Sans KR', sans-serif;*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300;500;700&display=swap');/*'Noto Serif KR', serif;*/

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
} 

@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
}


@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
}


/* RESET */
*{margin:0; padding:0; font-family:'Noto Sans KR', sans-serif; -webkit-text-size-adjust:none; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
html, body{font-size:14px; font-weight:300; letter-spacing:-0.02em; line-height:1.3em; width:100%; max-width:640px; min-width:360px; height:100%; margin:0 auto; position:relative;}
html{-webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0);} /*mobile*/

a{text-decoration:none; outline:none; color:#000;}
fieldset, img{border:0;}
i, em, address{font-style:normal; font-weight:normal;}
ul, li, dl{list-style:none}
label{cursor:pointer;}
img{width:100%;}/*mobile*/
table{table-layout:fixed; border-collapse:collapse;}

.cf{} 
.cf:after{clear:both; content:''; display:block}

.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}


/* FORM STYLE */
textarea, input, select{-webkit-border-radius:0px; vertical-align:middle; outline:none; font-size:1em; line-height:18px; background-color:#fff;}
textarea{resize:none; padding:10px; border:1px solid #ddd;}
textarea[contenteditable]{-webkit-appearance:none}
input[type="text"], input[type="tel"], input[type="password"], input[type="email"]{border:1px solid #ddd; padding:7px; -webkit-appearance:none;}
input[type="checkbox"], input[type="radio"]{width:14px; height:14px; cursor:pointer; margin-top:-2px;}
input[type="button"], input[type="submit"], button{tap-highlight-color:transparent; border:0; outline:0; cursor:pointer;}
select{border:1px solid #ddd; padding:7px; padding-right:20px; appearance:none; -moz-appearance:none; -webkit-appearance:none; background:url(../img/common/select_arrow.png) no-repeat right center #fff;}
select::-ms-expand{display:none;}


/* TEXT STYLE */
.ellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.ellipsis_2{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;  line-height: 1.3em; height: 2.6em;}
.ellipsis_5{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; word-wrap:break-word;  line-height: 1.3em; height: 6.1em;}

.txt_center{text-align:center !important;}
.txt_left{text-align:left !important;}
.txt_right{text-align:right !important;}

.f_blue{color:#014099 !important}
.f_wgray{color:#9d9d9d !important}
.f_dgray{color:#606060 !important}
.f_org{color:#ff7200 !important}
.f_red{color:#e22126 !important}
.f_b_red{color:#e22126 !important;}
.f_dpink {color: #dd298e !important;}
.f_yellow{color:#ffea00 !important;}
.f_violet{color:#943690 !important;}


/* BUTTON STYLE */
.btn{box-sizing:border-box; padding:7px; display:inline-block; font-size:1em; line-height:18px;}
/*.btn:hover{opacity:0.8; transition-duration:0.3s;}*/

.btn.xsmall{font-size:13px; padding:3px 5px; font-weight:300;}
.btn.small{padding:7px 10px; font-weight:300;}
.btn.medium{padding:12px 50px; font-weight:300;}
.btn.full{padding:12px; width:100%; font-weight:300; text-align:center;}

.btn.blue{background:#014099; color:#fff;}
.btn.dblue{background:#00508d; color:#fff; border:1px solid #003d6b;}
.btn.green{background:#007e91; color:#fff; border:1px solid #006574;}
.btn.grey{background:#c9c9c9; color:#666;}
.btn.dgrey{background:#3f3f3f; color:#fff;}
.btn.orange{background:#ff840b; color:#fff;}
.btn.yellow{background:#ffc000; color:#fff;}
.btn.pink{background:#db2db8; color:#fff;}
.btn.black{background:#000; color:#fff;}
.btn.w_line{background:none; border:1px solid #fff; color:#fff;}
.btn.g_line{background:none; border:1px solid #e5e5e5; color:#666;}
.btn.dg_line{background:none; border:1px solid #666; color:#666;}
.btn.bk_line{background:none; border:1px solid #000; color:#000;}


/* PAGING */
.paging{text-align:center; margin-top:30px; position:relative;}
.paging ul{display:inline-block;}
.paging li{float:left; margin:0 2px; width:30px; height:30px; box-sizing:border-box;}
.paging li a{display:block; height:100%; background:#fff; border:1px solid #d7d7d7; line-height:28px; box-sizing:border-box; font-size:0.92em; color:#666;}
.paging li.on a{background:#21538f; border:1px solid #21538f; color:#fff; font-weight:400;}


/* PADDING */
.pt5 {padding-top:5px;}
.pt10 {padding-top:10px;}
.pt15 {padding-top:15px;}
.pt20 {padding-top:20px;}
.pt25 {padding-top:25px;}
.pt30 {padding-top:30px;}
.pt35 {padding-top:35px;}
.pt40 {padding-top:40px;}
.pt45 {padding-top:45px;}
.pt50 {padding-top:50px;}

.pr5 {padding-right:5px;}
.pr10 {padding-right:10px;}
.pr15 {padding-right:15px;}
.pr20 {padding-right:20px;}
.pr25 {padding-right:25px;}
.pr30 {padding-right:30px;}
.pr35 {padding-right:35px;}
.pr40 {padding-right:40px;}
.pr45 {padding-right:45px;}
.pr50 {padding-right:50px;}

.pb5 {padding-bottom:5px;}
.pb10 {padding-bottom:10px;}
.pb15 {padding-bottom:15px;}
.pb20 {padding-bottom:20px;}
.pb25 {padding-bottom:25px;}
.pb30 {padding-bottom:30px;}
.pb35 {padding-bottom:35px;}
.pb40 {padding-bottom:40px;}
.pb45 {padding-bottom:45px;}
.pb50 {padding-bottom:50px;}

.pl5 {padding-left:5px;}
.pl10 {padding-left:10px;}
.pl15 {padding-left:15px;}
.pl20 {padding-left:20px;}
.pl25 {padding-left:25px;}
.pl30 {padding-left:30px;}
.pl35 {padding-left:35px;}
.pl40 {padding-left:40px;}
.pl45 {padding-left:45px;}
.pl50 {padding-left:50px;}


/* MARGIN */
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt25 {margin-top:25px;}
.mt30 {margin-top:30px;}
.mt35 {margin-top:35px;}
.mt40 {margin-top:40px;}
.mt45 {margin-top:45px;}
.mt50 {margin-top:50px;}

.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr15 {margin-right:15px;}
.mr20 {margin-right:20px;}
.mr25 {margin-right:25px;}
.mr30 {margin-right:30px;}
.mr35 {margin-right:35px;}
.mr40 {margin-right:40px;}
.mr45 {margin-right:45px;}
.mr50 {margin-right:50px;}

.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb15 {margin-bottom:15px;}
.mb20 {margin-bottom:20px;}
.mb25 {margin-bottom:25px;}
.mb30 {margin-bottom:30px;}
.mb35 {margin-bottom:35px;}
.mb40 {margin-bottom:40px;}
.mb45 {margin-bottom:45px;}
.mb50 {margin-bottom:50px;}

.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml15 {margin-left:15px;}
.ml20 {margin-left:20px;}
.ml25 {margin-left:25px;}
.ml30 {margin-left:30px;}
.ml35 {margin-left:35px;}
.ml40 {margin-left:40px;}
.ml45 {margin-left:45px;}
.ml50 {margin-left:50px;}