﻿@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:700');
@import url('http://fonts.googleapis.com/earlyaccess/jejumyeongjo.css');
@import url('http://fonts.googleapis.com/earlyaccess/cwtexming.css');

html, body {width:100%; height:100%; font-family:'Roboto', sans-serif;font-weight:400;font-size:13px;line-height:1.5;color:#2b2b2b;}


/*viewport // fadeInRight / fadeInUp / fadeInDown / fadeInLeft*/
.hidden {opacity:0;}
.visible {opacity:0;}
.animated {animation-duration:1.5s;animation-fill-mode:both;}
@keyframes fadeInUpAni {0%{opacity:0;transform:translate3d(0,120px,0)} to{opacity:1;transform:none}}
.fadeInUpAni {animation-name:fadeInUpAni;}
@keyframes fadeInDownAni {0%{opacity:0;transform:translate3d(0,-120px,0)} to{opacity:1;transform:none}}
.fadeInDownAni {animation-name:fadeInDownAni;}
@keyframes fadeInRightAni {0%{opacity:0;transform:translate3d(-120px,0,0)} to{opacity:1;transform:none}}
.fadeInRightAni {animation-name:fadeInRightAni;}
@keyframes fadeInLeftAni {0%{opacity:0;transform:translate3d(120px,0,0)} to{opacity:1;transform:none}}
.fadeInLeftAni {animation-name:fadeInLeftAni;}
.animation_delay1 {animation-delay:0.5s;}
.animation_delay2 {animation-delay:1s;}
.txt_hid {width:0; height:0; font-size:0; color:transparent;}


/*헤더*/
header {width:100%; position:fixed; left:0; top:0; z-index:999; background:rgba(255,255,255,0.9); display:none;}
	.header_inner {width:100%; max-width:1920px; height:120px; margin:0 auto; position:relative;}
		.header_logo {width:21%; max-width:280px; height:45px; position:absolute; top:38%; left:5%; z-index:999;
			background:url("../images/logo_black.png") no-repeat center left; background-size:contain;}
			.header_logo a {display:block; width:100%; height:100%;}
		.gnb_wrap {position:absolute; bottom:12%; right:4%; z-index:99;}
			.gnb {font-family: 'Roboto', sans-serif; text-align:center;}
				.gnb li {display:inline-block; padding-left:10px; margin-bottom: 15px;}
				.gnb li a {color:#888; font-size:17px; padding:20px}
				.gnb li a:hover span {color:#333; text-decoration:line-through;}
				.gnb li.language_wrap {border-radius: 16px; background: #333; padding: 5px 10px;}
				.gnb li a.language {color:#ddd; padding:20px 5px;}
				.gnb li a.language.on {color:#edce3c;}
				.gnb li a.language:hover span {color:#edce3c;}
				.language_line {color:#ddd; font-size:17px;}
.btn_scroll_up {position:fixed; width:4%; max-width:70px; right:2%; bottom:2%; z-index:999; display:none;}
	.btn_scroll_up a, .btn_scroll_up a img {width:100%;}


/*main*/
#main {width:100%; height:100vh; overflow:hidden; position:relative;}
	#main .swiper-container { width: 100%; height: 100%; /*background:url("../images/main/main_loading.png") no-repeat center center; background-size:cover;*/}
		#main .swiper-wrapper li.swiper-slide {width:100%; height:100%; position:relative;}
		#main .swiper-wrapper li.main1 { background:url("../images/main/main01.jpg") no-repeat center center; background-size:cover;}
		#main .swiper-wrapper li.main2 { background:url("../images/main/main02.jpg") no-repeat center center; background-size:cover;}
		#main .swiper-wrapper li.main3 { background:url("../images/main/main03.jpg") no-repeat center center; background-size:cover;}
		#main .swiper-wrapper li.main4 { background:url("../images/main/main04.jpg") no-repeat center center; background-size:cover;}
		#main .swiper-wrapper li.main5 { background:url("../images/main/main05.jpg") no-repeat center center; background-size:cover;}
		#main .swiper-wrapper li.main6 { background:url("../images/main/main06.jpg") no-repeat center top; background-size:cover;}
		#main .swiper-wrapper li.main7 { background:url("../images/main/main07.jpg") no-repeat center bottom; background-size:cover;}
		#main .swiper-wrapper li.swiper-slide img {display:block;width:100%;}
			#main .swiper-pagination {bottom:10%;}
				#main .swiper-pagination-bullet {width:16px; height:16px; background:#eee; opacity:1;}
				#main .swiper-pagination-bullet-active {background:#edce3c; opacity:1;}
				#main .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {margin:0 15px;}
	#main .main_tit {width:625px; height:237px; position:absolute; left:15%; top:20%; background:url("../images/main/main_tit.png") no-repeat center center; background-size:contain; z-index:2;}
	#main .main_mouse_wheel {width:46px; height:75px; position:absolute; left:50%; margin-left:-23px; bottom:17%; background:url("../images/main/main_mouse_wheel.png") no-repeat center center; background-size:contain; z-index:2;
		animation-name:main_mouse_wheel_ani;animation-duration:10s;animation-fill-mode:both;}
	@keyframes main_mouse_wheel_ani {
		0%{opacity:1;transform:translate3d(0,10px,0)}
		30%{transform:translate3d(0,-5px,0)}
		60%{transform:translate3d(0,10px,0)}
		90%{opacity:1;transform:translate3d(0,-5px,0)}
		100%{opacity:0;}
	}



/*sc1 - CAMPAIGN STORY(INFO PROCESS HISTORY)*/
#sc1 {width:100%; overflow:hidden}
	.sc1 {width:100%; overflow:hidden; font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
		.sc1_inner {width:85%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc1_tit {width:100%; margin:8% auto 3.5%; text-align:center;}
				.sc1_tit .tit_nonblack {font-size:32px; font-weight:600; margin-bottom:0.5%;}
				.sc1_tit .tit_black {font-size:48px; font-weight:700; color:#fff; background:#121212; padding:5px 15px;}
			.sc1_con_wrap {width:100%; position:relative;}
				.sc1_bgtree {display:block; width:18%; position:absolute; right:8%; bottom:5%;}
				.sc1_con1 {width:100%; text-align:center; padding-bottom:2.2%;font-size:20px; text-align:center; line-height:1.85; letter-spacing:-1px; font-weight:500;}
					.sc1_con1 span {font-weight:700;}
					.sc1_con1 span.sc1_con1_yellow {background:url('../images/sc1/sc1_con1_yellow.png') no-repeat center bottom; background-size:contain;}
				.sc1_con2 {width:100%; text-align:center; color:#5f5f5f; font-size:17px; text-align:center; padding:1% 0 4.5%;}
			.sc1_video_wrap {width:82%; margin:0 auto 8%; position:relative;}
				.sc1_video_bg {display:block; width:100%;}
				.sc1_video {display:block; width:100%; height:99.2%; position:absolute; left:0; top:0;}

	.sc2 {width:100%; overflow:hidden; background:#efefef;
		font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
		.sc2_inner {width:85%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc2_tit {width:100%; margin:8% auto 4%; text-align:center;}
				.sc2_tit .tit_black {font-size:48px; font-weight:700; color:#fff; background:#121212; padding:5px 15px;}
				.sc2_tit .tit_nonblack {font-size:32px; font-weight:600; margin-top:0.5%;}
			.sc2_process {width:100%; position:relative;}
				.sc2_process_list {width:70%; overflow:hidden; margin:0 auto 8%; text-align:center;}
					.sc2_process_list li {width:30%; float:left; margin:0 1.66665%;}
						.sc2_process_list li img {display:block; width:50%; margin:0 auto;}
						.sc2_phase_no {font-family: 'Roboto', sans-serif; font-size:18px; text-align:center; line-height:1.5; font-weight:500; padding-top:10%;}
							.sc2_phase_no span {border-bottom:solid 2px;}
						.sc2_phase_tit {width:100%; font-size:24px; text-align:center; line-height:1.4; font-weight:900; padding-top:5%;}
						.sc2_phase_term {width:100%; font-size:17px; text-align:center; line-height:1.5; padding-top:2%;}
						.sc2_phase_con {width:100%; font-size:20px; text-align:center; line-height:1.5; letter-spacing:-0.5px; padding-top:10%;}
				.sc2_arrow {width:1.5%; position:absolute; top:50%;}
					.sc2_arrow1 {left:38%;}
					.sc2_arrow2 {left:61%;}

	.sc3 {width:100%; overflow:hidden;
		font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
		.sc3_inner {width:85%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc3_tit {width:100%; margin:8% auto 4%; text-align:center;}
				.sc3_tit .tit_black {font-size:48px; font-weight:700; color:#fff; background:#121212; padding:5px 15px;}
				.sc3_tit .tit_nonblack {font-size:32px; font-weight:600; margin-top:0.5%;}
					.sc3_tit .tit_nonblack .font_mj {font-family: 'Nanum Gothic', serif;}
					.sc3_tit .tit_nonblack .font_bold {font-weight:800;}
			.sc3_history {width:93%; overflow:hidden; margin:0 auto 8%; text-align:center;}
				.sc3_history li {width:100%; overflow:hidden; background:#f8f8f8;}
					.sc3_history_bg {width:50%; float:left;}
						.sc3_history_bg01 {background:url("../images/sc1/history/sc1_history01.jpg") no-repeat center center; background-size:cover;}
						.sc3_history_bg02 {background:url("../images/sc1/history/sc1_history02.jpg") no-repeat center center; background-size:cover;}
						.sc3_history_bg03 {background:url("../images/sc1/history/sc1_history03.jpg") no-repeat center center; background-size:cover;}
						.sc3_history_bg04 {background:url("../images/sc1/history/sc1_history04.jpg") no-repeat center center; background-size:cover;}
						.sc3_history_bg05 {background:url("../images/sc1/history/sc1_history05.jpg") no-repeat center center; background-size:cover;}
						.sc3_history_bg06 {background:url("../images/sc1/history/sc1_history06.jpg") no-repeat center center; background-size:cover;}
					.sc3_history_txt {width:50%; float:left; background:#f8f8f8;}
						.sc3_history_txt .sc3_history_txt_top {width:100%; padding-top:100px;}
						.sc3_history_txt span {font-size:17px; color:#fff; padding:4px 10px; border-radius:16px; background:#121212;}
						.sc3_history_txt h3 {font-size:36px; line-height:1.85; padding-top:10px;}
						.sc3_history_txt .bar {width:5%; height:2px; margin:10px auto; background:#121212;}
						.sc3_history_txt p {font-size:18px; text-align:center; line-height:1.75; letter-spacing:-0.5px; padding:20px 5% 80px;}


/*sc2 - VIDEO*/
#sc2 {width:100%; overflow:hidden;}
	.sc4_video_wrap {width:100%;}
		.sc4_video {width:100%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc4_video_bgcenter {display:block; width:100%;}
			.sc4_video_tit {width:100%; position:absolute; left:0; top:6.5%; text-align:center;
				font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
				.sc4_video_tit .tit_black {font-size:48px; font-weight:700; color:#fff; background:#121212; padding:5px 15px;}
				.sc4_video_tit .tit_nonblack {font-size:32px; font-weight:600; margin-top:0.5%;}
			.sc4_video .gallery-top.swiper-container { width: 80%; height: 73%; position:absolute; left:10%; top:20%;}
				.sc4_video .gallery-top.swiper-container .swiper-slide {width:100%; height:100%; position:relative;}
				.sc4_video .gallery-top.swiper-container .swiper-slide iframe {display:block; width:75%; height:66%; margin:0 auto;}
				.sc4_video .swiper-pagination {font-size:22px; letter-spacing:4px; bottom:0%; text-align:center;}
				.sc4_video .gallery-top.swiper-container .swiper-button-prev, .sc4_video .gallery-top.swiper-container .swiper-button-next {
					width:2.5%; height:10%; max-width: 30px; max-height: 58px; background-size: contain; outline: none; text-decoration: none; top:auto; bottom:15%;}
					.sc4_video .gallery-top.swiper-container .swiper-button-prev, .sc4_video .gallery-top.swiper-container .swiper-container-rtl .swiper-button-next {
						background-image: url("../images/sc4/textgallery/sc4_textgallery_btn_left.png"); left:7%;}
					.sc4_video .gallery-top.swiper-container .swiper-button-next, .sc4_video .gallery-top.swiper-container .swiper-container-rtl .swiper-button-prev {
						background-image: url("../images/sc4/textgallery/sc4_textgallery_btn_right.png"); right:7%;}
			.sc4_video .gallery-thumbs.swiper-container { width: 60%; position:absolute; left:20%; bottom:12%;}
				.sc4_video .gallery-thumbs.swiper-container .swiper-slide {width:100%; position:relative;}
				.sc4_video .gallery-thumbs.swiper-container .swiper-slide img {display:block; width:100%; margin:0 auto;}


/*sc3 - PRESS*/
#sc3 {width:100%; overflow:hidden;}
	.sc4_textgallery_wrap {width:100%; overflow:hidden; background:#efefef;}
		.sc4_textgallery {width:85%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc4_textgallery_bgcenter {display:block; width:100%;}
			.sc4_textgallery .swiper-container { width: 86%; height: 100%; overflow:hidden; margin:0 auto; position:absolute; left:7%; top:0%;}
				.sc4_textgallery .swiper-container .swiper-slide {width:100%; background:#efefef; position:relative;}
				.sc4_textgallery .swiper-container .swiper-slide div {display:block; width: 80%; position:absolute; left:10%; top:10px; opacity:1; transition:all 1s; text-align:center;}
					.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con {font-size:36px; line-height:1.85; font-weight:500; font-family: 'Jeju Myeongjo', serif; margin-top:19%;}
					.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con span {font-family: 'cwTeXMing', serif;}
					.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_site {font-size:20px;margin-top:5%; font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
				.sc4_textgallery .swiper-container .swiper-slide.swiper-slide-prev div {top:10px;opacity:0; left:3%;}
				.sc4_textgallery .swiper-container .swiper-slide.swiper-slide-next div {top:10px;opacity:0; left:17%;}
				.sc4_textgallery .swiper-container .swiper-slide.swiper-slide-active div {top:10px;opacity:1; left:10%;}
			.sc4_textgallery .swiper-pagination {font-size:22px; letter-spacing:4px; bottom:12%; text-align:center;}
			.sc4_textgallery .swiper-button-prev, .sc4_textgallery .swiper-button-next {width:2.5%; height:10%; max-width: 30px; max-height: 58px;
				background-size: contain; outline: none; text-decoration: none;}
				.sc4_textgallery .swiper-button-prev, .sc4_textgallery .swiper-container-rtl .swiper-button-next {background-image: url("../images/sc4/textgallery/sc4_textgallery_btn_left.png"); left:0;}
				.sc4_textgallery .swiper-button-next, .sc4_textgallery .swiper-container-rtl .swiper-button-prev {background-image: url("../images/sc4/textgallery/sc4_textgallery_btn_right.png"); right:0;}
	.sc4_news_wrap {width:85%; overflow:hidden; margin:8% auto;}
		.sc4_news {width:100%; max-width:1200px; margin:0 auto; position:relative;}
		.sc4_news li {width:20%; float:left; margin:2.5%;}
		.sc4_news li a img {display:block; width:80%; margin:0 auto;}
				

/*sc4 - ARTWORK*/
#sc4 {width:100%; overflow:hidden;}
	.sc5_gallery_wrap {width:100%; background:#efefef;}
		.sc5_gallery {width:100%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;}
			.sc5_gallery_bgcenter {display:block; width:100%;}
			.sc5_gallery_tit {width:100%; position:absolute; left:0; top:12%; text-align:center;
				font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
				.sc5_gallery_tit .tit_black {font-size:48px; font-weight:700; color:#fff; background:#121212; padding:5px 15px;}
				.sc5_gallery_tit .tit_nonblack {font-size:32px; font-weight:600; margin-top:0.5%;}
			.sc5_gallery .swiper-container { width: 100%; height: 57%; position:absolute; left:0%; top:33%;}
				.sc5_gallery .swiper-container .swiper-slide {position:relative;}
				.sc5_gallery .swiper-container .swiper-slide img {display:block; width:100%; margin:0 auto;}
			.sc5_gallery .swiper-container-horizontal > .swiper-scrollbar {width:60%; height:2px; bottom:13%; left:20%; background:#828282;}
			.sc5_gallery .swiper-scrollbar-drag {height:18px; top:-9px; background:#161616;}
			.sc5_gallery .swiper-pagination {font-size:22px; letter-spacing:4px; bottom:0%; text-align:center;}


/*sc5 - SNS*/
#sc5 {width:100%; overflow:hidden; background:#fff; padding:120px 0 100px;}
	.sc6_inner {width:85%; max-width:1920px; overflow:hidden; margin:0 auto; position:relative;
		font-family: 'NanumSquare', sans-serif; font-weight: 400; color:#2b2b2b;}
		.sc6_tit {width:100%; margin:2% auto 3%; text-align:center;}
			.sc6_tit img {display:block; width:4.5%; margin:0 auto 1.5%;}
			.sc6_tit .tit_black {font-size:40px; font-weight:700; letter-spacing:-2px;}
			.sc6_tit .tit_nonblack {font-size:25px; line-height:1.4; font-weight:600; margin-top:0.5%;}
		.sc6_viral {width:70%; margin:0 auto;}
			.sc6_viral li {width:32%; padding:0.66665%; float:left;}
				.sc6_viral li img {width:100%;}



/*footer*/
footer {width:100%; text-align:center; background:#161616;}
	footer p {font-size:14px; color:#fff; font-weight:300; padding:1% 0;}


/*가로폭*/
@media all and (max-width: 1600px) {
	.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con {margin-top: 17%; font-size:30px;}/*19 36*/

	.sc1_bgtree {width:15%;}
}
@media all and (max-width: 1380px) {
	.gnb_wrap {right:2%;}
	.gnb li a {padding:10px;}
	.header_logo {left:2%;}

	.sc1_bgtree {width:14%;}
	.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con {margin-top: 15%; font-size:24px;}/*17 30*/

	.sc1_tit .tit_black, .sc2_tit .tit_black, .sc3_tit .tit_black, .sc4_video_tit .tit_black, .sc5_gallery_tit .tit_black {font-size:44px;}/*48*/
	.sc6_tit .tit_black {font-size:36px;}/*40*/
	.sc3_history_txt h3 {font-size:32px;}/*36*/
	.sc1_tit .tit_nonblack, .sc2_tit .tit_nonblack, .sc3_tit .tit_nonblack, .sc4_video_tit .tit_nonblack, .sc5_gallery_tit .tit_nonblack {font-size:28px;}/*32*/
	.sc6_tit .tit_nonblack {font-size:21px;}/*25*/
	.sc2_phase_tit {font-size:20px;}/*24*/
	.sc1_con1, .sc2_phase_con, .sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_site {font-size:17px;}/*20*/
	.sc2_phase_no, .sc3_history_txt p {font-size:17px;}/*18*/
}
@media all and (max-width: 1200px) {
	.gnb li {padding-left:0;}
	.gnb li a {font-size:15px; padding:0px;}
	.language_line {font-size:15px;}
	.sc5_result_inner li h2 {font-size:30px;}

	.sc1_tit .tit_black, .sc2_tit .tit_black, .sc3_tit .tit_black, .sc4_video_tit .tit_black, .sc5_gallery_tit .tit_black {font-size:36px;}/*44*/
	.sc6_tit .tit_black {font-size:28px;}/*36*/
	.sc3_history_txt h3 {font-size:24px;}/*32*/
	.sc1_tit .tit_nonblack, .sc2_tit .tit_nonblack, .sc3_tit .tit_nonblack, .sc4_video_tit .tit_nonblack, .sc5_gallery_tit .tit_nonblack {font-size:20px;}/*28*/
	.sc6_tit .tit_nonblack {font-size:17px;}/*25*/
	.sc2_phase_tit {font-size:20px;}/*24*/
	.sc2_phase_con, .sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_site {font-size:13px;}/*17*/
}
@media all and (max-width: 1090px) {
	.sc5_result_inner li h2 {font-size:20px;}
	.sc4_textgallery .swiper-pagination, .sc5_gallery .swiper-pagination, .sc4_video .swiper-pagination {font-size:16px;}

	.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con {font-size:16px;}/*17 30*/

	.sc1_tit .tit_black, .sc2_tit .tit_black, .sc3_tit .tit_black, .sc4_video_tit .tit_black, .sc5_gallery_tit .tit_black {font-size:32px;}/*36*/
	.sc6_tit .tit_black {font-size:24px;}/*28*/
	.sc3_history_txt h3 {font-size:20px;}/*24*/
	.sc1_tit .tit_nonblack, .sc2_tit .tit_nonblack, .sc3_tit .tit_nonblack, .sc4_video_tit .tit_nonblack, .sc5_gallery_tit .tit_nonblack {font-size:17px;}/*20*/
}
@media all and (max-width: 800px) {
	.sc5_result_inner li h2 {font-size:20px;}
}
@media all and (max-width: 760px) {
	.header_logo {left:40%; top:20%;}
	.gnb_wrap {width:100%; bottom:10%;}
	.gnb li a {font-size:10px;}
	.language_line {font-size:10px;}
	#main .main_tit {width:70%;}

	.sc1_tit .tit_black, .sc2_tit .tit_black, .sc3_tit .tit_black, .sc4_video_tit .tit_black, .sc5_gallery_tit .tit_black {font-size:24px;}/*32*/
	.sc6_tit .tit_black {font-size:17px;}/*24*/
	.sc3_history_txt h3 {font-size:17px;}/*20*/
}
@media all and (max-width: 730px) {
	.sc5_result_inner li h2 {font-size:15px;}
	
	.sc4_textgallery .swiper-container .swiper-slide .sc4_textgallery_con {margin-top: 10%; font-size:12px;}/*17 30*/
}
@media all and (max-width: 690px) {
	.sc4_textgallery .swiper-pagination {font-size:15px;}f
	.sc5_gallery .swiper-pagination {font-size:15px;}
	footer p {font-size:10px;}

	.sc1_tit .tit_black, .sc2_tit .tit_black, .sc3_tit .tit_black, .sc4_video_tit .tit_black, .sc5_gallery_tit .tit_black {font-size:17px;}/*32*/
}
@media all and (max-width: 480px) {
	.sc5_result_inner li h2 {font-size:10px;}
}