@charset "utf-8";

@import url("/sites/guide/style/css/guide.css");
@import url("main.css");
@import url("layout.css");

/* common */
._contentBuilder ._obj._objHtml ol, ._contentBuilder ._obj._objTag ol { list-style-type: none !important; }

/*인사말*/
.dean_title{ color: #ff8601; margin-bottom:20px; font-size: 24px; font-weight: 500; }
.dean_text{ text-align:justify; }
.dean_sign{ float:right; margin-top:20px; font-weight:500; text-align: right; }

@media screen and (max-width:820px){
  .dean_text{ text-align:left; }
}

/*사업계획-연구역량 영역*/
.diagram_01{height:100%;}
.diagram_01 > ul{display:table; width:100%;height:100%; word-break:keep-all;margin-bottom:28px;}
.diagram_01 > ul > li{display:table-cell; padding:1%; position:relative; vertical-align:top; height:100%;}
.diagram_01 > ul > li:before{content:""; display:block; position:absolute; top:calc(50% - 10px); right:calc(100% - 6px); width:12px; height:20px; background:url(/sites/kr/images/arrow_diagram_01.png); }
.diagram_01 > ul > li:first-child:before{display:none;}
.diagram_01 > ul > li div{box-sizing:border-box; border:1px solid #cccccc; box-shadow: 5px 5px 5px #f5f5f5; text-align:center; height:100%;}
.diagram_01 > ul > li div h3{font-size:17px; font-weight:500; color:#FFF;  padding:15px 0; position:relative; }
/* 익스플로어 전용 CSS */
/* Only works in IE10 이상 (IE11도 포함)*/
_:-ms-input-placeholder, :root .diagram_01 ul li {padding-bottom:0;}
_:-ms-input-placeholder, :root .diagram_01 ul li div p{padding-bottom:10px;}

/* Only works in IE11 */
_:-ms-input-placeholder, :root .diagram_01 ul li {padding-bottom:0;}
_:-ms-input-placeholder, :root .diagram_01 ul li div p{padding-bottom:10px;}

/* 익스플로어 전용 CSS 끝 */
.diagram_01 > ul > li div h3:before,
.diagram_01 > ul > li div h3:after{content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%;}
.diagram_01 > ul > li div h3:before{background:#1280d4; z-index:-1;}
.diagram_01 > ul > li div h3:after{background:url(/sites/kr/images/pattern_7.png); filter:alpha(opacity=20);opacity:0.2; z-index:-1;}
.diagram_01 > ul > li:nth-child(even) div h3:before{background:#24b8f6; z-index:-1;}
.diagram_01 > ul > li div ul {padding:30px 10px; text-align: left; }
.diagram_4cell > ul > li{width:21%;}

@media only screen and (max-width:780px){
  .diagram_4cell > ul {display:block;}
  .diagram_4cell > ul > li {display:block; width:auto;}
  .diagram_4cell > ul > li:before{top:calc(0% - 20px); right:auto; left:calc(50% - 6px); transform:rotate(90deg);}
  .diagram_4cell > ul > li div h3,
  .diagram_4cell > ul > li div ul {padding:10px;}
}

/*사업계획산학협력 영역 box*/
.GeeproArea {padding:20px; background:#f2f2f2;}

/*조직도*/
.orgaWrap ul{position:relative;}
.orgaWrap ul li{}
.orgaWrap ul li div{position:relative;max-width:200px;padding:14px 10px;color:#FFF;text-align:center;font-size:16px;margin: 0 auto;line-height:1.25;word-break: keep-all;}
.orgaWrap ul li div a{color:#FFF;}

.orgaWrap .con_1 li div{background:#103856;}
.orgaWrap .con_2 li div{background:#00a2ff;}
.orgaWrap .con_3 li div{background:#00898e;}
.orgaWrap .con_4 li div{background:#076a7f;}
.orgaWrap .con_5 li div{background:#527bc9;}
.orgaWrap .con_5 li ul li div{background:#8d9cb9;}
.orgaWrap .con_6 li div{background:#888;}

.orgaWrap .con_1{width:100%; position:relative; left:50%; margin-left:-12%;}
.orgaWrap .con_1 li{
  width:24%; float:left; position:relative; margin-bottom:40px; 
}
.orgaWrap .con_1 li:before{
  content:"";display:block;width: 1px;height:1200%;border-top:1px solid #c1c1c1;background:#c1c1c1;position:absolute;left:calc(50% - 0.5px); top: 100%;
}
.orgaWrap .con_2{
  clear:both;
}
.orgaWrap .con_2 li{
  margin-bottom:40px;
}
.orgaWrap .con_3{
  width:80%; position:relative; left:50%; margin-left:-40%;
}
.orgaWrap .con_3:after {
  clear: both; content: ""; display: block;
}
.orgaWrap .con_3 li{
  margin-bottom:40px; position:relative;
  float: left; width: 30.3%; padding: 0 1.5%;
}
.orgaWrap .con_3 li:nth-child(1):before{
  content:"";
  display:block;
  width: 150%;
  border-top:1px solid #c1c1c1;
  background:#c1c1c1;
  position:absolute;
  right: -140%;
  top: 50%;
}

.orgaWrap .con_4 li div {max-width: 350px;}
.orgaWrap .con_4 li {margin-bottom: 30px;}

.orgaWrap .con_5{position:relative; float: right; width: 50%; margin-bottom: 20px;}
.orgaWrap .con_5:after {content: ""; display: block; width: 42%; border-top: 1px solid #c1c1c1; background: #c1c1c1; position: absolute; left: 0; top: 13%; z-index: -10;}
.orgaWrap .con_5 > li{position:relative; margin-bottom:30px;}

.orgaWrap .con_6{clear:both;overflow:hidden;width:100%;margin: 0 auto;}
.orgaWrap .con_6:before{content:"";display:block;width:80%;height:1px;margin: 0 auto;background:#c1c1c1;}
.orgaWrap .con_6 li{float:left;width:17%;padding:0 1.5%;}
.orgaWrap .con_6 li:before{content:"";display:block;width:1px;height:40px;margin: 0 auto;background:#c1c1c1;}

@media (min-width: 637px) and (max-width: 700px) {
  .orgaWrap .con_1 li:before { height: 1057% !important; }
}

@media screen and (max-width:700px){
  /*조직도*/
  .orgaWrap .con_1{margin-left:-25%;}
  .orgaWrap .con_1 li{width:50%;  margin-bottom:30px;}
  .orgaWrap .con_1 li:after{right: -42%; }
  .orgaWrap .con_1 li:before{height:1100%;}

  .orgaWrap .con_2 li{
	margin-bottom:30px;
  }

  .orgaWrap .con_3{
	width:100%; margin-left:-50%;
  }
  .orgaWrap .con_3 li:nth-child(1):before{
	width: 185%;
  }

  .orgaWrap .con_5 { width: 100%; }
  .orgaWrap .con_5:after { border-top: 1px solid #fff; }

  .orgaWrap .con_6:before{width:50%;}
  .orgaWrap .con_6 li{width:47%;}
  .orgaWrap .con_6 li:before{height:30px;}
}

/*교양과정 소개_기본방향*/
div.missionWrap {position:relative;width:100%; zoom:1}
div.mission { width:100%;}
div.mission:after { clear: both; content: ""; display: block; }
div.missionL {position:relative;max-width:200px; width:25%; float:left;}
div.missionTit { width:80%; box-sizing: border-box; color:#fff; text-align:center; vertical-align: middle; padding:25px 10px; margin-right:100px; font-weight: 400;}
.mission:nth-child(1) div.missionTit {background: #567abf;}
.mission:nth-child(2) div.missionTit {background: #4389be;}
.mission:nth-child(3) div.missionTit {background: #2193D1;} 
.mission:nth-child(4) div.missionTit {background: #4db0ba;}   
div.missionR {position:relative; float:left; width:70%; box-sizing: border-box; margin:0 auto; padding-bottom: 30px;}
div.m_con01 {position:relative; display: block; width:80%;padding:20px; text-align: center; background: #4C75B5; border: 1px solid #4C75B5; border-radius: 50px; color:#fff; font-weight: 500; font-size:17px; margin:0 auto; }
div.m_con01 span{display: block; color: #caf4ff; font-size: 14px;}
div.missionR ol {width:100%; text-align: center;}
div.missionR ol li{font-weight: 500;list-style:none;}
div.missionR ol.step01 {}
div.missionR ol.step01 li { display: block; border:1px solid #92ACDD; background: #E7EFFC; color:#3B5CA9; margin-right:1%;  padding: 10px 20px; box-sizing: border-box; margin-bottom: 5px; text-align: left !important; font-size: 15px;}
div.missionR ol.step01,  div.missionR ol.step02 li:last-child,  div.missionR ol.step03 li:last-child{margin-right:0;}
div.missionR ol.step02 li { display: inline-block !important; margin-right:1.5%; width:23%; vertical-align:top;  box-sizing: border-box;}
div.missionR ol.step02 li {background: #439dce; color:#fff; font-size:14px; font-weight: 500; padding: 10px 1%;}
div.missionR ol.step02 li span {display: block; color: #e4f193;}
div.missionR ol.step03 {height: 100%; display: table;}
div.missionR ol.step03 > li { display: table-cell !important; width:25%; vertical-align:top;  box-sizing: border-box; padding: 1%; height: 100%;}
div.missionR ol.step03 li > div {height: 100%; background: #fff; border: 1px solid #dcdcdc; box-sizing: border-box;}
div.missionR ol.step03 li > div h5{border:1px solid #92ACDD; background: #B4CAF9; color:#1C3464; font-size:14px; font-weight: 500; padding: 10px 1%;}
div.missionR ol.step03 li > div ul {padding:14px; text-align: left;}
div.missionR ol.step03 li > div ul li {font-size:13px; font-weight: 300; color: #666; position: relative; padding-left: 8px;}
div.missionR ol.step03 li > div ul li:after {content: ""; width: 3px; height: 3px; background: #555; position: absolute; top: 9px; left: 0; border-radius: 50%;}

@media only screen and (max-width:760px) {
  div.missionR ol.step02 li {width: 48.9%; margin-bottom: 2%; margin-right: 0;}
  div.missionR ol.step03 > li {display: block !important; width: 100%; height: auto;}
}
@media only screen and (max-width:480px) {
  div.missionL {max-width: none; width: 100%;}
  div.missionTit {width: 100%; margin-right: 0; margin-bottom: 10px; padding: 10px;}
  div.missionR {width: 100%;}
  div.m_con01 {width: calc(100% - 42px);}
  }
}