@charset "gb2312";
/* Reset */
html{ min-width:1100px !important; margin:0 auto;}
  body, form, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, em, address, a, input, textarea, span, strong, img { margin: 0px; padding: 0px; }
body, input, textarea, table { font-size: 12px; color: #333; }
ul, dl { list-style: none; }
input, textarea, select, button { font-size: 12px; }
img { border: none; }
a { color: #000; text-decoration: none;  blr: expression(this.onFocus=this.blur());
outline: none; }
i, em { font-style: normal; }
table, thead, tbody, tfoot, tr, td { margin: 0px; }
h1, h2, h3, h4, h5, h6 { font-size: 12px; font-weight: normal; }
* { outline: none; }
input[type=submit], input[type=reset], input[type=button] { filter: chroma(color=black); }
article, aside, dialog, footer, header, section, footer, nav, figure, menu { display: block; }
/* Import Variable */
/* Var all site variable */
/**/
.anim-delay-1 { animation-delay: 0.1s; /* W3C & Opera */
  -moz-animation-delay: 0.1s; /* Firefox */
  -webkit-animation-delay: 0.1s;/* Safari & Chrome */ }
.anim-delay-2 { animation-delay: 0.2s; /* W3C & Opera */
  -moz-animation-delay: 0.2s; /* Firefox */
  -webkit-animation-delay: 0.2s;/* Safari & Chrome */ }
.anim-delay-3 { animation-delay: 0.3s; /* W3C & Opera */
  -moz-animation-delay: 0.3s; /* Firefox */
  -webkit-animation-delay: 0.3s;/* Safari & Chrome */ }
.anim-delay-4 { animation-delay: 0.4s; /* W3C & Opera */
  -moz-animation-delay: 0.4s; /* Firefox */
  -webkit-animation-delay: 0.4s;/* Safari & Chrome */ }
 @keyframes {
}
@-webkit-keyframes {
}
@keyframes fadeInLeft {  from {
 transform: translateX(-100px);
 -webkit-transform: translateX(-100px);
}
to { transform: translateX(0); -webkit-transform: translateX(0); opacity: 1; visibility: visible; }
}
@-webkit-keyframes fadeInLeft {  from {
 transform: translateX(-100px);
 -webkit-transform: translateX(-100px);
}
to { transform: translateX(0); -webkit-transform: translateX(0); opacity: 1; visibility: visible; }
}
.fadeInLeft { animation: fadeInLeft .5s forwards; -webkit-animation: fadeInLeft .5s forwards; }
 @keyframes fadeInRight {  from {
 transform: translateX(100px);
 -webkit-transform: translateX(100px);
}
to { transform: translateX(0); -webkit-transform: translateX(0); opacity: 1; visibility: visible; }
}
@-webkit-keyframes fadeInRight {  from {
 transform: translateX(100px);
 -webkit-transform: translateX(100px);
}
to { transform: translateX(0); -webkit-transform: translateX(0); opacity: 1; visibility: visible; }
}
.fadeInRight { animation: fadeInRight .5s forwards; -webkit-animation: fadeInRight .5s forwards; }
 @keyframes fadeOutRight {  from {
 transform: translateX(0);
 -webkit-transform: translateX(0);
 opacity: 1;
}
to { transform: translateX(100px); -webkit-transform: translateX(100px); opacity: 0; }
}
@-webkit-keyframes fadeOutRight {  from {
 transform: translateX(0);
 -webkit-transform: translateX(0);
 opacity: 1;
}
to { transform: translateX(100px); -webkit-transform: translateX(100px); opacity: 0; }
}
.fadeOutRight { animation: fadeOutRight .5s forwards; -webkit-animation: fadeOutRight .5s forwards; }
 @keyframes fadeOutLeft {  from {
 transform: translateX(0);
 -webkit-transform: translateX(0);
 opacity: 1;
}
to { transform: translateX(-100px); -webkit-transform: translateX(-100px); opacity: 0; }
}
@-webkit-keyframes fadeOutLeft {  from {
 transform: translateX(0);
 -webkit-transform: translateX(0);
 opacity: 1;
}
to { transform: translateX(-100px); -webkit-transform: translateX(-100px); opacity: 0; }
}
.fadeOutLeft { animation: fadeOutLeft .5s forwards; -webkit-animation: fadeOutLeft .5s forwards; }
 @keyframes fadeInUp {  from {
 transform: translateY(100px);
 -webkit-transform: translateY(100px);
}
to { transform: translateY(0); -webkit-transform: translateY(0); opacity: 1; visibility: visible; }
}
@-webkit-keyframes fadeInUp {  from {
 transform: translateY(100px);
 -webkit-transform: translateY(100px);
}
to { transform: translateY(0); -webkit-transform: translateY(0); opacity: 1; visibility: visible; }
}
.fadeInUp { animation: fadeInUp .4s forwards; -webkit-animation: fadeInUp .4s forwards; }
 @keyframes fadeOutDown {  from {
 transform: translateY(0);
 -webkit-transform: translateY(0);
}
to { transform: translateY(100px); -webkit-transform: translateY(100px); opacity: 0; visibility: hidden; }
}
@-webkit-keyframes fadeOutDown {  from {
 transform: translateY(0);
 -webkit-transform: translateY(0);
}
to { transform: translateY(100px); -webkit-transform: translateY(100px); opacity: 0; visibility: hidden; }
}
.fadeOutDown { animation: fadeOutDown .4s forwards; -webkit-animation: fadeOutDown .4s forwards; }
/* All site common css */
.center { width: 1200px; margin: 0 auto; }
header, header .naver, footer { width: 100%; min-width: 1200px; }
header .toper:after, header .naver:after, footer .center:after { content: ""; display: block; height: 0; clear: both; visibility: hidden;  *zoom: 1;
}
header .logo, header .top_font, footer .f_link .f_logo { font-size: 0; line-height: 0; }
/* Style sheet */
@font-face { font-family: 'heliosextthinregular'; src: url("../font/he_eth_-webfont.eot"); src: url("../font/he_eth_-webfont.eot?#iefix") format("embedded-opentype"), url("../font/he_eth_-webfont.woff") format("woff"), url("../font/he_eth_-webfont.ttf") format("truetype"), url("he_eth_-webfont.svg#heliosextthinregular") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'DINOTCondLight'; src: url("../font/DINOT-CondLight.eot"); src: url("../font/DINOT-CondLight.eot?#iefix") format("embedded-opentype"), url("../font/DINOT-CondLight.woff") format("woff"), url("../font/DINOT-CondLight.ttf") format("truetype"), url("he_eth_-webfont.svg#DINOTCondLight") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'alphanum20'; src: url("../font/alphanum20.eot?-a6m7hz"); src: url("../font/alphanum20.eot?#iefix-a6m7hz") format("embedded-opentype"), url("../font/alphanum20.woff2?-a6m7hz") format("woff2"), url("../font/alphanum20.woff?-a6m7hz") format("woff"), url("../font/alphanum20.ttf?-a6m7hz") format("truetype"), url("../font/alphanum20.svg?-a6m7hz#alphanum20") format("svg"); font-weight: normal; font-style: normal; }
/* Header | Footer start */
header .toper { padding: 30px 0; }
header .logo { float: left; display: block; width: 176px; height: 91px; background: url(../images/logo.png); }
header .top_font { float: left; display: block; width: 186px; height: 28px; background: url(../images/top_font.png); vertical-align: bottom; margin-top: 55px; }
header .phone { float: right; margin-top: 25px; display: block; height: 43px; line-height: 43px; background: url(../images/phone.png) no-repeat left center; padding-left: 50px; font-family: 'alphanum20'; font-size: 30px; }
header .naver { height: 64px; background: #00a0e8; }
header .naver a { float: left; position: relative; width: 150px; height: 64px; line-height: 50px; text-align: center; color: #fff; font-size: 18px; -webkit-transition: all 0.4s; /* Safari & Chrome */
    -moz-transition: all 0.4s; /* Firefox 4 */
    -o-transition: all 0.4s; /* Opera */
    transition: all 0.4s; }
header .naver a i { position: absolute; left: 50%; margin-left: -50px; top: 40px; display: block; width: 100px; font-size: 12px; line-height: 12px; text-transform: uppercase; color: #d8f3ff; }
header .naver a:hover, header .naver a.on { background: #0094d6; transform: translateX(5px); }
.waaperbox1 { width:800px; height:auto; }
.waaperbox1 .periodicallist { width:800px; height:auto; margin-top:30px; margin-left:30px; }
.waaperbox1 .periodicallist li { width:200px; height:200px; float:left; margin:25px 25px 0 25px; }
.waaperbox1 .periodicallist li p { width:200px; line-height:30px; }
footer { height: 260px; overflow: hidden; margin-top: 50px; background: #00a0e8; }
footer .center { height: 100%; }
footer .f_link, footer .f_add, footer .f_qr { float: left; }
footer .f_link { width: 260px; height: 100%; background: #fff; }
footer .f_link .f_logo { display: block; width: 176px; height: 91px; background: url(../images/logo.png); margin: 10px auto; }
footer .f_link .nav { margin-top: 15px; }
footer .f_link .nav a { display: inline-block; width: 70px; margin: 0 20px 15px 35px; font-size: 16px; color: #666; }
footer .f_link .nav a:first-child:first-letter { margin-right: 33px; }
footer .f_link .nav a:hover { color: #333; text-decoration: underline; }
footer .f_add { color: #fff; width: 500px; padding: 40px 0 0 40px; }
footer .f_add h4 { font-size: 20px; text-transform: uppercase; margin-bottom: 23px; }
footer .f_add p { font-size: 15px; line-height: 40px; }
footer .f_qr { color: #fff; float: right; width: 360px; padding-top: 40px; }
footer .f_qr h4 { font-size: 20px; text-transform: uppercase; margin-bottom: 23px; }
footer .f_qr .qrbox span { display: inline-block; font-size: 14px; text-align: center; line-height: 30px; margin-right: 30px; }
footer .f_qr .qrbox span img { border: 4px solid #fff; display: block; }
#page { width: 100%; text-align: center; min-height: 36px; padding: 30px 0 0; font-size: 14px; font-weight: bold; }
#page a { padding: 8px 14px;  *display: inline-block;
background: #f6f6f6; border: 1px solid #c1c1c1; color: #666666; margin-right: 10px; border-radius: 2px; }
#page a:hover, #page a.on { background: #00a0e8; border: 1px solid #008ccb; color: #fff; }
/*# sourceMappingURL=common.css.map */

.lazy { background:url(../images/loading.gif) no-repeat center #FFF }