@charset "utf-8";

 @import url(common.css);
 
#container {position:relative; height: 100%;background:url('/images/web/en//main/bg.jpg') no-repeat center 140px; background-size:cover; *background-size:auto 100%; padding:140px 0 60px;}
#container:after { display: block; content: ""; clear: both; }

.main_content {position:relative;z-index:7;width:1200px; margin:0 auto;font-family:'NotoM'; }
.main_content:after {content:""; display:block; clear:both;}

/* slogan */
.slogan {position:relative; width:100%;  overflow:hidden;}
.slogan .img{width:621px; margin:0 auto; padding:80px 0 90px;}
.slogan .img img{width:100%;}


/* Greetings */
.Greetings {position:relative;width:250px;height:235px;padding:25px 25px 0;background: #d8213a url('/images/web/en//main/Greetings_bg.png') no-repeat center 0;background-size:cover;float:left;overflow:hidden;}
.Greetings h2 {font-size:24px;color:#fff;line-height:30px;font-family:'notoM';font-weight:  bold;}
.Greetings p {font-size:13px;color: #fcf2f3;font-family:'notoR'; margin-top:20px;line-height: 1.4;}
.Greetings .btn_more { position:absolute; width:88px; height:27px; left:25px; bottom:33px; text-indent: -9999em; line-height: 0; font-size: 0; background: url(/images/web/en//main/btn_more01.png) no-repeat center center; }
.Greetings .btn_more:hover {background: #ff909f url(/images/web/en//main/btn_more01.png) no-repeat center center;}


/* M_link01 Korea Maritime & Ocean University */
.M_link01 {position:relative; width:250px; height:235px; padding:25px 25px 0; background:#273074 url('/images/web/en//main/M_link01_bg.png') no-repeat center 0; background-size:cover; float:left; overflow:hidden;}
.M_link01 h2 {font-size:21px;line-height:1.4;color:#fff;font-family:'notoM';margin-bottom:20px;font-weight:  bold;}
.M_link01 h2 span {color:#54dcf5;}
.M_link01 ul li {position:relative; border:1px solid #525990; margin-bottom:9px; }
.M_link01 ul li:hover {background-color: rgba(155, 161, 210, 0.3); }
.M_link01 ul li a {display:block; font-family:'notoR'; font-size:12px; color:#fff; height:28px; line-height:28px; padding-left:13px;}
.M_link01 ul li a span.btn { position:absolute; width:5px; height:9px; right:16px; top:34%; text-indent: -9999em; line-height: 0; font-size: 0;  background:url('/images/web/en//main/btn_more02.png') no-repeat right center;}


/* Units_Camp 180123 수정 */
.Units_Camp {position:relative; width:550px; height:235px; padding:25px 25px 0; background:#fff; float:left; overflow:hidden;}
.Units_Camp h2 {font-size:24px;color:#381d1d;font-family:'notoM';font-weight:  bold;}
.Units_Camp h2 span{color: #d8213a;}
.Units_Camp .UC_img {position:relative; width:100%; height:190px; overflow:hidden; }
.Units_Camp .UC_img li {width:100%; padding:15px 0; overflow:hidden;}
.Units_Camp .UC_img p.img {width: 40%; float:left;}
.Units_Camp .UC_img .img img {width:100%;height: 164px;}
.Units_Camp .UC_img dl {width: 55%; float:right;}
.Units_Camp .UC_img dl dt {font-size: 18px; line-height:22px; font-family:'notoR'; color: #d8213a; font-weight:bold; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.Units_Camp .UC_img dl dt:hover {color: #d8213a;}
.Units_Camp .UC_img dl dd.txt {margin-top:10px; font-family:'notoR'; font-size:13px; color:#222; text-overflow:ellipsis; overflow:hidden; height:110px; line-height: 1.4;}
.Units_Camp .control {position:absolute; top:0; right:0; z-index:10; overflow:hidden;}
.Units_Camp .control a {display:block; width:39px; height:39px; float:left; text-indent:-10000em; }
.Units_Camp .control a.prev {background:url("/images/web/en//main/btn_prev.png") no-repeat; }
.Units_Camp .control a.next {background:url("/images/web/en//main/btn_next.png") no-repeat; }

/* Headquarters */
.Headquarters {position:relative; width:600px; height:260px;  float:left; overflow:hidden; /* background:url(/images/web/en//main/Headquarters.jpg) no-repeat center center; background-size:100%; */}
.Headquarters .img{position:relative; width:600px; height:260px;}
.Headquarters .img img{width:100%; height:100%;}
.Headquarters .txt_box {position:absolute; right:20px; top:30px; font-size:14px; color:#fff; font-family:'notoR'; line-height:1.4;}

/* Services */
.Services {position:relative;width:250px;height:225px;padding:35px 25px 0;background: #2a384a url(/images/web/en//main/academic_bg.png) no-repeat;background-position:bottom right;float:left;overflow:hidden;}
.Services h2 {font-size:21px; color:#fff; font-weight:bold;}
.Services h2 span{color:#fdeb6f;}
.Services ul {margin-top:10px;}
.Services ul li  {position:relative;width:100%;font-family:'notoR';line-height: 36px;font-size:12px;overflow:hidden;border-bottom:  1px solid #000;}
.Services ul li:last-child{border-bottom:none;}
.Services ul li a {display:block;width:100%;float:left;color:#fff;overflow:hidden;}
.Services ul li a:hover {color:#b5f4e9;}


/* Contact */
.Contact {position:relative;width:250px;height:225px;padding:35px 25px 0;background: #04afef url('/images/web/en//main/Campus_bg.png') no-repeat;background-position:bottom right;float:left;overflow:hidden;}
.Contact h2 {font-size:22px; color:#fff; font-weight:bold; margin-bottom:20px;} 
.Contact h2 span {color:#2a384a;}
.Contact p {font-size:13px; color:#f7d3de; font-family:'notoR';}
.Contact .btn_more {position:absolute; width:88px; height:27px; left:25px; bottom:50px; text-indent: -9999em; line-height: 0; font-size: 0; background: url(/images/web/en//main/btn_more01.png) no-repeat center center; }
.Contact .btn_more:hover {background:#90def6 url(/images/web/en//main/btn_more01.png) no-repeat center center; }




 @media (max-width: 800px) {
	
	#container, .main_content, .Greetings, .M_link01, .Headquarters, .Units_Camp, .Services, .Contact {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}
	
	#container {width:100%; padding-top:70px; background-position:0 70px;}
	
	.main_content {width:96%;}
		
	.main_content, .slogan, .Greetings, .M_link01, .Headquarters, .Units_Camp, .Services, .Contact{-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease}
	
	/* slogan */
	.slogan {width:100%; }
	.slogan .img{width:90%; padding:50px 0;}
	.slogan .img img{width:100%;}	
	
	/* Greetings */
	.Greetings {width:50%; height:260px; background-position:bottom right;}

	/* M_link01 Korea Maritime & Ocean University */
	.M_link01  {width:50%; height:260px;}

	/* Headquarters */
	.Headquarters {width:100%; height:240px; margin:0 0 4%;}
	.Headquarters .img {width:100%;}

	/* Units_Camp */
	.Units_Camp {width:100% ;height:260px; margin: 4% 0;}
	
	/* Services */
	.Services {width:50%;}
	
	/* Contact */
	.Contact {width:50%;}
}	
	
 @media (max-width: 640px) {

	/* Services */
	.Services {width:100%;margin:  0 0 4%;}
	
	/* Contact */
	.Contact {width:100%;}
	
	/* M_link01 */
	.M_link01 h2 {font-size:18px;}

}


 @media (max-width: 560px) {

	/* Units_Camp */
	.Units_Camp {height:auto;}
	.Units_Camp .gall_top {padding:15px 0 30px; overflow:hidden;}
	.Units_Camp .gall_top p.img {width:100%;float:none; margin-right:0;}
	.Units_Camp .gall_top dl {margin-top:20px;width:100%; }
	.Units_Camp .gall_top dl dd.txt {height:52px;}
	.Units_Camp .gall_top dl dd.date {margin-top:20px;}

}


 @media (max-width: 480px) {
	
	.Headquarters .txt_box {color:#2a384a;}
	
	/* Greetings */
	.Greetings {width:100%; margin: 0 0 4%;}

	/* M_link01 Korea Maritime & Ocean University */
	.M_link01 {width:100%;}
	
}
 
 
 @media (max-width: 380px) {
	
	/* Headquarters */ 
	.Headquarters .list_box li a {width:65%;}
	.Headquarters .list_box li span.date {width:30%;}
	
}