@charset "utf-8";

@font-face {
  font-family: 'NotoSansKR';
  font-style: normal;
  font-weight: 100;
  src: url(../css/font/NotoSansKR-Thin.woff2) format('woff2'),
       url(../css/font/NotoSansKR-Thin.woff) format('woff'),
       url(../css/font/NotoSansKR-Thin.otf) format('opentype');
}

@font-face {
  font-family: 'NotoSansKR';
  font-style: normal;
  font-weight: 200;
  src: url(../css/font/NotoSansKR-Light.woff2) format('woff2'),
       url(../css/font/NotoSansKR-Light.woff) format('woff'),
       url(../css/font/NotoSansKR-Light.otf) format('opentype');
}

@font-face {
 font-family: 'NotoSansKR';
 font-style: normal;
 font-weight: 300;
 src: url(../css/font/NotoSansKR-Regular.woff2) format('woff2'),
	  url(../css/font/NotoSansKR-Regular.woff) format('woff'),
	  url(../css/font/NotoSansKR-Regular.otf) format('opentype');
}

@font-face {
 font-family: 'NotoSansKR';
 font-style: normal;
 font-weight: 500;
 src: url(../css/font/NotoSansKR-Bold.woff2) format('woff2'),
	  url(../css/font/NotoSansKR-Bold.woff) format('woff'),
	  url(../css/font/NotoSansKR-Bold.otf) format('opentype');
}



