@charset "utf-8";


/* ******************************************************
	00. common
*******************************************************/
.letter{letter-spacing:normal !important} 
.under{text-decoration: underline !important}
html.fix{overflow-y:hidden}
.d_t{display:table;width:100%;height:100%;table-layout:fixed}
.d_c{display:table-cell;width:100%;vertical-align:middle}

.v_t{vertical-align:top !important}
.v_m{vertical-align:middle !important}
.v_b{vertical-align:bottom !important}

.mobile_data{display:none;}



/* ******************************************************
	01. Font
*******************************************************/
html{font-family:"aktiv-grotesk",sans-serif;font-weight:400;text-align:left;color:#fff;font-size:18px;line-height:1.556;word-break:keep-all;}
body {background-color:#000;}
input,textarea,select,button {font-family:"aktiv-grotesk",sans-serif;font-weight:400;}
button{outline:none;border:none;background:none;cursor:pointer}
button > span {position:relative;}


.f_200{font-weight:200}/* Thin */
.f_300{font-weight:300}/* light */
.f_400{font-weight:400}/* Reguler */
.f_500{font-weight:500}/* Medium */
.f_700{font-weight:700}/* Bold */
.f_800{font-weight:800}/* EB */

.text_c{text-align:center !important;}
.text_l{text-align:left !important;}
.text_r{text-align:right !important;}

.text_over{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.nPd{padding:0 !important}


/* ******************************************************
	02. layout
*******************************************************/
#wrap{position:relative;overflow:hidden;opacity:0;transition:opacity 0.5s ease;}
#wrap.open{opacity:1;}

#header{position:fixed;top:0;left:0;width:100%;height:120px;z-index:1000;box-sizing:border-box;transition:background 0.5s, height 0s 0.5s, transform 0.45s cubic-bezier(0.250, 0.460, 0.450, 0.940);;overflow:hidden;}
#header.scroll {background-color:rgba(0,0,0,1);}
#header.open {height:100%; background-color:rgba(0,0,0,1);transition:background 0.5s, height 0s 0s ease;}
#header.open .btn_header_menu_open {opacity:0; visibility:visible;  transition:opacity 0.5s 0s, visibility 0s 0.5s ease }
#header.open .btn_header_menu_close {opacity:1; visibility:visible;  transition:opacity 0.5s 0s, visibility 0s 0s ease }
#header.open .header_visual{opacity:1;transition:opacity 0.6s 0.2s ease;}
#header.open .header_visual .visual{}
#header.open .btn_header_menu > span:before{transform:rotate(-30deg) translate(-4px, 0px);}
#header.open .btn_header_menu > span:after{transform:rotate(30deg) translate(-4px, -0px);}

#header.down {transform: translate(0px, -140px);}
#header.up {transform: translate(0px, 0px);}

.header_wrap{position:relative; height:120px;}
.header_wrap h1 {position:absolute;top:50px;left:0;display:block;width:95px;height:50px;z-index:2;}
.header_wrap h1 a{position:absolute;top:0;left:0;display:block;width:100%;height:100%;font-size:0;background:url(../images/common/logo.png) left top no-repeat;}

#header .global-menu {position:absolute; height:27px; top:70px; right:76px; font-size:0;}
#header .global-menu > a {position:relative; display:inline-block; font-size:20px; line-height:30px; font-weight:500; opacity:0.4; transition:opacity 0.35s ease;}
#header .global-menu > a + a {margin-left:15px;}
#header .global-menu > a.actived,
#header .global-menu > a:hover {opacity:1;}

.header_visual {position:absolute;top:0;left:0;display:block;width:100%;height:100%;z-index:1;opacity:0;transition:opacity 0.6s ease;}
.header_visual:before {content:'';position:absolute;top:0;left:0;display:block;width:calc(50% - 342px);height:100%;z-index:1;background:#000;z-index:5;}
.header_visual .visual_wrap {position:absolute;top:0;right:0;display:block;width:calc(50% + 342px);height:100%;z-index:1;}
.header_visual .visual_wrap .visual {position:absolute;top:0;right:0;display:block;width:100%;height:100%;z-index:1;}
.header_visual .visual .visual_item {content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-size:cover;}
.header_visual .visual.visual_cell {transform:translate(0px , 0px); transition:opacity 0.45s, transform 0.95s cubic-bezier(0.250, 0.460, 0.450, 0.940);opacity:0;}
.header_visual .visual.visual_cell.actived {transform:translate(0px , 0px); opacity:1;}
.header_visual .visual_01 .visual_item {background-image:url(../images/common/header_visual_01.png);background-position:center center;opacity:0.4}
.header_visual .visual_0201 .visual_item {background-image:url(../images/common/header_visual_0201.png);background-position:center center;opacity:0.4}
.header_visual .visual_0202 .visual_item {background-image:url(../images/common/header_visual_0202.png);background-position:center center;opacity:0.4}
.header_visual .visual_03 .visual_item {background-image:url(../images/common/header_visual_03.png);background-position:center center;opacity:0.4}
.header_visual .visual_04 .visual_item {background-image:url(../images/common/header_visual_04.png);background-position:center center;opacity:0.4}
.header_visual .visual_05 .visual_item {background-image:url(../images/common/header_visual_05.png);background-position:center center;opacity:0.4}
.header_visual .visual_06 .visual_item {background-image:url(../images/common/header_visual_06.png);background-position:center center;opacity:0.4}
.header_visual .visual_07 .visual_item {background-image:url(../images/common/header_visual_07.png);background-position:center center;opacity:0.4}

.header_info{position:absolute;bottom:0;left:0;width:100%;}
.header_info .copy{margin-top:20px;border-top:1px solid #fff; font-size:0;height:40px}

.btn_header_menu{position:absolute;top:40px;right:-35px;display:block;width:94px;height:89px}
.btn_header_menu > span{position:absolute;top:50%;left:50%;display:block;width:24px;height:3px;background:#fff;margin:-1.5px 0 0 -12px;}
.btn_header_menu > span:before{content:'';position:absolute;bottom:100%;left:0;display:block;width:24px;height:3px;background:#fff;margin:0 0 5px 0;border-radius: 6px 0px 0px 0px;/*transform-origin: 60% 120%;*/transition:all 0.45s ease;}
.btn_header_menu > span:after{content:'';position:absolute;top:100%;left:0;display:block;width:24px;height:3px;background:#fff;margin:5px 0 0 0;border-radius: 0px 0px 0px 6px;/*transform-origin: 60% -20%;*/transition:all 0.45s ease;}

.btn_header_menu_open {position:absolute;top:95px;right:0;display:block;width:24px;height:19px;font-size:0;background:url(../images/common/btn_header_menu_open.png) left top no-repeat; opacity:1; visibility:visible; transition:opacity 0.5s 0s, visibility 0s 0.5s ease;}
.btn_header_menu_close {position:absolute;top:91px;right:0;display:block;width:27px;height:27px;font-size:0;background:url(../images/common/btn_header_menu_close.png) left top no-repeat; opacity:0; visibility:hidden; transition:opacity 0.5s 0s, visibility 0s 0.5s ease }

#gnb {position:absolute; top:226px; left:0; display:block; width:100%;}
#gnb.open > ul > li{opacity:1;transform: translate(0px, 0px);}
#gnb.open > ul > li:nth-child(1){transition-delay:0.20s;}
#gnb.open > ul > li:nth-child(2){transition-delay:0.35s;}
#gnb.open > ul > li:nth-child(3){transition-delay:0.50s;}
#gnb.open > ul > li:nth-child(4){transition-delay:0.65s;}
#gnb.open > ul > li:nth-child(5){transition-delay:0.80s;}
#gnb.open > ul > li:nth-child(6){transition-delay:0.95s;}
#gnb.open > ul > li:nth-child(7){transition-delay:1.00s;}
#gnb > ul > li{margin-top:18px;position:relative;opacity:0;transform: translate(0px, 50px);padding-left:190px;transition:opacity 0.6s, transform 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
#gnb > ul > li:first-child{margin-top:0;}
#gnb > ul > li:before{content:'';position:absolute;top:20px;left:0;display:block;width:160px;height:1px;background:#FFDC73;opacity:0;transition:opacity 0.5s ease;}
#gnb > ul > li:after{content:'';position:absolute;top:10px;left:155px;display:block;width:1px;height:12px;transform:rotate(-45deg);background:#FFDC73;opacity:0;transition:opacity 0.5s ease;}
#gnb > ul > li > a {display:inline-block;font-size:30px;font-weight:700;line-height:40px;color:#fff;transition:color 0.5s ease;z-index:10;vertical-align:top;}
#gnb > ul > li:hover > a {color:#FFDC73}
#gnb > ul > li:hover:before{opacity:1;}
#gnb > ul > li:hover:after{opacity:1;}
#gnb > ul > li.actived > a{color:#FFDC73}
/*#gnb > ul > li.actived:before {opacity:1;}*/
#gnb > ul > li.open > a:before {opacity:0;}
.snb {display:inline-block;font-size:0;margin-left:37px;}
.snb > li{display:inline-block;visibility:hidden;transform:translate(-20px , 0px);opacity:0;transition:visibility 0s 0.35s, opacity 0.35s 0s, transform 0.35s 0s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
.snb > li + li {margin-left:32px;}
.snb > li > a {display:inline-block;position:relative;font-size:30px;font-weight:700;line-height:40px;color:#fff;transition:color 0.5s ease;padding-left:46px;z-index:10;}
.snb > li > a:hover {color:#FFDC73}
.snb > li.actived > a{color:#FFDC73}
.snb > li.actived:before {opacity:1;}
.snb.toggle > li {visibility:visible;}
.snb.toggle > li:nth-child(1) {opacity:1; transform:translate(0px , 0px); transition:visibility 0s 0s, opacity 0.35s 0.15s, transform 0.35s 0.15s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
.snb.toggle > li:nth-child(2) {opacity:1; transform:translate(0px , 0px); transition:visibility 0s 0s, opacity 0.35s 0.25s, transform 0.35s 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
.snb.toggle > li:nth-child(3) {opacity:1; transform:translate(0px , 0px); transition:visibility 0s 0s, opacity 0.35s 0.35s, transform 0.35s 0.35s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
.snb.toggle > li:nth-child(4) {opacity:1; transform:translate(0px , 0px); transition:visibility 0s 0s, opacity 0.35s 0.45s, transform 0.35s 0.45s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
.snb.toggle > li:nth-child(5) {opacity:1; transform:translate(0px , 0px); transition:visibility 0s 0s, opacity 0.35s 0.55s, transform 0.35s 0.55s cubic-bezier(0.250, 0.460, 0.450, 0.940)}


#footer{position:relative;padding:90px 0 42px 0; background:#000; z-index:50;}
#footer h2 {position:relative;width:285px;height:60px;font-size:0;background:url(../images/common/footer_logo.png) left top no-repeat;}
/*#footer ul{position:absolute; top:28px; right:330px;}
#footer ul li{margin-top:9px;line-height:1;}
#footer ul li:first-child{margin-top:0;}
#footer ul li a{font-size:14px;color:#fff;line-height:19px;transition:color 0.5s ease;}
#footer ul li a:hover {color:#FFDC73;}*/
#footer dl {position:absolute; top:28px; right:362px; padding:0 0 0 60px;}
#footer dl dt,
#footer dl dd {font-size:14px;color:#fff;line-height:19px;margin-top:9px;transition:color 0.5s ease;}
#footer dl dd a:hover{color:#FFDC73;}
#footer dl dt,
#footer dl dt + dd {margin-top:0;}
#footer dl dt {position:absolute;top:0;left:0;font-weight:700;display:none;}
#footer dl:nth-child(2) {right:70px;padding:0 0 0 97px;}
#footer dl:nth-child(2) dt {display:block;}
#footer dl2 {position:absolute; top:28px; right:35px; display:block; padding:0 0 0 97px;}
#footer dl2 dt,
#footer dl2 dd {font-size:14px;color:#fff;line-height:19px;margin-top:9px;transition:color 0.5s ease;}
#footer dl2 dd a:hover{color:#FFDC73;}
#footer dl2 dt,
#footer dl2 dt + dd {margin-top:0;}
#footer dl2 dt {position:absolute;top:0;left:0;font-weight:700;}

#footer .copy {position:relative;margin-top:130px;font-size:14px;line-height:19px;padding:9px 0 0 0;border-top:1px solid #fff;}
#footer .global-menu {position:absolute; height:27px; top:9px; right:0; font-size:0;}
#footer .global-menu > a {position:relative; display:inline-block; font-size:13px; line-height:17px; font-weight:400; opacity:0.4; transition:opacity 0.35s ease;}
#footer .global-menu > a + a {margin-left:12px;}
#footer .global-menu > a.actived,
#footer .global-menu > a:hover {opacity:1;}

.fix_data_migration_tool {position:fixed;bottom:55px;right:50%;margin-right:-603px; display:block; z-index:500;}
.fix_data_migration_tool .btn_data_tool {position:relative;display:inline-block;width:220px;height:40px;border-radius:20px;overflow:hidden;text-align:center;}
.fix_data_migration_tool .btn_data_tool .default_txt {position:absolute;top:0;left:0;display:block;width:100%;height:100%;z-index:1;font-size:14px;line-height:40px;font-weight:500;overflow:hidden;
	background: linear-gradient(90deg,  rgba(45,45,45,1) 0% , rgba(255,220,115,1) 20%, rgba(255,220,115,1) 100%);
  background-repeat: no-repeat;
  background-size: 80%;
  animation: dataToolAnimate 2.5s linear infinite;
  -webkit-background-clip: text;
  -webkit-text-fill-color: rgba(255, 255, 255, 0);
}
.fix_data_migration_tool .btn_data_tool .visible_txt {position:absolute;top:0;right:0;display:block;width:100%;height:100%;color:#2d2d2d;z-index:5;font-size:14px;line-height:40px;font-weight:500;z-index:0;}
.fix_data_migration_tool .btn_data_tool .over_txt {position:absolute;top:0;right:0;display:block;width:0;height:100%;z-index:5;font-size:14px;line-height:40px;overflow:hidden;transition:width 0.45s cubic-bezier(0.455, 0.030, 0.515, 0.955);transform:translate3d(0px, 0px, 5px);}
.fix_data_migration_tool .btn_data_tool .over_txt .txt {position:absolute;top:0;right:0;display:block;width:220px;height:40px;font-weight:500;text-align:center;color:#000;}
.fix_data_migration_tool .btn_data_tool .over_txt:before {content:'';position:absolute;top:0;right:0;display:block;width:0;height:40px;border-radius:0;background:#fff; opacity:0; transition:opacity 0.45s 0.12s ease, width 0.45s cubic-bezier(0.455, 0.030, 0.515, 0.955);}
.fix_data_migration_tool .btn_data_tool:hover .over_txt {left:0;right:auto;width:100%; opacity:1;}
.fix_data_migration_tool .btn_data_tool:hover .over_txt .txt {left:0;right:auto;}
.fix_data_migration_tool .btn_data_tool:hover .over_txt:before {left:0;right:auto;width:100%;opacity:1;transition:opacity 0.45s 0s cubic-bezier(0.455, 0.030, 0.515, 0.955), width 0.45s cubic-bezier(0.455, 0.030, 0.515, 0.955);}
.fix_data_migration_tool.hide {display:none;}

@keyframes dataToolAnimate {
  0% {
    background-position: -500%;
  }
  100% {
    background-position: 500%;
  }
}


/* ******************************************************
	@ reponsive
*******************************************************/

@media screen and (max-width:1439px){		
	.header_visual:before {width:292px}
	.header_visual .visual_wrap {width:auto;height:auto;top:0;right:0;bottom:0;left:0;margin:auto auto auto 292px;}
}

@media screen and (max-width:1366px){
	
	#gnb {top:204px;}
	.snb {display:none;margin:8px 0 0 -190px;}
	.snb > li{display:block;visibility:visible !important;transform:translate(0px , 0px)  !important;opacity:1  !important;transition:none !important;position:relative;margin-left:0 !important;padding-left:225px}
	.snb > li > a {transition:none;padding-left:0;}
	.snb > li > a:hover {color:inherit}
	.snb > li.actived > a{color:#FFDC73}
	.snb > li.actived:before{content:'';position:absolute;top:20px;left:0;display:block;width:200px;height:1px;background:#FFDC73;opacity:1;transition:opacity 0.5s ease;}
	.snb > li.actived:after{content:'';position:absolute;top:10px;left:195px;display:block;width:1px;height:12px;transform:rotate(-45deg);background:#FFDC73;opacity:1;transition:opacity 0.5s ease;}
}

@media screen and (max-width:1268px){
.fix_data_migration_tool {right:35px;margin-right:0;}

}
@media screen and (max-width:1024px){	
	#gnb > ul > li:hover:before{opacity:0;}
	#gnb > ul > li:hover:after{opacity:0;}
	#gnb > ul > li:hover > a {color:inherit}
	#gnb > ul > li.open > a{color:#FFDC73}
	#gnb > ul > li.actived:before{opacity:1}
	#gnb > ul > li.actived:after{opacity:1}
	#gnb > ul > li.actived.open:before{opacity:0;}
	#gnb > ul > li.actived.open:after{opacity:0;}


}

@media screen and (max-width:800px){
	html{font-size:16px;line-height:24px;word-break:keep-all;}
	
	#header.open .inner {height:100%;}
	#header.open .header_wrap {height:100%;}
	#gnb {position:absolute;top:0;right:0;bottom:0;left:0;width:auto;height:auto;margin:171px auto 131px auto; overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling: touch;}
	#gnb > ul {padding:0 0 35px 0;}
	#gnb > ul > li{margin-top:28px;}
	#gnb > ul > li:first-child{margin-top:0;}
	#gnb > ul > li:before{width:33px;}
	#gnb > ul > li:after{left:28px;}	
	#gnb > ul > li {padding-left:47px}
	#gnb > ul > li > a {line-height:35px;}
	#gnb > ul > li.actived > a{color:#FFDC73}
	/*
	#gnb > ul > li.open:before{opacity:1;}
	#gnb > ul > li.open:after{opacity:1;}
	*/
	.header_visual .visual.visual_cell {transform:translate(0px , 0px);}
	.header_visual .visual_01 .visual_item {background-image:url(../images/common/header_visual_01_m.png);}
	.header_visual .visual_0201 .visual_item {background-image:url(../images/common/header_visual_0201_m.png);}
	.header_visual .visual_0202 .visual_item {background-image:url(../images/common/header_visual_0202_m.png);}
	.header_visual .visual_03 .visual_item {background-image:url(../images/common/header_visual_03_m.png);}
	.header_visual .visual_04 .visual_item {background-image:url(../images/common/header_visual_04_m.png);}
	.header_visual .visual_05 .visual_item {background-image:url(../images/common/header_visual_05_m.png);}
	.header_visual .visual_06 .visual_item {background-image:url(../images/common/header_visual_06_m.png);}
	.header_visual .visual_07 .visual_item {background-image:url(../images/common/header_visual_07_m.png);}

	
	.header_visual:before {width:137px}
	.header_visual .visual_wrap {width:auto;height:auto;top:0;right:0;bottom:0;left:0;margin:auto auto auto 137px;}
	.snb {margin:8px 0 0 -47px;}
	.snb > li{padding-left:79px;}
	.snb > li.actived:before{width:66px;}
	.snb > li.actived:after{left:61px;}

	.fix_data_migration_tool {display:none !important;}

	#header .global-menu {top:44px; right:44px}


	#header{height:100px;}
	#header.down {transform: translate(0px, -100px);}
	#header.up {transform: translate(0px, 0px);}

	.header_wrap{height:100px;}
	.header_wrap h1 {top:30px;width:78px;height:41px}
	.header_wrap h1 a{background:url(../images/common/logo_x02.png) left top no-repeat;background-size:100% auto;}

	.btn_header_menu_open {top:0;right:-35px;width:94px;height:100px;background:url(../images/common/btn_header_menu_open_x02.png) center 48px no-repeat;background-size:24px auto;;}
	.btn_header_menu_close {top:0;right:-35px;width:97px;height:100px;background:url(../images/common/btn_header_menu_close_x02.png) center 44px no-repeat;background-size:27px auto;;}

	.btn_header_menu{top:13px}	


	.header_info{}
	.header_info .inner{padding-top:30px;background:#000}
	.header_info .copy{font-size:14px;line-height:19px;padding-top:9px;box-sizing:border-box;height:57px}

	#footer{padding:40px 0 30px 0;}
	#footer:before {content:'';position:absolute;top:0;left:0;right:0;bottom:auto;display:block;width:auto;height:1px;margin:40px 35px auto 35px;background:#fff;}
	#footer h2 {width:231px;height:40px;margin-top:78px;background:url(../images/common/footer_logo_x02.png) left top no-repeat;background-size:231px auto;}
	#footer ul{position:relative;top:auto;right:auto;padding-top:19px;border-top:1px solid #fff;}
	#footer dl {position:relative;top:auto;right:auto;margin-top:19px;padding:0;}
	#footer dl dt {position:absolute;top:0;left:0;font-weight:700;display:none;}
	#footer dl dd{margin-top:8px}
	#footer dl:nth-child(2) {padding:0;top:auto;right:auto;margin-top:38px;}
	#footer dl:nth-child(2) dt {display:none;}
	#footer .copy {margin-top:20px;}
	#footer .copy {position:relative;margin-top:130px;font-size:14px;line-height:19px;padding:9px 0 0 0;border-top:1px solid #fff;}
	#footer .global-menu {height:16px; top:10px; right:0; font-size:0;}
	#footer .global-menu > a {font-size:12px; line-height:16px; font-weight:400; opacity:0.4; transition:opacity 0.35s ease;}
	#footer .global-menu > a + a {margin-left:10px;}
	#footer .global-menu > a.actived,
	#footer .global-menu > a:hover {opacity:1;}



}

@media screen and (max-width:414px){	
	
}

@media screen and (max-width:360px){	
	
}