@charset "utf-8";
/* CSS Document */

/* ===========================
--- Intro - home video
============================ */

#intro.home-video {
	/*position: relative;*/
	text-align: center;
}

#intro.home-video .homevideo-container { /*height: 100%; width: 100%; position: absolute; z-index: 1; background-size: cover;*/ }

#intro.home-video .overlay {
	/*position: relative;
	height: 100%;
	z-index: 2;
	padding: 20% 0;*/

}


.movie_main_wrap05 { margin-top:-20px;}
.movie_main05 { width:100%; height:auto;}
.movie_main05 {
    /*position: relative;
    padding-bottom: 52.8%;
    padding-top:30px;
    height:0; 
    overflow:hidden; 
	 max-width: 100%;*/
}
.movie_main05 iframe, movie_main05 object , movie_main05 embed {
 /*position:absolute; 
top:0; 
left:0; 
width:100%; 
height:100%;*/
}


#intro .m_movie {position:relative; max-height:800px; overflow:hidden;}
#intro .m_movie:before {content:''; position:absolute; left:0; right:0; top:0; bottom:0; background-color:rgba(0, 0, 0, 0.7); z-index:98;}
#intro .m_movie video {width:100%; /*margin-top: -140px;*/}
#intro .m_movie .movie_txt {position:absolute; left:0; right:0; top:280px; z-index:99;}
#intro .m_movie .movie_txt .font_k { font-size:70px; line-height:50px;}
#intro .m_movie .movie_txt .bold {margin-bottom:20px; font-size:40px;}
#intro .m_movie .movie_txt p {color:#fff; font-size:18px; line-height:40px; font-family: 'Lato', sans-serif;}
#intro .m_movie .movie_txt .btn {margin:40px 10px 0 10px;}
#intro .m_movie .movie_txt .movie_day {display:none; vertical-align:middle; width:600px; margin-top:20px;}
#intro .m_movie .movie_txt .movie_day > div {display:inline-block; vertical-align:middle; float:left; width:25%;}
#intro .m_movie .movie_txt .movie_day p {width:100px; height:100px; margin:0 auto; background-color:rgba(255,138,0,0.8); border-radius:100px; line-height:100px; text-align:center; font-size:40px;}
#intro .m_movie .movie_txt .movie_day span {display:block; margin-top:10px; color:#fff;}
#intro .m_movie li {height:500px; background-repeat:no-repeat; background-position:center center;}

#intro .m_movie .movie_txt p.on_bg {font-size:30px;background:#ef588d;display:inline-block;padding-left:7px;padding-right:7px;padding-bottom:2px;margin-top:10px;line-height: normal;}

#intro .m_movie .movie_main_wrap03 {width:100%;}

#intro .btn-get-started, #intro .btn-get-service {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 28px;
  /*border-radius: 50px;*/
  transition: 0.5s;
  margin: 10px;
  border: 2px solid #fff;
  color: #fff;
}
#intro .btn-get-started { 
  background: #ff9800;
  border: 2px solid #ff9800;
  color: #fff;
  }
#intro .btn-get-started:hover {
  background: none;
  border-color: #fff;
  color: #fff;
}
#intro .btn-get-service {
	border: 2px solid #fff;
	}

#intro .btn-get-service:hover {
  background: #ff9800;
  border-color: #ff9800;
  color: #fff;
}


@media all and (min-width:415px) {

#intro .m_movie video { /*margin-top: -140px;*/}

}


@media all and (max-width:1360px) {
#intro {/*padding-top:10px;*/}

#intro .m_movie .movie_txt {top:50%;margin-top:-95px;}
#intro .m_movie li {height:500px;}

}


@media all and (max-width:1000px) {

#intro .m_movie .movie_txt {/*margin-top:-57px;*/}
#intro .m_movie .movie_txt .font_k {margin-bottom:5px; font-size:30px; line-height:30px;}
#intro .m_movie .movie_txt p {font-size:16px; line-height:40px;}
#intro .m_movie .movie_txt .btn {margin:10px 0 0 0;}
#intro .m_movie .movie_txt .movie_day p {width:50px; height:50px; line-height:50px; font-size:18px;}
#intro .m_movie li {height:300px;}

}


