@charset "utf-8";
.eQ01 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_1.jpg) no-repeat center top;}
.eQ02 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_2.jpg) no-repeat center top;}
.eQ03 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_3.jpg) no-repeat center top;}
.eQ04 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_4.jpg) no-repeat center top;}
.eQ05 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_5.jpg) no-repeat center top;}
.eQ06 .wrap_sub_visual:before{background:url(/sites/uisp/images/sub/sub_visual_6.jpg) no-repeat center top;}

/*
.eQ01 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_1.jpg) no-repeat center top;}
.eQ02 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_2.jpg) no-repeat center top;}
.eQ03 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_3.jpg) no-repeat center top;}
.eQ04 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_4.jpg) no-repeat center top;}
.eQ05 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_5.jpg) no-repeat center top;}
.eQ06 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_6.jpg) no-repeat center top;}
.eQ07 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_7.jpg) no-repeat center top;}
.eQ08 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_8.jpg) no-repeat center top;}
*/

/*메인메뉴*/
@media (min-width: 1281px) {
  .head_navi nav .li_2 {text-align:center;}
}

/*구조*/
.wrap_sub_visual {height: 400px;}
.wrap_sub_visual .container {padding-top: 190px;}
.wrap_page_func {top: 255px;}
.sub .wrap_contents {margin-top: 250px;}
@media all and (max-width:1400px) {
  .sub .wrap_contents {margin-top: 280px;}
}
@media all and (max-width:768px) {
  .wrap_page_func {top: 330px;}
}

