@charset "utf-8";
@font-face {font-family: notosans; font-weight: 200; src: url("../font/NotoSansKR-Regular.eot"); src: local("※"), url("../font/NotoSansKR-Light.woff") format("woff")
}
@font-face {font-family: notosans; font-weight: 300; src: url("../font/NotoSansKR-Regular.eot"); src: local("※"), url("../font/NotoSansKR-Regular.woff") format("woff")
}
@font-face {font-family: notosans; font-weight: 500; src: url("../font/NotoSansKR-Bold.eot"); src: local("※"), url("../font/NotoSansKR-Bold.woff") format("woff")
}
@font-face {font-family: titleGothic; font-weight: 200; src: url("../font/TitleGothic2.eot"); src: local("※"), url("../font/TitleGothic2.woff") format("woff")
}

/* reset */
body,  h1, h2, h3, h4, h5, p, ul, address, th, td, button {margin: 0; padding: 0}
body {font-size: 20px; font-family: notosans, '본고딕', 'NanumGothic', '나눔고딕', 'Gulim', '굴림'; font-weight: 200; color: #fff; line-height: 1}
h1, h2, h3, h4, h5 {font-weight: inherit; font-size: inherit}
ul {list-style: none}
a:hover, a:link, a:visited, a:active {text-decoration: none; color: inherit}
input[type="text"] {border: 1px solid #aaa}
input, button{font-family: inherit;font-size: inherit;color: inherit}
button {cursor: pointer; background: none; border: none}
table {border-collapse: collapse; border-spacing: 0; font-weight: inherit}
address {font-style: normal}
img {vertical-align: top; border: none; max-width: 100%; height: auto}
header, nav, section, article, footer {display: block}

/* 공통클래스 */
.blind {font-size: 0; line-height: 0; width: 1px; height: 1px; line-height: 1px; text-align: -9999px; overflow: hidden; position: absolute; top: 0; left: -9999px}
.clear:after {content: ""; display: block; clear: both}
.p_r {position: relative}
.p_a {position: absolute}
.f_l {float: left}
.f_r {float: right}
.area {width: 1300px; margin: 0 auto}
article h2.title {font-size: 45px; line-height: 55px; font-weight: 200; color: #fff; text-align: center}
article .subtit {font-size: 14px; color: #fff; text-align: center; line-height: 40px; font-weight: 200; letter-spacing: 11px}
 
/*#header .logo, #header .bg_head, #header .bg_head:before, #header #gnb > ul, #header #gnb > ul > .bg, #header #gnb > ul > .side_gnb, #header #gnb > ul > .bg, #cnt1, #cnt1 .pro_ban div {-webkit-transition: 0.7s all; -moz-transition: 0.7s all; -o-transition: 0.7s all; transition: 0.7s all}*/

/* skip */
#skip a {position: absolute; top: 0; left: -9999px; z-index: 100}
#skip a:focus {display: block; top: 0; left: 0;  width: 100%; padding: 10px 0; background: #fff; color: #000; font-weight: 300; text-align: center}

.l1 {font-size: 72px; font-weight: 300; line-height: 100px}
.l2 {font-size: 24px; font-weight: 200; line-height: 36px; padding: 55px 0 34px;}


.modal-wrapper{position: fixed; top:0; left:0; width: 100%; height: 100%; background: rgba(33,33,33,.8); z-index: 10000; display: none;}
.modal-container{position: absolute; width:100%; max-width:800px; top:52%; left:50%; transform:translate(-50%,-50%); height: 85%; padding: 1.2em .4em; background: #fff; box-sizing: border-box;}
.scroll{height: 100%; overflow: scroll; overflow-x: hidden;}
.modal-close{width: 40px; height: 40px; background: url(../images/close.png)0 0 /100% no-repeat; position: absolute; top:-6%; left:calc(50% + 350px); text-indent: -9999em;}