@media all and (max-width:767px) {
	
#intro .btn {width:100%;}
#intro .m_movie .movie_txt {margin-top:-54px;}
#intro .m_movie .movie_txt .font_k {font-size:20px; line-height:14px;}
#intro .m_movie .movie_txt .bold {margin-bottom:5px; font-size:20px;}
#intro .m_movie .movie_txt p {font-size:12px; line-height:19px;}
#intro .m_movie .movie_txt .movie_day {width:90%;}
#intro .btn-get-started, #intro .btn-get-service { font-size: 14px; padding: 6px 16px; margin:8px 8px 8px 8px; }

}



/* ===========================
--- Intro - video_wrap02 메인영상 해양포럼 새로운거(비율로)
============================ */

.video_wrap02 {}
.video_wrap_in02 {
	 /*position: relative;
    background-color: #202228;
	 height:800px;
	 height: 670px;*/
	 height: auto;
	 background: #000000;
	}
.movie_area02 {
	 /*overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;*/
	 display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 35.70%;
    overflow: hidden;
    background: #000000;
	}
.movie_area02:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /*background: rgba(0, 0, 0, 0.5);*/
    z-index: 1;
}
.movie_area02 video {
	 /*min-width: 100%;
    min-height: 102%;
    width: auto;
    height: auto;*/
	}
#main_video02 {}
.main_video02 {
	 position:absolute; 
    top:50%; 
    left:50%; 
    width:100%; 
    height:auto; 
    -webkit-transform:translate(-50%, -50%); 
    -ms-transform:translate(-50%, -50%); 
	 -moz-transform: translate(-50%, -50%);
    transform:translate(-50%, -50%);
	}



/* ===========================
--- Intro - video_wrap02 메인영상 탄소중립 아래 VOD 새로운거(비율로)
============================ */

.video_wrap03 {}
.video_wrap_in03 {
	 /*position: relative;
    background-color: #202228;
	 height:800px;
	 height: 670px;*/
	 height: auto;
	 background: #000000;
	}
.movie_area03 {
	 /*overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;*/
	 display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 35.70%;
	 padding-bottom: 56.25%;
	 /*padding-bottom: 75%;*/
	 padding-bottom: 40%;
	 padding-bottom: 25%;
    overflow: hidden;
    background: #000000;
	 /*background: #023560;*/
	 height:100%;
	}
.movie_area03:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /*background: rgba(0, 0, 0, 0.5);*/
    z-index: 1;
}
.movie_area03 video {
	 /*min-width: 100%;
    min-height: 102%;
    width: auto;
    height: auto;*/
	}
#main_video03 {}
.main_video03 {
	 position:absolute; 
    top:50%; 
    left:50%; 
    width:100%; 
    height:auto; 
    -webkit-transform:translate(-50%, -50%); 
    -ms-transform:translate(-50%, -50%); 
	 -moz-transform: translate(-50%, -50%);
    transform:translate(-50%, -50%);
	 z-index:101;
	}



/* ===========================
--- Intro - video_wrap 메인영상 행복 새로운거
============================ */

.video_wrap {}
.video_wrap_in {
	 position: relative;
    background-color: #202228;
	 height:800px;
	 height: 670px;
	}
.movie_area {
	 overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
	}
.movie_area:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /*background: rgba(0, 0, 0, 0.5);*/
    z-index: 1;
}
.movie_area video {
	 min-width: 100%;
    min-height: 102%;
    width: auto;
    height: auto;
	}
#main_video {}
.main_video {
	 position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	}
.movie_txt_wrap {
	 left: 0;
    width: 100%;
    color: #fff;
    text-align: left;
    z-index: 1;
	 position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
	}
	

.movie_txt_in {
	 /*position: relative;
    max-width: 1170px;
	 margin:auto;*/
	}

