
#sub-visual{position: relative; width: 100%; height: 280px; padding: 20px; display: flex; align-items: center; justify-content: center; background: no-repeat center / cover;}
#sub-visual::before{content:""; display:block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(66,77,117,.46);}
#sub-visual h2{font-size: 5rem; font-weight: 800; color: #fff; position:relative;}

/* sub-visual */
#sub-visual.sub-visual_1{background-image: url('/resources/cbe/img/sub/subvisual_01.png');}
#sub-visual.sub-visual_2{background-image: url('/resources/cbe/img/sub/subvisual_02.png');}
#sub-visual.sub-visual_3{background-image: url('/resources/cbe/img/sub/subvisual_03.png');}
#sub-visual.sub-visual_4{background-image: url('/resources/cbe/img/sub/subvisual_04.png');}
#sub-visual.sub-visual_5{background-image: url('/resources/cbe/img/sub/subvisual_05.png');}
#sub-visual.sub-visual_6{background-image: url('/resources/cbe/img/sub/subvisual_06.png');}


#breadcrumb{position: relative; z-index: 10; border-bottom: 1px solid #ddd; --h: 65px; }
.breadcrumb{display: flex; align-items: center; justify-content: space-between; padding: 0 calc(50% - 600px); margin: 0;}
.breadcrumb .group{display: flex; border-left: 1px solid #ddd;}
.breadcrumb .box{width: 230px; flex: 1; position: relative; border-right: 1px solid #ddd;}
.breadcrumb .item{display: inline-flex; align-items: center; justify-content: space-between; width: 100%; height: var(--h); font-size: 1.8rem; font-weight: 500; color: #333; text-align: left; padding: 0 30px; }
.breadcrumb .item:after{content: ''; display: inline-block; width: 11px; height: 6px; background: #7c7c7c; mask: url('/resources/cbe/img/common/arrow_down_w.svg') no-repeat center}
.breadcrumb .item span{display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; flex: 1;}
.breadcrumb .depth{display: none; position: absolute; top: 100%; left: 0; width: 100%; background: #fff; border: 1px solid #ddd}
.breadcrumb .depth a{display: block; font-size: 1.6rem; font-weight: 500; color: #222; padding: 15px 30px;}
.breadcrumb .item.active:after{translate: rotate(180deg)}
.breadcrumb .active + .depth{border-top: 2px solid var(--main-blue);}
.breadcrumb .active + .depth a:hover{color: var(--main-blue);}
.breadcrumb [class^=btn]{width: 60px; line-height: var(--h); height: var(--h); text-align: center; border-right: 1px solid #ddd;}
.breadcrumb .btn-home{}
.breadcrumb .btn-print{}
.breadcrumb .btn-share{}

@media (max-width: 1024px){
	.breadcrumb .btn-home,
	.breadcrumb .btn-print{display: none;}
}
@media (max-width: 768px){
	#breadcrumb{--h: 50px}
	.breadcrumb .group:nth-child(1){width: calc(100% - 51px);}
	.breadcrumb.col2 .box{width: 50%;}
	.breadcrumb.col3 .box{width: 33.3333%;}
	.breadcrumb .item{padding: 0 10px;}
	.breadcrumb .item:after{}
	.breadcrumb .depth a{padding: 15px 10px;}
	.breadcrumb [class^=btn]{width: 50px;}
}
@media (max-width: 480px){
}

/* layout */
.sub-cont{padding-top: 80px; padding-bottom: 120px;}
.sub-cont .section + .section{margin-top: 8rem;}
.sub-cont .section .second-section + .second-section{margin-top: 4rem;}



/* tab */
.tab-tit > li{flex:1; min-width: 0;}
.tab-tit.len1 > li{width: 100%}
.tab-tit.len2 > li{width: 50%}
.tab-tit.len3 > li{width: 33.333333333%}
.tab-tit.len4 > li{width: 25%}
.tab-tit.len5 > li{width: 20%}
.tab-tit.len6 > li{width: 16.6666666667%}
.tab-tit.len7 > li{width: 25%}
.tab-tit.len8 > li{width: 25%}
.tab-tit.len9 > li{width: 20%}
.tab-tit.len10 > li{width: 20%}
.tab-tit.len11 > li{width: 16.6666666667%}
.tab-tit.len12 > li{width: 16.6666666667%}

@media (max-width: 1024px){
}
@media (max-width: 768px){
	.tab-tit > li{flex: none;}
	.tab-tit.len5 > li{width: 33.333333333%}
}
@media (max-width: 480px){
}

.tab-st1 .tab-tit{display: flex; align-items: center; flex-wrap: wrap; background: #f4f4f4; border-radius: 10px; margin-bottom: 60px;}
.tab-st1 .tab-tit a{display: flex; align-items: center; justify-content: center; height: 60px; font-size: 1.8rem; font-weight: 500; color: #666; text-align: center; border-radius: 10px; padding: 0 5px;}
.tab-st1 .tab-tit a.active{color: #fff; font-weight: 700; background: var(--main-blue);}

/* table */
.type_scroll{overflow-x: auto;}
.type_scroll table{min-width: 768px}
.tbl-st1{word-break: break-all; position: relative; border-top: 3px solid #0F0F70; width: 100%;}
.tbl-st1 th,
.tbl-st1 td{border: 1px solid #ddd; padding: 1em; font-size: 1.8rem; text-align: center; line-height: 1.5em; vertical-align: middle; word-break: normal;}
.tbl-st1 th:first-child,
.tbl-st1 td:first-child{border-left: 0;}
.tbl-st1 th:last-child,
.tbl-st1 td:last-child{border-right: 0;}
.tbl-st1 th{font-weight: 600; color: #333; background: #F4F9FF;}
.tbl-st1 td{color: #666;}
.tbl-st1 .text-left{padding: 1em 4rem;}
@media (max-width: 1024px){
	.tbl-st1 .text-left{padding: 1em;}
}
.tbl-st1.type_black { border-top: 3px solid #000; }
.tbl-st1.type_black th {background: #f4f4f4; }


/* text */
.sub-title{font-size: 3.2rem; font-weight: 700; color: #333; text-align: center; margin-bottom: 50px;}
.h4{font-size: 2.8rem; font-weight: 700; color: #0F0F70; line-height: 1.4; margin-bottom: 1em;}
.h4 span{font-weight: 500;}
.h5{position: relative; font-size: 2.2rem;; font-weight: 600; color: #333; line-height: 1.4; padding-left: 1.5rem; margin-bottom: 1em;}
.h5:before{content: '·'; position: absolute; top: 0; left: 0;}
.h6 { font-size: 2.2rem; font-weight: 700; color: #333; line-height: 1.4; margin-bottom: 10px;}
.txt-st1{font-size: 1.8rem; color: #666; line-height: 2.6rem;}
.txt-st1 strong{font-weight: 600; color: #333;}
.txt-st2{font-size: 2rem;font-weight: 700; color: #333;}
.txt-min{font-size: 1.5rem; font-weight: 500; color: #999; line-height: 2em;}
.text-left{text-align: left !important;}
.text-center{text-align: center !important;}
.text-right{text-align: right !important;}
.fw-500 { font-weight: 500 !important;}
.fw-700 { font-weight: 700 !important;}


/* background & color */
.bg-black{background: #000 !important;}
.bg-white{background: #fff !important;}
.bg-gray{background: #f4f4f4 !important;}
.color-0{color: #000;}
.color-1{color: #111;}
.color-2{color: #222;}
.color-3{color: #333;}
.color-6{color: #666;}
.color-f{color: #fff;}


/* bullet */
[class*=bull]{position: relative; padding-left: 1.5rem;}
[class*=bull] + [class*=bull]{margin-top: 5px;}
.bull-dot:before{content: '·'; position: absolute; top: 0; left: 0;}
.bull-dash:before{content: '-'; position: absolute; top: 0; left: 0;}

.list-decimal{ list-style: decimal; padding-left: 21px;}
.list-decimal >li{ list-style: decimal;}
.list-decimal >li + li{ margin-top: 5px; }

.list-dot li{position: relative; padding-left: 1.5rem;}
.list-dot li + li{margin-top: 0.5rem;}
.list-dot li:before{content: '·'; position: absolute; top: 0; left: 0;}


/* box */
.content-type1 { border-top: 2px solid #000; }
.content-type1 li { padding: 60px 0; border-bottom: 1px solid #ddd; }

.content-type2 > li { display: flex; align-items: flex-start; flex-wrap: wrap; }
.content-type2 > li + li { margin-top: 80px; }
.content-type2 .tit { width: 350px; }
.content-type2 .cont { width: 100%; flex: 1; }

@media (max-width: 1024px){
	.content-type2 .tit{width: 100%; margin-bottom: 1em;}
	.content-type2 .tit br{display: none;}
}
@media (max-width: 580px){
}

/* button */
[class*=btn-wrap]{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 8rem;}
.btn-wrap-left{justify-content: flex-start;}
.btn-wrap-right{justify-content: flex-end;}
[class*=btn-wrap] [class*=btn]{display: inline-flex; align-items: center; justify-content: center; font-size: 1.6rem; text-align: center; font-weight: 600; border-radius: 5px; height: 4rem; padding: 0 2rem;}
[class*=btn-wrap] [class*=sm]{width: 10rem; height: 4rem; font-size: 1.4rem;}
[class*=btn-wrap] [class*=md]{width: 20rem; height: 6rem; font-size: 1.8rem;}
[class*=btn-wrap] [class*=black]{color: #fff; background: #333;}
[class*=btn-wrap] [class*=white]{color: #666; background: #fff; border: 1px solid #ddd}
[class*=btn-wrap] [class*=gray]{color: #fff; background: #666;}



/* 학부장 인사말 */
.greeting-box{position: relative;background: url('/resources/cbe/img/sub/sub01-01_01.jpg') no-repeat left center / cover; padding: 7rem 14rem; margin-bottom: 50px;}
.greeting-box span{display: block; font-size: 2.2rem; font-weight: 600; color: #2D487D;}
.greeting-box p{font-size: 3rem; color: #222; margin-top: 15px; line-height: 4rem;}
.greeting-box p strong{font-weight: 700;}
.greeting-box img{width: 240px; position: absolute;bottom: 0;right: 0;}
@media (max-width: 1024px){
	.greeting-box{padding: 7rem 300px 7rem 7rem;}
	.greeting-box p br{display: none;}
}
@media (max-width: 768px){
	.greeting-box{padding: 7rem 7rem 300px;}
}
@media (max-width: 480px){
	.greeting-box{padding: 7rem 4rem 300px;}
}

.greeting-sign{text-align: right; margin-top: 50px;}
.greeting-sign strong{display: inline-block; font-size: 1.6rem; font-weight: 500; color: #333; margin-right: 15px;}

.greeting-info::before{content: ''; display: block; width: 16px; border-top: 3px solid #2D487D; }
.greeting-name{font-size: 1.8rem; font-weight: 500; color: #333; }
.greeting-name strong{font-size: 2.7rem; letter-spacing: -0.4px; margin-left: 15px;}

/* 학생회장 인사말 */
.greeting-block{display: flex;}
.greeting-block .greeting-con{flex: 1; min-width: 0;padding-right: 50px;}
.greeting-block .greeting-img{flex: none; width: 240px;}
.greeting-block .greeting-img img{width: 100%;}
.greeting-tit{font-size: 2.4rem; line-height: 3.3rem; font-weight: 600;}
@media (max-width: 768px){
	.greeting-block{display: block;}
	.greeting-block .greeting-con{padding-right: 0;}
	.greeting-block .greeting-img{width: 100%}
}

/* 학부 역사 */
.history-wrap{display: flex; align-items: flex-start; flex-wrap: wrap;}
.history-wrap .h4{width: 350px;}
.history-wrap >*:nth-child(2){width: 100%; flex: 1;}
.history-wrap .list{border-top: 3px solid #000;}
.history-wrap .list li{display: flex; align-items: center; gap: 4rem; border-bottom: 1px solid #ddd; padding: 3rem 0;}
.history-wrap .list img{display: block; aspect-ratio: 78 / 47;}
.history-wrap .list .cont{width: 100%; flex: 1;}
.history-wrap .list .date{font-size: 2rem; font-weight: 800; color: #333; margin-bottom: 0.5em;}
.history-wrap .list .desc{font-size: 1.6rem; font-weight: 500; color: #666; line-height: 2.8rem;}

@media (max-width: 1024px){
	.history-wrap .h4{width: 100%; margin-bottom: 1em;}
	.history-wrap .h4 br{display: none;}
}
@media (max-width: 580px){
	.history-wrap .list li{flex-direction: column;}
}


/* 소개 및 이용안내 */
.faccility-img{display: flex; align-items: stretch; flex-wrap: wrap; gap: 20px;}
.faccility-img >*{width: calc(50% - 10px)}
.faccility-slider .swiper-slide img{width: 100%;}
.faccility-slider .etc{position: absolute; bottom: 0; left: 0; z-index: 1; width: 100%; min-height: 64px; background: rgba(0, 0, 0, 0.7); display: flex; align-items: center;}
.faccility-slider .desc{font-size: 1.8rem;font-weight: 600;color: #fff;padding: 0 1.7em;width: 100%;flex: 1;}
.faccility-slider [class^=swiper-button]{width: 64px;height: 64px;position: static;margin: 0;color: #fff;border-left: 1px solid #ffffff80;}
.faccility-slider [class^=swiper-button]:after{font-size: 14px;}
.faccility-slider .swiper-button-prev{}
.faccility-slider .swiper-button-next{}
.faccility-grid{display: flex; flex-wrap: wrap; gap: 10px;}
.faccility-grid >*{width: calc(50% - 5px);}
.faccility-grid.grid-col{flex-direction: column;}
.faccility-grid.grid-col >*{width: 100%;}
@media (max-width: 1024px){
	.faccility-img >*{width: 100%;}
}

/* 교육 목표 */
.border-box-list {display: flex; flex-wrap: wrap; align-items: stretch;gap: 20px;}
.border-box-list >li {border: 1px solid #ddd;padding: 15px;display: flex;flex-direction: column;justify-content: center;align-items: center; flex-grow: 1;text-align: center;}
@media (max-width: 768px) {
	.border-box-list >li { flex: auto }
}

/* 연구비전 */
.vision-wrap .line-bottom{padding-bottom: 6rem; border-bottom: 1px solid #ddd;}
.vision-wrap .vision-list{font-size: 2rem;font-weight: 700; color: #333;}
.vision-wrap .vision-list li + li{margin-top: 25px;}
.vision-wrap .vision-txt{margin-bottom: 0.5em;}

/* 연구분야 */
.research-wrap .tbl-st1 td { font-size: 1.6rem; padding: 3rem 1em 1em;}
.research-wrap .btn-dtl { position: relative; font-size: 1.4rem; font-weight: 500; color: #fff; padding: 4px 28px 4px 14px; border-radius: 5px; background-color: #333; margin-top: 1.8rem; display: inline-block;}
.research-wrap .btn-dtl:before { content: ""; display: block; position: absolute; top: 50%; right: 14px; width: 8px; height: 8px; transform: translateY(-50%); background: no-repeat 50% 50%; background-size: 100% auto; background-image: url("/resources/cbe/img/common/ico-detail.svg"); }

/* 발전기금 */
.download-wrap .sec-tit { font-size: 2rem; font-weight: 700; color: #333; margin-bottom: 15px; }
.download-wrap .box { padding: 2rem 3rem; font-size: 2rem; font-weight: 700; color: #333; }
.download-wrap .download-list li + li{margin-top: 8px;}
.download-wrap .download-link { position: relative; padding-left: 3.2rem; font-size: 1.8rem; color: #666; line-height: 2.6rem; font-weight: 400; text-decoration: underline;}
.download-wrap .download-link::before { content: ""; display: block; position: absolute; left: 0; top: 50%; width: 2rem; height: 2rem; transform: translateY(-50%); background: no-repeat 50% 50%; background-size: 100% auto; background-image: url("/resources/cbe/img/sub/ic_download.svg"); }
.dvf-wrap .dvf-box { display: flex; gap: 27px; }
.dvf-wrap .dvf-item { flex: 1; min-width: 0; }
.dvf-wrap .dvf-info { margin-top: 6px; }
.dvf-wrap .dvf-info .dvf-txt { margin-top: 6px; }
@media (max-width: 768px) {
	.dvf-wrap .dvf-box {flex-direction: column;}
}
#select-orderName{max-width: 225px;}

#map{width: 100%; height: 676px;}