@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 100;
src: local('SohoGothicPro-Thin'), local('SohoGothicPro-Thin'), url(../css/font/SohoGothicPro-Thin.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 200;
src: local('SohoGothicPro-Light'), local('SohoGothicPro-Light'), url(../css/font/SohoGothicPro-Light.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 300;
src: local('SohoGothicPro-Regular'), local('SohoGothicPro-Regular'), url(../css/font/SohoGothicPro-Regular.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 400;
src: local('SohoGothicPro-Medium'), local('SohoGothicPro-Medium'), url(../css/font/SohoGothicPro-Medium.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 500;
src: local('SohoGothicPro-Bold'), local('SohoGothicPro-Bold'), url(../css/font/SohoGothicPro-Bold.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 600;
src: local('SohoGothicPro-ExtraBold'), local('SohoGothicPro-ExtraBold'), url(../css/font/SohoGothicPro-ExtraBold.woff) format('woff');
}
@font-face {
font-family: 'SohoGothicPro';
font-style: normal;
font-weight: 700;
src: local('SohoGothicPro-Ultra'), local('SohoGothicPro-Ultra'), url(../css/font/SohoGothicPro-Ultra.woff) format('woff');
}


/*common*/
* { margin: 0; padding: 0; /*box-sizing: border-box;*/ -webkit-touch-callout: none; }
html { -webkit-font-size-adjust: none;overflow-y: scroll; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;/*word-wrap:break-word;word-break:break-all*/ }
html, body { margin: 0; padding: 0; color: #555; font-size: 15px; letter-spacing:-0.3px; font-family:/*'SohoGothicPro',*/ 'NotoSansKR', '맑은고딕', Malgun Gothic, sans-serif,'Sans-serif', 'Malgun Gothic',  맑은고딕, 돋움, 'dotum'; min-width:320px; line-height:normal;line-height:1.4em; font-weight:300; text-rendering: optimizeLegibility; vertical-align:middle !important;}

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, a, abbr, address, cite, em, img, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, section, summary, audio, video { margin: 0; padding: 0; border: 0; vertical-align:baseline }

h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size:100% ; line-height:normal  }
dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote { margin: 0; padding: 0 }
input, textarea, select {   color: inherit;  font-family:/*'SohoGothicPro',*/ 'NotoSansKR', '맑은고딕', Malgun Gothic, sans-serif,'Sans-serif', 'Malgun Gothic',  맑은고딕, 돋움, 'dotum'; }


select{-webkit-border-radius:0; /* -webkit-appearance:none;아이폰에서 셀렉트 아이콘 안나와서 주석처리*/}
input[type=text], input[type=password]{ border:1px solid #ddd; height:33px; line-height:33px;-webkit-border-radius:0; -webkit-appearance:none; }
input[type=submit]{-webkit-border-radius:0; -webkit-appearance:none;}
input[type=image]{ height:auto; border:0;   }
input[type=file]{ border:0; background:none;  }

textarea{ overflow-y:auto;  border:1px solid #ddd; }
select { height: 30px ; margin: 0; padding: 0; border: 1px solid #ddd; box-sizing: border-box; }


input[type=checkbox], input[type=radio]{ width:14px; height:14px; vertical-align:middle; margin-top:-2px}



label { cursor: pointer }
label, select, input, button { vertical-align: middle; }

table { border-collapse: collapse; border-spacing: 0 }

img { max-width: 100%; border: 0; -webkit-tap-highlight-color: rgba(0,0,0,0) ;vertical-align: top; -ms-interpolation-mode: bicubic}

ol, ul { list-style: none }
ol, ul, li { list-style: none }

img, fieldset { border: 0 none }


a { color:inherit }
a:link, a:visited { text-decoration: none }
a:hover, a:active { text-decoration: none }

blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none }
em, address { font-style: normal; }
hr { display: none; clear: both;height: 0; }
legend, caption { visibility: hidden; overflow: hidden; position: absolute; width: 0; height: 0; margin: 0; padding: 0; line-height: 0 }


strong, table th{ font-weight:normal; font-weight:400 !important}



/*html5 구 버전 적용 위한 소스*/
[hidden], area, base, basefont, command, datalist, head, input[type=hidden], link, menu[type=context], meta, noembed, noframes, param, script, source, style, track, title { /* case-insensitive */
 display: none;
}
address, article, aside, blockquote, body, center, dd, dir, div, dl, dt, figure, figcaption, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, legend, listing, menu, nav, ol, p, plaintext, pre, section, summary, ul, xmp { display: block; }
table { display: table; }
caption { display: table-caption; }
colgroup { display: table-column-group; }
col { display: table-column; }
thead { display: table-header-group; }
tbody { display: table-row-group; }
tfoot { display: table-footer-group; }
tr { display: table-row; }
td, th { display: table-cell; }
li { display: list-item; }
ruby { display: ruby; }
rt { display: ruby-text; display: inline; }



/*마진 및 정렬*/

.text_c{ text-align:center}
.text_l{ text-align:left}
.text_r{ text-align:right}

.float_r{ float:right}
.float_l{ float:left}

.clear {clear:both;}
.blind {display:none;}

.pat0{ padding-top:0 !important}
.pab0{ padding-bottom:0 !important}
.mat0{ margin-top:0 !important}

.mat5{ margin-top:5px !important}
.mar5{ margin-right:5px !important}
.mab5{ margin-bottom:5px !important}
.mal5{ margin-left:5px !important}

.mat10{ margin-top:10px !important}
.mar10{ margin-right:10px !important}
.mab10{ margin-bottom:10px !important}
.mal10{ margin-left:10px !important}

.mat20{ margin-top:20px !important}
.mar20{ margin-right:20px !important}
.mab20{ margin-bottom:20px !important}
.mal20{ margin-left:20px !important}

.mat30{ margin-top:30px !important}
.mar30{ margin-right:30px !important}
.mab30{ margin-bottom:30px !important}
.mal30{ margin-left:30px !important}

.mat40{ margin-top:40px !important}
.mar40{ margin-right:40px !important}
.mab40{ margin-bottom:40px !important;}
.mal40{ margin-left:40px !important}

.mat50{ margin-top:50px !important}
.mar50{ margin-right:50px !important}
.mab50{ margin-bottom:50px !important}
.mal50{ margin-left:50px !important}

.mat60{ margin-top:60px !important}
.mar60{ margin-right:60px !important}
.mab60{ margin-bottom:60px !important}
.mal60{ margin-left:60px !important}

.mat70{ margin-top:70px !important}
.mar70{ margin-right:70px !important}
.mab70{ margin-bottom:70px !important}
.mal70{ margin-left:70px !important}

.mat80{ margin-top:80px !important}
.mar80{ margin-right:80px !important}
.mab80{ margin-bottom:80px !important}
.mal80{ margin-left:80px !important}

.mat100{ margin-top:100px !important}
.mar100{ margin-right:100px !important}
.mab100{ margin-bottom:100px !important}
.mal100{ margin-left:100px !important}

@media screen and (max-width:640px){
.mat10{ margin-top:5px !important}
.mar10{ margin-right:5px !important}
.mab10{ margin-bottom:5px !important}
.mal10{ margin-left:5px !important}

.mat20{ margin-top:10px !important}
.mar20{ margin-right:10px !important}
.mab20{ margin-bottom:10px !important}
.mal20{ margin-left:10px !important}

.mat30{ margin-top:15px !important}
.mar30{ margin-right:15px !important}
.mab30{ margin-bottom:15px !important}
.mal30{ margin-left:15px !important}

.mat40{ margin-top:20px !important}
.mar40{ margin-right:20px !important}
.mab40{ margin-bottom:20px !important;}
.mal40{ margin-left:20px !important}

.mat50{ margin-top:25px !important}
.mar50{ margin-right:25px !important}
.mab50{ margin-bottom:25px !important}
.mal50{ margin-left:25px !important}

.mat60{ margin-top:30px !important}
.mar60{ margin-right:30px !important}
.mab60{ margin-bottom:30px !important}
.mal60{ margin-left:30px !important}

.mat70{ margin-top:35px !important}
.mar70{ margin-right:35px !important}
.mab70{ margin-bottom:35px !important}
.mal70{ margin-left:35px !important}

.mat80{ margin-top:40px !important}
.mar80{ margin-right:40px !important}
.mab80{ margin-bottom:40px !important}
.mal80{ margin-left:40px !important}

.mat100{ margin-top:50px !important}
.mar100{ margin-right:50px !important}
.mab100{ margin-bottom:50px !important}
.mal100{ margin-left:50px !important}
}

.point_c1 {color:#0052a6 !important;}
.point_c2 {color:#003667 !important;}
.point_c3 {color:#e04f40 !important;} /*포인트 색깔 : 레드톤 */
.point_c4 {color:#3d3f41 !important;}

.white {color:#fff;}
.gray3 {color:#333;}
.gray4 {color:#444;}
.gray5 {color:#555;}
.gray6 {color:#666;}
.gray7 {color:#777;}
.gray8 {color:#888;}
.gray9 {color:#999;}

.f_light {font-weight:100 !important;}
.f_bold {font-weight:500 !important;}
.f_under {text-decoration:underline;}

.f_14 {font-size:14px;}
.f_16 {font-size:16px;}



::selection {background:#3d3f41; color:#fff; text-shadow:none;}
::-moz-selection {background:#3d3f41; color:#fff; text-shadow:none;}
::-webkit-selection {background:#3d3f41; color:#fff; text-shadow:none;}



/* Comming Soon */
.soon {}
.soon dl dt {margin:0 0 32px 0;}
.soon dl dt img {width:152px;}
.soon dl dd .soon_tit {font-weight:500; font-size:24px; }
.soon dl dd .soon_line {width:20px; height:1px; background:#0052a6; margin:0 auto; margin-top:16px; margin-bottom:8px;}
.soon dl dd .soon_sub {font-weight:200; font-size:16px;  line-height:1.3em; color:#777;}

@media screen and (max-width:920px){
.soon dl dt {margin:0 0 24px 0;}
.soon dl dt img {width:120px;}
}
@media screen and (max-width:640px){
.soon dl dt {margin:0 0 24px 0;}
.soon dl dt img {width:120px;}
.soon dl dd .soon_tit {font-size:18px; }
.soon dl dd .soon_line {margin-top:12px; margin-bottom:6px;}
.soon dl dd .soon_sub {font-size:14px;}
}

.clearfix::after{content: ''; display: block; clear: both;}





/* Popup */
.popup {position:absolute; z-index:999999; border:0; visibility:hidden;}
.popup.divpop1 {left:50px; top:100px;}
.popup.divpop2 {left:500px; top:100px;}
.popup .pop_img {position:relative;}
.popup .pop_img map area {cursor:default;}
.popup .pop_img.pc {display:block;}
.popup .pop_img.mobile {display:none;}
.popup .pop_bottom p {width:50%; float:left; text-align:center; line-height:40px; vertical-align:middle;}
.popup .pop_bottom p a {display:block; width:100%;}
.popup .pop_bottom:after { content: ""; display: block; clear: both; }
.popup .pop_bottom p.day {background:#222; color:#fff; }
.popup .pop_bottom p.close {background:#fff; color:#333;}

@media screen and (max-width:640px){
.popup.divpop1 {left:50%; top:50%; margin:-270px 0 0 -210px;}
.popup.divpop2 {left:50%; top:50%; margin:-270px 0 0 -210px;}
.popup .pop_img.pc {display:none;}
.popup .pop_img.mobile {display:block;}
}
@media screen and (max-width:420px){
.popup.divpop1 {width:100%; left:0; margin:-270px 0 0 0;}
.popup.divpop2 {width:100%; left:0; margin:-270px 0 0 0;}
}