@charset "utf-8";

.mcont {position:relative; max-width:1200px; margin:0 auto}

.mtltBox {padding-bottom:70px; text-align:center;}
.mtltBox .stxt {color:#0f1a1b; font-size:22px; margin-bottom:10px; line-height:1.3em;}
.mtltBox .big {color:#842aa1; font-size:38px; line-height:1.2em; letter-spacing:-0.05em;}

@media screen and (max-width:1220px){
	.mcont {max-width:94%}
}

@media screen and (max-width:1024px){
	.mtltBox {padding-bottom:60px}
	.mtltBox .stxt {font-size:20px; margin-bottom:18px;}
	.mtltBox .big {font-size:34px;}
}

@media screen and (max-width:768px){
	.mtltBox {padding-bottom:50px}
	.mtltBox .stxt {font-size:18px; margin-bottom:16px;}
	.mtltBox .big {font-size:24px;}
}

@media screen and (max-width:480px){
	.mtltBox {padding-bottom:30px}
	.mtltBox .stxt {font-size:16px; margin-bottom:14px;}
	.mtltBox .big {font-size:18px;}
}



/* --------------------------------------------------오른쪽 네비-------------------------------------------------- */
.r_navi {position:fixed; top:50%; right:40px; ; transform: translateY(-50%); font-size:14px;}
.fp-viewing-1 .r_navi a, .fp-viewing-3 .r_navi a, .fp-viewing-4 .r_navi a, .fp-viewing-5 .r_navi a {color:#fff}
.fp-viewing-2 .r_navi a, .fp-viewing-6 .r_navi a {color:#222}

.r_navi ul {margin:0 auto; text-align:center}
.r_navi ul a {width:9px; height:9px; display:inline-block; block; margin:1px 0; border-radius:50%;}
.fp-viewing-1 .r_navi ul a, .fp-viewing-3 .r_navi ul a, .fp-viewing-4 .r_navi ul a, .fp-viewing-5 .r_navi ul a {background:#fff}
.fp-viewing-2 .r_navi ul a, .fp-viewing-2 .r_navi ul a, .fp-viewing-6 .r_navi ul a {background:#222}

.fp-viewing-1 .r_navi li:nth-child(1) a {background:#00aeef}
.fp-viewing-2 .r_navi li:nth-child(2) a {background:#00aeef}
.fp-viewing-3 .r_navi li:nth-child(3) a {background:#00aeef}
.fp-viewing-4 .r_navi li:nth-child(4) a {background:#00aeef}
.fp-viewing-5 .r_navi li:nth-child(5) a {background:#00aeef}
.fp-viewing-6 .r_navi li:nth-child(6) a {background:#00aeef}

@media screen and (max-width:1220px){
	.r_navi {display:none}
}

/* --------------------------------------------------메인 섹션01-------------------------------------------------- */
.main_vsBox {position:relative; background:url(/share/img/main/main_vs.jpg) no-repeat 50% 0; height:900px;}
.main_vscont {position:relative; max-width:1200px; margin:0 auto; height:100%; overflow:hidden}

.mvs_lBox, .mvs_rBox {position:absolute; top:53%; transform:translateY(-50%);}
.mvs_lBox {left:0; width:40%;}
.mvs_rBox {right:0; width:58%;}

.mvs_lBox .txtBox .stxt {font-size:17px; line-height:1.5em;}
.mvs_lBox .txtBox .stxt span {display:block; color:#00aeef;}

.mvs_lBox .txtBox .bigtxt {margin-top:25px;}
.mvs_lBox .txtBox .bigtxt span {display:block; font-size:60px; color:#00aeef; line-height:1.1em;}

.mvs_lBox .txtBox .datatxt {margin-top:30px; font-size:17px;}
.mvs_lBox .txtBox .datatxt span {font-size:27px;}
.mvs_lBox .txtBox .datatxt img {margin-left:15px; margin-top:-10px;}

.mvs_lBox .mvs_host {margin-top:200px;}
.mvs_lBox .mvs_host li {display:inline-block; margin-right:20px;}
.mvs_lBox .mvs_host li:last-child {margin-right:0}

.mvs_rBox > div {position:relative}
.mvs_rBox .txt01 {margin-bottom:44px;}
.mvs_rBox .txt02 {margin-bottom:50px;}
.mvs_rBox .txt03 {margin-bottom:44px;}

.mvs_rBox .txt01 .car {position:absolute; top:53px; left:252px}
.mvs_rBox .txt02 .car01 {position:absolute; top:0; left:165px}
.mvs_rBox .txt02 .car02 {position:absolute; top:37px; left:105px}
.mvs_rBox .txt04 .car {position:absolute; top:0; right:37px}

.main_vscont .mvs_bottom {position:absolute; bottom:25px; left:50%; transform:translateX(-50%);}
.main_vscont .mvs_bottom img {animation: float 1.6s; animation-iteration-count: infinite;}

/*애니메이션*/

.main #section1.active .mvs_lBox .txtBox .stxt, .main #section1.active .mvs_lBox .txtBox .bigtxt, .main #section1.active .mvs_lBox .txtBox .datatxt, .main #section1.active .mvs_lBox .mvs_host {animation-fill-mode: both !important; animation: fade-in 0.8s; animation-timing-function: ease-in-out;}

.main #section1.active .mvs_rBox .txt01, .main #section1.active .mvs_rBox .txt02, .main #section1.active .mvs_rBox .txt03, .main #section1.active .mvs_rBox .txt04 {animation-fill-mode: both !important; animation: fade-in-up 0.5s;animation-timing-function: ease-out; animation-delay:0.3s}
.main #section1.active .mvs_rBox .txt01 .car img {animation-fill-mode: both !important; animation: fade-in-right 0.7s;animation-timing-function: ease-out; animation-delay:0.3s}
.main #section1.active .mvs_rBox .txt02 .car01 img {animation-fill-mode: both !important; animation: fanfare2 0.3s; animation-delay:0.5s}
.main #section1.active .mvs_rBox .txt02 .car02 img {animation-fill-mode: both !important; animation: fanfare2 0.3s; animation-delay:0.6s}
.main #section1.active .mvs_rBox .txt04 .car img {animation-fill-mode: both !important; animation: fanfare2 0.3s;animation-timing-function: ease-out; animation-delay:0.7s}

@media screen and (max-width:1220px){
	.main_vsBox {height:80vw}
	.main_vscont {max-width:94%}
	
	.mvs_lBox .txtBox .stxt {font-size:1.4vw;}

	.mvs_lBox .txtBox .bigtxt {margin-top:2vw;}
	.mvs_lBox .txtBox .bigtxt span {font-size:5.5vw;}
	.mvs_lBox .txtBox .bigtxt img {height:4.6vw}

	.mvs_lBox .txtBox .datatxt {margin-top:2.5vw; font-size:1.2vw;}
	.mvs_lBox .txtBox .datatxt span {font-size:2.3vw;}
	.mvs_lBox .txtBox .datatxt img {margin-left:1vw; margin-top:-0.5vw; height:2vw}

	.mvs_lBox .mvs_host {margin-top:16vw;}
	.mvs_lBox .mvs_host li {margin-right:1.5vw;}
	.mvs_lBox .mvs_host li img {height:2.7vw}

	.mvs_rBox .txt01 {margin-bottom:3.8vw;}
	.mvs_rBox .txt02 {margin-bottom:4.4vw;}
	.mvs_rBox .txt03 {margin-bottom:3.8vw;}

	.mvs_rBox .txt01 .car {top:4vw; left:15vw}
	.mvs_rBox .txt02 .car01 {top:0; left:12.3vw}
	.mvs_rBox .txt02 .car02 {top:2vw; left:7.3vw}
	.mvs_rBox .txt04 .car {top:0; right:3.6vw}


	.mvs_rBox .txt01 .txt img {height:7.8vw}
	.mvs_rBox .txt02 .txt img {height:7.9vw}
	.mvs_rBox .txt03 .txt img {height:7.8vw}
	.mvs_rBox .txt04 .txt img {height:8vw}

	.mvs_rBox .txt01 .car img {height:5vw}
	.mvs_rBox .txt02 .car01 img {height:8.2vw}
	.mvs_rBox .txt02 .car02 img {height:8.2vw}
	.mvs_rBox .txt04 .car img {height:12.5vw}

	.main_vscont .mvs_bottom {bottom:2.2vw;}

}

@media screen and (max-width:768px){
	.main_vsBox {height:90vw}
	.mvs_lBox, .mvs_rBox {top:55%;}

	.mvs_lBox .txtBox .stxt {font-size:2vw;}

	.mvs_lBox .txtBox .datatxt {font-size:1.8vw;}
	.mvs_lBox .txtBox .datatxt span {font-size:2.9vw;}
	

	.mvs_lBox .mvs_host {margin-top:8vw}
	.mvs_lBox .mvs_host li {display:block; margin-bottom:1.5vw;}
	.mvs_lBox .mvs_host li img {height:3.7vw}

	.main_vscont .mvs_bottom img {height:3.6vw}
}

@media screen and (max-width:540px){
	.main_vsBox {height:105vw}
	.mvs_lBox, .mvs_rBox {top:60%;}
	.mvs_lBox .txtBox .stxt {font-size:2.5vw;}

	.mvs_lBox .txtBox .datatxt {font-size:2.3vw;}
	.mvs_lBox .txtBox .datatxt span {font-size:3.2vw;}
	

	.mvs_lBox .mvs_host {margin-top:4vw}
	.mvs_lBox .mvs_host li {margin-bottom:1vw;}
	.mvs_lBox .mvs_host li img {height:3.9vw}

	.main_vscont .mvs_bottom img {height:3.8vw}
}



/* --------------------------------------------------메인 섹션01_new -------------------------------------------------- */
.main_vsBox_new {position:relative; background:url(/share/img/main/main_vs.jpg) no-repeat 50% 0; background-size:cover; height:900px; background-color:#080b1d;}
.main_vscont_new {position:relative; max-width:1200px; margin:0 auto; height:100%; overflow:hidden}

.main_vscont_new .mvs_Box {position:absolute; top:59%; left:50%; width:100%; transform:translate(-50%,-50%);}
.main_vsBox_new .txt01_02Box, .main_vsBox_new .txt03_04Box {position:relative; text-align:center}
.main_vsBox_new .txt01_02Box {margin-bottom:25px;}

.main_vsBox_new .mvs_Box .txt02, .main_vsBox_new .mvs_Box .txt03, .main_vsBox_new .mvs_Box .txt04 {position:relative; display:inline-block; vertical-align:middle}

.main_vsBox_new .mvs_Box .txt01 .car {margin-top:55px;}
.main_vsBox_new .mvs_Box .txt01 .car img {height:187px;}
.main_vsBox_new .mvs_Box .txt01 .light {position:absolute; top:-200px; left:0}
.main_vsBox_new .mvs_Box .txt01 .light img {height:632px;}


.main_vsBox_new .mvs_Box .txt02 .car01 {position:absolute; bottom:-3px; left:127px}
.main_vsBox_new .mvs_Box .txt02 .car01 img {height:90px;}

.main_vsBox_new .mvs_Box .txt02 .car02 {position:absolute; bottom:-20px; left:80px}
.main_vsBox_new .mvs_Box .txt02 .car02 img {height:83px;}

.main_vsBox_new .mvs_Box .txt04 .car {position:absolute; bottom:-40px; right:33px}
.main_vsBox_new .mvs_Box .txt04 .car img {height:125px;}


.main_vsBox_new .txtBox {margin-top:80px;}
.main_vsBox_new .txtBox > div {display:inline-block;}
.main_vsBox_new .txtBox > div > div {display:inline-block; margin:0 15px;}

.main_vsBox_new .txt_box_top {margin-bottom:20px;}
.main_vsBox_new .txt_box_top .tb03 {display:none;}


/*애니메이션*/
.main #section1.active .main_vscont_new .mvs_logoBox img {animation-fill-mode: both !important;  animation: bounce-in-down 0.5s;animation-timing-function: ease-out; animation-delay:0.2s}

.main #section1.active .main_vsBox_new .mvs_Box .txt01 .txt img, .main #section1.active .main_vsBox_new .mvs_Box .txt02 .txt img, .main #section1.active .main_vsBox_new .mvs_Box .txt03 .txt img, .main #section1.active .main_vsBox_new .mvs_Box .txt04 .txt img {animation-fill-mode: both !important; animation: fade-in-up 0.5s; animation-timing-function: ease-out; animation-delay:0.3s}
.main #section1.active .main_vsBox_new .mvs_Box .txt01 .car img {animation-fill-mode: both !important; animation: fade-in-left 0.5s;animation-timing-function: ease-out; animation-delay:0.3s}
.main #section1.active .main_vsBox_new .mvs_Box .txt01 .light img {animation-fill-mode: both !important; animation: fade-in 0.3s; animation-timing-function: ease-out; animation-delay:0.5s}
.main #section1.active .main_vsBox_new .mvs_Box .txt02 .car01 img, .main #section1.active .main_vsBox_new .mvs_Box .txt02 .car02 img, .main #section1.active .main_vsBox_new .mvs_Box .txt04 .car img {animation-fill-mode: both !important; animation: fanfare2 0.3s}
.main #section1.active .main_vsBox_new .mvs_Box .txt02 .car01 img {animation-delay:0.5s}
.main #section1.active .main_vsBox_new .mvs_Box .txt02 .car02 img {animation-delay:0.6s}
.main #section1.active .main_vsBox_new .mvs_Box .txt04 .car img {animation-delay:0.7s}

.main #section1.active .main_vsBox_new .txt_box_top .tb01 img, .main #section1.active .main_vsBox_new .txt_box_bottom .tb01 img {animation-fill-mode: both !important;  animation: bounce-in-right 0.5s;animation-timing-function: ease-out; animation-delay:0.7s}
.main #section1.active .main_vsBox_new .txt_box_top .tb02 img, .main #section1.active .main_vsBox_new .txt_box_bottom .tb02 img {animation-fill-mode: both !important;  animation: bounce-in-left 0.5s;animation-timing-function: ease-out; animation-delay:0.7s}


@media screen and (max-width:1220px){
	.main_vscont_new .mvs_logoBox img {height:81px}

	.main_vsBox_new .mvs_Box .txt01 .car img {height:160px;}
	.main_vsBox_new .mvs_Box .txt01 .light {top:-200px; left:110px;}
	.main_vsBox_new .mvs_Box .txt01 .light img {height:540px;}

	.main_vsBox_new .mvs_Box .txt02 .car01 {bottom:-3px; left:107px}
	.main_vsBox_new .mvs_Box .txt02 .car01 img {height:75px;}

	.main_vsBox_new .mvs_Box .txt02 .car02 {bottom:-20px; left:67px}
	.main_vsBox_new .mvs_Box .txt02 .car02 img {height:68px;}

	.main_vsBox_new .mvs_Box .txt04 .car { bottom:-40px; right:20px}
	.main_vsBox_new .mvs_Box .txt04 .car img {height:110px;}

	.main_vsBox_new .txt_box_top .tb01 img {height:40px}
	.main_vsBox_new .txt_box_top .tb02 img {height:28px}

	.main_vsBox_new .txt_box_bottom .tb01 img, .main_vsBox_new .txt_box_bottom .tb02 img {height:26px}
}

@media screen and (max-width:1024px){
	.main_vsBox_new {height:90vw}

	.main_vscont_new .mvs_logoBox img {height:7.5vw}

	.main_vsBox_new .mvs_Box .txt01 .txt img {height:6vw;}
	.main_vsBox_new .mvs_Box .txt01 .car img {height:16vw;}
	.main_vsBox_new .mvs_Box .txt01 .light {top:-150px; left:60;}
	.main_vsBox_new .mvs_Box .txt01 .light img {height:460px;}

	.main_vsBox_new .mvs_Box .txt02 .car01 {bottom:-0.3vw; left:10.7vw}
	.main_vsBox_new .mvs_Box .txt02 .car01 img {height:7.5vw;}

	.main_vsBox_new .mvs_Box .txt02 .car02 {bottom:-2vw; left:6.7vw}
	.main_vsBox_new .mvs_Box .txt02 .car02 img {height:6.8vw;}

	.main_vsBox_new .mvs_Box .txt04 .car { bottom:-4vw; right:2vw}
	.main_vsBox_new .mvs_Box .txt04 .car img {height:11vw;}


	.main_vsBox_new .txtBox {margin-top:8vw}
	.main_vsBox_new .txtBox > div > div {display:inline-block; margin:0 10px;}

	.main_vsBox_new .txt_box_top .tb01 img {height:3.4vw}
	.main_vsBox_new .txt_box_top .tb02 img {height:2.6vw}

	.main_vsBox_new .txt_box_bottom .tb01 img, .main_vsBox_new .txt_box_bottom .tb02 img {height:2.35vw}
}


@media screen and (max-width:768px){
	.main_vsBox_new {height:110vw}

	.main_vscont_new .mvs_logoBox img {height:8.1vw}

	.main_vsBox_new .txtBox {margin-top:9vw}

	.main_vsBox_new .mvs_Box .txt01 .car img {height:17vw;}
	.main_vsBox_new .mvs_Box .txt01 .light {top:-60px; left:0;}
	.main_vsBox_new .mvs_Box .txt01 .light img {height:350px;}

	.main_vsBox_new .mvs_Box .txt02 .car01 {bottom:-0.3vw; left:15vw}
	.main_vsBox_new .mvs_Box .txt02 .car01 img {height:10.5vw;}

	.main_vsBox_new .mvs_Box .txt02 .car02 {bottom:-2vw; left:9vw}
	.main_vsBox_new .mvs_Box .txt02 .car02 img {height:9.8vw;}

	.main_vsBox_new .mvs_Box .txt04 .car {bottom:-4vw; right:4.5vw}
	.main_vsBox_new .mvs_Box .txt04 .car img {height:14vw;}

	.main_vsBox_new .txt_box_top .tb01 img {height:3.5vw}
	.main_vsBox_new .txt_box_top .tb02 img {height:3vw}
	
	.main_vsBox_new .txt_box_bottom .tb01 img, .main_vsBox_new .txt_box_bottom .tb02 img {height:2.6vw}
}

@media screen and (max-width:480px){
	.main_vsBox_new {height:150vw}

	.main_vscont_new .mvs_logoBox img {height:8.1vw}

	.main_vsBox_new .mvs_Box .txt01 .txt img {height:9vw;}
	.main_vsBox_new .mvs_Box .txt01 .car img {height:19vw;}
	.main_vsBox_new .mvs_Box .txt01 .light {top:0; left:50px;}
	.main_vsBox_new .mvs_Box .txt01 .light img {height:200px;}

	.main_vsBox_new .mvs_Box .txt02 .car01 {bottom:-0.3vw; left:15vw}
	.main_vsBox_new .mvs_Box .txt02 .car01 img {height:12.5vw;}

	.main_vsBox_new .mvs_Box .txt02 .car02 {bottom:-2vw; left:9vw}
	.main_vsBox_new .mvs_Box .txt02 .car02 img {height:11.8vw;}

	.main_vsBox_new .mvs_Box .txt04 .car {bottom:-4vw; right:4.5vw}
	.main_vsBox_new .mvs_Box .txt04 .car img {height:16vw;}

	.main_vsBox_new .txtBox > div > div {display:inline-block; margin:0 15px;}

	.main_vsBox_new .txt_box_top .tb01 img {height:6.7vw}
	.main_vsBox_new .txt_box_top .tb02 img {height:4.6vw}
	.main_vsBox_new .txt_box_top .tb03 {display:block;}
	.main_vsBox_new .txt_box_top .tb03 img {height:3.6vw}
	.main_vsBox_new .txt_box_top .tb01 {margin-bottom:10px;}
	.main_vsBox_new .txt_box_top .tb03 {margin-top:5px;}

	.main_vsBox_new .txt_box_bottom .tb01 {display:none;}
	.main_vsBox_new .txt_box_bottom .tb02 img {height:5vw}
}



/* --------------------------------------------------메인 섹션02-------------------------------------------------- */
.main #section2 {padding:116px 0}
.main #section2 .mcont {max-width:1240px}
.main #section2 .msec02_ul {overflow:hidden}
.main #section2 .msec02_ul li {opacity:0; position:relative; float:left; width:31.3%; margin:0 3% 3% 0; overflow:hidden}
.main #section2 .msec02_ul li:nth-child(3n) {margin-right:0}

.main #section2 .msec02_ul .img img {width:100%; transition:all 0.3s}
.main #section2 .msec02_ul li:hover .img img {transform: scale(1.2);}

.main #section2 .msec02_ul .txtBox {position:absolute; top:44px; left:35px; color:#fff; font-size:19px; z-index:1}
.main #section2 .msec02_ul .txtBox p {font-size:29px; font-family: 'GmarketSansBold'; margin-bottom:10px;}

.main #section2 .msec02_ul .btn {position:absolute; bottom:25px; right:28px; transition:all 0.3s}
.main #section2 .msec02_ul li:hover .btn {right:18px;}

.main #section2.active .msec02_ul li {opacity:1; animation-fill-mode: both !important; animation: slide-in-up 0.5s; animation-timing-function: ease;}
.main #section2.active .msec02_ul li:nth-child(1) {animation-delay:0.1s}
.main #section2.active .msec02_ul li:nth-child(2) {animation-delay:0.2s}
.main #section2.active .msec02_ul li:nth-child(3) {animation-delay:0.3s}
.main #section2.active .msec02_ul li:nth-child(4) {animation-delay:0.4s}
.main #section2.active .msec02_ul li:nth-child(5) {animation-delay:0.5s}
.main #section2.active .msec02_ul li:nth-child(6) {animation-delay:0.6s}

@media screen and (max-width:1260px){
	.main #section2 .mcont {max-width:94%}
}

@media screen and (max-width:1220px){
	.main #section2 .msec02_ul .txtBox {font-size:17px; top:34px; left:25px;}
	.main #section2 .msec02_ul .txtBox p {font-size:25px;}
}

@media screen and (max-width:1024px){
	.main #section2 {padding:100px 0}
	.main #section2 .msec02_ul li {width:32%; margin:0 2% 2% 0; }
	.main #section2 .msec02_ul .txtBox {font-size:15px; top:24px; left:20px;}
	.main #section2 .msec02_ul .txtBox p {font-size:20px;}

	.main #section2 .msec02_ul .btn, .main #section2 .msec02_ul li:hover .btn {bottom:25px; right:20px;}
	.main #section2 .msec02_ul .btn img {height:28px}
}

@media screen and (max-width:768px){
	.main #section2 {padding:80px 0}
	.main #section2 .msec02_ul li {width:49%; margin:0 2% 2% 0;}
	.main #section2 .msec02_ul li:nth-child(3n) {margin-right:2%}
	.main #section2 .msec02_ul li:nth-child(2n) {margin-right:0}
	.main #section2 .msec02_ul .btn img {height:25px}
}

@media screen and (max-width:480px){
	.main #section2 {padding:50px 0}
	.main #section2 .msec02_ul .txtBox {font-size:13px; top:15px; left:15px;}
	.main #section2 .msec02_ul .txtBox p {font-size:16px; margin-bottom:5px;}

	.main #section2 .msec02_ul .btn, .main #section2 .msec02_ul li:hover .btn {bottom:20px; right:15px;}
}


/* --------------------------------------------------메인 섹션03-------------------------------------------------- */
.main #section3 {background:url(/share/img/main/sec03_bg.jpg) no-repeat 50% 50% fixed; padding-top:118px; overflow:hidden; background-color:#080b1d;}
.main #section3 .mtltBox {padding-bottom:100px}

.main #section3 .msec03_ulBox, .main #section3 .msec03_ul {position:relative;}
.main #section3 .msec03_ul li {position:relative; display:inline-block; vertical-align:top; height:400px; padding:0 17px}
.main #section3 .msec03_ul li:before {content:""; display:block; width:12px; height:12px; border-radius:50%; background:#fff; position:absolute; top:0; right:-6px}
.main #section3 .msec03_ul li:after {content:""; display:block; width:1px; height:100%; background:rgba(255,255,255,0.4); position:absolute; top:0; right:0px}
.main #section3 .msec03_ul li:last-child:before, .main #section3 .msec03_ul li:last-child:after{display:none;}


.main #section3 .msec03_ul .stxt {font-size:22px; margin-top:15px; margin-bottom:20px;}
.main #section3 .msec03_ul .num {font-size:80px; font-family: 'GmarketSansBold'; line-height:1em;}
.main #section3 .msec03_ul li:nth-child(odd) .num {color:#3192ed}
.main #section3 .msec03_ul li:nth-child(even) .num {color:#ed8e31}

.main #section3 .msec03_ul .txt01 {font-size:18px;}
.main #section3 .msec03_ul .txt02 {font-size:14px; line-height:1.5em;}


@media screen and (max-width:1220px){
	.main #section3 {padding-top:100px;}
	.main #section3 .mtltBox {padding-bottom:80px}
	
	.main #section3 .msec03_ul li {height:350px}
	.main #section3 .msec03_ul .num {font-size:70px;}
}

@media screen and (max-width:1024px){	
	.main #section3 .msec03_ul .num {font-size:65px;}
}

@media screen and (max-width:768px){
	.main #section3 {padding-top:80px;}
	.main #section3 .mtltBox {padding-bottom:70px}

	.main #section3 .msec03_ul li {height:300px}
	.main #section3 .msec03_ul .stxt {font-size:20px; margin-top:10px; margin-bottom:15px;}
	.main #section3 .msec03_ul .num {font-size:60px;}

	.main #section3 .msec03_ul .txt01 {font-size:16px;}
	.main #section3 .msec03_ul .txt02 {font-size:13px;}
}

@media screen and (max-width:480px){
	.main #section3 {padding-top:60px;}
	.main #section3 .mtltBox {padding-bottom:40px}
	
	.main #section3 .msec03_ul li {height:250px}
	.main #section3 .msec03_ul .stxt {font-size:18px;}
	.main #section3 .msec03_ul .num {font-size:40px;}

	.main #section3 .msec03_ul .txt01 {font-size:14px;}
	.main #section3 .msec03_ul .txt02 {font-size:12px;}
}


/* --------------------------------------------------메인 섹션04-------------------------------------------------- */
.main #section4 {padding-top:85px; overflow:hidden}
.main #section4 .mtltBox {padding-bottom:42px}
.main #section4 .mtltBox .big {color:#031323;}

.mgrid_slBox {height:53vw;}
.mgrid_sl .grid {position:relative; max-width: 100%; height:53vw !important;}

.mgrid_sl .grid-item { display:inline-block;}
.mgrid_sl .grid-item img {width:100%; height:100%}

/* fluid 5 columns */
.grid-sizer, .grid-item {width: 20%; height:13.2vw; padding:1px;}
/* 2 columns */
.mgrid_sl .grid-item:nth-child(2), .mgrid_sl .grid-item:nth-child(5) {height:26.54vw}
.mgrid_sl .grid-item:nth-child(4) {width:40%; height:27vw}
.mgrid_sl .grid-item:nth-child(11) {width:40%; height:27vw}

.mgrid_sl .grid-item:nth-child(9) {height:26.54vw}

/*.mgrid_sl .grid-item-w2 {width: 20%;}
.mgrid_sl .grid-item-w3 {width: 30%;}
.mgrid_sl .grid-item-w4 {width: 40%;}
.mgrid_sl .grid-item-w5 {width: 50%;}
.mgrid_sl .grid-item-w6 {width: 60%;}

.mgrid_sl .grid-item-h10 {height: 10vw;}
.mgrid_sl .grid-item-h15 {height: 15vw;}
.mgrid_sl .grid-item-h20 {height: 20vw;}
.mgrid_sl .grid-item-h25 {height: 25vw;}
.mgrid_sl .grid-item-h30 {height: 30vw;}
.mgrid_sl .grid-item-h35 {height: 35vw;}*/

@media screen and (max-width:768px){
	.main #section4 {padding:60px 0}
	.main #section4 .mtltBox {padding-bottom:32px}

	.mgrid_slBox, .mgrid_sl .grid {height:50vw !important;}
}

@media screen and (max-width:768px){
	.main #section4 {padding:40px 0}
	.main #section4 .mtltBox {padding-bottom:22px}

	.mgrid_slBox, .mgrid_sl .grid {height:42vw !important;}
}

/* --------------------------------------------------메인 섹션05-------------------------------------------------- */
.main #section5 {background:#000 url(/share/img/main/sec05_bg.jpg) no-repeat 50% 50%; padding:130px 0}

@media screen and (max-width:1220px){
	.main #section5 {padding:100px 0}
}

@media screen and (max-width:768px){
	.main #section5 {background-size:150%; background-position:50% 0; padding:80px 0}
}

@media screen and (max-width:480px){
	.main #section5 {background-size:200%; padding:50px 0}
}


/* --------------------------------------------------메인 섹션06-------------------------------------------------- */
.main #section6 {/*background:url(/share/img/main/sec06_topbg.png) no-repeat 50% 0; padding-top:170px*/ padding-top:100px}
.main #section6 .msec06_bg {/*background:url(/share/img/main/sec06_bottombg.png) no-repeat 50% bottom; padding-bottom:170px*/ padding-bottom:120px}
.main #section6 .mcont {max-width:1270px;}

.main #section6 .main_snsBox .tabs {margin-bottom:20px;}
.main #section6 .main_snsBox .tabs li {display:inline-block; margin:0 1px;}

.main .snsUlBox, .main .snsUlBox2 {overflow:hidden}
.main .snsUlBox li, .main .snsUlBox2 li {position:relative; float:left; margin-right:5px; overflow:hidden}
.main .snsUlBox li {width:313px; height:313px;}
.main .snsUlBox2 li  {width:313px; height:240px;}

.main .snsUlBox li:nth-child(4n), .main .snsUlBox2 li:nth-child(4n) {margin-right:0}
.main .snsUlBox .img img, .main .snsUlBox2 .img img {width:100%; height:100%}

.main .snsUlBox2 li {border:1px solid #ddd}
.main .snsUlBox2 .txtBox {padding:15px; font-size:14px; color:#9e9e9e; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.main .snsUlBox .more, .main .snsUlBox2 .more {opacity:0; position:absolute; top:0; left:0; width:100%; height:100%; transition:all 0.2s}
.main .snsUlBox li:hover .more, .main .snsUlBox2 li:hover .more {opacity:1}

.main .snsUlBox .more i, .main .snsUlBox2 .more i {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); color:#fff; font-size:60px;}


.main .snsUlBox #youtubeList .more {background:rgba(212,39,45,0.8)}
.main .snsUlBox #instaList .more {background:url(/share/img/main/ins_bg.png) no-repeat 0 0; background-size:cover}
.main .snsUlBox #facebookList .more {background:rgba(56,87,156,0.8)}
.main .snsUlBox2 #blogList .more {background:rgba(50,179,74,0.8)}


@media screen and (max-width:1290px){
	.main #section6 .mcont {max-width:94%;}
	.main .snsUlBox li {width:24%; height:22.3vw; margin:0 1.3% 0 0}
	.main .snsUlBox2 li {width:24%; height:20vw;}
	.main .snsUlBox2 .txtBox {height:6.5vw; padding:10px;}
}

@media screen and (max-width:768px){
	.main #section6, .main #section6 .msec06_bg {background-size:150%}
	.main #section6 {padding-top:15vw;}
	.main #section6 .msec06_bg {padding-bottom:15vw;}

	.main #section6 .main_snsBox .tabs li {margin:0 5px;}
	.main #section6 .main_snsBox .tabs img {height:40px}

	.main .snsUlBox li {width:49%; height:45vw; margin:0 1.3% 1.3% 0}
	.main .snsUlBox2 li {width:49%; height:40vw; margin:0 1.3% 1.3% 0}

	.main .snsUlBox li:nth-child(4n), .main .snsUlBox2 li:nth-child(4n) {margin-right:1.3%}
	.main .snsUlBox li:nth-child(2n), .main .snsUlBox2 li:nth-child(2n) {margin-right:0}

	.main .snsUlBox2 .txtBox {font-size:13px; height:10.5vw;}

	.main .snsUlBox .more, .main .snsUlBox2 .more {display:none}
}

@media screen and (max-width:480px){
	.main #section6, .main #section6 .msec06_bg {background-size:200%}
	.main #section6 {padding-top:20vw;}
	.main #section6 .msec06_bg {padding-bottom:20vw;}

	.main .snsUlBox2 .txtBox {height:13vw;}
}