.movie_txt_wrap .font_k { font-size: 6.8rem; font-size: 4.5rem; font-weight:700; line-height: 1.1; }
.movie_txt_wrap .font_s { font-size: 3.5rem; font-size: 2.5rem; letter-spacing:2px;}
.movie_txt_wrap .bold {margin-bottom:20px; font-size:40px;}
.movie_txt_wrap p {color:#fff;/* font-size:18px; line-height:40px;*/ font-family: 'Lato', sans-serif; line-height: 1.1;}
.movie_txt_wrap .btn {margin:40px 10px 0 10px;}
.movie_txt_wrap .movie_day {display:none; vertical-align:middle; width:600px; margin-top:20px;}
.movie_txt_wrap .movie_day > div {display:inline-block; vertical-align:middle; float:left; width:25%;}
.movie_txt_wrap .movie_day p {width:100px; height:100px; margin:0 auto; background-color:rgba(255,138,0,0.8); border-radius:100px; line-height:100px; text-align:center; font-size:40px;}
.movie_txt_wrap .movie_day span {display:block; margin-top:10px; color:#fff;}
.video_wrap_in li {height:500px; background-repeat:no-repeat; background-position:center center;}

.movie_txt_in p.on_bg {font-size:30px;background:#ef588d;display:inline-block;padding-left:7px;padding-right:7px;padding-bottom:2px;margin-top:10px;line-height: normal;}

.video_wrap .btn-get-started, .video_wrap .btn-get-service {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 28px;
  /*border-radius: 50px;*/
  transition: 0.5s;
  margin: 10px;
  border: 2px solid #fff;
  color: #fff;
}
.video_wrap .btn-get-started { 
  background: #ff9800;
  border: 2px solid #ff9800;
  color: #fff;
  }
.video_wrap .btn-get-started:hover {
  background: none;
  border-color: #fff;
  color: #fff;
}
.video_wrap .btn-get-service {
	border: 2px solid #fff;
	}

.video_wrap .btn-get-service:hover {
  background: #ff9800;
  border-color: #ff9800;
  color: #fff;
}


@media all and (min-width:415px) {


}

@media all and (max-width:1360px) {

   .video_wrap_in {
		  height: 480px;
    }
}

 @media screen and (max-width:1024px) {
	.video_wrap_in {
        /*margin-bottom: 3rem;*/
        height: 550px;
		  height: 360px;
    }
   .movie_txt_wrap .font_k { letter-spacing:0;}
	.movie_txt_wrap { top: 55%; }
	
}

@media all and (max-width:1000px) {

.movie_txt_wrap {/*margin-top:-57px;*/}
.movie_txt_wrap .font_k { }
.movie_txt_wrapt p {}
.movie_txt_wrap .btn {margin:10px 0 0 0;}
.movie_txt_wrap .movie_day p {width:50px; height:50px; line-height:50px; font-size:18px;}
.video_wrap_in li {height:300px;}

}

 @media screen and (max-width:991px) {
	.video_wrap_in {
        /*margin-bottom: 3rem;*/
        height: 430px;
		  height: 280px;
    }
	.movie_txt_wrap .font_k { font-size: 5.8rem; }
	.movie_txt_wrap .font_s { font-size: 3.0rem; }
	.movie_txt_wrap { top: 65%; }

}

@media all and (max-width:767px) {
	
 .video_wrap_in {
        /*margin-bottom: 3rem;*/
        /*height: 35rem !important;*/
		  height: 290px;
    }
  .movie_area video {
        min-width: auto;
        min-height: auto;
        height: 100%;
    }	
	.movie_txt_wrap { top: 65%; }
	
.video_wrap .btn {width:100%;}

.movie_txt_wrap .font_k { font-size: 3.8rem; line-height:1;}
.movie_txt_wrap .font_s { font-size: 2.6rem; line-height:1; }
.movie_txt_in p.on_bg { font-size: 2.8rem;}
.movie_txt_wrap .bold {}
.movie_txt_wrap p {}
.movie_txt_wrap .movie_day {width:90%;}
.video_wrap .btn-get-started, .video_wrap .btn-get-service { font-size: 14px; padding: 6px 16px; margin:8px 8px 8px 8px; }

.movie_area02 {
    padding-bottom: 54.70%;
	}
.movie_area03 {
    /*padding-bottom: 54.70%;*/
	}	
	

}

@media all and (max-width:576px) {
	.video_wrap_in {
		  height: 140px;
    }
}