/*탭메뉴3*/
.tab_3 .menuSubTitleUI{display:none;}
@media all and (min-width:1025px) {
  .tab_3{background:#FFF;position:relative;border-bottom:1px solid #EEE;}
  .tab_3 .sub_div{max-width:1600px;margin:0 auto;}
  .tab_3 .sub_div{}
  .tab_3 .sub_div > a{display:none;}
  .tab_3 .sub_div > ul{display:flex;justify-content:space-between;}
  .tab_3 .sub_div > ul > li{text-align:center;width:100%;border-right:1px solid #EEE;display:flex;justify-content:center;align-items:center;}
  .tab_3 .sub_div > ul > li:last-child{border-right:0;}
  .tab_3 .sub_div > ul > li > a{display:block;padding:15px 10px;font-weight:600;font-size:18px;}	
  .tab_3 .sub_div > ul > li._active{background:#0e56a8;margin-top:-10px;border:0;transform:skew;}
  .tab_3 .sub_div > ul > li > a._active{color:#FFF;}
  .tab_3 .sub_div > ul > li:hover{background:#333;color:#FFF;transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);}
  .tab_3 .sub_div > ul > li:hover a{color:#FFF;}
}
@media all and (max-width:1600px) {
  .tab_3{padding:0 15px;}
}
@media all and (max-width:1024px) {
  .tab_3 .sub_div{padding-top:20px;}
  .tab_3 .sub_div > a{display:none;}
  .tab_3 .sub_div > ul{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;}
  .tab_3 .sub_div > ul > li{margin:2.5px;}
  .tab_3 .sub_div > ul > li > a{display:block;padding:10px;font-weight:400;font-size:14px;border:1px solid #999;}
  .tab_3 .sub_div > ul > li > a._active{border-color:#007d77;background:#007d77;color:#FFF;}
}

/*탭메뉴4*/
@media all and (min-width:1025px) {
  .tab_4{background:#f7f7f7;position:relative;}
  .tab_4 .menuUItab{max-width:1600px;margin:0 auto;}
  .tab_4 .tab_div{}
  .tab_4 .tab_div > a{display:none;}
  .tab_4 .tab_div > ul{display:flex;justify-content:center;}
  .tab_4 .tab_div > ul > li{text-align:center;display:flex;justify-content:center;align-items:center;}
  .tab_4 .tab_div > ul > li > a{display:block;padding:12px 20px;font-weight:700;font-size:17px;}	
  .tab_4 .tab_div > ul > li > a._active{color:#0e56a8;}
  .tab_4 .tab_div > ul > li:hover a{color:#000;}
}
@media all and (max-width:1600px) {
  .tab_4{padding:0 15px;}
}
@media all and (max-width:1024px) {
  .tab_4 .tab_div{padding-top:20px;}
  .tab_4 .tab_div > a{display:none;}
  .tab_4 .tab_div > ul{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;}
  .tab_4 .tab_div > ul > li{margin:2.5px;}
  .tab_4 .tab_div > ul > li > a{display:block;padding:10px;font-weight:400;font-size:14px;}
  .tab_4 .tab_div > ul > li > a._active{}
}



/* */
.opening-table .txt-round { display: inline-block; margin-right: 5px; padding: 5px 10px; background: #f2f2f2; border: 1px solid #999; border-radius: 20px; color: #777; font-size: 14px; font-weight: bold; line-height: 1; }
.opening-table p { display:inline-block; }

/*professor-area*/
.professor-area { display: flex; justify-content: space-between;  }
.professor-area .col { width: 49%;  height: 300px; padding: 10px 15px; background: rgba(131, 91, 147, 0.05); position: relative; border-radius: 30px; box-shadow: 0 0 5px 0 rgba(0, 0, 0, .15); font-size: 0; }
.professor-img { display: inline-block; width: 160px; padding: 5px; background: #fff; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1); overflow: hidden; vertical-align: middle; }
.professor-img img { width: 100%; }
.professor-info-area { display: inline-block; width: calc(100% - 160px); height: 100%; padding: 20px 0 20px 20px; border-radius: 10px; vertical-align: middle; overflow: hidden; }
.professor-name { font-size: 18px; font-weight: 500; color: #222; line-height: 1.3; }
.professor-name span { font-size: 0.85em; font-weight: 300; }
.professor-name-info { color: #999; }
.professor-title-area { position: relative; padding-right: 100px; }
.professor-sub { position: absolute; right: 0;  margin-bottom: 5px; padding: 0 8px; border: 1px solid #663b93; border-radius: 20px; color: #663b93; font-size: 13px; font-weight: bold; }
.professor-history { padding-top: 15px; }
.professor-history-title { font-size: 13px;  width: 100%;color: #835b93; border-bottom: 1px solid rgba(131, 91, 147, 0.7); font-weight: bold; padding: 2px; margin-bottom: 5px; }
.professor-history li { color: #333; padding: 3px 0 3px .5em; list-style-position: inside; text-indent: -.5em; line-height: 1.3; font-size: 14px; font-weight: 500; }
.professor-history .book { margin-top: 10px; color: #888; }
.professor-history .book span { border: 1px solid #777777; color: #333;  padding: 0 5px; height: 20px; line-height: 20px; border-radius: 5px; font-size: 11px; display: inline-block; margin-right: 8px; }
.professor-history li span { font-weight: normal; opacity: .8; text-indent: 0; }
@media screen and (max-width:1280px) { 
  .professor-area { flex-direction: column;  }
  .professor-area .col { width: 100%; height: auto;   }
  .professor-area .col + .col { 	margin-top: 20px;   }
}
@media screen and (max-width:767px) {
  .professor-area { 	padding: 15px; 	flex-wrap: wrap;   }
  .professor-img { 	width: 80px; 	position: absolute; 	left: 20px; 	top: 10px;   }
  .professor-info-area { 	width: 100%; 	padding: 0;   }
  .professor-title-area { 	padding-top: 10px; 	padding-right: 0; 	padding-left: 100px; 	min-height: 100px;   }
  .professor-sub { 	position: inherit; 	display: inline-block;   }
  .professor-name { 	font-size: 16px;   }
  .professor-name span { 	display: block;   }
  .professor-name-info { 	font-size: 13px;   }
  .professor-history { 	padding-top: 5px;   }
  .professor-history-title { 	font-size: 12px; 	padding: 2px 5px; 	width: 100%;   }
  .professor-history li { 	font-size: 12px;   }
}

.forum-timeline .content-box-area {  margin-right: 0; }
.forum-timeline .content-box {     border-radius: 20px; }
.content-box-area {     padding-top: 20px;     margin-left: 100px;     position: relative;     margin-right: 45px; }
.content-box-area:before {   content: '';   position: absolute;    width: 1px;   height: 100%;    background: #ddd;   top: 0;    left: -60px; }
.content-box-area:last-child {   padding-bottom: 45px; }
.content-box {   background: #fff;   padding: 35px;   display: flex;   position: relative;   -webkit-box-shadow: 0 15px 60px -10px rgba(0, 0, 0, 0.12);   box-shadow: 0 15px 60px -10px rgba(0, 0, 0, 0.12); }
.content-box:before {   content: '';   width: 12px;   height: 12px;   position: absolute;   left: -66px;   background: #ff6b6b;   top: -6px;   border-radius: 50%; }
.content-box-img-wrap {   width: 40%;   position: relative; }
.content-box-img-area {   width: 100%;    height: 0;   padding-top: 56.25%;   overflow: hidden;    position: relative; } 
.content-box-img-area img {   position: absolute;   left: 50%;   top: 50%;   width: 100%;   -webkit-transform: translate(-50%, -50%);    -ms-transform: translate(-50%, -50%);   transform: translate(-50%, -50%);   transition: .35s;   -o-transition: .35s;   -moz-transition: .35s;   -webkit-transition: .35s; }

.content-box-img-area img { max-width:unset !important; }
.content-box-img-wrap:hover .content-box-img-area img {   width: 110%; }



.content-box-text-area {   position: absolute;   width: 100%;   height: 100%;    bottom: 0;   left: 0;   background: rgba(0, 0, 0, 0.4);   color: #fff;   display: flex;    flex-direction: column;   justify-content: center;   align-items: center; }
.content-box-text-area label {   width: 100%;   height: 100%;   display: flex;   flex-direction: column;   justify-content: center;   align-items: center;   cursor: pointer; } 
.content-box-title-area {   width: 60%;   padding-left: 30px;   position: relative; }
.content-box-title-area .box-title {   color: #262626;    font-weight: 500;   font-size: 24px;  }
.content-box-title-area .box-sub {    display: inline-block;   margin-bottom: 5px;    padding: 0 8px;   border: 1px solid #663b93;   border-radius: 20px;   color: #663b93;   font-size: 13px;   font-weight: bold; }
@media screen and (max-width:767px) { 
  .content-box-area { 	padding-top: 15px; 	margin-left: 50px; 	margin-right: 15px;   }
  .content-box-area:before { 	left: -25px;   }
  .content-box { 	padding: 15px; 	flex-direction: column;   }
  .content-box:before { 	left: -30px;   }
  .content-box-img-wrap { 	width: 100%;   }
  .content-box-title-area { 	width: 100%; 	padding-left: 0; 	padding-top: 10px;   }
  .box-date { 	font-size: 12px; 	margin-bottom: -3px;   }
  .download { 	font-size: 13px; 	right: 0; 	top: -28px; 	margin-top: 0; 	margin-right: 0;   }
  .box-text { 	font-size: 12px; 	word-break: break-all; 	line-height: 1.3;   }
  .content-box-title-area .box-title { 	font-size: 16px;   }
  .content-box-title-area .box-sub { 	font-size: 12px;   }
}


/* modal */
.modal {   opacity: 0;   visibility: hidden;   position: fixed;   top: 0;   right: 0;    bottom: 0;   left: 0;   text-align: left;   background: rgba(0, 0, 0, .7);   transition: opacity .25s ease;   z-index: 99999;   overflow: auto;   display: block; }
.modal-state {   display: none; }
.modal-state:checked + .modal {   opacity: 1;   visibility: visible; }
.layer {   display: table;   top: 0;   left: 0;   width: 100%;   height: 100%;   position: absolute; }
.layer .layer-content {   display: table-cell;    vertical-align: middle;   position: relative;   top: -100px;    transition: top .25s ease;   padding: 60px 15px;   width: 100%; }
.layer .blank {   display: inline-block;   width: 0;   height: 100%;   vertical-align: middle }
.modal-state:checked + .modal .layer-content {   top: 0; }
.modal-inner {
  position: relative;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: auto;
  /*overflow: auto; 
  border-radius: 10px;*/
  background: #fff;
  padding: 30px;
}

.modal-close,
.gift-modal-close {   position: absolute;   right: 12px;   top: 5px;   width: 50px;   height: 50px;   cursor: pointer; }

.modal-close:after,
.modal-close:before,
.gift-modal-close:after,
.gift-modal-close:before {   content: '';   position: absolute;   width: 1px;   height: 30px;   background: #aaa;   display: block;   transform: rotate(45deg);   left: 50%;   margin: 9px 0 0 0;   top: 0; }

.modal-close:hover:after,
.modal-close:hover:before,
.gift-modal-close:hover:after,
.gift-modal-close:hover:before {   background: #aaa; }
.modal-close:before,
.gift-modal-close:before {  transform: rotate(-45deg); }
.modal-md {   max-width: 600px; }
.modal-sm {   max-width: 450px; }
.modal-content { width: 100%; display: inline-block; padding-top: 5px; }
.modal-title { font-size: 22px; font-weight: 500; color: #262626; line-height: 1.3; }
@media (max-width: 767px) {
  .modal-inner { padding: 30px 20px 20px;  }
  .modal-title { font-size: 17px;  }
}

/*modal-play*/
.modal .embed-youtube {
  position: relative;
  width: 100%;
  overflow: hidden;
  height: 0;
  padding-bottom: 56.25%;
  margin: -5px 0 -7px;
}

.modal-inner.modal-play {
  padding: 0;
  background-color: transparent;
  width: 100%;
  max-width: 1000px;
}

.modal-play .modal-close {
  z-index: 9;
  top: 0;
  right: 0;
  background: #000;
  width: 40px;
  height: 40px;
}

.modal-play .modal-close:after,
.modal-play .modal-close:before {
  background: #fff;
  height: 25px;
  top: -2px;
}

/* //modal */

/*.embed-youtube {*/
.embed-youtube {
  position: relative;
  width: 100%;
  height: 400px;
  overflow: hidden;
  /*height:0;
  padding-bottom: 56.25%;*/
}

.embed-youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

@media (max-width:1300px) {
  .embed-youtube {
	position: relative;
	width: 100%;
	overflow: hidden;
	height: 0;
	padding-bottom: 56.25%;
  }
}
.live:before {
  content: 'LIVE';
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 10px;
  padding: 1px 3px;
  text-align: center;
  z-index: 9;
  color: #ff4c51;
  background: #000;
  font-weight: 700;
}


.title-area button {
  margin-top: 30px;
}

@media screen and (max-width:1200px) {
  .title-area button {
	margin-top: 20px;
  }
}

@media screen and (max-width:991px) {
  .title-area button {
	margin-top: 0;
	margin-bottom: 15px;
  }
}


/*사업개요 - 1주기*/
.moImg{display:none;}
@media all and (max-width:768px){
  .moImg{margin-top:20px;display:block;}
}
.tBox > li > dl dt.bg1,
.tBox > li > dl dt.bg2{padding-bottom:0;padding:20px 50px;}

/*QR코드*/
.thumbList > li{margin-right: 0;}
.thumbList > li > .txt {font-size: 18px;}