@charset "utf-8";
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700');

/* Common */
body { overflow-y:scroll;}
body, div, dl, dt, dd, ul, ol, li, i, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, legend, button, select, p, blockquote, th, td, table { font-family: 'Noto Sans KR', 'Nanum Gothic', '맑은 고딕', 'Malgun Gothic', 'dotum', sans-serif !important; font-size:100%; padding:0; margin:0; word-break:keep-all; -webkit-text-size-adjust:none;/* 모바일에서 폰트크기 변형안되도록 함 */}
ol, ul, li { list-style:none; margin:0; padding:0;}
h1, h2, h3, h4, h5, h6 { font-weight:normal;}
form, fieldset, img { border:0; margin:0; padding:0;}
address, caption, small, em { font-weight:normal; font-style:normal;}
i { font-style:normal;}

/* Link */
a { text-decoration:none; outline:none; /* 링크클릭시 생기는 점선없애기*/}
a:link, a:visited { text-decoration:none;}
a:hover, a:active { text-decoration:none;}

/* Table */
table { border-spacing:0; padding:0; margin: 0; border-collapse:collapse; border:0; empty-cells:show;}
caption { display:none;}
tr, th, td { margin:0; padding:0;}

/* float 속성 초기화 */
.clear { clear:both; display:block; float: none; font-size:0 !important; height:0; line-height:0 !important; margin:0 !important; overflow:hidden; padding:0 !important; width:100%;}

/* 숨김영역 */
#accessibility_header, #accessibility_footer, .skip, hr, legend { position:absolute; width:0; height:0; font-size:0; line-height:0; overflow:hidden; visibility:hidden;}

/* ie6에서 이미지 공백 0으로 조절 */
img { border:0; margin:0; padding:0; vertical-align:top;}

/* button 초기화 */
button { border:0; background:none; text-align:left; cursor:pointer;}

/* 이미지 인풋등 세로중앙정렬 */
input, textarea, select, img { vertical-align:middle;}

/* sumit 네이티브 모양 숨기기 */
input[type="submit"] { appearance:none !important; -webkit-appearance:none; -ms-appearance:none; -moz-appearance:none;}

/* select 네이티브 모양 숨기기 */
select { appearance:none; -webkit-appearance:none; -ms-appearance:none; -moz-appearance:none;}
select::-ms-expand { display:none;}

