@charset utf-8;

/** css 초기화 **/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, 
em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, fhead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, 
hgroup, menu, nav, section, summary, time, mark, audio, video
{margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; box-sizing: border-box;}

body{font-family: NanumBarunGothic, 나눔바른고딕, 'NanumBarunGothic', Nanum Barun Gothic, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica; line-height: 1; letter-spacing: -0.5px; min-width: 360px;}

article, aside, details, figcaption, fiqure, footer, header, hgroup, menu, nav, section {display: block;}

nav, ul, li {list-style: none;}

a{margin: 0; padding: 0; font-size: 100%; text-decoration: none; vertical-align: baseline; color: #333; background: transparent;}

img {vertical-align: top;}

table {border-collapse: collapse; border-spacing: 0;}

input {margin: 0; padding: 0; box-sizing: border-box; vertical-align: top; border: 1px solid #dfdfdf; color: #999; 
border-radius: 0; font-family: NanumGothic, 나눔고딕, 'Nanum Gothic', '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica; padding-left: 8px !important;}

select	{background: #fff url('../image/sub/select_icon.gif') no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; padding-left: 8px;}
select::-ms-expand {display: none;}

input::-moz-input-placeholder {color: #999;}
input::-webkit-input-placeholder {color: #999;}

/* 웹폰트 css */

@import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumsquare.css);
@import url(//cdn.rawgit.com/puts-blog/NanumSquare/master/NanumSquare-Base64.css);

/*폰트추가*/
@font-face	{font-family: 'KopubDotum_b';
src: url('../../fonts/KoPubWorld Dotum Bold.ttf') format("truetype");
src: url('../../fonts/KoPubWorld Dotum Bold.eot') format("eddedopentype");
src: url('../../fonts/KoPubWorld Dotum Bold.woff') format("woff");
}
@font-face	{font-family: 'KopubDotum_m';
src: url('../../fonts/KoPubWorld Dotum Medium.ttf') format("truetype");
src: url('../../fonts/KoPubWorld Dotum Medium.eot') format("eddedopentype");
src: url('../../fonts/KoPubWorld Dotum Medium.woff') format("woff");
}
@font-face	{font-family: 'KopubDotum_l';
src: url('../../fonts/KoPubWorld Dotum Light.ttf') format("truetype");
src: url('../../fonts/KoPubWorld Dotum Light.eot') format("eddedopentype");
src: url('../../fonts/KoPubWorld Dotum Light.woff') format("woff");
}
@font-face	{font-family: 'MalgunGothic';
src: url('../../fonts/MalgunGothic.ttf') format("truetype");
src: url('../../fonts/MalgunGothic.eot') format("eddedopentype");
src: url('../../fonts/MalgunGothic.woff') format("woff");
}

.kpw_dotum_b		{font-family: 'KopubDotum_b';}
.kpw_dotum_m		{font-family: 'KopubDotum_m';}
.kpw_dotum_l		{font-family: 'KopubDotum_l';}
.MalgunGothic		{font-family: 'MalgunGothic';}

/* 상하단 css */

#wrap		{width: 100%;}
.wrap_box	{width: 100%; max-width: 1200px; margin: 0 auto;}

@media all and (max-width:1200px) /* 테블릿 세로 */	{
.wrap_box	{width: 90% !important; margin: 0 5%;}
}
/*
header	{width: 100%; height: 150px;}
*/

/* 움직이는 소스 */

.hd-scrollani {opacity: 100%;} /*핵적용*/

@keyframes fade-in-left { 0% {-webkit-transform: translateX(-50px); transform: translateX(-50px); opacity: 0;} 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1;}}
.hd-scrollani-type.ani-delay-left0s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;}
.hd-scrollani-type.ani-delay-left2s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.2s;}
.hd-scrollani-type.ani-delay-left4s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.4s;}
.hd-scrollani-type.ani-delay-left6s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.6s;}
.hd-scrollani-type.ani-delay-left8s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.8s;}
.hd-scrollani-type.ani-delay-left10s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1s;}
.hd-scrollani-type.ani-delay-left12s { -webkit-animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1.2s;}

@keyframes fade-in-right { 0% {-webkit-transform: translateX(50px); transform: translateX(50px); opacity: 0;} 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1;}}
.hd-scrollani-type.ani-delay-right0s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;}
.hd-scrollani-type.ani-delay-right2s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.2s;}
.hd-scrollani-type.ani-delay-right4s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.4s;}
.hd-scrollani-type.ani-delay-right6s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.6s;}
.hd-scrollani-type.ani-delay-right8s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.8s;}
.hd-scrollani-type.ani-delay-right10s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1s;}
.hd-scrollani-type.ani-delay-right12s { -webkit-animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-right 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1.2s;}

@keyframes fade-in-top { 0% {-webkit-transform: translateY(-50px); transform: translateY(-50px); opacity: 0;} 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}}
.hd-scrollani-type.ani-delay-top0s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;}
.hd-scrollani-type.ani-delay-top2s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.2s;}
.hd-scrollani-type.ani-delay-top4s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.4s;}
.hd-scrollani-type.ani-delay-top6s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.6s;}
.hd-scrollani-type.ani-delay-top8s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.8s;}
.hd-scrollani-type.ani-delay-top10s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1s;}
.hd-scrollani-type.ani-delay-top12s { -webkit-animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1.2s;}

@keyframes fade-in-bottom { 0% {-webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0;} 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}}
.hd-scrollani-type.ani-delay-bottom0s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;}
.hd-scrollani-type.ani-delay-bottom2s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.2s;}
.hd-scrollani-type.ani-delay-bottom4s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.4s;}
.hd-scrollani-type.ani-delay-bottom6s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.6s;}
.hd-scrollani-type.ani-delay-bottom8s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:.8s;}
.hd-scrollani-type.ani-delay-bottom10s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1s;}
.hd-scrollani-type.ani-delay-bottom12s { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation-delay:1.2s;}


.moving, a	{-webkit-transition: 0.5s all ease; transition: 0.5s all ease;}