@charset "utf-8";

/* fonts */
/*@import "noto-sans-scott.css";*/
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanssc.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
@import url(https://fonts.googleapis.com/css?family=Montserrat);

/* reset */
html * {max-height: 999999px} /* font size bug fix */
html,body{margin:0px;padding:0px;width:100%;font-size:10px;-webkit-text-size-adjust:none;-webkit-font-smoothing:antialiased}
ul,ol,li,dl,dd,dt,input,h1,h2,h3,h4,h5,h6,p,b,input,button,textarea,fieldset,legend,td,th{margin:0px;padding:0px;word-break:keep-all}
li{list-style:none}
fieldset,img,a{border:0px}
a{text-decoration:none}
legend,.blind{position:absolute;top:0;left:-10000px;width:0;height:0;overflow:hidden;font-size:0;line-height:0}
caption{display:none}
button,label{cursor:pointer}
button{overflow:visible\9}	/* button fix for ie8 */
/*input,textarea,button{font-family:"noto-sans-scott",sans-serif;font-family:200}*/
table{width:100%;border-collapse:collapse;border-spacing:0;text-align:left}
table th, table td{text-align:left}
input::-webkit-input-placeholder{color:#929292}
input::-moz-placeholder{color:#929292}
input:-moz-placeholder{color:#929292}
input:-ms-input-placeholder{color:#929292}
textarea::-webkit-input-placeholder{color:#929292}
textarea::-moz-placeholder{color:#929292}
textarea:-moz-placeholder{color:#929292}
textarea:-ms-input-placeholder{color:#929292}
input:focus::-webkit-input-placeholder{color:transparent!important}
input:focus::-moz-placeholder{color:transparent!important}
input:focus:-moz-placeholder{color:transparent!important}
input:focus:-ms-input-placeholder{color:transparent!important}
textarea:focus::-webkit-input-placeholder{color:transparent!important}
textarea:focus::-moz-placeholder{color:transparent!important}
textarea:focus:-moz-placeholder{color:transparent!important}
textarea:focus:-ms-input-placeholder{color:transparent!important}
header, footer, section, article, aside, nav, address { display: block; margin:0; } /* ie8 */

.clear_wrap:before,.clear_wrap:after{content:" ";display:table}
.clear_wrap:after{clear:both}
.clear_wrap{*zoom:1}
.clear_ine{clear:both}
.ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.appearance{border:0;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;-o-appearance:none;appearance:none}
.boxsizing{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.mobilescrolling{-webkit-overflow-scrolling:touch}

#pnael_header,
#panel_header .header_text .btn_letsgo,
#panel_video .video_box .btn_video,
#panel_video .video_box .bg_over,
#panel_map .text_area .map_05 .slide_box .btn_slide,
.ani{transition:all 0.2s ease-in-out}

.bg_cover{background-size:cover;background-position:center center;background-repeat:no-repeat}
.bg_cover .bg_img{display:none}

html,body,#viewport{height:100%}
#viewport{min-width:1204px}
.contains{position:relative;margin:0 auto;padding:0 40px;max-width:1124px}

.panel_area{position:relative;z-index:10}

#panel_header{height:100%;background:#1c2c38}
#panel_header .header_slide{position:relative;padding-bottom:360px;height:100%!important;overflow:hidden}
#panel_header .header_slide li{position:absolute;left:0;top:0;right:0;bottom:0;filter:alpha(opacity=0);opacity:0;z-index:10}
#panel_header .header_slide.load li:first-child{z-index:20}
#panel_header .header_slide li.on{z-index:20}
#panel_header .header_slide li.active{filter:"";opacity:1}
#panel_header .header_slide li.first.on{z-index:30}
#panel_header .header_slide li.active .img_box{transform:scale(1.04)}
#panel_header .header_slide .img_box{background-position:center center}
#panel_header .img_box{position:absolute;left:0;top:0;right:0;bottom:0}
#panel_header .header_text{position:absolute;left:0;top:50%;right:0;margin-top:-220px;text-align:center;z-index:100}
#panel_header .header_text .title{margin-bottom:30px;line-height:1em;text-indent:-10px;font-size:100px;color:#fff;font-weight:700;letter-spacing:-6px}
#panel_header .header_text .seoul{margin-bottom:-5px;line-height:1em;font-size:100px;color:#fff;font-weight:700;font-family:"Montserrat",sans-serif;letter-spacing:6px}
#panel_header .header_text .sub{line-height:1em;font-size:16px;color:#fff;font-weight:700;font-family:"Montserrat",sans-serif;letter-spacing:7px}
#panel_header .header_text .btn_letsgo{display:block;margin:0 auto;margin-top:130px;width:210px;height:56px;line-height:56px;text-align:center;font-size:21px;color:#fff;font-weight:700;font-family:"Montserrat",sans-serif;background:#e50304}
#panel_header .header_text .btn_letsgo:hover{filter:alpha(opacity=80);opacity:0.8}
#panel_header .header_text .btn_letsgo:active{filter:"";opacity:1}

#panel_video .text_area{position:relative;height:360px;text-align:center}
#panel_video .text_area .text_box{position:absolute;left:0;top:0;right:0;filter:alpha(opacity=0);opacity:0;z-index:10;transition:all 600ms ease-out}
#panel_video .text_area .text_box.on{top:80px;filter:"";opacity:1}
#panel_video .text_area .title{display:inline-block;position:relative;padding:0 80px;line-height:1.3em;font-size:48px;color:#fff;*display:inline;zoom:1}
#panel_video .text_area .title b{font-weight:700}
#panel_video .text_area .title .icon{display:block;position:absolute;left:0;top:15px;width:51px;height:45px;text-align:left;text-indent:-9999px;background:url("../img/icon/quote_left.png") no-repeat}
#panel_video .text_area .title .icon.right{left:auto;right:0;background:url("../img/icon/quote_right.png") no-repeat}
#panel_video .video_box{position:relative}
#panel_video .video_box .bg_img{display:block;position:relative;width:100%;z-index:20}
#panel_video .video_box .btn_video{display:block;position:absolute;left:50%;top:50%;margin:-55px 0 0 -55px;z-index:40}
#panel_video .video_box .btn_video .icon{display:block}
#panel_video .video_box .btn_video:hover{filter:alpha(opacity=80);opacity:0.8}
#panel_video .video_box .btn_video:active{filter:"";opacity:1}
#panel_video .video_box .bg_over{position:absolute;left:0;top:0;right:0;bottom:0;background:#000;filter:alpha(opacity=30);opacity:0.3;z-index:30}
#panel_video .video_box .bg_over.on{filter:alpha(opacity=0);opacity:0}
#panel_video .video_box.on .bg_img,
#panel_video .video_box.on .bg_over{filter:alpha(opacity=0);opacity:0;z-index:1}
#panel_video .video_box #video{position:absolute;left:0;top:0;z-index:10}

#panel_treasure{overflow:hidden}
#panel_treasure .text_box{height:340px;text-align:center}
#panel_treasure .text_box p{line-height:1.4em;font-size:18px;color:#5e5e5e}
#panel_treasure .text_box .title{padding-top:110px;margin-bottom:25px;font-size:56px;color:#24263f;font-weight:700}
#panel_treasure .menu_box{margin:0 -2px;margin-bottom:-1px;overflow:hidden}
/*#panel_treasure .treasure_menu{display:table;width:100%;table-layout:fixed}*/
#panel_treasure .treasure_menu{display:table;width:100%;table-layout:fixed;*display:block}
/*#panel_treasure .treasure_menu li{display:table-cell;border-left:2px solid #fff;border-right:4px solid #fff;vertical-align:top}*/
#panel_treasure .treasure_menu li{display:table-cell;border-left:2px solid #fff;border-right:4px solid #fff;vertical-align:top;*display:block;*float:left;*width:24.5%}
#panel_treasure .treasure_menu .bg{display:block;width:100%;filter:alpha(opacity=0);opacity:0}
#panel_treasure .treasure_menu .menu_box{display:block;position:relative;overflow:hidden}
#panel_treasure .treasure_menu .bg_cover{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10;transition:all 800ms ease-out}
#panel_treasure .treasure_menu .menu_box:hover .bg_over{filter:alpha(opacity=0);opacity:0}
#panel_treasure .treasure_menu .menu_box:hover .bg_box{transform:scale(1.04)}

#panel_map{position:relative;height:6774px;overflow:hidden}
#panel_map .map_line{position:absolute;left:0;top:0;width:100%;height:100%;background:url("../img/map/load_img.png") no-repeat center top;z-index:20}
#panel_map .map_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10}
#panel_map .map_area .contains{height:100%}
#panel_map .map_area .img_box{position:absolute;left:0;top:0;transition:all 800ms ease-out;z-index:10}
#panel_map .map_area .img_box .bg_img{display:block;filter:alpha(opacity=0);opacity:0}
#panel_map .map_area .img_box.on{transform:scale(1.1)}
#panel_map .map_area .map_01{left:-142px;top:318px}
#panel_map .map_area .map_02{left:540px;top:1320px}
#panel_map .map_area .map_03{left:-165px;top:2375px}
#panel_map .map_area .map_04{left:950px;top:3500px}
#panel_map .map_area .map_05{left:315px;top:4883px}
#panel_map .text_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:30}
#panel_map .text_area .contains{padding:0;height:100%}
#panel_map .text_area p{line-height:1.6em;font-size:16px;color:#181e35;letter-spacing:-1px;word-break:break-all}
#panel_map .text_area .sub{margin-bottom:20px;line-height:1.1em;font-size:30px;color:#000d2f;font-weight:500}
#panel_map .text_area .title{margin-bottom:40px;line-height:1.1em;text-indent:-4px;font-size:90px;color:#000d2f;font-weight:700; }
#panel_map .text_area .map_01{position:absolute;left:0;top:315px;padding-top:255px;width:100%}
#panel_map .text_area .map_01 .text_left{float:left;width:430px}
#panel_map .text_area .map_01 .img_right{float:right;position:relative}
#panel_map .text_area .map_01 .img_right .img{display:block;position:absolute;right:-40px;top:-30px}
#panel_map .text_area .map_01 .img_right .over{right:-150px;top:226px}
#panel_map .text_area .map_02{position:absolute;left:0;top:1315px;padding-top:60px;width:100%}
#panel_map .text_area .map_02 .text_top{margin-bottom:40px}
#panel_map .text_area .map_02 .text_top .title{margin-bottom:0}
#panel_map .text_area .img_mid{padding-bottom:40px;background:#fff}
#panel_map .text_area .text_column{background:#fff;overflow:hidden}
#panel_map .text_area .text_column .left{float:left;width:545px}
#panel_map .text_area .text_column .right{float:right;width:545px}
#panel_map .text_area .map_03{position:absolute;left:0;top:2400px;padding-top:167px;width:100%}
#panel_map .text_area .map_03 .img_right{width:640px}
#panel_map .text_area .map_03 .img_right .text{padding-top:490px;width:410px}
#panel_map .text_area .map_03 .text{background:#fff}
#panel_map .text_area .map_03 .text_left,
#panel_map .text_area .map_03 .img_right{position:relative;z-index:10}
#panel_map .text_area .map_03 .text_bg{position:absolute;left:400px;top:617px;width:100px;height:200px;background:#fff;z-index:5}
#panel_map .text_area .map_04{position:absolute;left:0;top:3510px;width:100%}
#panel_map .text_area .map_05{position:absolute;left:0;top:5380px;width:100%}
#panel_map .text_area .map_05 .title{margin-bottom:80px;line-height:1.3em;text-align:center;font-size:64px}
#panel_map .text_area .map_05 .title span{font-weight:200}
#panel_map .text_area .map_05 .slide_area{margin:0 auto;max-width:940px}
#panel_map .text_area .map_05 .text_column .left,
#panel_map .text_area .map_05 .text_column .right{width:450px}
#panel_map .text_area .map_05 .text_column p b{font-weight:700}
#panel_map .text_area .map_05 .slide_box{position:relative}
#panel_map .text_area .map_05 .slide_box .map_slide,
#panel_map .text_area .map_05 .slide_box .map_slide li{height:600px;overflow:hidden}
#panel_map .text_area .map_05 .slide_box .map_slide img{display:block}
#panel_map .text_area .map_05 .slide_box .btn_slide{display:block;position:absolute;right:60px;bottom:40px;width:60px;height:60px;text-align:left;text-indent:-9999px;background:rgba(21,19,28,0.5) url("../img/icon/slide_left.png") no-repeat center center;z-index:100}
#panel_map .text_area .map_05 .slide_box .btn_slide.right{right:0;background:rgba(21,19,28,0.5) url("../img/icon/slide_right.png") no-repeat center center}
#panel_map .text_area .map_05 .slide_box .btn_slide.left:hover{background:rgba(21,19,28,1) url("../img/icon/slide_left.png") no-repeat center center}
#panel_map .text_area .map_05 .slide_box .btn_slide.right:hover{background:rgba(21,19,28,1) url("../img/icon/slide_right.png") no-repeat center center}
#panel_map .text_area .text_box p{font-family:"SimHei","Malgun Gothic"}

#panel_map .middle_area{position:absolute;left:0;top:4385px;width:100%;height:500px;z-index:40}
#panel_map .middle_area .text_box{display:table;width:100%;height:500px;filter:alpha(opacity=0);opacity:0;text-align:center;transition:all 800ms ease-out}
#panel_map .middle_area.on .text_box{filter:"";opacity:1}
#panel_map .middle_area .text_box .text{display:table-cell;vertical-align:middle}
#panel_map .middle_area .text_box .text p{font-size:42px;color:#fff}
#panel_map .middle_area .text_box .text .title{margin-bottom:30px;font-size:72px;color:#fff;font-weight:700}

#panel_map .pin_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:25}
#panel_map .pin_area .pin{position:absolute;left:0;top:0;margin:103px 0 0 -19px;width:68px;height:89px;background:url("../img/map/map_pin_ic.png") no-repeat;z-index:15}

#footer{background:#f7f8fc}
#footer .footer_top{padding:200px 0 80px 0;text-align:center}
#footer .footer_top .img_box{margin-bottom:130px}
#footer .footer_top .link_box .link{font-size:24px;color:#868d98;font-weight:500}
#footer .footer_top .link_box .link .icon{margin:-1px 0 0 15px;vertical-align:middle}
#footer .footer_bottom{padding:70px 0;text-align:center;background:#edf1f6}
#footer .footer_bottom .copyright{font-size:14px;color:#888}

/* Top Gnb */
.rooftop {
	position: fixed; z-index: 1000;
	top: 0; right: 0; bottom: 0; left: 0;
	background-color: #fff;
	height: 46px;
	filter:alpha(opacity=0);opacity:0;
}
.rooftop.on{filter:"";opacity:1}
.joins_gnb {
	background-color: #fff !important;
}
.joins_gnb .doc {
	padding:0 40px;width:auto!important;
}
.forehead {
	line-height: 46px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1)
}
.forehead .inner {
	position: relative;
	padding:0 40px;width:auto!important;
	height: 46px;
	margin: auto;
}
.forehead .inner:after {
	content: '';
	clear: both;
	display: block;
}
.brandsolution-logo {
	float: left;
	margin-top: 10px;
}
.brandsolution-logo a {
	display: block;
	width: 128px; height: 13px;
	background: url(../img/sp-common.png) no-repeat 0 0;
}
.brandsolution-logo img{vertical-align:top}
.brand-identity {
	position: absolute;
	top: 10px; left: 50%;
	width: 231px; height: 25px;
	margin-left: -115px;
	text-align: center;
}
.brand-identity img {
	vertical-align: top;
}
.sns-share-box {
	float: right;
	margin-top: 10px;
}
.sns-share-box > ul:after {
	content: '';
	display: block;
	clear: both;
}
.sns-share-box > ul > li {
	float: left;
	margin: 0 0 0 15px
}
.sns-share-box > ul > li > a {
	display: block;
	width: 25px; height: 25px;
}
.sns-share-box img{vertical-align:top}

.forehead .sns-share-box .lang{padding-right:10px}
.forehead .sns-share-box .lang a{float:left;padding:0 5px;width:auto;height:25px;line-height:25px;font-size:14px;color:#898989;font-weight:normal}
.forehead .sns-share-box .lang a:hover{text-decoration:underline}
.forehead .sns-share-box .lang .line{display:block;float:left;margin:7px 5px 0 7px;width:1px;height:11px;background:#cfcfcf}

.sns-share-box .sns-wb{background:url("../img/icon/header_sns_weibo_ic.png") no-repeat center center}
.sns-share-box .sns-tc{background:url("../img/icon/header_sns_tencent_ic.png") no-repeat center center}
.sns-share-box .sns-wb:hover{background:url("../img/icon/header_sns_weibo_ic_on.png") no-repeat center center}
.sns-share-box .sns-tc:hover{background:url("../img/icon/header_sns_tencent_ic_on.png") no-repeat center center}

body{font-family:"Noto Sans SC",sans-serif;font-family:300}
body.tc{font-family:"Noto Sans TC",sans-serif;font-family:300}
body.kor{font-family:"Noto Sans KR","Noto Sans SC",sans-serif;font-family:300}
body.kor #panel_map{height:6550px}
body.kor #panel_map .map_line{background:url("../img/map/kor/load_img.png") no-repeat center top}

