@charset "utf-8";

@media only screen and (max-width:999px){
	.body-slide-wr {margin-left:0 !important;}
}

.msec01-wrap {width:100%;background:#333;}
.msec02-wrap {width:100%;background:#D7E6F8 url(/resources/_Templet/Main/main_kor/images/sec2-bg.gif) no-repeat center 0;}
.msec03-wrap {width:100%;padding:60px 0;}
.msec04-wrap {width:100%;background:#F5F5F5;padding:60px 0;}

.ms-tit {font-size:28px;color:#000;text-align:center;line-height:120%;}
.ms-txt {font-size:15px;color:#444;text-align:center;padding-top:20px;}

@media only screen and (max-width:640px){
	.msec03-wrap {padding:30px 0;}
	.msec04-wrap {padding:30px 0;}
	
	.ms-tit {font-size:24px;}
}

/* 메인 비주얼 */
.mvisual-wrap {position:relative;overflow:hidden;height:760px;width:100%;max-width:2000px;margin:0 auto;}
.msec01-wrap .mvisual-wr {position:absolute; left:50%;margin-left:-1000px; width:2000px;text-align:center;top:0;}
.msec01-wrap .owl-theme .owl-nav [class*=owl-]{position:absolute;top:50%;margin-top:-34px;color:#000;font-size:0;overflow:hidden;text-indent:-9999em;line-height:0;width:68px;height:68px;background:rgba(0,0,0,0.8) url(/resources/_Templet/Main/main_kor/images/mvis-arr.png) no-repeat 0 0;display:none;cursor:pointer;}
.msec01-wrap .owl-theme .owl-nav [class*=owl-]:hover{background-color:rgba(10,81,161,0.8);}
.msec01-wrap .owl-theme .owl-nav .disabled{opacity:.5;cursor:default}
.msec01-wrap .owl-theme .owl-nav .owl-next {background-position:0 100%;position:absolute;right:15%;}
.msec01-wrap .owl-theme .owl-nav .owl-prev {left:15%;}

.msec01-wrap .owl-theme .owl-dots {text-align:center;-webkit-tap-highlight-color:transparent;position:absolute;bottom:20px;left:50%;margin-left:-118px;}
.msec01-wrap .owl-theme .owl-dots {background:rgba(0,0,0,0.7);height:38px;border-radius:19px;padding:0 20px 0 80px;}
.msec01-wrap .owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}
.msec01-wrap .owl-theme .owl-dots .owl-dot span{width:20px;height:20px;margin:8px 7px 0 7px;background:url(/resources/_Templet/Main/main_kor/images/mvis-ctl.png) no-repeat 0 0;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;}
.msec01-wrap .owl-theme .owl-dots .owl-dot.active span,.msec01-wrap .owl-theme .owl-dots .owl-dot:hover span{background-position:-20px 0;}

.msec01-wrap .btn-w {position:absolute;bottom:23px;left:50%;z-index:9999;margin-left:-105px;}
.msec01-wrap .btn-w button {border:0;padding:0;background:url(/resources/_Templet/Main/main_kor/images/mvis-ctl.png) no-repeat 0 0;width:20px;height:20px;margin:0 5px;}
.msec01-wrap .btn-w .play {background-position:-60px 0;}
.msec01-wrap .btn-w .stop {background-position:-40px 0;}

.mvisual-wrap .mv-slogan {position:absolute;top:25%;left:50%;z-index:9999;margin:0 0 0 -360px;text-align:center;color:#fff;font-weight:bold;font-family: "Proxima Nova";}
.msec01-wrap .owl-theme .owl-item .txt1 {font-size:56px;display:block;line-height:1;opacity:0;transform:translateY(20%); -webkit-transform:translateY(20%); -moz-transform:translateY(20%); -ms-transform:translateY(20%);transition:all 0.5s; -webkit-transition:all 0.5s; -moz-transition:all 0.5s;text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ;-webkit-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ;-moz-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ; }
.msec01-wrap .owl-theme .owl-item.active .txt1{opacity:1;transition-delay: 0.6s; transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); }
.msec01-wrap .owl-theme .owl-item .txt2 {font-size:24px;display:block;padding-top:30px;opacity:0;transform:translateY(20%); -webkit-transform:translateY(20%); -moz-transform:translateY(20%); -ms-transform:translateY(20%);transition:all 0.5s; -webkit-transition:all 0.5s; -moz-transition:all 0.5s;text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ;-webkit-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ;-moz-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ; }
.msec01-wrap .owl-theme .owl-item.active .txt2{opacity:1;transition-delay: 0.6s; transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); }
.msec01-wrap .owl-theme .owl-item .slogan-logo {display:block;width:100%;height:104px;padding-bottom:20px;background:url(/resources/_Templet/Main/main_kor/images/m_vis_logo.png) no-repeat center 0;opacity:0;transform:translateY(20%); -webkit-transform:translateY(20%); -moz-transform:translateY(20%); -ms-transform:translateY(20%);transition:all 0.5s; -webkit-transition:all 0.5s; -moz-transition:all 0.5s;-webkit-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ;-moz-text-shadow: 0 0 9px rgba(0, 0, 0, 0.5) ; }
.msec01-wrap .owl-theme .owl-item.active .slogan-logo {opacity:1;transition-delay: 0.6s; transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); }

.msec01-wrap .owl-theme .item-video {overflow:hidden;max-height:760px;width:100%;height:760px;}
.msec01-wrap .owl-theme .item-video .youtubeWrap {overflow:hidden;width:100%;padding-bottom: 56.25%;position:relative;}
.msec01-wrap .owl-theme .item-video iframe {position: absolute;width:100%;height:100%;top:-180px;left:0;}

.msec01-wrap #mv-pc {display:block;}
.msec01-wrap #mv-m {display:none;}


@media only screen and (max-width:1400px){
	.msec01-wrap .owl-theme .owl-nav .owl-next {right:20%;}
	.msec01-wrap .owl-theme .owl-nav .owl-prev {left:20%;}

	.msec01-wrap .owl-theme .item-video {overflow:hidden;max-height:760px;width:100%;height:auto;}
}

@media only screen and (max-width:1280px){
	.msec01-wrap .owl-theme .owl-nav .owl-next {right:0;}
	.msec01-wrap .owl-theme .owl-nav .owl-prev {left:0;}

	.mvisual-wrap .mv-slogan {top:10%;}
	.mvisual-wrap .mv-slogan {margin:0 0 0 -193px;}
	.msec01-wrap .owl-theme .owl-item .txt1 {font-size:30px;}
	.msec01-wrap .owl-theme .owl-item .txt2 {font-size:18px;}
}

@media only screen and (max-width:1280px){
	.mvisual-wrap {height:auto;width:100%;}
	.msec01-wrap .mvisual-wr {position:relative; left:auto;margin-left:0; width:auto;height:auto}

	.msec01-wrap .owl-theme .item-video iframe {top:auto;bottom:0;width:2000px;margin-left:-450px;}
	.msec01-wrap .owl-theme .item-video video {top:auto;bottom:0;}
}

@media only screen and (max-width:999px){
	.mvisual-wrap .mv-slogan {margin:0 0 0 -161px;}
	.msec01-wrap .owl-theme .owl-item .txt1 {font-size:23px;}
	.msec01-wrap .owl-theme .owl-item .txt2 {font-size:16px;}
	.msec01-wrap .owl-theme .owl-item .slogan-logo {display:none;}
	.mvisual-wrap .mv-slogan {top:30%;}
	.msec01-wrap .owl-theme .item-video iframe {width:100%;margin-left:0;}

	.msec01-wrap .owl-theme .item-video .youtubeWrap {overflow:hidden;width:100%;padding-bottom:38.75%;position:relative;}


}

@media only screen and (max-width:680px){
	.mvisual-wrap .mv-slogan {top:35%;}
	.msec01-wrap .item {height:250px;width:658px;}
	.msec01-wrap .owl-theme .owl-nav {display:none;}

	.msec01-wrap .owl-theme .owl-item .txt2 {padding-top:10px;}

	.msec01-wrap .owl-theme .owl-dots {position:relative;bottom:0;left:0;margin-left:0;background:none;height:38px;border-radius:0;padding:0 20px 0 80px;}
	.msec01-wrap .btn-w {position:absolute;bottom:5px;left:50%;z-index:9999;margin-left:-105px;}
}

@media only screen and (max-width:480px){
	.msec01-wrap #mv-pc {display:none;}
	.msec01-wrap #mv-m {display:block;}
}


/* 본선작업현황 */
.msec02-wrap {overflow:hidden}
.msec02-wrap .bg-pat1 {position:absolute;bottom:0;left:50%;width:2000px;height:100%;overflow:hidden;margin-left:-1000px;}
.msec02-wrap .bg-pat1 .line1 {position:absolute;bottom:0;left:78px;width:32px;height:79px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 0;animation-name:msec02-line11;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat1 .line2 {position:absolute;bottom:0;left:140px;width:32px;height:175px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 0;animation-name:msec02-line12;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat1 .line3 {position:absolute;bottom:0;left:202px;width:32px;height:47px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 0;animation-name:msec02-line13;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat1 .line4 {position:absolute;bottom:0;left:264px;width:32px;height:111px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 0;animation-name:msec02-line14;animation-duration:4s;animation-iteration-count:infinite;}

@keyframes msec02-line11 {
    0%   {height:79px;}
    50%  {height:100px;}
    100% {height:79px;}
}
@keyframes msec02-line12 {
    0%   {height:175px;}
    50%  {height:120px;}
    100% {height:175px;}
}@keyframes msec02-line13 {
    0%   {height:47px;}
    50%  {height:20px;}
    100% {height:47px;}
}@keyframes msec02-line14 {
    0%   {height:111px;}
    50%  {height:150px;}
    100% {height:111px;}
}

.msec02-wrap .bg-pat2 {position:absolute;bottom:0;left:50%;width:2000px;height:100%;overflow:hidden;margin-left:-1000px;}
.msec02-wrap .bg-pat2 .line1 {position:absolute;top:0;right:239px;width:32px;height:79px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 100%;opacity:0.7;animation-name:msec02-line21;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat2 .line2 {position:absolute;top:0;right:186px;width:32px;height:175px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 100%;animation-name:msec02-line22;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat2 .line3 {position:absolute;top:0;right:115px;width:32px;height:47px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 100%;animation-name:msec02-line23;animation-duration:4s;animation-iteration-count:infinite;}
.msec02-wrap .bg-pat2 .line4 {position:absolute;top:0;right:53px;width:32px;height:111px;background:url(/resources/_Templet/Main/main_kor/images/sec2-bg-pat.png) no-repeat 0 100%;animation-name:msec02-line24;animation-duration:4s;animation-iteration-count:infinite;}

@keyframes msec02-line21 {
    0%   {height:79px;}
    50%  {height:100px;}
    100% {height:79px;}
}
@keyframes msec02-line22 {
    0%   {height:175px;}
    50%  {height:120px;}
    100% {height:175px;}
}@keyframes msec02-line23 {
    0%   {height:47px;}
    50%  {height:20px;}
    100% {height:47px;}
}@keyframes msec02-line24 {
    0%   {height:111px;}
    50%  {height:150px;}
    100% {height:111px;}
}
@media all and (max-width:1399px) {
	.msec02-wrap .bg-pat1,
	.msec02-wrap .bg-pat2 {display:none}
}
.msec02-01 {width:870px;position:relative;padding:60px 0;}
.msec02-01 .owl-carousel {margin-top:45px;}
.msec02-01 .item {text-align:center;}
.msec02-01 .ship-w {width:150px;font-family: "Proxima Nova";text-align:center;margin:0 auto;position:relative;min-height:253px;}
.msec02-01 .ship-w .ship-p {width:100%;height:107px;background:url(/resources/_Templet/Main/main_kor/images/sec2-ship.png) no-repeat center bottom;position:relative;}
.msec02-01 .ship-w .ship-p .stit {display:block;text-align:center;font-style:normal;padding-top:75px;font-size:28px;color:#062676;font-weight:bold;}
.msec02-01 .ship-w .ship-p .stit .per {font-size:18px;}
.msec02-01 .ship-w .ship-p .sper {position:absolute;top:0;left:50%;margin-left:-40px;width:80px;height:57px;display:block;}
.msec02-01 .ship-w .txt1 {display:block;text-align:center;font-style:normal;padding-top:30px;font-size:12px;color:#2b3651;font-weight:bold;}
.msec02-01 .ship-w .txt2 {display:block;text-align:center;font-style:normal;padding-top:0;font-size:14px;color:#000;font-weight:bold;}
.msec02-01 .ship-w .tit {display:inline-block;font-style:normal;padding-top:0;font-size:17px;color:#fff;font-weight:bold;background:#2C5FAB;padding:5px 10px;margin-top:15px;letter-spacing:-1px;}

.msec02-01 .ship-w .t-wrap {position:absolute;bottom:0;left:0;width:100%;}

.msec02-01 .ship2 .tit {background:#4883DB;}
.msec02-01 .ship3 .tit {background:#429DDF;}
.msec02-01 .ship4 .tit {background:#4AA89D;}
.msec02-01 .ship5 .tit {background:#4A5E5D;}

.msec02-01 .ship-w .ship-p #sp-10 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar10.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-20 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar20.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-30 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar30.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-40 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar40.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-50 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar50.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-60 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar60.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-70 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar70.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-80 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar80.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-90 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar90.png) no-repeat center bottom;}
.msec02-01 .ship-w .ship-p #sp-100 {background:url(/resources/_Templet/Main/main_kor/images/sec2-ship-bar100.png) no-repeat center bottom;}

.msec02-01 .owl-prev {position:absolute;top:50%;left:0;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-l.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}
.msec02-01 .owl-next {position:absolute;top:50%;right:0;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-r.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}

.msec02-01 .btn-w {text-align:center;padding-top:20px;}
.msec02-01 .button {cursor:pointer;text-align:center;display:inline-block;padding:3px 10px;border:1px solid #bdd5ee;font-size:12px; background:#fff;}
.msec02-01 .button:hover {border:1px solid #178DE6;background:#178DE6;color:#fff;transition:opacity .2s ease;}

.msec02-01 .ship-w .ship-p .sper-w {position:absolute;top:0;left:50%;margin-left:-40px;width:80px;height:57px;display:block;overflow:hidden;}
.msec02-01 .ship-w .ship-p .sper-w .cbox {position:absolute;width:20px;height:19px;display:block;-webkit-animation-duration:1s;animation-duration: 1s;-webkit-animation-name:cbox1;animation-name:cbox1;}

/*
.msec02-01 .ship-w .ship-p .sper-w .cbox1 {bottom:0;left:0;-webkit-animation-name:cbox1;animation-name:cbox1;background:url(/resources/_Templet/Main/main_kor/images/sec2-box01.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox2 {bottom:0;left:20px;-webkit-animation-name:cbox2;animation-name:cbox2;background:url(/resources/_Templet/Main/main_kor/images/sec2-box02.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox3 {bottom:0;left:40px;-webkit-animation-name:cbox3;animation-name:cbox3;background:url(/resources/_Templet/Main/main_kor/images/sec2-box03.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox4 {bottom:0;left:60px;-webkit-animation-name:cbox4;animation-name:cbox4;background:url(/resources/_Templet/Main/main_kor/images/sec2-box04.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox5 {bottom:19px;left:0;-webkit-animation-name:cbox5;animation-name:cbox5;background:url(/resources/_Templet/Main/main_kor/images/sec2-box05.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox6 {bottom:19px;left:20px;-webkit-animation-name:cbox6;animation-name:cbox6;background:url(/resources/_Templet/Main/main_kor/images/sec2-box06.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox7 {bottom:19px;left:40px;-webkit-animation-name:cbox7;animation-name:cbox7;background:url(/resources/_Templet/Main/main_kor/images/sec2-box07.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox8 {bottom:19px;left:60px;-webkit-animation-name:cbox8;animation-name:cbox8;background:url(/resources/_Templet/Main/main_kor/images/sec2-box08.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox9 {bottom:38px;left:20px;-webkit-animation-name:cbox9;animation-name:cbox9;background:url(/resources/_Templet/Main/main_kor/images/sec2-box09.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox10 {bottom:38px;left:40px;-webkit-animation-name:cbox10;animation-name:cbox10;background:url(/resources/_Templet/Main/main_kor/images/sec2-box10.png) no-repeat 0 0;}
*/

.msec02-01 .ship-w .ship-p .sper-w .cbox1 {bottom:0;left:0;background:url(/resources/_Templet/Main/main_kor/images/sec2-box01.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox2 {bottom:0;left:20px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box02.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox3 {bottom:0;left:40px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box03.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox4 {bottom:0;left:60px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box04.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox5 {bottom:19px;left:0;background:url(/resources/_Templet/Main/main_kor/images/sec2-box05.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox6 {bottom:19px;left:20px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box06.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox7 {bottom:19px;left:40px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box07.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox8 {bottom:19px;left:60px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box08.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox9 {bottom:38px;left:20px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box09.png) no-repeat 0 0;}
.msec02-01 .ship-w .ship-p .sper-w .cbox10 {bottom:38px;left:40px;background:url(/resources/_Templet/Main/main_kor/images/sec2-box10.png) no-repeat 0 0;}

.msec02-01 .ship-w .ship-p .sper-w.ani .cbox1 {-webkit-animation-name:cbox1;animation-name:cbox1;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox2 {-webkit-animation-name:cbox2;animation-name:cbox2;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox3 {-webkit-animation-name:cbox3;animation-name:cbox3;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox4 {-webkit-animation-name:cbox4;animation-name:cbox4;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox5 {-webkit-animation-name:cbox5;animation-name:cbox5;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox6 {-webkit-animation-name:cbox6;animation-name:cbox6;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox7 {-webkit-animation-name:cbox7;animation-name:cbox7;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox8 {-webkit-animation-name:cbox8;animation-name:cbox8;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox9 {-webkit-animation-name:cbox9;animation-name:cbox9;}
.msec02-01 .ship-w .ship-p .sper-w.ani .cbox10 {-webkit-animation-name:cbox10;animation-name:cbox10;}

@media only screen and (max-width:480px){
	.msec02-01 .owl-carousel {margin-top:25px;}
	.msec02-01 .ship-w {min-height:223px;}
}


@keyframes cbox1 {
    0%   {bottom:60px;}
    100% {bottom:0px;}
}
@keyframes cbox2 {
    0%   {bottom:60px;}
    30%  {bottom:60px;}
    100% {bottom:0px;}
}
@keyframes cbox3 {
    0%   {bottom:60px;}
    20%  {bottom:60px;}
    100% {bottom:0px;}
}
@keyframes cbox4 {
    0%   {bottom:60px;}
    10%  {bottom:60px;}
    100% {bottom:0px;}
}
@keyframes cbox5 {
    0%   {bottom:60px;}
    40%  {bottom:60px;}
    100% {bottom:19px;}
}
@keyframes cbox6 {
    0%   {bottom:60px;}
    60%  {bottom:60px;}
    100% {bottom:19px;}
}
@keyframes cbox7 {
    0%   {bottom:60px;}
    70%  {bottom:60px;}
    100% {bottom:19px;}
}
@keyframes cbox8 {
    0%   {bottom:60px;}
    50%  {bottom:60px;}
    100% {bottom:19px;}
}
@keyframes cbox9 {
    0%   {bottom:60px;}
    90%  {bottom:60px;}
    100% {bottom:38px;}
}
@keyframes cbox10 {
    0%   {bottom:60px;}
    60%  {bottom:60px;}
    100% {bottom:38px;}
}


/*반출입정보*/
.msec02-02 {position:absolute;bottom:0;right:0;width:290px;background:#fff;text-align:center;}
.msec02-02-w {padding:50px 10px 30px 10px;}
.msec02-02 .tit {position:relative;font-size:28px;color:#000;text-align:center;padding-bottom:40px;}
.msec02-02 .tit:after {position:absolute;bottom:0;left:50%;margin-left:-10px;width:20px;height:3px;background:#c8c8c8;display:block;content:'';}

.msec02-02 .graph-chart {display:inline-block;width:100%;margin-top:40px;position:relative;width:167px;height:168px;line-height:168px;text-align:center;background:url(/resources/_Templet/Main/main_kor/images/sec2-im2-bg1.png) no-repeat center 0;}
.msec02-02 .graph-chart .chart-tit {font-size:24px;color:#3d9001;}

.msec02-02 #st11.graph-chart {background:url(/resources/_Templet/Main/main_kor/images/sec2-im2-bg1.png) no-repeat center 0;}
.msec02-02 #st11.graph-chart .chart-tit {color:#3d9001;}
.msec02-02 #st12.graph-chart {background:url(/resources/_Templet/Main/main_kor/images/sec2-im2-bg2.png) no-repeat center 0;}
.msec02-02 #st12.graph-chart .chart-tit {color:#F8BF15;}
.msec02-02 #st13.graph-chart {background:url(/resources/_Templet/Main/main_kor/images/sec2-im2-bg3.png) no-repeat center 0;}
.msec02-02 #st13.graph-chart .chart-tit {color:#CF3317;}

.msec02-02 .chart-list {overflow:hidden;padding-top:15px;}
.msec02-02 .chart-list li {float:left;width:33.33%;text-align:center;position:relative;padding-top:40px;}
.msec02-02 .chart-list .step {display:inline-block;font-size:15px;color:#000;font-weight:400;}
.msec02-02 .chart-list .cir-w {display:block;text-align:center;width:30px;height:30px;border-radius:50%;border:1px solid #fff;background:#fff;position:absolute;top:0;left:50%;margin-left:-16px;z-index:1;}
.msec02-02 .chart-list .cir {display:block;text-align:center;width:18px;height:18px;border-radius:50%;background:#3d9001;position:absolute;top:6px;left:50%;margin-left:-9px;z-index:2;}

.msec02-02 .chart-list #st21.over .cir-w {border:1px solid #3d9001;}
.msec02-02 .chart-list #st22.over .cir-w {border:1px solid #F8BF15;}
.msec02-02 .chart-list #st22 .cir {background:#F8BF15;}
.msec02-02 .chart-list #st23.over .cir-w {border:1px solid #CF3317;}
.msec02-02 .chart-list #st23 .cir {background:#CF3317;}

@media only screen and (max-width:1280px){
	.msec02-01 {width:670px;}
	.msec02-01 .ship-w {width:auto;}
}

@media only screen and (min-width:1000px){
	.msec02-01 .owl-prev {top:100%;margin-top:20px;}
	.msec02-01 .owl-next {top:100%;margin-top:20px;}
}

@media only screen and (max-width:999px){
	.msec02-01 {width:100%;padding-right:330px;box-sizing:border-box;}
	.msec02-01 .owl-carousel {padding:0 60px;box-sizing:border-box;}
}

@media only screen and (max-width:840px){
	.msec02-01 {width:100%;padding-right:0;}

	.msec02-02 {position:relative;width:100%;border-bottom:1px solid #D7E6F8;}
	.msec02-02 .stit .bl {display:inline-block;}
}

@media only screen and (max-width:640px){
	.msec02-01 {padding:30px 0;}
	.msec02-02 .tit {font-size:24px;}
}

@media only screen and (max-width:480px){
	.msec02-02-w {position:relative;height:235px;}
	.msec02-02 .tit {padding-bottom:0;}
	.msec02-02 .tit:after {display:none;}
	.msec02-02 .graph-chart {position:absolute;top:65px;left:20px;}
	.msec02-02 .chart-list {padding-left:200px;padding-top:55px;}
	.msec02-02 .chart-list li {width:100%;padding-top:0;min-height:32px;text-align:left;padding-bottom:15px;}
	.msec02-02 .chart-list .cir-w {left:0;margin-left:0;}
	.msec02-02 .chart-list .step {padding-left:40px;}
}


/* 부산신항만소개 사진 배너 */
.msec03-01 {overflow:hidden;border-bottom:1px solid #ccc;}
.msec03-01 .msec03-01-list {overflow:hidden;padding-top:30px;}
.msec03-01 li {float:left;width:373px;padding-left:40px;}
.msec03-01 li:first-child {padding-left:0;}
.msec03-01 a {display:block;position:relative;padding-bottom:165px;transition:padding-bottom .35s;-webkit-transition:padding-bottom .35s;-moz-transition:padding-bottom .35s;}
.msec03-01 .img img {width:100%;}
.msec03-01 .txt-wrap {position:absolute;bottom:40px;left:0;width:100%;background:#fff;padding-top:30px;text-align:center;display:block;transition:padding-bottom .35s;-webkit-transition:padding-bottom .35s;-moz-transition:padding-bottom .35s;}
.msec03-01 .tit {font-size:24px;font-weight:bold;font-style:normal;color:#000;display:block;padding:0 5%;}
.msec03-01 .txt {display:block;padding:20px 5% 0 5%;font-size:14px;}
.msec03-01 .more {position:absolute;bottom:0;left:50%;margin-left:-25px;display:inline-block;background:url(/resources/_Templet/Main/main_kor/images/d-more.png) no-repeat center 0;width:50px;height:50px;opacity:0;transform:translateY(40%);-webkit-transform:translateY(40%);-moz-transform:translateY(40%);transition:all .5s .3s;-webkit-transition:all .5s .3s;-moz-transition:all .5s .3s;}

.msec03-01 .msec03-01-list .bl {display:block;}

.msec03-01 a:hover .txt-wrap {padding-bottom:70px;}
.msec03-01 a:hover .tit {color:#1A5DAA;text-decoration:underline;}
.msec03-01 a:hover .more {opacity:1;transform:translateY(0);-webkit-transform:translateY(0);-moz-transform:translateY(0);}

@media only screen and (max-width:1280px){
	.msec03-01 li {float:left;width:32%;padding-left:2%;}
	.msec03-01 a {padding-bottom:30px;}
	.msec03-01 .txt-wrap {position:relative;bottom:0;left:0;}

	.msec03-01 .msec03-01-list .bl {display:inline;}

	.msec03-01 a:hover .txt-wrap {padding-bottom:0;}
	.msec03-01 a:hover .more {opacity:0;}
}

@media only screen and (max-width:640px){
.msec03-01 .txt-wrap {padding-top:10px;}
.msec03-01 .tit {font-size:15px;padding:0;}
.msec03-01 .txt {display:none;}
}

/* 부산신항만소개 아이콘 배너 */
.msec03-02 {overflow:hidden;padding-top:45px;}
.msec03-02 li {float:left;width:20%;}
.msec03-02 .item img {width:114px !important;height:114px;}
.msec03-02 .item a {display:block;text-align:center;padding-top:14px;height:200px;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;background:no-repeat center 0;}
.msec03-02 .item .img {display:block;width:114px;height:114px;margin:0 auto;text-align:center;position:relative;background:#F5F5F5;border-radius:50%;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;}
.msec03-02 .item .tit {display:block;font-size:15px;font-weight:bold;color:#333;margin-top:17px;padding-top:5px;background:no-repeat center 0;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;}

.msec03-02 .item a:hover {background:url(/resources/_Templet/Main/main_kor/images/sec3-ban-o1.png) no-repeat center 0;}
.msec03-02 .item a:hover .img {background:#2F6FCB;}
.msec03-02 .item a:hover .tit {padding-top:15px;background:url(/resources/_Templet/Main/main_kor/images/sec3-ban-o2.png) no-repeat center 5px;color:#0E519F;}

.msec03-02 .owl-prev {position:absolute;top:60px;left:0;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-l.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}
.msec03-02 .owl-next {position:absolute;top:60px;right:0;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-r.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}

.msec03-02 .btn-w {text-align:center;}
.msec03-02 .button {cursor:pointer;text-align:center;display:inline-block;padding:3px 10px;border:1px solid #ccc;font-size:12px; background:#fff;}
.msec03-02 .button:hover {border:1px solid #178DE6;background:#178DE6;color:#fff;transition:opacity .2s ease;}

@media only screen and (min-width:1000px){
	.msec03-02 .btn-w {display:none;}
	.msec03-02 .owl-prev {display:none;}
	.msec03-02 .owl-next  {display:none;}
}


/* 사회공헌 */
.msec04-01 {float:left;width:680px;padding-right:80px;}
.msec04-01 .owl-carousel {padding:35px 50px 0 50px;box-sizing:border-box;}
.msec04-01 .item .img {display:block;position:relative;overflow:hidden;}
.msec04-01 .item .img .btn {display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(10,81,161,0.9) url(/resources/_Templet/Main/main_kor/images/df-more.png) no-repeat center center;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;opacity:0;z-index:99;}
.msec04-01 .item img {width:320px;height:245px;}
.msec04-01 .tit {display:block;text-align:center;width:100%;font-size:16px;color:#333;font-weight:bold;padding-top:15px;overflow:hidden;height:20px;white-space:nowrap;text-overflow:ellipsis;word-wrap:normal;line-height:110%;}
.msec04-01 .date {display:block;text-align:center;width:100%;color:#555;padding-top:10px;}

.msec04-01 .item a:hover .img .btn {opacity:1;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;}
.msec04-01 .item a:hover .tit {color:#0E519F;text-decoration:underline;}

.msec04-01 .owl-prev {position:absolute;top:50%;left:0;margin-top:-40px;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-l.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}
.msec04-01 .owl-next {position:absolute;top:50%;right:0;margin-top:-40px;background:#484846 url(/resources/_Templet/Main/main_kor/images/m-arr-r.png) no-repeat center center;width:40px;height:40px;font-size:0;color:#484846;overflow:hidden;cursor:pointer;}


/* 새소식 */
.msec04-02 {float:left;width:430px;}
.msec04-02 .notice-list {margin-top:35px;border-top:1px solid #ccc;}
.msec04-02 .notice-list li {border-bottom:1px solid #ccc;box-sizing:border-box;}
.msec04-02 .notice-list li a {display:block;padding:22px 20px 18px 90px;position:relative;overflow:hidden;height:20px;white-space:nowrap;text-overflow:ellipsis;word-wrap:normal;line-height:110%;}
.msec04-02 .notice-list a:after {width:1px;position:absolute;top:0;left:72px;background:#ccc;height:100%;content:'';display:block;}
.msec04-02 .notice-list .num {width:72px;position:absolute;top:22px;left:0;text-align:center;z-index:2;transition:all 0.5s ease-out;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;}
.msec04-02 .notice-list .txt {position:relative;z-index:2;display:block;transition:all 0.6s ease-out;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-wrap:normal;}
.msec04-02 .notice-list .bg {display:block;position:absolute;top:0;left:0;height:100%;width:0;background:#0E519F;transition:all 0.5s ease-out;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;}

.msec04-02 .notice-list a:hover .bg {width:100%;}
.msec04-02 .notice-list a:hover .num {color:#fff;}
.msec04-02 .notice-list a:hover .txt {color:#fff;}



/*
.msec04-02 .notice-list li:first-child {border:1px solid #ccc;padding:0;}
.msec04-02 .notice-list li:first-child a {background:#fff;padding-top:20px;padding-bottom:17px;}
.msec04-02 .notice-list li:first-child a:after {display:none;}
.msec04-02 .notice-list li:first-child .num {top:20px;}
/*.msec04-02 .notice-list li:first-child .num {position:absolute;top:20px;left:0;background:url(/resources/_Templet/Main/main_kor/images/icon-notice.png) no-repeat 33px center;padding-left:72px;color:#0E519F;overflow:hidden;}*/


.msec04-w .btn-w {text-align:center;padding-top:50px;}
.msec04-w .msec04-02 .btn-w {padding-top:42px;}

.msec04-w .btn-more {border:1px solid #ccc;display:inline-block;padding:10px 30px;position:relative;}
.msec04-w .btn-more * {vertical-align:middle;}
.msec04-w .btn-more .line-w {display:inline-block;margin-left:10px;position:relative;}
.msec04-w .btn-more .line-w .line1,.msec04-w .btn-more .line-w .line2 {position:absolute;z-index:10;left:0;top:0;width:9px;height:1px;background-color:#464644;transition:transform .7s;-webkit-transition:-webkit-transform .7s;-moz-transition:-moz-transform .7s;}
.msec04-w .btn-more .line-w .line1 {transform:rotate(90deg);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);}
.msec04-w .btn-more .line-w .line2 {transform:rotate(0deg);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);}

.msec04-w .btn-more:hover {border:1px solid #0E519F;color:#0E519F;}
.msec04-w .btn-more:hover .line1 {transform:rotate(-90deg);-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);background-color:#0E519F;}
.msec04-w .btn-more:hover .line2 {transform:rotate(-180deg); -webkit-transform:rotate(-180deg); -moz-transform:rotate(-180deg);background-color:#0E519F;}


@media only screen and (max-width:1280px){
	.msec04-01 {width:55%;padding-right:5%;}
	.msec04-02 {width:40%;}
}

@media only screen and (max-width:640px){
	.msec04-01 {width:100%;padding-right:0%;padding-bottom:30px;}
	.msec04-02 {width:100%;padding-top:30px;border-top:1px solid #ccc;}

	.msec04-w .btn-w {text-align:center;padding-top:20px;}
	.msec04-w .msec04-02 .btn-w {padding-top:20px;}
}