/* 체크박스&라디오버튼 */
.checkbox-radio { display:inline-block; position:relative; padding:0 0 0 35px; margin:0 20px 0 0; line-height:23px; cursor:pointer; font-size:14px; color:#222; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; letter-spacing:-0.05em;}
.checkbox-radio input { position:absolute; opacity:0; cursor:pointer;}
.checkmark { position:absolute; top:0; left:0; height:23px; width:23px; background:#eee;}
.radiomark { position:absolute; top:0; left:0; height:23px; width:23px; background:#eee; border-radius:50%;}
.checkbox-radio:hover input ~ .checkmark,
.checkbox-radio:hover input ~ .radiomark { background:#ccc;}
.checkbox-radio input:checked ~ .checkmark,
.checkbox-radio input:checked ~ .radiomark { background:#ffe400;}
.checkmark:after,
.radiomark:after { content:""; position:absolute; display:none;}
.checkbox-radio input:checked ~ .checkmark:after,
.checkbox-radio input:checked ~ .radiomark:after { display:block;}
.checkbox-radio .checkmark:after { left:8px; top:4px; width:5px; height:10px; border:solid #222; border-width:0 3px 3px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform: rotate(45deg);}
.checkbox-radio .radiomark:after { top:9px; left:9px; width:8px; height:8px; border-radius:50%; background:#222;}

/* 문의폼 하단 개인정보취급방침 */
.common-privacy-check,
.quick-privacy-check { padding:15px 0 40px;}
.common-privacy-check .btn-privacy { display:inline-block; padding:0 7px; margin:0 0 0 15px; border:solid 1px #555; border-radius:3px; font-size:12px; color:#555; line-height:22px; letter-spacing:-0.05em; opacity:.8;}
.quick-privacy-check .btn-privacy { display:inline-block; padding:0 7px; margin:0 0 0 15px; border:solid 1px #fff; border-radius:3px; font-size:12px; color:#fff; line-height:22px; letter-spacing:-0.05em; opacity:.8;}

/* Paginate */
.paginate {text-align:center;}
.paginate * {margin:0; padding:0;}
.paginate img {border:0;}
.paginate a, .paginate strong {display:inline-block; margin:0 1px;  padding:2px 6px 3px 6px; color:#333; white-space:nowrap; text-decoration:none; font:bold 9pt tahoma; border:1px solid #E2E2E2; vertical-align:top;}
.paginate strong {color:#016fc1; border:1px solid #016fc1;}
.paginate a:hover {color:#016fc1; border:1px solid #016fc1;}
.paginate .arrow {padding-top:5px; margin-bottom:3px;}

/* display */
.disblock { display:block !important;}
.disnone { display:none !important;}
.disinline { display:inline !important;}

/* align */
.left { text-align:left !important;}
.center { text-align:center !important;}
.right { text-align:right !important;}

/* marginall */
.allc { margin:0 auto !important;}

/* vertical align */
.top { vertical-align:top !important;}
.middle { vertical-align:middle !important;}
.bottom { vertical-align:bottom !important;}

/* float */
.float-l { float:left !important;}
.float-r { float:right !important;}
.clear-b { clear:both !important;}
.clear-l { clear:left !important;}
.clear-r { clear:right !important;}

/* hidden */
.hidden { position:absolute; left:-9999px;}

/* font color */
.txt-white { color:#fff !important;}
.txt-block { color:#222 !important;}

/* Padding */
.pt0 {padding-top:0px !important;}
.pt1 {padding-top:1px !important;}
.pt2 {padding-top:2px !important;}
.pt3 {padding-top:3px !important;}
.pt4 {padding-top:4px !important;}
.pt5 {padding-top:5px !important;}
.pt6 {padding-top:6px !important;}
.pt7 {padding-top:7px !important;}
.pt8 {padding-top:8px !important;}
.pt9 {padding-top:9px !important;}
.pt10 {padding-top:10px !important;}
.pt12 {padding-top:12px !important;}
.pt15 {padding-top:15px !important;}
.pt16 {padding-top:16px !important;}
.pt20 {padding-top:20px !important;}
.pt23 {padding-top:23px !important;}
.pt25 {padding-top:25px !important;}
.pt30 {padding-top:30px !important;}
.pt35 {padding-top:35px !important;}
.pt40 {padding-top:40px !important;}
.pt45 {padding-top:45px !important;}
.pt50 {padding-top:50px !important;}
.pt60 {padding-top:60px !important;}
.pt80 {padding-top:80px !important;}

.pr0 {padding-right:0px !important;}
.pr1 {padding-right:1px !important;}
.pr2 {padding-right:2px !important;}
.pr3 {padding-right:3px !important;}
.pr4 {padding-right:4px !important;}
.pr5 {padding-right:5px !important;}
.pr6 {padding-right:6px !important;}
.pr7 {padding-right:7px !important;}
.pr8 {padding-right:8px !important;}
.pr9 {padding-right:9px !important;}
.pr10 {padding-right:10px !important;}
.pr15 {padding-right:15px !important;}
.pr20 {padding-right:20px !important;}
.pr25 {padding-right:25px !important;}
.pr30 {padding-right:30px !important;}
.pr80 {padding-right:80px !important;}

.pl0 {padding-left:0px !important;}
.pl1 {padding-left:1px !important;}
.pl2 {padding-left:2px !important;}
.pl3 {padding-left:3px !important;}
.pl4 {padding-left:4px !important;}
.pl5 {padding-left:5px !important;}
.pl6 {padding-left:6px !important;}
.pl7 {padding-left:7px !important;}
.pl8 {padding-left:8px !important;}
.pl9 {padding-left:9px !important;}
.pl10 {padding-left:10px !important;}
.pl12 {padding-left:12px !important;}
.pl15 {padding-left:15px !important;}
.pl20 {padding-left:20px !important;}
.pl25 {padding-left:25px !important;}
.pl30 {padding-left:30px !important;}
.pl33 {padding-left:33px !important;}
.pl35 {padding-left:35px !important;}
.pl70 {padding-left:70px !important;}
.pl250 {padding-left:250px !important;}
.pl300 {padding-left:300px !important;}

.pb0 {padding-bottom:0px !important;}
.pb1 {padding-bottom:1px !important;}
.pb2 {padding-bottom:2px !important;}
.pb3 {padding-bottom:3px !important;}
.pb4 {padding-bottom:4px !important;}
.pb5 {padding-bottom:5px !important;}
.pb6 {padding-bottom:6px !important;}
.pb7 {padding-bottom:7px !important;}
.pb8 {padding-bottom:8px !important;}
.pb9 {padding-bottom:9px !important;}
.pb10 {padding-bottom:10px !important;}
.pb15 {padding-bottom:15px !important;}
.pb13 {padding-bottom:13px !important;}
.pb20 {padding-bottom:20px !important;}
.pb25 {padding-bottom:25px !important;}
.pb30 {padding-bottom:30px !important;}
.pb35 {padding-bottom:35px !important}
.pb40 {padding-bottom:40px !important;}
.pb50 {padding-bottom:50px !important;}
.pb60 {padding-bottom:60px !important;}

/* Margin */
.mt0 {margin-top:0px !important;}
.mt5 {margin-top:5px !important;}
.mt7 {margin-top:7px !important;}
.mt10 {margin-top:10px !important;}
.mt14 {margin-top:14px !important;}
.mt15 {margin-top:15px !important;}
.mt19 {margin-top:19px !important;}
.mt20 {margin-top:20px !important;}
.mt22 {margin-top:22px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt32 {margin-top:32px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}
.mt60 {margin-top:60px !important;}
.mt100 {margin-top:100px !important;}

.ml9 {margin-left:9px !important;}
.ml10 {margin-left:10px !important;}
.ml13 {margin-left:13px !important;}
.ml15 {margin-left:15px !important;}
.ml20 {margin-left:20px !important;}
.ml22 {margin-left:20px !important;}
.ml30 {margin-left:30px !important;}
.ml115 {margin-left:115px !important;}

.mr0 {margin-right:0px !important;}
.mr5 {margin-right:5px !important;}
.mr6 {margin-right:6px !important;}
.mr8 {margin-right:8px !important;}
.mr10 {margin-right:10px !important;}
.mr14 {margin-right:14px !important;}
.mr20 {margin-right:20px !important;}
.mr25{margin-right:25px !important;}
.mr30 {margin-right:30px !important;}

.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb14 {margin-bottom:14px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}
.mb40 {margin-bottom:40px !important;}
.mb45 {margin-bottom:45px !important;}

/* CSS 버튼 기본 */
.btn { display:inline-block; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; text-align:center; white-space:nowrap; background-image:none; border-radius:3px; letter-spacing:-0.05em; -webkit-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out;}
.btn-round { border-radius:27px;}
.btn.active, .btn:active { outline:0; background-image:none; -webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125); box-shadow:inset 0 3px 5px rgba(0,0,0,.125);}

/* CSS 버튼 크기 */
.btn-small { min-width:40px; font-size:14px; padding:0 15px; line-height:32px; height:32px;}
input.btn-small,
button.btn-small { min-width:40px; font-size:14px; padding:0 15px; line-height:32px; height:32px; vertical-align:top; border:0;}

.btn-medium { font-size:14px; padding:0 20px; line-height:40px; height:40px;}
input.btn-medium,
button.btn-medium { font-size:14px; padding:0 20px; line-height:40px; height:40px; vertical-align:top; border:0;}

.btn-large { font-size:15px; width:200px; line-height:54px; height:54px; font-weight:400;}
input.btn-large,
button.btn-large { font-size:16px; width:200px; line-height:54px; height:54px; font-weight:400; vertical-align:top; border:0;}

.btn-grand { font-size:16px; width:350px; line-height:54px; height:54px;}
input.btn-grand,
button.btn-grand { font-size:16px; width:350px; line-height:54px; height:54px; vertical-align:top; border:0;}

/* CSS 버튼 색상 */
.btn-white { background:#fff; border:solid 1px #aaa; color:#555;}
.btn-yellow { background:#ffe400; color:#222;}
.btn-blue { background:#0885c7; color:#fff;}
.btn-mint { background:#02aea5; color:#fff;}
.btn-gray { background:#222; color:#fff;}
.btn-darkgray { background:#646464; color:#fff;}
.btn-black { background:#333; color:#fff;}
.btn-navy { background:#233a51; color:#fff;}

/* active 상태 속성 */
.btn-white.active,
.btn-white.disabled,
.btn-white.disabled.active,
.btn-white.disabled:active,
.btn-white.disabled:focus,
.btn-white.disabled:hover,
.btn-white:active,
.btn-white:focus,
.btn-white:hover,
.btn-white[disabled],
.btn-white[disabled].active,
.btn-white[disabled]:active,
.btn-white[disabled]:focus,
.btn-white[disabled]:hover{ background:#005e99; border:solid 1px #005e99; color:#fff;}

.btn-yellow.active,
.btn-yellow.disabled,
.btn-yellow.disabled.active,
.btn-yellow.disabled:active,
.btn-yellow.disabled:focus,
.btn-yellow.disabled:hover,
.btn-yellow:active,
.btn-yellow:focus,
.btn-yellow:hover,
.btn-yellow[disabled],
.btn-yellow[disabled].active,
.btn-yellow[disabled]:active,
.btn-yellow[disabled]:focus,
.btn-yellow[disabled]:hover{ background:#ffd300; color:#222;}

.btn-blue.active,
.btn-blue.disabled,
.btn-blue.disabled.active,
.btn-blue.disabled:active,
.btn-blue.disabled:focus,
.btn-blue.disabled:hover,
.btn-blue:active,
.btn-blue:focus,
.btn-blue:hover,
.btn-blue[disabled],
.btn-blue[disabled].active,
.btn-blue[disabled]:active,
.btn-blue[disabled]:focus,
.btn-blue[disabled]:hover{ background:#035fad; color:#fff;}

.btn-mint.active,
.btn-mint.disabled,
.btn-mint.disabled.active,
.btn-mint.disabled:active,
.btn-mint.disabled:focus,
.btn-mint.disabled:hover,
.btn-mint:active,
.btn-mint:focus,
.btn-mint:hover,
.btn-mint[disabled],
.btn-mint[disabled].active,
.btn-mint[disabled]:active,
.btn-mint[disabled]:focus,
.btn-mint[disabled]:hover{ background:#019288; color:#fff;}

.btn-gray.active,
.btn-gray.disabled,
.btn-gray.disabled.active,
.btn-gray.disabled:active,
.btn-gray.disabled:focus,
.btn-gray.disabled:hover,
.btn-gray:active,
.btn-gray:focus,
.btn-gray:hover,
.btn-gray[disabled],
.btn-gray[disabled].active,
.btn-gray[disabled]:active,
.btn-gray[disabled]:focus,
.btn-gray[disabled]:hover{  color:#fff;}

.btn-darkgray.active,
.btn-darkgray.disabled,
.btn-darkgray.disabled.active,
.btn-darkgray.disabled:active,
.btn-darkgray.disabled:focus,
.btn-darkgray.disabled:hover,
.btn-darkgray:active,
.btn-darkgray:focus,
.btn-darkgray:hover,
.btn-darkgray[disabled],
.btn-darkgray[disabled].active,
.btn-darkgray[disabled]:active,
.btn-darkgray[disabled]:focus,
.btn-darkgray[disabled]:hover{ background:#494949; color:#fff;}

.btn-black.active,
.btn-black.disabled,
.btn-black.disabled.active,
.btn-black.disabled:active,
.btn-black.disabled:focus,
.btn-black.disabled:hover,
.btn-black:active,
.btn-black:focus,
.btn-black:hover,
.btn-black[disabled],
.btn-black[disabled].active,
.btn-black[disabled]:active,
.btn-black[disabled]:focus,
.btn-black[disabled]:hover{ background:#222; color:#fff;}

.btn-navy.active,
.btn-navy.disabled,
.btn-navy.disabled.active,
.btn-navy.disabled:active,
.btn-navy.disabled:focus,
.btn-navy.disabled:hover,
.btn-navy:active,
.btn-navy:focus,
.btn-navy:hover,
.btn-navy[disabled],
.btn-navy[disabled].active,
.btn-navy[disabled]:active,
.btn-navy[disabled]:focus,
.btn-navy[disabled]:hover{ background:#182b3f; color:#fff;}





/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
    /* 문의폼 하단 개인정보취급방침 */
    .common-privacy-check,
    .quick-privacy-check { padding:10px 0 20px;}

    /* CSS 버튼 크기 */
    .btn-large { font-size:15px; width:170px; line-height:46px; height:46px;}
    input.btn-large,
    button.btn-large { font-size:15px; width:170px; line-height:46px; height:46px;}


}
