@charset "utf-8";
@font-face {
 font-family: 'NanumBarunGothic';
 font-style: normal;
 font-weight: 400;
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot');
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.ttf') format('truetype');
}

@font-face {
 font-family: 'NanumBarunGothic';
 font-style: normal;
 font-weight: 700;
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot');
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.ttf') format('truetype')
}

@font-face {
 font-family: 'NanumBarunGothic';
 font-style: normal;
 font-weight: 300;
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot');
 src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.ttf') format('truetype');
}

.area_intro{position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:#006930;}
.area_intro .inr{position:absolute; top:34%; width:100%; text-align:center;}
.area_intro .logo{width:487px; height:142px; margin:0 auto; background:url(/images/content/intro_logo.png) no-repeat 0 0;}
.area_intro .lang{display:flex; justify-content:center; padding-top:40px; gap:0 80px;}
.area_intro .lang > a{display:inline-block; height:45px; line-height:46px; vertical-align:top; padding:0; color:#fff; font-weight:500; font-size:23px; font-family:'NanumBarunGothic', sans-serif; text-decoration:none; text-transform:uppercase; border-top:1px solid #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.area_intro .lang > a:last-child{margin-right:0;}
.ani{opacity:0;}
.ani.active{opacity:1; transition:all 0.3s ease-out 0s; transition-delay:0.1s;}

/*
white, yellow, blue, gray, black, navy, green
*/
.area_intro.white{background:#fff;}
.area_intro.white .logo{background-image:url(/images/content/intro_logo_wh.png);}
.area_intro.white .lang > a{color:#000; border-color:#000;}


.area_intro.yellow{background:#f5d010;}
.area_intro.yellow .logo{background-image:url(/images/content/intro_logo_yellow.png);}
.area_intro.yellow .lang > a{color:#0e3171; border-color:#0e3171;}

.area_intro.blue{background:#008ce3;}
.area_intro.blue .logo{background-image:url(/images/content/intro_logo_blue.png);}
.area_intro.blue .lang > a{color:#fff; border-color:#fff;}

.area_intro.gray{background:#f7f7f7;}
.area_intro.gray .logo{background-image:url(/images/content/intro_logo_gray.png);}
.area_intro.gray .lang > a{color:#00664e; border-color:#00664e;}

.area_intro.black{background:#000000;}
.area_intro.black .logo{background-image:url(/images/content/intro_logo_black.png);}
.area_intro.black .lang > a{color:#fff; border-color:#fff;}


.area_intro.navy{background:#fff;}
.area_intro.navy .logo{background-image:url(/images/content/intro_logo_wh01.png);}
.area_intro.navy .lang > a{color:#000; border-color:#000;}

.area_intro.green{background:#2f4135;}
.area_intro.green .logo{background-image:url(/images/content/intro_logo_green.png);}
.area_intro.green .lang > a{color:#fff; border-color:#fff;}

@media (max-width:560px){
    .area_intro .inr{top:30%;}
    .area_intro .inr h1{margin:0; padding:0 10%;}
    .area_intro .logo{width:100%; padding:0 10%; background-size:contain; background-position:center; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
    .area_intro .lang{gap: 0 10%; padding-top:5%;} 
}

@media (max-width:360px){
    .area_intro .lang > a{height:40px; line-height:40px; font-size:1rem; transition: all 1s;}
}