@charset "utf-8";

/* 조직도 */
.org_left{ width: 18.4%; margin: -10% 0 0; }
.org_left span{background: #FFF;  border: 2px solid #667891;  color: #112b51; padding: 19.5px 0;}
.org_left:after{ content: "";  display: block; background: #bbbbbb;  width: 172%; height: 2px;  margin: -12% 100% 20%;}
.orgaBox{font-size: 17px;}
.orgaBox_1 span { background: url(https://www.knou.ac.kr/sites/50th/images/org50_title_bg.png) no-repeat center;  padding: 49px;}
.orgaBox_1:after{height: 150px;}
.orgaBox_2:after{height: 150px;}

.orgaBox_5 span { border: 1px solid #1d3e8f;   background: #f5fafb;  color: #1d3e8f;width: 20%; float: left; }
.orgaBox_5:before { width: 1px; height: 25px; margin: 0 auto; background: #ddd;}
 .orgaGup:before{display:none;}
.orgaGup > li {width: 100%; }

.org_right{ width: 18.4%; margin: -10% 0 0 0; float:right; clear:both;}
.org_right span{/*background: #FFF;  border: 2px solid #667891;  color: #112b51; padding: 19.5px 0;*/     color: #fff;  padding: 19.5px 0;  background: #3bbeef url(https://www.knou.ac.kr/html/func-organ/images/back_6.png);}
.org_right:after{ content: "";  display: block; background: #bbbbbb;  width: 172%; height: 2px;  margin: -12% 0 0 -172%;}

.applyFlow_2 > ul > li:nth-child(2) dl {  border-color: #23b768;}
.applyFlow_2 > ul > li:nth-child(2) dt {  background-color: #23b768;}

@media all and (max-width:800px){
  .org_left, .org_right{width:250px; margin: 0 auto;}
  .org_left:after,.org_right:after{width: 2px; height: 20px; margin: 0 auto;}
  .orgaBox_1:after{height: 20px;}
  .orgaBox_2:after{height: 20px;}
  .org_right{ float:none;}
}
@media all and (max-width:320px){
  .org_left,.org_right{width:100%;}
}



/*인사말*/
@keyframes showItem {
  from {
    transform: translateY(30px);
    opacity: 0;
  }

  to {
    transform: translateY(0px);
    opacity: 1;
  }
}
.stegger-item{ animation:showItem 0.5s;  animation-fill-mode: both;}
.stagger-item:nth-child(1) { animation-delay: 0.14s;}
.stagger-item:nth-child(2) { animation-delay: 0.21s;}
.stagger-item:nth-child(3) { animation-delay: 0.28s;}
.stagger-item:nth-child(4) { animation-delay: 0.35s;}
.stagger-item:nth-child(5) { animation-delay: 0.42s;}

.greeting .col_box{margin-top:120px;}
.greeting .col_box .col_content{display:block;position:relative; margin: 0 70px;}
.greeting .col_box .col_content:before{content:'';display:block;position:absolute;top:-80px;left:-100px;z-index:-30;width:600px;height:550px;background: rgb(46,215,172); background: linear-gradient(45deg, rgba(46,215,172,1) 10%, rgba(39,77,206,1) 61%, rgba(33,163,211,1) 100%);  border-radius: 5%;}
.greeting .col_box .col_content .col_inner{height:1000px;margin-bottom:100px;padding:70px 80px;background-color:#fff;opacity:95%;box-shadow: 0px 9px 20px 13px rgba(0, 0, 0, 0.1);}
.greeting .col_box .col_content .col_item{position:absolute;width:30%;}
.greeting .col_box .col_content .col_item.n2,.greeting .col_box .col_content .col_item.n4{right:50px;width:50%;margin-right:0;}

.greeting .col_box .col_content .col_item.n1 .inner span{display:block;width:380px;height:300px; background-size:contain; font-size:2.6em;}
.greeting .col_box .col_content .col_item.n2 p{margin-bottom:30px;font-size:18px;line-height:30px;letter-spacing:-0.02em;}
.greeting .col_box .col_content .col_item.n3{bottom:90px;}
.greeting .col_box .col_content .col_item.n2 .inner img{width:45%;}
.greeting .col_box .col_content .col_item.n3 .inner span{display:inline-block;position:absolute;right:0;bottom:45px;width:120px;height:19px;margin-bottom:20px; background-size:contain;font-size:15px;}
.greeting .col_box .col_content .col_item.n3 .inner span:last-child{bottom:0;width:300px;height:24px; background-size:contain;font-size:19px;}
.greeting .col_box .col_content .col_item.n4{bottom:100px;}
.greeting .col_box .col_content .col_item.n4 .inner span{display:block;width:100%;height:50px;background:url(https://www.knou.ac.kr/sites/50th/images/greeting_footer.jpg) no-repeat 95% 100%;background-size:cover;font-size:0;}
.greeting .col_box .col_content .col_item.n4 .inner:after{content:'';display:block;position:absolute;bottom:15px;right:-300px;width:300px;height:10px;background-color:#20c1f5;}
@media all and (max-width:1300px){
    .greeting .col_box .col_content .col_item.n1 .inner span{width:100%; font-size:2em; }
    .greeting .col_box .col_content .col_inner{padding:65px 50px;height:1300px;}
  .greeting .col_box .col_content .col_item.n3 .inner img{width:100%;}
    .greeting .col_box .col_content .col_item.n2, .greeting .col_box .col_content .col_item.n4{right:50px;}
    .greeting .col_box .col_content:before{width:525px;height:450px;}
}
@media all and (max-width:1000px){
    .greeting .col_box .col_content .col_inner{height:1350px; box-shadow:none;}
    .greeting .col_box .col_content::before{width:450px;height:370px;}
}
@media all and (max-width:800px){
  .greeting .col_box{margin-top: 40px;}
    .greeting .col_box .col_content{margin: 0 15px;}
    .greeting .col_box .col_content .col_inner{height:2050px;}
    .greeting .col_box .col_content .col_item{position:relative;width:100%;}
    .greeting .col_box .col_content .col_item.n1 .inner span{margin-bottom:50px; font-size:1.5em;}
    .greeting .col_box .col_content .col_item.n2,.greeting .col_box .col_content .col_item.n4{right:0;width:100%;}
  	.greeting .col_box .col_content .col_item.n2 .inner img{width:100%;}
    .greeting .col_box .col_content .col_item.n3{bottom:-120px;}
    .greeting .col_box .col_content .col_item.n4{bottom:-110px;}
    .greeting .col_box .col_content .col_item.n4 .inner span{height:40px;}

  
  
  
}

@media all and (max-width:640px){
    .greeting .col_box .col_content:before{width:370px;height:310px;}
    .greeting .col_box .col_content .col_inner{height:1400px;padding:40px;}
    .greeting .col_box .col_content .col_item.n1 .inner span{height:190px;margin-bottom:30px; font-size:1.3em;}
    .greeting .col_box .col_content .col_item.n2 p{margin-bottom:10px;font-size:15px;line-height:25px;letter-spacing:-0.016em;}
    .greeting .col_box .col_content .col_item.n3{bottom:-120px;}
    .greeting .col_box .col_content .col_item.n4{bottom:-150px;}
    .greeting .col_box .col_content .col_item.n3 .inner span{width:105px;height:15px;}
    .greeting .col_box .col_content .col_item.n3 .inner span:last-child{width:200px;height:30px; font-size: 1em;}
}
@media all and (max-width:480px){
    .greeting .col_box .col_content .col_inner{padding:2%;}
    .greeting .col_box .col_content .col_inner{height:1350px;}
  	.greeting .col_box .col_content .col_item.n1{padding: 5% 10%;}
    .greeting .col_box .col_content .col_item.n4{bottom: 0px;}
  .orgaBox_5 span {width: 100%; }
}





/*비젼*/
.vision-list .vision-info li {
    width: 29.3% !important; 
}

.vision-bg-list .vision-info li {
    width: 18% ;/* !important;*/
  }

@media all and (max-width:770px){
  .vision-bg-list .vision-info li {
	width: 100% !important;
  }
  }




  
  .vision-list .vision-info li p {
	font-size: 20px;}



.wrap-sub-visual {

    background: url(/sites/klead/images/sub-visual1.jpg) no-repeat center top  !important;
  }






/*테이블 반응형 UI 수정 */
@media all and (max-width:960px) {
  .wrap-contents .con-table table {width:100% !important;}
.wrap-contents .con-table:after {width:auto !important; background:none !important;}
}


