@charset "utf-8";
/********************
메인페이지 및 서브페이지 동시 적용.
가장 마지막에 불러오는 CSS 파일입니다.
※ 공통영역 CSS에서 부분별 개별 적용시 사용하시면 됩니다. 
********************/

/*구조변경*/
.wrap_unb{background:rgba(255,255,255,0.2);}
.wrap_unb:before{background:rgba(255,255,255,0.4);}
#_globalNavi .item_2 li a{color:#FFF;}
#_globalNavi .item_2 li._sign a:before{background: url(/sites/style_guide/images/common/aLink_3_w.png) no-repeat right center;}
#_globalNavi .item_2 li._sitemap a:before{background: url(/sites/style_guide/images/common/icon_nav_w.png) no-repeat right center;}
body.main{padding-top:0 !important;}
.wrap_header{background:rgba(0,0,0,0.3);}
.wrap_header .head_logo {width: 30%;}
.wrap_header .head_logo a span{color:#FFF;}
.wrap_header .head_util button{background:url(../../images/common/openM.png) no-repeat center;}
@media all and (min-width:1025px) {
  .top_div_6772{width: 110% !important;}
  .wrap_header .head_navi nav .a_1{color:#FFF;}
  .wrap_header .head_navi {width: 70%;}
}
@media all and (max-width:1024px) {
  .wrap_header .head_logo {width: 50%;}
}



/*서브비주얼****************************************/
.eQ01 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_10.jpg) no-repeat center top;}
.eQ02 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_43.jpg) no-repeat center top;}
.eQ03 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_30.jpg) no-repeat center top;}
.eQ04 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_25.jpg) no-repeat center top;}
.eQ05 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_44.jpg) no-repeat center top;}
.eQ06 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_45.jpg) no-repeat center top;}
.eQ07 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_48.jpg) no-repeat center top;}
.eQ08 .wrap_sub_visual:before{background:url(/sites/style_guide/images/sub/sub_visual_20.jpg) no-repeat center top;}

