@import url("default.css");
@charset "utf-8";

.codrops-header								{ position: relative; height: 100vh; min-height: 600px; text-align: center; color: #fff; }
.wrap										{ float: left; position:relative; width:100%; overflow: hidden; z-index:10; min-height: 100vh; }

.vertical_line								{ width:100%; min-height: 100vh; left:0; top:0; position: absolute; z-index:1; background: repeating-linear-gradient(90deg, #F4F5F7, #F4F5F7 1px, transparent 0, transparent calc(100% / 5)); -webkit-animation: vertical_line_any 1000ms ease 1; animation: vertical_line_any 1000ms ease 1; }
@-webkit-keyframes vertical_line_any		{ 	0%   { top:-100vh; }	100% { top:0px; } }
@keyframes vertical_line_any				{	0%   { top:-100vh; }	100% { top:0px; } }


.sub_vertical_line							{ width:100%; min-height: 100vh; left:0; top:0; position: absolute; z-index:1; background: repeating-linear-gradient(90deg, #3D3D3E, #3D3D3E 1px, transparent 0, transparent calc(100% / 5)); -webkit-animation: sub_vertical_line_any 1000ms ease 1; animation: sub_vertical_line_any 1000ms ease 1; }
@-webkit-keyframes sub_vertical_line_any	{ 	0%   { top:-100vh; }	100% { top:0px; } }
@keyframes sub_vertical_line_any			{	0%   { top:-100vh; }	100% { top:0px; } }

.owl-theme .owl-nav							{ text-align: center; -webkit-tap-highlight-color: transparent; }
.owl-theme .owl-nav [class*='owl-']			{ color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; border:3px solid rgba(255, 255, 255, .5); display: inline-block; cursor: pointer; }
.owl-theme .owl-nav [class*='owl-']:hover	{ border-color:#fff; text-decoration: none; }
.owl-theme .owl-nav .disabled				{ opacity: 0.5; cursor: default; }
.owl-theme .owl-nav.disabled + .owl-dots	{ margin-top: 10px; }

.owl-theme .owl-dots						{ position: absolute; bottom:0; right:-60px; text-align: center; -webkit-tap-highlight-color: transparent; z-index:101; -webkit-animation: owl-dots_any 2000ms ease 1; animation: owl-dots_any 2000ms ease 1; }

@-webkit-keyframes owl-dots_any				{ 0%   { right:-6000px; } 100% { right:-60px; } }
@keyframes owl-dots_any						{ 0%   { right:-6000px; } 100% { right:-60px; } }

.owl-theme .owl-dots .owl-dot				{ display: inline-block; zoom: 1; *display: inline; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; }
.owl-theme .owl-dots .owl-dot span			{ width: 5px; height: 16px; margin:0 5px; display: block; background:#888; -webkit-backface-visibility: visible; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background:#000; height: 35px; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; }

.owl-carousel								{ display: none; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 10; }
.owl-carousel .owl-stage					{ position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; }
.owl-carousel .owl-stage:after				{ content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.owl-carousel .owl-stage-outer				{ position: relative; overflow: hidden; -webkit-transform: translate3d(0px, 0px, 0px); }
.owl-carousel .owl-wrapper,  .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); }
.owl-carousel .owl-item						{ position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
.owl-carousel .owl-item img					{ display: block; width: 100%; }
.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled			{ display: none; }
.owl-carousel .owl-nav .owl-prev, 
.owl-carousel .owl-nav .owl-next, 
.owl-carousel .owl-dot						{ cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel button.owl-dot				{ background: none; color: inherit; border: none; padding: 0 !important; font: inherit; }
.owl-carousel.owl-loaded					{ display: block; }
.owl-carousel.owl-loading					{ opacity: 0; display: block; }
.owl-carousel.owl-hidden					{ opacity: 0; }
.owl-carousel.owl-refresh .owl-item			{ visibility: hidden; }
.owl-carousel.owl-drag .owl-item			{ -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.owl-carousel.owl-grab						{ cursor: move; cursor: grab; }
.owl-carousel.owl-rtl						{ direction: rtl; }
.owl-carousel.owl-rtl .owl-item				{ float: right; }
.owl-height									{ transition: height 500ms ease-in-out; }

.header										{ display: block; width: 100%; height: 120px; padding:35px; }
.fixed										{ position: fixed !important; z-index:1001; right: 0; left: 0; top: 0; }
.logo										{ float: left; width:44px; height:46px; background:url(../img/main/logo.png) no-repeat center; background-size: 44px 46px; cursor:pointer; }
.logo_white									{ float: left; width:44px; height:46px; background:url(../img/main/logo_white.png) no-repeat center; background-size:44px 46px; cursor:pointer; }

.menu_wrap									{ float: right; position: relative; color:#888; }
.menu_wrap ul								{ display: inline-block; }
.menu_wrap ul li							{ float: left; display: inline; font-weight:300; margin:0 15px; cursor:pointer; margin-top:8px; }
/*.menu_wrap ul li:last-child					{ margin-top:0; width:120px; }*/
.menu_wrap ul li a:hover					{ color:#000; }
.menu_wrap ul li a							{ color:#888; font-size:16px; position: relative; display: block; text-decoration: none; text-transform: uppercase; transition: 0.5s; padding-bottom: 10px; }
.menu_wrap ul li a:after					{ position: absolute; content: ""; width: 100%; height: 2px; top: 100%; left: 0; background: #000; transition: transform 0.5s; transform: scaleX(0); transform-origin: right; }
.menu_wrap ul li a:hover:after				{ transform: scaleX(1); transform-origin: left; }
/*.menu_wrap dt								{ float: left; display: inline; }*/
.menu_wrap #menu .active > a				{ color:#000 !important; }
.menu_wrap #menu .active > a:after			{ position: absolute; content: ""; width: 100%; height: 2px; top: 100%; left: 0; background: #000; transition: transform 0.5s; transform: scaleX(1) !important; transform-origin: left !important; }

.sub_menu_wrap								{ float: right; position: relative; color:#888; }
.sub_menu_wrap ul							{ display: inline-block; }
.sub_menu_wrap ul li						{ float: left; display: inline; font-weight:300; margin:0 15px; cursor:pointer; margin-top:8px; }
/*.menu_wrap ul li:last-child				{ margin-top:0; width:120px; }*/
.sub_menu_wrap ul li a:hover				{ color:#fff; }
.sub_menu_wrap ul li a						{ color:#888; font-size:16px; position: relative; display: block; text-decoration: none; text-transform: uppercase; transition: 0.5s; padding-bottom: 10px; }
.sub_menu_wrap ul li a:after				{ position: absolute; content: ""; width: 100%; height: 2px; top: 100%; left: 0; background: #fff; transition: transform 0.5s; transform: scaleX(0); transform-origin: right; }
.sub_menu_wrap ul li a:hover:after			{ transform: scaleX(1); transform-origin: left; }
.sub_menu_wrap #menu .sub_active > a		{ color:#fff !important; }
.sub_menu_wrap #menu .sub_active > a:after	{ position: absolute; content: ""; width: 100%; height: 2px; top: 100%; left: 0; background: #fff; transition: transform 0.5s; transform: scaleX(1) !important; transform-origin: left !important; }

.sns_box dt								    { float: left; display: inline; }
.sns_box									{ float: right; }

.move										{ -webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; transition:all .5s ease-in-out; }
.move_default								{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.0) !important; }
.move_reset									{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.9); }
.move_up									{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.9); }

.business_move								{ -webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; transition:all .5s ease-in-out; }
.business_move_default						{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.0) !important; }
.business_move_reset						{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.8); }
.business_move_up							{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.8); }

.facebook_button							{ margin-left:10px; width:30px; height:38px; border:0; background:url(../img/main/icon_facebook.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.facebook_button:hover						{ background-position:center -38px; }

.instagram_button							{ margin-left:5px; width:30px; height:38px; border:0; background:url(../img/main/icon_instagram.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.instagram_button:hover						{ background-position:center -38px; }

.blog_button								{ margin-left:5px; width:50px; height:38px; border:0; background:url(../img/main/icon_blog.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.blog_button:hover							{ background-position:center -38px; }


.sub_facebook_button						{ margin-left:10px; width:30px; height:38px; border:0; background:url(../img/main/icon_facebook_white.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.sub_facebook_button:hover					{ background-position:center -38px; }
.sub_instagram_button						{ margin-left:5px; width:30px; height:38px; border:0; background:url(../img/main/icon_instagram_white.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.sub_instagram_button:hover					{ background-position:center -38px; }
.sub_blog_button							{ margin-left:5px; width:50px; height:38px; border:0; background:url(../img/main/icon_blog_white.png) no-repeat center top; transition:all 0.4s ease; cursor:pointer; }
.sub_blog_button:hover						{ background-position:center -38px; }



.download									{ position:absolute; right:80px; top:35px;  color:#fff; cursor:pointer; background:url(../img/main/icon_down.png) no-repeat center; /*background-size: 300px 100px;*/ width:40px; height:30px; cursor:pointer; }
.down_spinner								{ display:none; right:92px; top:38px; position:absolute; width:20px; height: 20px; box-sizing: border-box; border: solid 2px transparent; border-top-color: #fff; border-left-color: #fff; border-radius: 50%; -webkit-animation: nprogress-spinner 400ms linear infinite; animation: nprogress-spinner 400ms linear infinite; }

.circle1									{ top:-100px; right:50px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.circle1 span.center						{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.circle2									{ bottom:-300px; left:150px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.circle2 span.center						{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.circle3									{ bottom:-300px; right:150px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.circle3 span.center						{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.section									{ position: relative; min-height:500px; width:100%; clear:both; }

.visual_box									{ position: relative; width:60%; background-color: rgba(255, 255, 255, 0); padding-top:200px; -webkit-animation: visual_box_any 2000ms ease 1; animation: visual_box_any 2000ms ease 1; }
@-webkit-keyframes visual_box_any			{ 0%   { left:-3000px; } 100% { left:0px; } }
@keyframes visual_box_any					{ 0%   { left:-3000px; } 100% { left:0px; } }

.visual_img_01								{ position: relative; height:65vh; background:url(../img/main/visual_img_01.png) no-repeat center center; /*background-position: top 0px right 0px; */ background-size: cover; }
.visual_img_02								{ position: relative; height:65vh; background:url(../img/main/visual_img_02.png) no-repeat center center; /*background-position: top 0px right 0px; */ background-size: cover; }
.visual_img_03								{ position: relative; height:65vh; background:url(../img/main/visual_img_03.png) no-repeat center center; /*background-position: top 0px right 0px; */ background-size: cover; }
.visual_text								{ position: absolute; font-size:130px; font-weight:900; white-space : nowrap; z-index:101; line-height:130px; left:50%; top:50%; transform:translate(-50%, -50%);  }
.ti-cursor									{ font-size:130px !important; }
.since										{ position: absolute; font-size:13px; font-weight:700; z-index:101; -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); right:10px; top:50%;  }

.icon_mouse									{ width: 50px; height: auto; text-align:center; position: absolute; z-index:101; right:30px; bottom:50px; }
.sub_icon_mouse								{ width: 50px; height: auto; text-align:center; position: absolute; z-index:101; right:30px; bottom:50px; color:#fff; }

.mouse										{ width: 36px; height: auto; }
.scroll										{ animation-name: scroll; animation-duration: 1.5s;	animation-timing-function: cubic-bezier(0.650, -0.550, 0.250, 1.500); animation-iteration-count: infinite; transform-origin: 50% 20.5px; will-change: transform, opacity; opacity: 1; }
@keyframes scroll							{ 0%, 20% { transform: translateY(0) scaleY(1);	} 100% { transform: translateY(36px) scaleY(2); opacity: 0; } }

.contents_wrap								{ position: relative; width:1200px; padding: 0 30px; margin:0 auto; height: auto; z-index:100; }
.partners_contents_wrap						{ position: relative; width:1260px; padding: 0 30px; margin:0 auto; }
.company_logo								{ min-height:125px; margin-top:0; background:url(../img/main/company_logo.png) no-repeat left top; background-size: 200px 57px; }
.company_title								{ font-size:30px; }
.company_title span							{ font-weight:700; }
.company_diary								{ position: absolute; z-index:0; left:27px; bottom:-160px; font-size:70px; font-weight:700; color:#F4F5F7; }

.diary_slide								{ float: left; width:100%; height: auto; margin-top:30px; z-index:100; }
.diary_slide .item							{ width:100%; height:43vh; }
.diary_slide .owl-dots						{ display:none; }
.history_slide .owl-dots					{ display:none; }

.btn_default								{ cursor:pointer; max-width:160px; border:1px solid #000;  background:url(../img/main/icon_button_white_arrow.png) no-repeat right; background-color: #000; background-position: right 15px center; color:#fff; height:44px; padding:10px 70px 10px 10px; }
.btn_default:hover							{ border:1px solid #000; background:url(../img/main/icon_button_black_arrow.png) no-repeat right; background-color: #fff; background-position: right 15px center; color:#000; }
.title_up									{ position: absolute; font-size:48px; font-weight:700; z-index:1000; }
.title										{ position: relative; font-size:48px; font-weight:700; line-height:60px; z-index:1000; }
.ment										{ position: relative; font-size:15px; color:#888; line-height:24px; z-index:100; }
.ment_up									{ position: relative; font-size:15px; color:#888; padding-top:50px; line-height:24px; }
#section1									{ /*background: -webkit-gradient(linear, top left, bottom left, from(rgba(255, 255, 255, .0)), to(#F4F5F7)); background: -webkit-linear-gradient(rgba(255, 255, 255, .0), #F4F5F7); background: linear-gradient(rgba(255, 255, 255, .0),#F4F5F7); */}
/*#section2									{ background: -webkit-gradient(linear, top left, bottom left, from(#F4F5F7), to(#ffffff)); background: -webkit-linear-gradient(#F4F5F7, #ffffff); background: linear-gradient(#F4F5F7,#ffffff); }*/
/*#section5									{ background-color:#F4F5F7; }*/

.rod										{ position: absolute; z-index:0; width:calc(100% / 1.5); height:230px; left:-100%; top:200px; background:#F4F5F7; }
.grayscale									{ -webkit-filter: grayscale(100%); filter: gray; }
.grayscale:hover 							{ -webkit-filter: grayscale(0%); filter: none; }

/*
@-webkit-keyframes nprogress-spinner { 
	0%   { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes nprogress-spinner {
	0%   { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
*/

table										{ font-size:15px; width:100%; border: 1px solid #E8E8E8; border-top: 2px solid #30748A; border-collapse: collapse; }
th											{ border: 1px solid #E8E8E8; padding: 15px 10px; }
td											{ border: 1px solid #E8E8E8; padding: 10px 10px; color:#888888; }
thead { }


.floatL										{ float: left; position:relative; }
.ML5										{ margin-left:5px; }
.MR5										{ margin-right:5px; }

.MT10										{ margin-top:10px; }
.MT15										{ margin-top:15px; }
.MT20										{ margin-top:20px; }
.MT30										{ margin-top:30px; }
.MT50										{ margin-top:50px; }
.MT80										{ margin-top:80px; }

.MB10										{ margin-bottom:10px; }
.MB15										{ margin-bottom:15px; }
.MB20										{ margin-bottom:20px; }
.MB30										{ margin-bottom:30px; }
.MB50										{ margin-bottom:50px; }
.MB80										{ margin-bottom:80px; }

.PL5										{ padding-left:5px; }
.PL10										{ padding-left:10px; }
.PL20										{ padding-left:20px; }
.PL30										{ padding-left:30px; }
.PL35										{ padding-left:35px; }
.PL40										{ padding-left:40px; }
.PL50										{ padding-left:50px; }

.PR5										{ padding-right:5px; }
.PR10										{ padding-right:10px; }
.PR20										{ padding-right:20px; }
.PR30										{ padding-right:30px; }

.PTB30										{ padding:30px 0; }

.PT5										{ padding-top:5px; }
.PT10										{ padding-top:10px; }
.PT20										{ padding-top:20px; }
.PT30										{ padding-top:30px; }
.PT40										{ padding-top:40px; }
.PT50										{ padding-top:50px; }
.PT60										{ padding-top:60px; }
.PT80										{ padding-top:80px; }
.PT100										{ padding-top:100px; }
.PT170										{ padding-top:170px; }


.PB5										{ padding-bottom:5px; }
.PB10										{ padding-bottom:10px; }
.PB20										{ padding-bottom:20px; }
.PB30										{ padding-bottom:30px; }
.PB40										{ padding-bottom:40px; }
.PB50										{ padding-bottom:50px; }
.PB80										{ padding-bottom:80px; }

.PA10										{ padding:10px; }
.MA10										{ margin:10px; }
.TC											{ text-align:center; }
.TR											{ text-align:right; }
.TL											{ text-align:left; }
.MA											{ margin:15px auto 20px; }
.MAL										{ margin:15px 0 20px 0; }

.FCB										{ color:#000000; }
.FCM										{ color:#30748A; }
.FCG										{ color:#888888; }
.FCW										{ color:#ffffff; }

.W25										{ float: left; position:relative; width:25%; }
.W50										{ float: left; position:relative; width:50%; }
.W100										{ float: left; position:relative; width:100%; }

.W600PX										{ position:relative; width:600px; }

.FR											{ float: right; position:relative; }
.FL											{ float: left; position:relative; }
.FC											{ margin:0 auto; }

.BGG										{ background:#FAFAFA; }
.FS15										{ font-size:15px; }
.FS18										{ font-size:18px; }
.FS30										{ font-size:30px; }

.pusher										{ right:20px; top:38px; position:absolute; color:#fff; width:45px; cursor:pointer; z-index:1001; }
.pusher span								{ width:26px; height:2px; display:block; background:#FFF; margin:0 0 8px 0; }
.pusher span:last-child						{ margin:0; }
.pusher.click span:nth-of-type(1)			{ -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg);	transform: rotate(45deg); margin:10px 0 0 0; }
.pusher.click span:nth-of-type(2)			{ opacity:0; }
.pusher.click span:nth-of-type(3)			{ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); margin:-12px 0 0 0; }

/* 최적화 해상도 */
.resolution_wrap							{ display:none; float:left; font-size: 12px; position: fixed; top: 50%; left: 50%; z-index: 90000; text-align:center; min-width:320px;}
.resolution_wrap p							{ padding-top:15px; color:#fff; font-size:13px; line-height:18px; }
.resolution_wrap p span						{ color:#fff; font-size:12px; line-height:18px; opacity: 0.5; }
#mask										{ display: none; background: #000; position: fixed; left: 0; top: 0; z-index: 10; width: 100%; height: 100%; opacity: 0.9; z-index:10000; }


/*개인정보처리방침 동의 레이어*/
#contact_us_wrap							{ display:none; float:left; font-size: 12px; position: fixed; top:50%; left: 50%; z-index: 90000; min-width:320px; }
#contact_us_wrap .box						{ background:#fff; border-radius: 10px; padding:10px; max-width:500px; }
#contact_us_wrap .contact_us_wrap_title		{ line-height:40px; font-size:15px; text-align:center; border-bottom:1px solid #F4F5F7; margin-bottom:10px; }
#contact_us_wrap .contact_us_wrap_contents	{ font-size:13px; }
#contact_us_wrap .contact_us_wrap_contents span	{ font-size:12px; color:#888; }
#contact_us_wrap .contact_us_wrap_close_box	{ border-top:1px solid #F4F5F7; margin-top:10px; text-align:center; }
#contact_us_wrap .layer_close_btn			{ padding:10px 30px; color:#fff; font-size:15px; font-weight:500; background:#000; border-radius:10px; border:0; text-align:center;  margin-top:10px; cursor:pointer; }


.mobile										{ display:none; }
.pc											{ display:block; }

.partners_box								{ float: left; position:relative; width:calc(100% / 10); text-align:center; padding-bottom:20px; }

.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell				{ height: auto !important; }
.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive 
.fp-tableCell								{ height: auto !important; }
.fp-sr-only									{ position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.spotlight.image							{ cursor: pointer; }


.timeline-carousel__item-inner				{ position: relative; padding-top: 45px; min-width:300px; }
.timeline-carousel__item-inner:after		{ position: absolute; width: 100%; top: 45px; left: 0; content: ""; border-bottom: 1px solid rgba(0, 0, 0, 1); }
.timeline-carousel__item-inner .year		{ position: absolute; top:20px; line-height:40px; padding:0 15px 3px 15px; font-size: 30px; color: #fff; background-color: #000; z-index:3; font-weight:700; }
.timeline-carousel__item-inner .month		{ font-size: 18px; color: #000; display: block; margin-bottom: 10px; padding:30px 0 0 10px; font-weight: 500; }
.timeline-carousel__item-inner .history_ment{ color: #888; padding:0 10px; font-size:15px; line-height:24px; }

.tab										{ width:100%; height:auto; overflow:hidden; }
.tab ul										{ position: absolute; top:10px; right:50px; padding:0; margin:0; list-style:none; width:210px; height:auto; overflow:hidden; }
.tab ul li									{ display:inline-block; width:70px; float:left; line-height:40px; font-size:20px; text-align:center; cursor:pointer; color:#888; }
.tab ul li.on								{ color:#000; display: table; text-decoration: none; position: relative; font-weight:500; }
.tab ul li.on:after							{ content: ""; position: absolute; left: 0; bottom: -1px; width:100%; border-bottom: 3px solid #000; -webkit-animation: on_any 1000ms ease 1; animation: on_any 1000ms ease 1;  }

@-webkit-keyframes on_any					{ 0%   { width: 0; } 100% { width:100%; } }
@keyframes on_any							{ 0%   { width: 0; } 100% { width:100%; } }

.tab .conBox								{ position: relative; width:100%; height:auto; margin-top:30px; overflow:hidden; min-height:100px; padding:0 20px 20px 20px; background:#fff; display:none; text-align:center; }
.tab .conBox.on								{ display:block; animation: fadein 2s; -moz-animation: fadein 2s; -webkit-animation: fadein 2s; -o-animation: fadein 2s; }
@keyframes fadein							{ from { opacity: 0; } to { opacity: 1; } }
@-moz-keyframes fadein						{ from { opacity: 0; } to { opacity: 1; } }
@-webkit-keyframes fadein					{ from { opacity: 0; } to { opacity: 1; } }
@-o-keyframes fadein						{ from { opacity: 0; } to { opacity: 1; } }

.section1 > img								{ width:100%; }

.business > img								{ width:100%; }
.phon										{ display: inline-block; width:100%; }
.phon li									{ float: left; display: inline; width:25%; }

.phon_name									{ position: relative; font-size:18px; }
.phon_name:after							{ content: "."; display: block; display:inline-block; width:38px; height:23px; border:1px solid #000; background:url(../img/main/icon_button_white_s_arrow.png) no-repeat right; background-size:20px 15px; background-color: #000; background-position: right 9px center; }
.phon_name:hover:after						{ background:url(../img/main/icon_button_black_s_arrow.png) no-repeat right; background-size:20px 15px; background-color: #fff; background-position: right 9px center;  color:#fff;}

.business .commerce							{ display: inline-block; width:100%; }
.business .commerce li						{ float: left; display: inline; width:calc(100% / 3); } 
.business .commerce dl						{ width:100%; position: relative; } 
.business .commerce dl dt img				{ width:100%; }
.commerce_name								{ font-size:18px; font-weight:700; line-height:50px; }
.commerce_ment								{ font-size:15px; color:#888; padding-left:30px; padding-bottom:5px; line-height:24px; }
.commerce_ment span							{ position: absolute; font-size:15px; color:#000; font-weight:900; left:10px; }

.contact ul									{ display: inline-block; width:100%; }
.contact ul li								{ float: left; display: inline; width:calc(100% / 2); }

#map										{ width:100%; height:390px; }
.map_name									{ font-size:23px; font-weight:700; }
.map_ment									{ font-size:15px; color:#888; line-height:24px; }
.map_ment span								{ font-size:15px; color:#000; font-weight:500; }

.counsel_input								{ width:100%; height:70px; border:1px solid #E1E2E6; padding:20px; color:#000; font-size:15px; }
.counsel_textarea							{ float:left; position:relative; background:#fff; border:1px solid #E1E2E6; color:#000; font-size:15px; padding:20px; width:100%; height:150px; resize:none; }


input[type=checkbox].css-checkbox			{ position:absolute; z-index:-1000; left:-1000px; overflow:hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0; }
input[type=checkbox].css-checkbox 
+ label.checkbox-label						{ font-size:15px; margin-top:10px; padding-top:10px; color:#000; padding-left:55px; height:46px; display:inline-block; background-repeat:no-repeat; background-position:0 0; vertical-align:middle; cursor:pointer; -webkit-transition-property: none; -moz-transition-property: none; -o-transition-property: none; transition-property: none; }
input[type=checkbox].css-checkbox:checked 
+ label.checkbox-label						{ background-position: 0 -46px; -webkit-transition-property: none; -moz-transition-property: none; -o-transition-property: none; transition-property: none;  }
label.checkbox-label						{ background-image:url(../img/main/icon_checkbox.png); -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; }

/*label.checkbox-label span					{ color:#000; }*/
.contact_text								{ position:absolute; right:0; margin-top:10px; padding-top:10px; margin-right:10px; height:46px; display:inline-block; text-align:right; }
.contact_text span							{ color:#888888; text-decoration: underline; cursor:pointer; }

.btn_counsel								{ width:100%; color:#fff; font-size:18px; font-weight:500; border:1px solid #000; background:#000; padding:20px; }
.btn_counsel:hover							{ color:#000; border:1px solid #000; background:#fff; }
              
.copyright									{ float:left; position:relative; width:100%; border-top:1px solid #F4F5F7; padding:30px; color:#888; }
.copyright ul								{ display: inline-block; width:100%; }
.copyright ul li							{ float: left; display: inline; width:calc(100% / 4); }
.copy_title									{ font-size:15px; font-weight:500; color:#000; }
.copy_ment									{ font-size:15px; color:#888; line-height:26px; }
.copy_ment span								{ color:#000; }
.copy_down									{ font-size:15px; font-weight:500; color:#000; cursor: pointer;  }
.copy_down:after							{ position:absolute; content: ""; display: block; display:inline-block; margin:0 0 0 10px; width:24px; height:24px; background:url(../img/main/icon_down.png) no-repeat center; background-size:24px 24px; }
.copy_logo_box								{ padding-right:50px; padding-top:10px; }
.copy_logo									{ margin:0 auto; margin-bottom:20px; width:44px; height:46px; background:url(../img/main/copy_logo.png ) no-repeat center; background-size:44px 46px; display: block; }
.copy_logo_01								{ margin:0 auto; width:202px; height:28px; background:url(../img/main/copy_logo_01.png ) no-repeat center; background-size:202px 28px; display: block; }

.copy_sns_circle							{ width:43px; height:43px; border-radius: 50%; cursor: pointer; }

.copy_sns_circle.facebook					{ background:url(../img/main/copy_facebook.png) no-repeat center top #000; transition:all 0.4s ease; }
.copy_sns_circle.facebook:hover				{ background-position:center -43px; }

.copy_sns_circle.instagram					{ background:url(../img/main/copy_instagram.png) no-repeat center top #000; transition:all 0.4s ease; }
.copy_sns_circle.instagram:hover			{ background-position:center -43px; }

.copy_sns_circle.blog						{ background:url(../img/main/copy_blog.png) no-repeat center top #000; transition:all 0.4s ease; }
.copy_sns_circle.blog:hover					{ background-position:center -43px; }

.copy_sns									{ display: inline-block; float: right;}
.copy_sns dt								{ float: left; display: inline; margin:0 10px;  }


.slide_sns									{ position:absolute; bottom:100px; right:25px;  }
.slide_sns dt								{ float: left; display: inline;  }

.COMPANY_INTRODUCE_ELEMENT					{ opacity:0; right:-100%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes COMPANY_INTRODUCE_ELEMENT_ANY	{ from { right:-100%; opacity:0;} to { right:0px; opacity:1; } }


.COMPANY_LOGO_ELEMENT						{ opacity:0; left:-100%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes COMPANY_LOGO_ELEMENT_ANY			{ from { left:-100%; opacity:0; } to { left:0px; opacity:1; } }

.DIARY_SLIDE_ELEMENT						{ opacity:0; bottom:-100px; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes DIARY_SLIDE_ELEMENT_ANY			{ from { bottom:-100px; opacity:0; } to { bottom:0px; opacity:1; } }

.mojise_history								{ position: absolute; z-index:0; left:27px; top:80px; font-size:70px; font-weight:700; color:#F4F5F7; opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes mojise_history_ANY				{ from { opacity:0; } to { opacity:1; } }


.history_slide								{ opacity:0; bottom:-100px; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes history_slide_ANY				{ from { opacity:0; bottom:-100px; } to { opacity:1; bottom:0px; } }

#con1										{ opacity:0; bottom:-100px; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes con1_ANY							{ from { opacity:0; bottom:-100px; } to { opacity:1; bottom:0px; } }

.AJIT_AD									{ opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes AJIT_AD_ANY						{ from { opacity:0; } to { opacity:1; } }

.Application								{ opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes Application_ANY					{ from { opacity:0; } to { opacity:1; } }

.E-Commerce									{ opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes E-Commerce_ANY					{ from { opacity:0; } to { opacity:1; } }

.CONTACT_LEFT								{ float: left; position:relative; opacity:0; left:-100%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes CONTACT_LEFT_ANY					{ from { left:-100%; opacity:0; } to { left:0px; opacity:1; } }

.CONTACT_RIGHT								{ float: left; position:relative; opacity:0; right:-100%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes CONTACT_RIGHT_ANY				{ from { right:-100%; opacity:0;} to { right:0px; opacity:1; } }

.diary_slide_hint							{ opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes diary_slide_hint_ANY				{ from { opacity:0;} to { opacity:1; } }


.animsition, .animsition-overlay {
  position: relative;
  opacity: 0;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

.animsition-overlay-slide {
  position: fixed;
  z-index: 100000;
  width: 100%;
  height: 100vh;
  background-color: #fff;
}
/* loading option */
.animsition-loading,
.animsition-loading:after {
  width: 32px;
  height: 32px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -16px;
  margin-left: -16px;
  border-radius: 50%;
  z-index: 100;
}

.animsition-loading {
  background-color: transparent;
  border-top: 5px solid rgba(0, 0, 0, 0.2);
  border-right: 5px solid rgba(0, 0, 0, 0.2);
  border-bottom: 5px solid rgba(0, 0, 0, 0.2);
  border-left: 5px solid #000;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-animation-iteration-count:infinite;
          animation-iteration-count:infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-duration: .8s;
          animation-duration: .8s;
  -webkit-animation-name: animsition-loading;
          animation-name: animsition-loading;
}

@-webkit-keyframes animsition-loading {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes animsition-loading {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


.fade-in {
  -webkit-animation-name: fade-in;
          animation-name: fade-in;
}


@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


.fade-out {
  -webkit-animation-name: fade-out;
          animation-name: fade-out;
}
@-webkit-keyframes fade-in-up {
  0% {
    -webkit-transform: translateY(500px);
            transform: translateY(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-up {
  0% {
    -webkit-transform: translateY(500px);
            transform: translateY(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}


.fade-in-up {
  -webkit-animation-name: fade-in-up;
          animation-name: fade-in-up;
}


@-webkit-keyframes fade-out-up {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    opacity: 0;
  }
}


@keyframes fade-out-up {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    opacity: 0;
  }
}


.fade-out-up {
  -webkit-animation-name: fade-out-up;
          animation-name: fade-out-up;
}
@-webkit-keyframes fade-in-up-sm {
  0% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-up-sm {
  0% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes overlay-slide-in-top {
  0% {
    height: 100%;
	width:100%;
  }
  100% {
    height: 0;
	width:100%;
  }
}

@keyframes overlay-slide-in-top {
  0% {
    height: 100%;
	width:100%;
  }
  100% {
    height: 0;
	width:100%;
  }
}


.overlay-slide-in-top {
  top: 0;
  height: 0;
  width:100%;
  -webkit-animation-name: overlay-slide-in-top;
          animation-name: overlay-slide-in-top;
}


@-webkit-keyframes overlay-slide-out-top {
  0% {
    height: 0;
	width:100%;
  }
  100% {
    height: 100%;
	width:100%;
  }
}


@keyframes overlay-slide-out-top {
  0% {
    height: 0;
	width:100%;
  }
  100% {
    height: 100%;
	width:100%;
  }
}


.overlay-slide-out-top {
  top: 0;
  height: 100%;
  width:100%;
  -webkit-animation-name: overlay-slide-out-top;
          animation-name: overlay-slide-out-top;
}



/*좌우 스크롤 힌트*/
@keyframes scroll-hint-appear {
  0% {
    transform: translateX(40px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  50%,
  100% {
    transform: translateX(-40px);
    opacity: 0;
  }
}

.scroll-hint.is-right-scrollable {
  background: linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint.is-right-scrollable.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0)), linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint-icon {
  position: absolute;
  top: calc(50% - 25px);
  left: calc(50% - 60px);
  box-sizing: border-box;
  width: 120px;
  height: 90px;
  border-radius: 5px;
  transition: opacity .3s;
  opacity: 0;
  background: rgba(0, 0, 0, .7);
  text-align: center;
  padding: 20px 10px 10px 10px;
}

.scroll-hint-icon-wrap {
  display:none;
  z-index:100;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 100%;
  /*pointer-events: none;*/
}

.scroll-hint-text {
  font-size: 12px;
  color: #FFF;
  margin-top: 5px;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon {
  opacity: .8;
}

.scroll-hint-icon:before {
  display: inline-block;
  width: 40px;
  height: 40px;
  color: #FFF;
  vertical-align: middle;
  text-align: center;
  content: "";
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDM8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIiBmaWxsPSIjZmZmIi8+PC9nPjwvZz48L3N2Zz4=);
}

.scroll-hint-icon:after {
  content: "";
  width: 34px;
  height: 14px;
  display: block;
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -20px;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDE8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIgZmlsbD0iI2ZmZiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjwvc3ZnPg==);
  opacity: 0;
  transition-delay: 2.4s;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:after {
  opacity: 1;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:before {
  animation: scroll-hint-appear 1.2s linear;
  animation-iteration-count: 2;
}

.scroll-hint-icon-white {
  background-color: #FFF;
  box-shadow: 0 4px 5px rgba(0, 0, 0, .4);
}

.scroll-hint-icon-white:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDQ8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIi8+PC9nPjwvZz48L3N2Zz4=);
}

.scroll-hint-icon-white:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDI8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiLz48L2c+PC9nPjwvc3ZnPg==);
}

.scroll-hint-icon-white .scroll-hint-text {
  color: #000;
}

/*갤러리*/
.gallery										{ background:#000; }
.gallery_title									{ position:relative; font-size:48px; font-weight:700; color:#fff; text-align:center; line-height:80px; margin-top:20px; z-index:100; }
.image											{ float: left; width:100%; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.spotlight.image								{ cursor: pointer; }
.spotlight > img								{ display:none; }
.spotlight-group								{ position:relative; z-index:10; width:calc(100% / 1.3); margin:0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(20vw, auto); grid-gap:10px; }

.gallery_close_box								{ position: absolute; right:50px; top:25px; width:50px; height:50px; }	
.gallery_close									{ height: 50px; width: 1px; background-color: #fff; margin-left:25px; transform: rotate(45deg); Z-index: 1; }
.gallery_close:after							{ content: ""; position: absolute; height: 50px; width: 1px; background-color: #fff; transform: rotate(90deg); Z-index: 2; }

.gallery_circle1								{ top:50px; right:50px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.gallery_circle1 span.center					{ background: #000; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.gallery_circle2								{ top:250px; left:50px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.gallery_circle2 span.center					{ background: #000; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }


.business_section								{ text-align:center; display: table; table-layout:fixed; width: 100%; }
.business_box									{ position: relative; z-index:10; display: table-cell; vertical-align: middle; width: 100%; height: 100%; background:url(../img/business/business_top_bg.png) no-repeat center center; /*background-position: top 0px right 0px; */ background-size: cover; }
.business_title									{ position: relative; font-size:48px; font-weight:700; line-height:60px; color:#fff; z-index: 100; padding:0 30px; } 
.business_title	span							{ position: relative; font-size:48px; font-weight:900; line-height:60px; background: #E8D793; background: -webkit-linear-gradient(bottom, #E8D793, #9D8E5B); background:-moz-linear-gradient(bottom, #E8D793, #9D8E5B); background:-o-linear-gradient(bottom, #E8D793, #9D8E5B); background:linear-gradient(to bottom, #E8D793, #9D8E5B); -webkit-background-clip: text; background-clip: text; color: transparent; }
.business_box img								{ width:100%; }
.dmp_column										{ font-size:15px; float: left; position:relative; width:calc(100% / 3); color:#888; }
.dmp_column span								{ position: absolute; left:10px; color:#fff; font-weight:500; }
/*background: linear-gradient(to right, #E8D793, #9D8E5B); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }*/

.m_dmp_box										{ float: left; position: relative; width:100%; }
.m_dmp_column_img								{ float: left; position: relative; width:150px; margin-bottom:20px; z-index:1;  }
.m_dmp_column									{ font-size:15px; position:relative; color:#888; margin-left:155px; margin-bottom:20px; }
.m_dmp_column span								{ position: absolute; left:10px; color:#fff; font-weight:500; }

.star_01										{ position: absolute; width:47px; height:47px; right:50%; top:-12px; margin-right:-205px; background:url(../img/business/star.png) no-repeat center; background-size:47px 47px; z-index:100; }
.star_02										{ position: absolute; width:47px; height:47px; right:50%; top:23px; margin-right:-73px; background:url(../img/business/star.png) no-repeat center; background-size:47px 47px; z-index:100; }


.right_rod										{ position: absolute; z-index:0; width:calc(100% / 1.3); height:230px; right:0; top:50%; margin-top:-115px; background:#F4F5F7; }
.left_rod										{ position: absolute; z-index:0; width:calc(100% / 1.3); height:230px; left:0; top:50%; margin-top:-115px; background:#F4F5F7; }

.application_img								{ position: relative; }
.app_icon										{ float: left; width: 110px; }
.app_icon2										{ float: left; width: 200px; }
.app_name										{ position: relative; font-size:25px; font-weight:500; }
.app_name:after									{ text-indent: 100%; margin-left:10px; color:#fff; content: " . "; display: block; display:inline-block; width:133px; height:26px; background:url(../img/business/btn_google.png) no-repeat right; background-size:133px 26px; cursor: pointer; }
.app_title										{ font-size:25px; font-weight:500; line-height:36px; padding:20px 0; }
.app_ment										{ position: relative; font-size:15px; color:#888; line-height:24px; }
.app_ment span									{ color:#000; font-weight:500; }

.skill_box										{ float: left; background:#000; font-size:15px; color:#fff; font-weight:500; width:80px; text-align:center; padding:5px 0; }
.skill_box_C									{ margin:0 auto; background:#000; font-size:15px; color:#fff; font-weight:500; width:80px; text-align:center; padding:5px 0; }
.skill_ment										{ margin-left:100px; font-size:15px; color:#888; line-height:30px; }
.skill_ment	span								{ color:#000; font-weight:500;  }

.sub_rod										{ position: absolute; z-index:0; width:calc(100% / 1.5); height:680px; top:0; background:#F4F5F7; }

.ment span										{ color:#000; font-weight:500; }

.online_box										{ float: left; text-align:center; width:100%; margin:20px 0; }
.online_box > div								{ float: left; position: relative; width:calc(100% / 5); height:120px; text-align:center; display: table; table-layout:fixed; z-index:1000; }
.online_box > div > div							{ width:100%; height:100%; background:#fff; display: table-cell; vertical-align: middle; border:1px solid #fff;  }
.online_box > div > div	img 					{ min-width:50%; width:60%; }


.online_box > div > div:hover					{ border:1px solid #000; }

.operationg										{ width:100%; height:400px; background:url(../img/business/operationg_bg.png) no-repeat center center; color:#fff; background-size: cover; }
.operationg .operationg_box						{ float: left; position: relative; width:25%; background:rgba(0, 0, 0, 0.5); height:400px; text-align:center; border-right:1px solid rgba(255, 255, 255, 0.1); cursor:pointer;  }
.operationg .operationg_box:last-child			{ border-right:0px solid #686978; }
.operationg .operationg_box:hover				{ padding-top:15px; background:rgba(0, 0, 0, 0.8); height:400px; text-align:center; border-right:1px solid rgba(255, 255, 255, 0.1); }
.operationg .operationg_box ul					{ padding-top:12vh; }

.operationg_num									{ font-size:48px; font-weight:900; padding:10px 10px 40px 10px; }
.operationg_title								{ font-size:18px; line-height:30px; font-weight:300; padding:0 10px 0 10px; }

.line_x_box										{ margin:0 auto; width:20px; height:20px; }
.line_x											{ height: 20px; width: 1px; background-color: #fff; margin-left:10px; transform: rotate(45deg); Z-index: 1; }
.line_x:after									{ content: ""; position: absolute; height: 20px; width: 1px; background-color: #fff; transform: rotate(90deg); Z-index: 2; }

.patent											{ background:url(../img/business/icon_patent.png) no-repeat; background-position:left 7px;  background-size:22px 28px; padding-left:30px; font-size:12px; line-height:18px; }


.section0										{ opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes section0_ANY							{ from {  } to { bottom:0px; opacity:1; } }


.section1										{ position: relative; opacity:0; bottom:-100px; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes section1_ANY							{ from { bottom:-100px; opacity:0; } to { bottom:0px; opacity:1; } }


.business_section_title							{ position: relative; bottom:-100px; opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes business_section_title_ANY			{ from { bottom:-100px; opacity:0; } to { bottom:0px; opacity:1; } }


.business_section_left							{ left:-100%; opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes business_section_left_ANY			{ from { left:-100%; opacity:0; } to { left:0px; opacity:1; } }


.business_section_right							{ right:-100%; opacity:0; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes business_section_right_ANY			{ from { } to { right:0px; opacity:1; } }


.application_img_05								{ position: absolute; z-index:0; left:-100%; opacity:0; top:250px; background:url(../img/business/application_img_05.png) no-repeat center center; height: 513px; width:50%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes application_img_05_ANY				{ from {  } to { opacity:1; left:0; } }

.application_img_06								{ position: absolute; z-index:0; right:-100%; opacity:0; top:350px; background:url(../img/business/application_img_06.png) no-repeat center center; height: 513px; width:50%; animation-duration: 1.5s; animation-timing-function:ease-in-out; animation-iteration-count: 1; animation-fill-mode:both; }
@keyframes application_img_06_ANY				{ from { } to { opacity:1; right:0; } }


.business_circle1								{ bottom:-400px; right:50%; margin-right:-750px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.business_circle1 span.center					{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.business_circle2								{ bottom:-600px; left:100px; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.business_circle2 span.center					{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }

.business_circle3								{ bottom:-450px; right:50%; position: absolute; width: 600px; height: 600px; border-radius: 50%; transition: 0.3s;  z-index:0; }
.business_circle3 span.center					{ background: #fff; display : block; position: absolute; top:50%; left:50%; width:545px; height:545px; border-radius: 50%; text-align:center; line-height: 200px; font-size:30px; transform: translate(-50%, -50%); }


#section0										{ width:100%; height:100vh; overflow: hidden; }
.hamburger										{ width: 30px; height: 30px; position: absolute; top: 20px; right: 30px; z-index: 10000; background: transparent; cursor: pointer; }
.hamburger.is-active .hamburger--container .hamburger--bars { background: #fff; }
.hamburger.is-active .hamburger--container .hamburger--bars:before, .hamburger.is-active .hamburger--container .hamburger--bars:after { background: #fff; }
.hamburger.is-active .hamburger--container .hamburger--bars:before { left: 0.25em; }
.hamburger.is-active .hamburger--container .hamburger--bars:after  { left: -0.25em; }
.hamburger .hamburger--container				{ width: 100%; padding: 0.25em; position: relative; }
.hamburger .hamburger--container .hamburger--bars { height: 3px; width: 25px; background: #000; position: absolute; top: 15px; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
.hamburger .hamburger--container .hamburger--bars:before, .hamburger .hamburger--container .hamburger--bars:after { content: ""; display: block; height: 3px; width: 25px; background: inherit; position: absolute; left: 0; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
.hamburger .hamburger--container .hamburger--bars:before	{ top: -7px; }
.hamburger .hamburger--container .hamburger--bars:after		{ top: 7px; }

.fsmenu											{ width: 100vw; height: 100vh; position: fixed !important; background: #000; top: 0; right: 0; bottom:0; left:0; z-index: 1001; overflow: hidden; display: none; }
.fsmenu .fsmenu--container						{ width: 100%; height: 100vh; padding: 100px 30px 30px 30px; position: absolute; right: 0; overflow: hidden; }
.fsmenu .fsmenu--container .fsmenu--list		{ width: 100%; height: 100%; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element { width: 100%; list-style-type: none; text-align: right; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element a { outline:none; width: 100%; height: 100%; text-decoration: none; color: #fff; display: -webkit-box; display: flex; -webkit-box-pack: end; justify-content: flex-end; -webkit-box-align: center;         align-items: center; -webkit-transition: 0.2s ease; transition: 0.2s ease; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element a:hover { color: #fff; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element a span:hover { color:#fff; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element a span { color:#888; font-size: 30px; font-weight: 700; letter-spacing: 5px; text-transform: uppercase; line-height: 1; height: 1em; display: inline-block; position: relative; z-index: 10010; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element a span:before { content: ""; display: block; width: 100%; height: 100%; background: #fff; position: absolute; left: 0; z-index: 1003; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element .fsmenu--scrolling-text { height: 100%; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-transform: translate(-20%, -100%); transform: translate(-20%, -100%); opacity: 0; pointer-events: none; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element .fsmenu--scrolling-text span { font-size: 50px; font-weight: 900; letter-spacing: 10px; text-transform: uppercase; line-height: 30px; color: #1E1E1E; display: inline-block; margin-right: 1em; }
.fsmenu .fsmenu--container .fsmenu--list .fsmenu--list-element:hover .fsmenu--scrolling-text { opacity: 1; -webkit-animation: animScrollingContactTextLeft 9s linear 0s infinite; animation: animScrollingContactTextLeft 9s linear 0s infinite; }
.fsmenu.is-active								{ display: block; -webkit-animation: animMenuReveal 0.6s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0s forwards; animation: animMenuReveal 0.6s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0s forwards; }
.fsmenu.is-active .fsmenu--container .fsmenu--list .fsmenu--list-element a span:before { -webkit-animation: animMenuRevealLinks 0.4s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0.4s forwards; animation: animMenuRevealLinks 0.4s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0.4s forwards; }

.fsmenu.close-menu								{ display: block; width: 100vw; right: auto; left: 0; -webkit-animation: animMenuClose 0.6s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0.3s forwards; animation: animMenuClose 0.6s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0.3s forwards; }
.fsmenu.close-menu .fsmenu--container .fsmenu--list .fsmenu--list-element a span:before { left: auto; right: 0; background: black; -webkit-animation: animMenuCloseLinks 0.4s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0s forwards; animation: animMenuCloseLinks 0.4s cubic-bezier(0.13, 0.13, 0.02, 1.07) 0s forwards; }

/*술라이드 오픈 애니*/
@-webkit-keyframes animMenuReveal				{ 0% { width: 0vw; }  100% { width: 100vw; } }
@keyframes animMenuReveal						{ 0% { width: 0vw; }  100% { width: 100vw; } }

@-webkit-keyframes animMenuRevealLinks			{ 0% { width: 100%; } 100% { width: 0%; } }
@keyframes animMenuRevealLinks					{ 0% { width: 100%; } 100% { width: 0%; } }

/*술라이드 아웃애니*/
@-webkit-keyframes animMenuClose				{ 0% { width: 100vw; padding: 8em 3em 3em; } 100% { width: 0vw; padding: 8em 0 0; } }
@keyframes animMenuClose						{ 0% { width: 100vw; padding: 8em 3em 3em; } 100% { width: 0vw; padding: 8em 0 0; } }

@-webkit-keyframes animMenuCloseLinks			{ 0% { width: 0%; } 100% { width: 110%; } }
@keyframes animMenuCloseLinks					{ 0% { width: 0%; } 100% { width: 110%; } }
@-webkit-keyframes animScrollingContactTextLeft { 0% { -webkit-transform: translate(-20%, -100%); transform: translate(-20%, -100%); } 100% { -webkit-transform: translate(-40%, -100%); transform: translate(-40%, -100%); } }
@keyframes animScrollingContactTextLeft			{ 0% { -webkit-transform: translate(-20%, -100%); transform: translate(-20%, -100%); } 100% { -webkit-transform: translate(-40%, -100%); transform: translate(-40%, -100%); } }

.mobile_logo									{ float: left; width:44px; height:46px; background:url(../img/main/logo.png) no-repeat center; background-size:44px 46px; cursor:pointer; }
.mobile_logo.is-active							{ background:url(../img/main/logo_white.png) no-repeat center; }
/*.mobile_logo.is-active							{ -webkit-filter: invert(100%); filter: invert(100%); }*/

.mobile_logo_white								{ float: left; width:44px; height:46px; background:url(../img/main/logo_white.png) no-repeat center; background-size:44px 46px; cursor:pointer; }
.mobile_logo_white.is-active					{ background:url(../img/main/logo.png) no-repeat center;  }
/*.mobile_logo_white.is-active					{ -webkit-filter: invert(100%); filter: invert(100%); }*/

.header_mobile									{ display: block; width: 100%; height: 80px; padding:20px 30px; }

.move_mobile									{ -webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; transition:all .5s ease-in-out; }
.move_default_mobile							{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.0) !important; }
.move_reset_mobile								{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.9); }
.move_up_mobile									{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(255, 255, 255, 0.9); }

.business_move_mobile							{ -webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; transition:all .5s ease-in-out; }
.business_move_default_mobile					{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.0) !important; }
.business_move_reset_mobile						{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.8); }
.business_move_up_mobile						{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); background-color: rgba(0, 0, 0, 0.8); }

.header_mobile_bg_not							{ background:transparent; }


/** 반응형 시작 스크롤 사이즈 계산 16px**/

@media only screen and ( max-width: 1400px ){ /* 1400아래로 메인텍스트 때문에*/ 
	.visual_text								{ font-size:100px; line-height:100px !important; }
	.ti-cursor									{ font-size:100px !important; }
}

@media only screen and ( max-width: 1260px ){
	.contents_wrap								{ width:100%; }
	.partners_contents_wrap						{ width:100%; padding: 0; }
	.tab ul										{ right:20px; }
	.AJIT_AD img								{ width:100%; }
	.Application img							{ width:99%; }
	.section1 img								{ width:99%; }

	.application_img img						{ width:100%; }
	.right_rod									{ display:none; }
	.left_rod									{ display:none; }
}

@media only screen and ( max-width: 1200px ){
	.copy_logo_box								{ padding-right:0; padding-top:10px; }
	.copy_logo									{ float: left; margin:0; margin-bottom:20px; width:44px; height:46px; background:url(../img/main/copy_logo.png ) no-repeat center; background-size:44px 46px; display: block; }
	.copy_logo_01								{ float: left; margin-left:20px; margin-top:20px; width:202px; height:28px; background:url(../img/main/copy_logo_01.png ) no-repeat center; background-size:202px 28px; display: block; }

	.copyright									{ width:100%; border-top:1px solid #F4F5F7; padding:30px 0; color:#888; }
	.copyright ul								{ display: inline-block; width:100%; }
	.copyright ul li:first-child				{ float: left; display: inline; width:calc(100% / 1); }
	.copyright ul li							{ float: left; display: inline; width:calc(100% / 3); }
	
	
}

@media only screen and ( max-width: 1100px ){
	.visual_text								{ font-size:80px; line-height:80px !important; }
	.ti-cursor									{ font-size:80px !important; }
	.partners_box								{ width:calc(100% / 8); }

	.sub_service .W50							{ width:100%; }
	.sub_service .app_icon						{ float: none; width: 100px; margin:0 auto; }
	.sub_service .app_icon2						{ float: none; width: 200px; margin:0 auto; }
	.sub_service .ment							{ text-align:center; }

	.sub_service								{ padding:30px; }
	.sub_service .PL20							{ padding:0; }
	.sub_service .PL30							{ padding:0; }
	.sub_service .PT30							{ padding-top:0; }
	.sub_service .PT50							{ padding-top:30px; }
	.sub_service .PT80							{ padding-top:30px; }
	.sub_service .PB50							{ padding-bottom:30px; }
	
	.section7 .PL20								{ padding:0; }
	.section7 .partners_contents_wrap			{ padding:0 30px 30px 30px; }
	.section7 .PA10								{ padding:10px 10px 10px 0; }

	.skill_box									{ float: left; background:#000; font-size:15px; color:#fff; font-weight:500; width:80px; text-align:center; padding:5px 0; }

	.app_name									{ text-align:center; }

	.W600PX										{ width:100%; }

	.section2 .business_section_right			{ display:none; }
	.section3 .business_section_left			{ display:none; }
	.section4 .business_section_right			{ display:none; }
	.section5 .business_section_left			{ display:none; }
	.section6 .app_ment							{ padding-top:20px; }
	.section6 .skill_ment						{ margin-bottom:50px; }

	.application_img_05							{ display:none; }
	.application_img_06							{ display:none; }

	.skill_ment									{ float: left; width:100%; margin-left:0; margin-top:15px; padding-left:25px; }
	.skill_ment	span							{ position: absolute;  left:0; }

	.spotlight-group							{ position:relative; padding:0 30px 30px 30px; z-index:10; width:calc(100% / 1); margin:0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(20vw, auto); grid-gap:10px; }

}

@media only screen and ( min-width: 950px )		{
	body:after									{ content: 'desktop'; display:none;	}
	.mobile										{ display:none !important; }
	.desktop									{ display:block !important; }
	.fsmenu										{ display:none !important; }
}

@media only screen and ( max-width: 949px ){
	body:after									{ content: 'mobile'; display:none; }
	.mobile										{ display:block !important; }
	.desktop									{ display:none !important; }

	.AJIT_AD img								{ width:70%; margin:0 auto; }
}	

@media only screen and ( max-width: 870px ){
	.visual_text								{ font-size:60px; line-height:60px !important; }
	.ti-cursor									{ font-size:60px !important; margin: 0 0 0 10px; }

	.visual_box									{ width:100%; bottom:0; padding-top:0; }
	.visual_img_01								{ width:100%; height:100vh; background:url(../img/main/visual_img_01.png) no-repeat left top; background-position:-380px 0; background-size: cover; margin-top:80px; }
	.visual_img_02								{ width:100%; height:100vh; background:url(../img/main/visual_img_02.png) no-repeat center top; background-position:-700px 0;  background-size: cover; margin-top:80px;  }
	.visual_img_03								{ width:100%; height:100vh; background:url(../img/main/visual_img_03.png) no-repeat left top; background-position:-1100px 0; background-size: cover; margin-top:80px; }

	.owl-theme .owl-dots						{ right:auto; left:50%; margin-left:-10px; top:60vh; text-align: center; -webkit-tap-highlight-color: transparent; z-index:101; -webkit-animation: owl-dots_any 2000ms ease 1; animation: owl-dots_any 2000ms ease 1; }
	
	@-webkit-keyframes owl-dots_any				{ 0%   { left:50%; } 100% { left:50%; } }
	@keyframes owl-dots_any						{ 0%   { left:50%; } 100% { left:50%; } }

	.owl-theme .owl-dots .owl-dot span			{ background:#888; }
	.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background:#fff; }
	
	.icon_mouse									{ bottom:30px; color:#fff; }
	.mouse										{ width: 30px; height: auto; }
	#section1 .contents_wrap.MT30				{ text-align:center; margin-top:20px; }
	/*#section1 .contents_wrap .btn_default		{ margin:0 auto; }*/
	#section1 .contents_wrap.MB30				{ margin-bottom:0; }
	.partners_box								{ width:calc(100% / 6); }

	.copyright									{ width:100%; border-top:1px solid #F4F5F7; padding:30px 0; color:#888; }
	.copyright ul								{ display: inline-block; width:100%; }
	.copyright ul li:first-child				{ float: left; display: inline; width:calc(100% / 1); }
	.copyright ul li							{ float: left; display: inline; width:calc(100% / 2); }
	.copy_sns									{ position: absolute; top:40px; right:0; }

	.spotlight-group							{ position:relative; padding:0 30px 30px 30px; z-index:10; width:calc(100% / 1); margin:0 auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(30vw, auto); grid-gap:10px; }
}

@media only screen and ( max-width: 650px ){ 
	.section									{ min-height:200px !important; }
	.vertical_line								{ width:100%; min-height: 100vh; left:0; top:0; position: absolute; z-index:1; background: repeating-linear-gradient(90deg, #F4F5F7, #F4F5F7 1px, transparent 0, transparent calc(100% / 3)); -webkit-animation: vertical_line_any 1000ms ease 1; animation: vertical_line_any 1000ms ease 1; }
	.sub_vertical_line							{ width:100%; min-height: 100vh; left:0; top:0; position: absolute; z-index:1; background: repeating-linear-gradient(90deg, #3D3D3E, #3D3D3E 1px, transparent 0, transparent calc(100% / 3)); -webkit-animation: sub_vertical_line_any 1000ms ease 1; animation: sub_vertical_line_any 1000ms ease 1; }
	.visual_text								{ font-size:30px; line-height:40px !important; text-align:center; text-shadow: 1px 1px 10px rgba(255,255,255,0.5); }
	.ti-cursor									{ font-size:30px !important; margin: 0 0 0 20px; }
	.since										{ text-shadow: 1px 1px 10px rgba(255,255,255,0.5); margin-left:-25px; margin-top:50px; font-size:13px; font-weight:700; z-index:101; -ms-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); right:auto; left:50%; top:50%; }
	
	.company_diary								{ display:none; }
	.company_logo.W50							{ display:none; }
	.COMPANY_INTRODUCE_ELEMENT.W50				{ width:100% !important; text-align:center; margin-top:30px; }
	.company_title								{ font-size:28px; }

	.title_up									{ font-size:28px; font-weight:900; }
	.title										{ font-size:28px; font-weight:900; line-height:40px; }

	.ment_up									{ padding-top:35px; }
	.ment.PT10									{ padding-top:8px; }


	.mojise_history								{ position: absolute; z-index:0; left:27px; top:40px; font-size:35px; }
	.main2 .title_up.PT60						{ padding-top:30px; }
	.main2 .PT170								{ padding-top:70px; }
	
	.timeline-carousel__item-inner				{ position: relative; padding-top: 45px; min-width:200px; max-width:330px;}
	.timeline-carousel__item-inner:after		{ position: absolute; width: 100%; top: 40px; left: 0; content: ""; border-bottom: 1px solid rgba(0, 0, 0, 1); }
	.timeline-carousel__item-inner .year		{ font-size:25px; }

	.tab ul										{ position: absolute; top:-10px; right:15px; padding:0; margin:0; list-style:none; width:180px; height:auto; overflow:hidden; }
	.tab ul li									{ display:inline-block; width:60px; float:left; line-height:40px; font-size:18px; text-align:center; cursor:pointer; color:#888; }
	
	.partners_box								{ width:calc(100% / 4); }

	.rod										{ display:none; }
	.tab .conBox								{ background:transparent; }


	.AJIT_AD img								{ width:90%; margin:0 auto; }

	.phon li									{ width:50%; padding-bottom:30px; }
	.Application .PT100							{ padding-top:40px; }
	.Application .PB50							{ padding-bottom:20px; }
	.E-Commerce .PT100							{ padding-top:40px; }
	.E-Commerce .ment.PB50						{ padding-bottom:30px; }
	
	.section1 .PT80								{ padding-top:20px; }
	.section1 .PB50								{ padding-bottom:20px; }
	.section2 .title.PT100						{ padding-top:20px; }

	.section6 .PT100							{ padding-top:40px; }


	.contact.PT80								{ padding-top:30px; }
	.contact ul li								{ float: left; display: inline; width:calc(100% / 1); }
	.CONTACT_LEFT .PR10							{ padding-right:0; }
	.CONTACT_RIGHT .PL10						{ padding-left:0; }
	.CONTACT_RIGHT .PB50						{ padding-bottom:30px; }
	.CONTACT_LEFT .MB30							{ margin-bottom:10px; }

    .copyright .PL30							{ padding-left:0; padding-top:30px; }
	.copyright ul li							{ float: left; display: inline; width:calc(100% / 1); }
	.copy_logo_01								{ float: left; display: inline; width:calc(100% / 1); margin:0; height:28px; background:url(../img/main/copy_logo_01.png ) no-repeat left; background-size:202px 28px; display: block; }
	.copyright ul li:nth-child(2)				{ padding-top:30px; }
	.copy_logo									{ margin-bottom:15px;  }

	.business .commerce li						{ float: left; display: inline; width:calc(100% / 1); } 
	.business .commerce li dl					{ padding-bottom:50px; } 
	.business .commerce.PB50					{ padding-bottom:0; }
	.business .commerce .PT50					{ padding-top:0; }

	.online_box > div							{ width:calc(100% / 4); }
	.section8 .PT100							{ padding-top:40px; }
	.section8 .ment.PB50						{ padding-bottom:30px; }

	.operationg									{ width:100%; height:600px; background:url(../img/business/operationg_bg.png) no-repeat center center; color:#fff; background-size: cover; }
	.operationg .operationg_box					{ float: left; position: relative; width:50%; background:rgba(0, 0, 0, 0.5); height:300px; text-align:center; border-right:1px solid rgba(255, 255, 255, 0.1); border-bottom:1px solid rgba(255, 255, 255, 0.1); cursor:pointer; }
	.operationg .operationg_box:hover			{ padding-top:15px; background:rgba(0, 0, 0, 0.8); height:300px; text-align:center; border-right:1px solid rgba(255, 255, 255, 0.1); }
	.operationg .operationg_box ul				{ padding-top:8vh; }

	.spotlight-group							{ position:relative; padding:0 10px 10px 10px; z-index:10; width:calc(100% / 1); margin:0 auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: minmax(35vw, auto); grid-gap:10px; }
	.gallery_title								{ font-size:30px; font-weight:700; text-align:center; line-height:50px; margin-top:20px; z-index:100; }
	.gallery_close_box							{ position: absolute; right:30px; top:10px; width:30px; height:30px; }	
	.gallery_close								{ height: 30px;  }
	.gallery_close:after						{ height: 30px; }

	.gallery .ment								{ padding:0 30px 30px 30px; }

}

@media only screen and ( max-width: 450px ){ 
	#map										{ width:100%; height:250px; }
	.partners_box img							{ width:100%; padding:5px; }
	.tab .conBox								{ margin-top:20px; padding:0 20px 0 20px; }
	.partners_box								{ padding-bottom:5px; }
	
	.business_box .PT10							{ padding-top:0; }

	.business_title								{ font-size:30px; } 
	.business_title	span						{ font-size:30px; }

	.star_01									{ right:50%; top:-5px; margin-right:-130px; }
	.star_02									{ right:50%; top:15px; margin-right:-50px; }

	.m_dmp_box									{ float: left; position: relative; width:100%; }
	.m_dmp_column_img							{ float: left; width:90px; margin-bottom:20px;  }
	.m_dmp_column								{ font-size:12px; position:relative; color:#fff; margin-left:95px; }
	.m_dmp_column span							{ position: absolute; left:10px; color:#fff; font-weight:500; }
	.online_box > div							{ width:calc(100% / 3); }
	.sub_rod									{ position: absolute; z-index:0; width:calc(100% / 1.5); height:750px; top:0; background:#F4F5F7; }

	.section8 .PT100							{ padding-top:0; }

	.operationg_num								{ font-size:38px; font-weight:900; padding:10px 10px 40px 10px; }
	.operationg_title							{ font-size:15px; line-height:30px; font-weight:300; }

	.copyright.MT50								{ margin-top:30px; }
	.copy_sns dt								{ float: left; display: inline; margin:0 5px;  }
}