/*교육혁신원 조직도*/
.ctlOrgaWrap{}
.ctlOrgaWrap .orga_01{padding-bottom:100px;}
/*.ctlOrgaWrap .orga_01:before{content:"";display:block;width:1px;height:100px;background:#DDD;position:absolute;top:200px;left:calc(50% - 0.5px);}*/
.ctlOrgaWrap .orga_01:before{content:"";display:block;width:1px;height:100px;background:#DDD;position:absolute;top:200px;left:calc(50% - 1.1px);}
.ctlOrgaWrap .orga_01 h3{width:200px;height:200px;margin:0 auto;position:relative;}
.ctlOrgaWrap .orga_01 span{display:flex;justify-content:center;align-items:center;width:100%;height:100%;box-sizing:border-box;color:#FFF;background:#0029a3 url(/sites/style_guide/images/common/pattern_2.png);font-size:32px;text-align:center;border-radius:100%;position:relative;}
.ctlOrgaWrap > ul{display: flex;flex-wrap: wrap;position: relative;margin-bottom:30px;}
/*.ctlOrgaWrap > ul > li{width: calc(16.66% - 10px);margin: 0 5px 15px 5px;position: relative;}*/
.ctlOrgaWrap > ul > li{width: calc(33.3% - 10px);margin: 0 5px 15px 5px;position: relative;}
.ctlOrgaWrap dt{box-sizing:border-box;font-weight:400;color:#FFF;background:#0029a3 url(/sites/style_guide/images/common/pattern_6.png); padding:15px 20px;text-align:center;margin-bottom:5px;}
.ctlOrgaWrap dd{border: 1px solid #DDD;padding:15px 8px;background: #FFF;}
.ctlOrgaWrap > ul{display: flex;flex-wrap: wrap;position: relative;margin-bottom:30px;}
.orga_02{position:relative;padding-top:50px;}
.orga_02:before{content:"";display:block;width:calc(83.3% - 16.66%);height:1px;background:#DDD;position:absolute;top:0;left:16.6%;}
.orga_02 dl{position:relative;}
.orga_02 dl:before{content:"";display:block;width:1px;height:50px;background:#DDD;position:absolute;top:-50px;left:calc(50% - 0.5px);}
.orga_02 dd{min-height:280px;}
@media all and (max-width:1280px) {
  .ctlOrgaWrap > ul > li{width: calc(33.33% - 10px);}
  .orga_02:before{width:calc(100% - 33.33%);height:1px;left:16.6%;}
  .orga_02 > li:nth-child(4) > dl:before, .orga_02 > li:nth-child(5) > dl:before, .orga_02 > li:nth-child(6) > dl:before{display:none;}
  .orga_02 dd{min-height:200px;}
}
@media all and (max-width:810px) {
  .ctlOrgaWrap > ul > li{width: calc(50% - 10px);}
  .orga_02:before{width:calc(100% - 50%);height:1px;left:25%;}
  .orga_02 > li:nth-child(3) > dl:before{display:none;}
}
@media all and (max-width:540px) {
  .ctlOrgaWrap .orga_01{padding-bottom:30px;}
  .ctlOrgaWrap > ul > li{width:100%;}
  .orga_02{;padding-top:0;}
  .ctlOrgaWrap .orga_01:before, .orga_02:before, .orga_02 dl:before{display:none;}
  .orga_02 dd{min-height:auto;}
}

/*교육성과관리센터 - 한성대학교 인재상 및 핵심역량*/
.hsCesaWrap > div{margin-bottom:30px;font-size:24px;font-weight:400;}
.hsCesaWrap > div > dl{display:flex;flex-wrap: wrap;align-items:center;}
.hsCesaWrap > div > dl > dt{width:200px;}
.hsCesaWrap > div > dl > dt h2{width:90%;}
.hsCesaWrap h2{position:relative;}
.hsCesaWrap h2:after{content:"";display:block;width:1px;height:40px;background:#DDD;position:absolute;top:calc(50% - 20px);right:20%;}
.hsCesaWrap > div > dl > dd{width:calc(100% - 200px);text-align:center;}
.hsCesaWrap .divide{display:flex;justify-content:space-between;flex-wrap: wrap;align-items:center;width:100%;}
.hsCesaWrap .divide li{width:calc(33% - 20px);margin:0 10px 10px 10px;}

.hsCesa_1 dd div{color:#FFF;background:url(/sites/style_guide/images/common/pattern_2.png) center;padding:25px;box-sizing:border-box;border-radius:20px;} 
.hsCesa_1 dd div span{display:inline-block;font-size:22px;}

.hsCesa_2 dd div{padding:25px;box-sizing:border-box;border:1px solid #DDD;border-radius:20px;}
.hsCesa_3 dd{padding:25px;box-sizing:border-box;border-radius:20px;background:#ecf1f7;}
.hsCesa_3 dd li{text-align:left;}
.hsCesa_3 dd li span{color:#1c63dc;}
.hsCesa_3 dd li:before{top:13px;}
.hsCesa_4 dd{color:#1c63dc;}
.hsCesa_4 dd div{padding:25px;box-sizing:border-box;border-radius:10px;background:#ecf1f7;display:flex;justify-content:center;flex-wrap: wrap;align-items:center;}

.hsCesa_5 dd .title{font-size:22px;color:#FFF;background:#1c63dc;box-sizing:border-box;border-radius:10px 10px 0 0;height:60px;padding:15px;}
.hsCesa_5 dd .item_2{font-size:20px;display:flex;justify-content:center;flex-wrap: wrap;align-items:center;padding:20px;background:#ecf1f7;border-radius:0 0 10px 10px;}
.hsCesa_5 dd .item_2 span{font-size:20px;}
.hsCesa_5 dd .item_2 span:first-child{position:relative;margin-right:5px;}
.hsCesa_5 dd .item_2 span:first-child:after{content:"|";padding-left:5px;}

.hsCesa_6 dd div{color:#1c63dc;padding:15px;box-sizing:border-box;border:1px solid #1c63dc;border-radius:20px;font-weight:600;}
.hsCesa_6 dd div p:first-child{font-size:18px;font-weight:400;}


@media all and (max-width:1300px) {
  .hsCesa_5 dd .item_2{display:block;}
  .hsCesa_5 dd .item_2 span{display:block;}
  .hsCesa_5 dd .item_2 span:first-child{margin-right:0;}
  .hsCesa_5 dd .item_2 span:first-child:after{display:none;}
}
@media all and (max-width:1024px) {
  .hsCesaWrap > div > dl > dt, .hsCesaWrap > div > dl > dd{display:block;width:100%;}
  .hsCesaWrap > div > dl > dt h2{width:100%;}
  .hsCesaWrap h2:after{display:none;}
}
@media all and (max-width:690px) {
  .hsCesaWrap .divide li{width:calc(50% - 20px);}
}
@media all and (max-width:420px) {
  .hsCesaWrap .divide li{width:100%;}
}


/*한성핵심역량진단*/
.hceaWrap{display:flex;justify-content:space-between;flex-wrap: wrap;align-items:center;width:100%;}
.hceaWrap li{width:calc(33% - 20px);margin:0 10px 10px 10px;box-sizing:border-box;}
.hceaWrap li div{width:390px;height:390px;display:flex;justify-content:center;align-items:center;border-radius:100%;}
.hceaWrap li div span{font-size:20px;width:90%;height:90%;color:#FFF;font-weight:500;box-sizing:border-box;border-radius:100%;padding:80px 40px 40px 40px;display:flex;justify-content:center;align-items:center;text-align:center;position:relative;}
.hceaWrap li div span:before{font-size:30px;display:block;width:42px;height:42px;text-align:center;position:absolute; top:15%;left:calc(50% - 21px);}

.hceaWrap li:nth-child(1) div{background:#97d0ee;}
.hceaWrap li:nth-child(2) div{background:#90b5e2;}
.hceaWrap li:nth-child(3) div{background:#80a2d2;}

.hceaWrap li:nth-child(1) div span{background:url(/sites/style_guide/images/common/pattern_1.png);}
.hceaWrap li:nth-child(2) div span{background:url(/sites/style_guide/images/common/pattern_2.png) center;}
.hceaWrap li:nth-child(3) div span{background:url(/sites/style_guide/images/common/pattern_7.png);}

.hceaWrap li:nth-child(1) div span:before{content:"1";}
.hceaWrap li:nth-child(2) div span:before{content:"2";}
.hceaWrap li:nth-child(3) div span:before{content:"3";}

@media all and (max-width:1280px) {
  .hceaWrap li div{width:280px;height:280px;}
  .hceaWrap li div span{font-size:18px;padding:40px 20px 20px 20px;}
  .hceaWrap li div span:before{font-size:24px;top:10%;}
}
@media all and (max-width:910px) {
  .hceaWrap li{width:100%}
  .hceaWrap li div{width:100%;height:100%;border-radius:0;border:0;}
  .hceaWrap li div span{width:100%;height:100%;border-radius:0;padding:40px 20px 10px 20px;text-align:left;}
  .hceaWrap li div span:before{top:5px;left:10px;text-align:left;}
}