@charset "utf-8";
@import url('board.css');

/* reset css*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio, video, input, button {margin:0; padding:0; border:0; font-size:100%; font-family:'Noto Sans KR', sans-serif; vertical-align:baseline}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
body {line-height:1; letter-spacing:-0.45px; word-break:keep-all}
ol, ul, li {list-style:none}
blockquote, q {quotes:none}
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none}
table {border-collapse:collapse; border-spacing:0; table-layout:fixed}
caption, legend {overflow:hidden; text-indent:-9999px; height:1px; padding:0 !important}
html {font-family:sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%}
a {background-color:transparent; color:inherit; text-decoration:none}
a:active, a:hover {outline:0; text-decoration:none; text-underline-position:under}
p {outline:none}
img {border:0}
button {cursor:pointer; background:none}
select {font:inherit}
select:hover {cursor:pointer}
textarea {padding:0}
input, select {vertical-align:top; margin-top:0 !important}
.bx-wrapper {box-shadow:none; border:none; background:none; margin:0}
.bx-wrapper .bx-controls-direction a {text-indent:0 !important; color:rgba(255,255,255,0) !important}

/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:999999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:14px; font-weight:bold; color:#fff; line-height:1; text-align:center; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {margin-top:0; height:auto; padding:10px 0px}


/* common */
.text-indent {text-indent:-9999px; display:inline-block}
.auto {margin:0 auto}
.width100 {width:100%}
.img-responsive {display:block; max-width:100%; height:auto}
.show-768 {display:none}
.ToolTip {display:none; opacity:0}
.ZoomIcon, .ZoomIcon0, .ZoomIcon1, .ZoomIcon2, .ZoomIcon3, .ZoomIcon4, .ZoomIcon5, .ZoomIcon6, .ZoomIcon7, .ZoomIcon8, .ZoomIcon9, .ZoomIcon10 {display:none}
.bZoomIcon, .bZoomIcon0, .bZoomIcon1, .bZoomIcon2, .bZoomIcon3, .bZoomIcon4, .bZoomIcon5, .bZoomIcon6, .bZoomIcon7, .bZoomIcon8, .bZoomIcon9, .bZoomIcon10 {display:none}
.tableResponsive {position:relative}
.flex {display:flex}
.mt5 {margin-top:5px !important}
.mt10 {margin-top:10px !important}
.mt20 {margin-top:20px !important}
.mt30 {margin-top:30px !important}
.mt40 {margin-top:40px !important}
.mt50 {margin-top:50px !important}
.mb20 {margin-bottom:20px !important}
.ml20 {margin-left:20px}
.nList {margin-left:20px}
.nList > li {list-style:decimal}

.headerTop > .inner, #HeaderWrap > section, .allMenu > .inner, #mainTop > section, .mainConWrap > .inner, footer > .inner {max-width:1280px; margin:0 auto; padding:0 15px; box-sizing:border-box}

/* header */
#HeaderWrap .headerTop {background:#EEEEEE}
#HeaderWrap .headerTop > .inner {display:flex; align-items:center; justify-content:flex-start; height:30px}
#HeaderWrap .headerTopUtil {font-size:12px; font-weight:400; color:#888888; padding:0 15px; border-left:solid 1px #ddd}
#HeaderWrap .headerTopUtil.br {border-right:solid 1px #ddd}
#HeaderWrap > section {display:flex; align-items:center; justify-content:space-between}
#HeaderWrap > section > h1 {margin:0; margin-right:150px; flex-shrink:0}
#HeaderWrap > section > h1 > a {display:block}
#HeaderWrap > section > h1 > a > img {width:100%; height:36px}
.gnb {display:flex; align-items:center; justify-content:space-between; width:100%; margin:0}
.gnb > li {position:relative}
.gnb > li > a {font-size:1.125rem; font-weight:400; padding:5px 10px}
.gnb > li > a:hover, .gnb > li > a:focus {font-weight:600; color:#4971B5}
.gnb > li.active > a, .gnb > li.active > a:hover, .gnb > li.active > a:focus {font-weight:600; color:#4971B5}
.gnb > li > .dep02 {display:none; position:absolute; top:40px; left:0; z-index:999; padding:5px 0; background:#4971B5; min-width:max-content; font-size:1rem}
.gnb > li > .dep02 > li > a {display:block; padding:5px 15px; color:#fff; background-image:linear-gradient(to right, rgba(0,0,0,0) 50%, rgba(234,234,234,1) 50%); background-position:0 0; background-size:200% auto; transition:.3s}
.gnb > li > .dep02 > li > a:hover {color:#000; background-position:-100% 0; text-decoration:none}
.headerRight {display:flex; align-items:center; flex-shrink:0; margin-left:70px}
.headerRight a.menuLog {display:flex; align-items:center; justify-content:center; width:80px; height:80px; background:#24292C; color:#fff; font-size:1.625rem; transition:.3s}
.headerRight a.menuLog:hover, .headerRight a.menuLog:focus {background:#000}
.headerRight a.menuSite {display:flex; align-items:center; justify-content:center; width:80px; height:80px; background:#4971B5; color:#fff; font-size:1.625rem; transition:.3s}
.headerRight a.menuSite:hover, .headerRight a.menuSite:focus {background:#999}

/* sitemap & mobile */
.allMenu {opacity:0; visibility:hidden; position:fixed; width:100%; height:60%; background:#fff; top:0; left:0; z-index:9999; transition:.3s; box-shadow: 0 0 25px rgba(0,0,0,0.5)}
.allMenu.active {opacity:1; visibility:visible}
.allMenuTop {display:flex; align-items:center; justify-content:flex-end}
.allMenuTop .menuClose {display:flex; align-items:center; justify-content:center; width:95px; height:95px; color:#000; font-size:2.875rem}
.allMenuMiddle {margin-top:50px}
.allMenuGnb {display:flex; flex-wrap:wrap}
.allMenuGnb > li {flex:auto; margin-right:70px; margin-bottom:50px}
.allMenuGnb > li > a {display:block; font-size:1.625rem; font-weight:600; padding-bottom:30px; border-bottom:1px solid #ddd; box-sizing:border-box; margin-bottom:30px}
.allMenuGnb > li > .dep02 {font-size:1.125rem}
.allMenuGnb > li > .dep02 > li {margin-bottom:30px}
.allMenuGnb > li > .dep02 > li > a {transition:.3s}
.allMenuGnb > li > .dep02 > li > a:hover, .allMenuGnb > li > .dep02 > li > a:focus {font-weight:500}

/* mainTop */
#mainTop {background:url('../images/mainWrap_bg.jpg') top center no-repeat}
#mainTop > section > .inner {padding:50px 0; display:flex; justify-content:space-between}
.mainTopLeft {width:660px; flex-shrink:0; position:relative; margin-right:60px}
.mainTopLeft .swiper-button-prev {left:-35px}
.mainTopLeft .swiper-button-next {right:-35px}
.mainTopLeft .swiper-button-prev, .mainTopLeft .swiper-button-next {color:#888888; opacity:0.6; transition:.3s}
.mainTopLeft .swiper-button-prev:after, .mainTopLeft .swiper-button-next:after {font-family:'Font Awesome 6 Pro'; font-size:2.8rem; font-weight:300}
.mainTopLeft .swiper-button-prev:after {content:'\f053'}
.mainTopLeft .swiper-button-next:after {content:'\f054'}
.mainTopLeft .swiper-button-prev:hover, .mainTopLeft .swiper-button-next:hover {opacity:1}
.mainTopLeft .swiper-slide {border-radius:15px; overflow:hidden}
.mainTopLeft .swiper-slide .popItem {max-width:330px; margin:0}
.mainTopLeft .swiper-slide .popItem img:hover {-webkit-transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); transform:scale(1.05,1.05)}
.mainTopRight {width:530px; position:relative}
.mainTopRight .mainTopRightTit {margin-bottom:20px; display:flex; align-items:center; justify-content:space-between}
.mainTopRight .mainTopRightTit > h3 {font-size:35px; font-weight:600; color:#333; letter-spacing:-2px}
.mainTopRight .mainTopRightTit > h3 > span {color:#4971B5}
.mainTopRight .mainTopRightTit > a > i {font-size:35px; font-weight:200; transition:all 0.2s ease-in-out}
.mainTopRight .mainTopRightTit > a > i:hover {webkit-transform: rotate(180deg); transform: rotate(180deg)}
.mainTopRight .mainSwiper {width:100%}
.swiper-pagination-bullet {background:#fff}
.swiper-pagination {margin-bottom:10px}
.mainSwiper .swiper-pagination-bullet-active {background:#fff; opacity:1}
.swiper-slide img  {border-radius:15px; transition: all 0.2s ease-in-out}


.mainConWrap {max-width:100%; background:#fff}
/* noticeWrap */
.noticeTit {margin-bottom:30px; display:flex; align-items:center; justify-content:space-between}
.noticeWrap .noticeTit > h3 {font-size:35px; font-weight:600; color:#333; letter-spacing:-2px}
.noticeWrap .noticeTit > h3 > span {color:#4971B5}
.noticeWrap .noticeTit > a > i {font-size:35px; font-weight:200; transition: all 0.2s ease-in-out}
.noticeWrap .noticeTit > a > i:hover {webkit-transform: rotate(180deg); transform: rotate(180deg)}
.noticeWrap .notiList > li {background:url('/dept1/common/images/dotIcon.png') 24px 29px no-repeat; list-style:none; padding:0 20px 0 35px; border-bottom:solid 1px #ddd}
.noticeWrap .notiList > li > a {display:flex; align-items:center; justify-content:space-between; padding:20px 0}
.notiList > li > a:hover .notiTit, .notiList > li > a:hover .notiDate {color:#4971B5}
.notiTit {width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:18px; font-weight:500; color:#555}
.notiDate {flex-shrink:0; margin-left:20px; font-size:15px; font-weight:300; color:#666}
.noticeWrap .notiList > li.active {background:linear-gradient(to right, #4971B5 , #47BA9A); border-bottom:none; padding:0; transition:.3s}
.noticeWrap .notiList > li.active:hover {background:linear-gradient(to right, #325ca3, #259f7d); transition:.3s}
.noticeWrap .notiList > li.active > a {background:url('/site/biocoss/images/TopIcon.png') 20px 14px no-repeat; display:flex; align-items:center; justify-content:space-between; padding:20px; color:#fff}
.noticeWrap .notiList > li.active > a > .notiTit {width:100%; overflow:hidden; margin-left:43px; white-space:nowrap; text-overflow:ellipsis; font-size:20px; font-weight:500; color:#fff}
.noticeWrap .notiList > li.active > a > .notiDate {flex-shrink:0; margin-left:20px; font-size:15px; font-weight:300; color:#fff}
/* contentsWrap */
.contentsWrap {margin-top:70px; display:flex; justify-content:space-between}
.contentsWrap .quick {text-align:center; flex-shrink:0; margin-left:90px; margin-top:38px;}
.contentsWrap .quick > a {display:block; padding:30px 40px; margin-top:18px; color:#fff; font-size:18px;transition: all 0.2s ease-in-out}
.contentsWrap .quick > a.mainCon4_1_btn {background:#4971B5}
.contentsWrap .quick > a.mainCon4_2_btn {background:#47B89A}
.contentsWrap .quick > a.mainCon4_3_btn {background:#3D3D3D}
.contentsWrap .quick > a > h2 {margin-top:20px}
.contentsWrap .quick > a > img {width:110px; margin:0 auto; transition:all 0.2s ease-in-out}
.contentsWrap .quick > a:hover {box-shadow:0 0 25px rgba(0,0,0,0.25)}
.contentsWrap .quick > a:hover img {transform:scale(1.1,1.1);}

/* footer */
footer {border-top:1px solid #ddd; background:#F2F2F2; padding:30px 0; margin-top:100px}
footer > .inner {margin:0 auto}
.footerTop {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap}
.footerTopLeft {display:flex; align-items:center}
.footerTopLeft > li > a {font-size:1rem; font-weight:400; color:#333; display:flex; align-items:center}
.footerTopLeft > li > a:after {content:''; display:inline-block; width:3px; height:3px; background:#959595; border-radius:100%; margin:0 20px}
.footerTopLeft > li:last-child > a:after {display:none}
.footerTopLeft > li > a.info {color:#FF0000}
.footIcon {margin-right:5px}
.blank {color:#0871CD; font-size:0.875rem; margin-left:5px}

.gositeWrap {display:flex}
.goSite {scrollbar-3dLight-Color: #efefef; scrollbar-arrow-color: #545557; scrollbar-base-color: #efefef; scrollbar-Face-Color: #545557; scrollbar-Track-Color: #262727; scrollbar-DarkShadow-Color: #efefef; scrollbar-Highlight-Color: #efefef; scrollbar-Shadow-Color: #545557}
.goSite::-webkit-scrollbar {width:13px}
.goSite::-webkit-scrollbar-track {background:#545557}
.goSite::-webkit-scrollbar-thumb {background:#262727}
.go_site1, .go_site2 {position:relative}
.go_site2 {margin-left:15px}
.go_site1 h3 a, .go_site2 h3 a {display:flex; align-items:center; border:1px solid #ccc; background:#fff; color:#333; font-size:0.9375rem; padding:0 20px; box-sizing:border-box; height:46px}
.go_site1 h3 a > i, .go_site2 h3 a > i {margin-top:2px; margin-left:10px}
.go_site1.active h3 a > i:before, .go_site2.active h3 a > i:before {content:"\f078"}
.go_site1_view, .go_site2_view {display:none; width:185px; height:200px; position:absolute; right:0px; bottom:35px; background:#fff; border:2px solid #f0f1f3; box-sizing:border-box; overflow-y:scroll; padding:10px 0 0 10px; box-sizing:border-box; letter-spacing:-0.5px}
.go_site2_view {width:200px}
.go_site1_view li, .go_site2_view li {font-size:0.8125rem !important; line-height:20px; padding-left:10px}
.go_site1_view li a, .go_site2_view li a {color:#333}
.go_site1_view li a:hover, .go_site2_view li a:hover {color:#0871CD}
.footerBottom {font-size:0.9375rem; font-weight:400; color:#333; letter-spacing:-0.75px; word-break:keep-all; position:relative}
.footerBottom address {font-style:normal; margin:20px 0 10px 0; line-height:22px}
.footerBottom address span {margin:0 20px}

/* subVisual */
#subVisual > section {height:250px}
.sv01 {background:url(../images/subVisual.jpg) center center no-repeat}

/* subContainer */
#subContainer {margin-top:50px}
#subContainer > .inner {max-width:1280px; margin:0 auto; padding:0 15px; box-sizing:border-box; display:flex}
#bodyCon {width:100%}
.leftCont {flex-shrink:0; width:20%; margin-right:50px; padding-bottom:100px}
.leftCont > h3 {display:flex; align-items:center; justify-content:center; width:100%; height:150px; color:#fff; background:#4971B5; font-size:2.375rem; font-weight:700; text-align:center; margin:0}
.leftCont .leftmenu {margin:0; padding:0}
.leftCont .leftmenu li {list-style:none}
.leftCont .leftmenu > li > a {display:flex; align-items:center; justify-content:space-between; height:60px; border-bottom:1px solid #dbdcde; padding:0 20px; color:#252525; font-weight:500; font-size:1.125rem; transition:.3s}
.leftCont .leftmenu > li.active > a, .leftCont .leftmenu > li > a:hover {background:#333; font-weight:500; color:#fff}
.leftCont .leftmenu > li > .depth2 {border-bottom:1px solid #dbdcde; background:#f7f7f7; padding:10px 0; display:none}
.leftCont .leftmenu > li > .depth2 > ul > li.active > a, .leftCont .leftmenu > li > .depth2 > ul > li > a:hover {font-weight:600}
.leftCont .leftmenu > li > .depth2 > ul {margin:0; padding:0}
.leftCont .leftmenu > li > .depth2 > ul > li a {display:flex; align-items:center; color:#252525; font-size:1rem; font-weight:400; height:30px; padding:0 20px}
.rightCont {padding-bottom:100px; overflow:hidden}
.rightCont > h4 {display:flex; align-items:center; height:150px; font-size:2.375rem; font-weight:600; padding:0; margin:0; position:relative; margin-bottom:10px; border-bottom:solid 1px #eee}
.rightCont > h4 .location {font-size:0.9375rem; position:absolute; top:30px; right:0; overflow:hidden}
.rightCont > h4 .location li {list-style:none; float:left; background:url('/dept1/common/images/location_ar.gif') right center no-repeat; padding-right:15px; margin-right:10px; color:#666}
.rightCont > h4 .location li.home {color:#333}
.rightCont > h4 .location li.home > i {vertical-align:baseline}
.rightCont > h4 .location li.home > i:before {content:"\f015"; font-family:"Font Awesome 6 Pro"; font-weight:900; font-size:initial}
.rightCont > h4 .location li.end {background:none; padding-right:0; margin-right:0}
.rightCont p {line-height:1.5rem}
.mColor {color:#4971B5}

.con h5, .con > .col-sm-12 h5, .con .h5 {font-size:1.5rem; font-weight:600; margin:40px 0 15px 0}
.con > h5:before, .con > .col-sm-12 h5:before, .con .h5:before {content:""; width:18px; height:5px; display:block; background:#4971B5; margin-bottom:2px}
.con h6 {font-size:1.15rem; font-weight:600; margin-top:20px; margin-bottom:10px}
.box {border:1px solid #dbdcde; background:#fcfcfc; padding:20px}
.linkStyle {text-decoration:revert; color:#1b7acb}

/* boxLine */
.boxLine {background:url('/dept1/common/images/boxLineBg.png') repeat; padding:5px;margin-bottom:20px}
.boxLine .inner {background:#fff; text-align:center; padding:20px; font-size:1.125rem; font-weight:500}
.boxLine .inner .txt1 {font-size:1.25rem}
.boxLine .inner .txt2 {font-size:1rem; font-weight:300}
.boxLine .location {padding:0 !important}

/* tabStyle */
.tabStyle {overflow:hidden; border-top:1px solid #d8d9db; margin:0 0 20px 0; list-style:none; padding:0}
.tabStyle li:first-child a {border-left:1px solid #d8d9db}
.tabStyle li a {display:block; float:left; background:#eff3f4; border-right:1px solid #d8d9db; border-bottom:1px solid #d8d9db; box-sizing:border-box; padding:16px 0; text-align:center; font-size:1rem; color:#636363; font-weight:700}
.tabStyle li.on a, .tabStyle li a:hover {color:#fff}
.tab2 li a {width:50%}
.tab3 li a {width:33.3%}
.tab4 li a {width:25%}
.tab5 li a {width:20%}
.tab5 li:nth-child(6) a {border-left:1px solid #d8d9db}
.tab5 li:nth-child(11) a {border-left:1px solid #d8d9db}
.tab6 li a {width:16.66%}
.tab6 li:nth-child(7) a {border-left:1px solid #d8d9db}
.tab7 li a {width:14.28%; font-size:12px !important}
.tab8 li a {width:12.5%; font-size:12px !important}
.nav>li>a {position:relative; display:block; padding:10px 15px}
.nav-tabs>li {float:left; margin-bottom:-1px}
.nav-tabs>li>a {margin-right:2px; line-height:1.42857143; border:1px solid transparent; border-radius:4px 4px 0 0; font-size:18px; padding:10px 20px}
.nav-tabs>li>a.active, .nav-tabs>li>a.active:hover, .nav-tabs>li>a.active:focus {color:#555; cursor:default; background-color:#fff; border:1px solid #ddd; border-bottom-color:transparent}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {color:#fff; font-weight:600; background-color:#333333}
.roadTab>li:nth-child(1).active>a, .roadTab>li:nth-child(1).active>a:focus, .roadTab>li:nth-child(1).active>a:hover {background-color:#4971b5}
.roadTab>li:nth-child(2).active>a, .roadTab>li:nth-child(2).active>a:focus, .roadTab>li:nth-child(2).active>a:hover {background-color:#c44c00}
.roadTab>li:nth-child(3).active>a, .roadTab>li:nth-child(3).active>a:focus, .roadTab>li:nth-child(3).active>a:hover {background-color:#177792}
.roadTab>li:nth-child(4).active>a, .roadTab>li:nth-child(4).active>a:focus, .roadTab>li:nth-child(4).active>a:hover {background-color:#147258}

/* listStyle */
.bList {margin:0; padding:0; margin-top:5px; text-align:left}
.bList > li {background:url('/dept1/common/images/barIcon.png') 4px 10px no-repeat; list-style:none; padding:0 0 0 17px; margin-bottom:5px; font-size:1rem; line-height:1.3rem}
.dList {margin:0; padding:0; margin-top:5px; text-align:left}
.dList > li {background:url('/dept1/common/images/dotIcon.png') 4px 9px no-repeat; list-style:none; padding:0 0 0 17px; margin-bottom:5px; font-size:1rem; line-height:1.3rem}
.listStyle {overflow:hidden}
.listStyle.list02 li {width:50%}
.listStyle.list03 li {width:33.33%}
.listStyle.list04 li {width:25%}
.listStyle.list05 li {width:20%}
.listStyle.list03 li:nth-child(4), .listStyle.list03 li:nth-child(7), .listStyle.list03 li:nth-child(10), .listStyle.list03 li:nth-child(13), .listStyle.list03 li:nth-child(16), .listStyle.list03 li:nth-child(19), .listStyle.list03 li:nth-child(22), .listStyle.list04 li:nth-child(5), .listStyle.list04 li:nth-child(9), .listStyle.list04 li:nth-child(13), .listStyle.list04 li:nth-child(17), .listStyle.list04 li:nth-child(21) {clear:both}
.listStyle li {float:left; text-align:center; padding:1% 1% 1% 0.5%; margin-bottom:2%}
.listStyle li.text-left {text-align:left !important}
.listStyle li img {margin:0 auto}
.li0{list-style-type: decimal;}
.li0 li {margin-bottom: 3px;margin-left: -25px;}
.lin li {margin-bottom: 3px;margin-left: -39px;list-style: none}


.tbl_skin1 {width:100%; border-top:2px solid #999999; background-color:#ffffff; text-align:center; line-height:1.5rem}
.tbl_skin1 thead th {padding:10px; border-bottom:1px solid #cccccc; border-bottom:1px solid #e6e6e6; border-right:1px solid #e6e6e6;color:#555555;background-color:#f8f8f8; text-align:center; vertical-align:middle}
.tbl_skin1 tbody th {padding:10px; border-right:1px solid #e6e6e6; border-bottom:1px solid #ebebeb; background-color:#f8f8f8; text-align:center; vertical-align:middle}
.tbl_skin1 tbody td {padding:10px; border-right:1px solid #e6e6e6; border-bottom:1px solid #ebebeb; vertical-align:middle}
.tbl_skin1 tfoot th {padding:10px; border-bottom:1px solid #cccccc; border-bottom:1px solid #e6e6e6; border-right:1px solid #e6e6e6;color:#555555;background-color:#f8f8f8}
.tbl_skin1 th.end {border-right:none}
.tbl_skin1 td.end {border-right:none !important}
.tbl_skin1 tr th:last-child {border-right:none}
.tbl_skin1 tr td:last-child {border-right:none}
.tbl_skin1 .tl {text-align:left}
.tbl_skin1 .cen {text-align:center}
.tbl_skin1 .ri {border-right:1px solid #e6e6e6 !important;}
.tbl_skin1 .bl {border-left:1px solid #e6e6e6 !important;}
.tbl_skin1 .bo {border-bottom:1px solid #cccccc;}
.tbl_skin1 .thc1 {background-color:#4971b5; color:#fff; font-size:20px}
.tbl_skin1 .thc1-2 {background-color:#eff5ff}
.tbl_skin1 .thc2 {background-color:#c44c00; color:#fff; font-size:20px}
.tbl_skin1 .thc2-2 {background-color:#fff2e9}
.thc2-3 {color:#c44c00}
.tbl_skin1 .thc3 {background-color:#177792; color:#fff; font-size:20px}
.tbl_skin1 .thc3-2 {background-color:#e6f7fb}
.thc3-3 {color:#177792}
.tbl_skin1 .thc4 {background-color:#147258; color:#fff; font-size:20px}
.tbl_skin1 .thc4-2 {background-color:#eaf7f4}
.thc4-3 {color:#147258}

/* 교수소개 */
.proBox {background:url('/dept1/common/images/boxLineBg.png') repeat; padding:5px; position:relative}
.proBox .inner {background:#fff; padding:30px; overflow:hidden; min-height:230px}
.pro_left {float:left; width:150px;}
.pro_left > p > img {width:100%; border-radius:10px}
.pro_right {float:right;width: calc(100% - 175px); box-sizing:border-box; word-break:break-all}
.pro_right dl {margin:0}
.pro_right dl dt {font-size:1.3rem; color:#000; margin-bottom:10px}
.pro_right dl dd {color:#555; letter-spacing:-0.75px; line-height:1.5rem; font-size:1rem}
.pro_right dl dd a {color:#555}

/* 행사일정 서브 */
.calender {display:table}
.calender .cal .c_header {padding:20px 0;text-align:center}
.calender .cal .c_header .c_month {font-size:24px;font-weight:700;padding:0 15px}
.calender .cal {overflow:hidden;}
.calender .cal table {width:100%; table-layout:fixed; border:#d4d4d4 1px solid; line-height:120%;font-size:12px}
.calender .cal thead th {text-align:center; height:23px; color:#7a7d8c; border-right:#eaedef 1px solid}
.calender .cal th {border:1px solid #dcdcdc;background:#f5f5f5;text-align:center;padding:3px}
.calender .cal tbody td {border:solid 1px #dcdcdc;text-align:left;vertical-align:top;padding:5px;color:#898989;min-height:80px;height:80px;}
.calender .cal tbody td a.hasevent{font-weight:bold;color:#4fb4e7}
.calender .cal tbody td.c_today {background:#ffffd9;}
.calender .cal tbody td .cld_day{font-weight:bold;color:#000}
.calender .cal tbody td .s_day{color:#f44e4e}
.calender .cal tbody td .st_day{color:#4fb4e7}
.calender .cal tbody td .cld_subject {display:inline-block;overflow:hidden;width:;margin-left:0;font-size:12px;color:#00c;vertical-align:top;white-space:;text-overflow:ellipsis; margin:5px 0}
.calender .cal tfoot td {border:solid 1px #FFF;text-align:center;height:50px}

/* 행사일정 메인 */
.calender.mainCalender .cal .c_header {padding:0; text-align:left; display:flex; align-items:center}
.calender.mainCalender .cal .c_header > a > i {font-size:36px; color:#ddd}
.calender.mainCalender .cal .c_header .c_month {font-size:35px; font-weight:400; color:#333; padding:0 20px; margin-top:-8px}
.calender.mainCalender .cal .c_header .c_month .highlight {color:#4971B5; font-weight:700}
.calender.mainCalender .cal table {margin-top:20px; line-height:110%;font-size:16px; border:none}
.calender.mainCalender .cal table th {background:#fff; padding:10px}
.calender.mainCalender .cal table .bl0 {border-left:0}
.calender.mainCalender .cal table .br0 {border-right:0}
.calender.mainCalender .cal tbody td {padding:10px; min-height:auto; height:auto}
.calender.mainCalender .cal tbody td .cld_subject_wrap {height:85px; overflow-y:auto}
.calender.mainCalender .cal tbody td .cld_subject {font-size:14px; color:#fff; background:#888; padding:2px 5px; border-radius:10px; line-height:120%; margin:2px 0; word-break:keep-all}

.btn01 {display:inline-block; padding:10px 20px; color:#fff; font-weight:500; background-color:#4971B5; border-radius:3px;}
.btn01:hover {background-color:#313131;color:#fff; text-decoration:none}

/* calenderStyle */
.calViewWrap {margin-top:30px}
.calViewTable {width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0}
.fcHead .fcRow {min-height:40px; border-bottom:1px solid #ddd}
.fcHead .fcRow > th {padding:10px; font-size:16px; border-right:1px solid #ddd}
.fcHead .fcRow > th:last-child {border-right:none}
.fcBody .fcRow {position:relative}
.fcBody .fcRow > td {height:120px; border-bottom:1px solid #ddd; border-right:1px solid #ddd}
.fcBody .fcRow > td:last-child {border-right:none}
.fcDdayNumber {font-size:16px}
.holidayTxt {font-size:14px}
.fcDdayNumber > div {display:flex; align-items:center; justify-content:space-between; padding:10px}
.colorHoliday {color:red}
.fcEventWrap {position:absolute; display:block !important; padding:0 !important}
.fcEvent {display:block; background:#6186c4; padding:5px 10px; margin:1px 0; color:#fff; font-size:14px; letter-spacing:-0.75px; border:1px solid #fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; cursor:pointer}
.fcEvent:hover, .fcEvent:focus {color:#fff}
.fcEventMore {display:none}
.fcEvent.active {background:#204b95}
.fcEvent.active .fcEventMore {display:block; position:absolute; bottom:22px; left:1px; background:#fff; z-index:9999; border:2px solid #204b95; color:#333; width:300px; min-height:150px; padding:15px; box-sizing:border-box; cursor:initial}
.fcEventMore > h3 {font-size:22px; font-weight:600; color:#204b95; white-space:break-spaces}
.fcEventMore > p {font-size:15px; line-height:130%; margin-top:10px; white-space:break-spaces}
.fcEventMore > .link {display:inline-block; margin-top:15px; background:linear-gradient(to right, #4971B5 , #47BA9A); color:#fff; padding:5px 5px; font-size:13px; transition:.3s}
.fcEventMore > .link:hover {background:linear-gradient(to right, #4971B5 , #4971B5)}
.fcEventMore::after {content:''; position:absolute; left:20px; top:100%; border-top:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid #fff; transform:rotate(90deg)}
.fcBody .fcRow:nth-child(1) .fcEvent.active .fcEventMore {bottom:auto; top:96%}
.fcBody .fcRow:nth-child(1) .fcEvent.active .fcEventMore::after {left:20px; top:-14px; border-top:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid #fff; transform:rotate(270deg)}


@media screen and (max-width:1280px) {
	#mainTop > section > .inner {display:block}
	.mainTopLeft {width:100%; margin-right: 0;}
	.mainTopRight {width:100%; margin-top:40px}
	.contentsWrap {width:100%; display:block}
	.contentsWrap .quick {display:flex; justify-content:space-between; margin-left:0; margin-top:20px}
	.contentsWrap .quick > a {width:32%}
	.mainTopLeft .swiper-button-prev {left:15px}
	.mainTopLeft .swiper-button-next {right:15px}
}

@media screen and (max-width:1200px) {
	.gnb > li {padding-left:20px}
	#HeaderWrap > section {padding:0 0 0 15px}
	#HeaderWrap > section > h1 {margin-right:20px; flex-shrink: inherit;}
	.headerRight {margin-left:40px}
	.footerTopLeft, .gositeWrap {width:100%; justify-content:center; flex-wrap:wrap}
	.gositeWrap {margin-top:20px}
	.footerBottom {text-align:center}
}

@media screen and (max-width:1024px) {
	.btnSide {display:block}
	.header > .inner {height:60px}
	.header > .inner > h1 {display:flex; align-items:center; justify-content:space-between; width:100%}
	.header > .inner > h1 > a > img {height:30px}
	.headerRight a.menuLog, .headerRight a.menuSite {width:60px; height:60px; font-size:1.25rem}
	.gnb {display:none; background:#003E85; position:fixed; top:0; right:0; width:300px; height:100%; z-index:99999}
	.gnb li {float:none; padding:0 !important; margin:5px 0}
	.gnb > li > a {margin:0; border-bottom:1px solid rgba(255,255,255,0.5); color:#fff; padding:15px}
	.gnb > li.active > a {color:#fff}
	.gnb > li > ul {position:inherit; float:none; background:#ddd !important; margin:0}
	.gnb > li > ul > li > a {padding:3px 15px; color:#000; background-image:linear-gradient(to right, rgba(0,0,0,0) 50%, rgba(192, 192, 192,1) 50%)}
	#HeaderWrap > section > h1 {margin-right:0}
	.allMenuTop .menuClose {width:60px; height:60px; font-size:1.875rem}
	.allMenu {width:auto; height:auto}
	.allMenu.active:before {display:block; content:''; width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.7); top:0; left:0; z-index:9}
	.allMenu.active > .inner {position:fixed; overflow-y:auto; max-width:300px; left:auto; right:0; z-index:99999; height:100%; background:#fff}
	.allMenu.active .allMenuMiddle {margin-top:10px}
	.allMenu.active .allMenuGnb > li {min-width:auto; margin-right:0px; margin-bottom:0; width:100%}
	.allMenu.active .allMenuGnb > li > a {font-size:1.125rem; padding:20px 0; margin-bottom:20px}
	.allMenu.active .allMenuGnb > li > .dep02 {display:none; font-size:1rem}
	.allMenu.active .allMenuGnb > li > .dep02 > li {margin-bottom:15px}
	.allMenu.active .allMenuGnb > li > .dep02 > li:last-child {margin-bottom:30px}
	#subContainer > .inner {flex-wrap:wrap; padding:20px 15px 150px 15px}
	.leftCont {width:100%; margin-right:0}
	.leftCont > h2 {display:none}
	.leftmenu {margin:0 0 50px 0}
	.mainCalender {display:block; overflow:auto}
	.calender.mainCalender .cal table {line-height:100%; font-size:14px}
	.calender.mainCalender .cal tbody td .cld_subject {font-size:13px; padding:2px 4px; line-height:110%}
	.calenderTableWrap, .calViewWrap {position:relative; min-height:.01%; overflow-x:auto; overflow-y:hidden}
	.calenderTableWrap > table, .calViewWrap > table {width:960px !important}
}
@media screen and (max-width:768px) {
	.hidden-768 {display:none}
	.show-768 {display:block}
	.imgZoomWrap, .imgZoomWrap0, .imgZoomWrap1, .imgZoomWrap2, .imgZoomWrap3, .imgZoomWrap4, .imgZoomWrap5, .imgZoomWrap6, .imgZoomWrap7, .imgZoomWrap8, .imgZoomWrap9, .imgZoomWrap10 {position:relative; overflow:hidden}
	.bimgZoomWrap, .bimgZoomWrap0, .bimgZoomWrap1, .bimgZoomWrap2, .bimgZoomWrap3, .bimgZoomWrap4, .bimgZoomWrap5, .bimgZoomWrap6, .bimgZoomWrap7, .bimgZoomWrap8, .bimgZoomWrap9, .bimgZoomWrap10 {position:relative; overflow:hidden}
	.ZoomIcon, .ZoomIcon0, .ZoomIcon1, .ZoomIcon2, .ZoomIcon3, .ZoomIcon4, .ZoomIcon5, .ZoomIcon6, .ZoomIcon7, .ZoomIcon8, .ZoomIcon9, .ZoomIcon10 {position:absolute; bottom:0; right:0; padding:10px 0px; background:rgba(0,0,0,0.5); width:40px; height:40px; box-sizing:border-box; display:block; text-align:center}
	.bZoomIcon, .bZoomIcon0, .bZoomIcon1, .bZoomIcon2, .bZoomIcon3, .bZoomIcon4, .bZoomIcon5, .bZoomIcon6, .bZoomIcon7, .bZoomIcon8, .bZoomIcon9, .bZoomIcon10 {position:absolute; bottom:0; right:0; padding:10px 0px; background:rgba(0,0,0,0.5); width:40px; height:40px; box-sizing:border-box; display:block; text-align:center}
	.ZoomIcon i, .ZoomIcon0 i, .ZoomIcon1 i, .ZoomIcon2 i, .ZoomIcon3 i, .ZoomIcon4 i, .ZoomIcon5 i, .ZoomIcon6 i, .ZoomIcon7 i, .ZoomIcon8 i, .ZoomIcon9 i, .ZoomIcon10 i {color:#fff; font-size:22px}
	.bZoomIcon i, .bZoomIcon0 i, .bZoomIcon1 i, .bZoomIcon2 i, .bZoomIcon3 i, .bZoomIcon4 i, .bZoomIcon5 i, .bZoomIcon6 i, .bZoomIcon7 i, .bZoomIcon8 i, .bZoomIcon9 i, .bZoomIcon10 i {color:#fff; font-size:22px}
	.tableScroll {position:relative; border:none; min-height:.01%; overflow-x:auto; overflow-y:hidden}
	.tableScroll table {width:910px; margin-bottom:15px}
	.tableResponsive th, .tableResponsive td {display:block; width:auto; border-right:none !important}
	.tableResponsive colgroup {display:none}
	.board-list.tableResponsive thead {display:none}
	.board-list.tableResponsive td {display:inline-block; width:30%; border-right:none !important}
	.board-list.tableResponsive td.title {width:70%}
	.responsiveMobile {display:none !important}
	.ToolTip {position:absolute; width:100%; top:20px; left:0; opacity:0; display:block; padding:5px 8px; font-size:13px; color:#fff; text-align:center; letter-spacing:0.45px; margin:5px 0; -webkit-animation-name:fadeOut; -webkit-animation-duration:4s; animation-name:fadeOut; animation-duration:4s;}
	.leftmenu > li > a {padding:12px 20px; font-size:15px}
	#rightCont h3.h3Tit {font-size:34px; margin-bottom:30px; padding-bottom:20px}
	.tabStyle > li {width:100% !important}
	.tabStyle > li > a {height:40px}
	.footerBottom {font-size:0.875rem}
	.go_site1 h3 a, .go_site2 h3 a {height:36px; font-size:0.875rem}	
	.calender.mainCalender .cal tbody td .cld_subject_wrap {height:75px}
}
@media screen and (max-width:570px) {
	.headerRight a.menuLog, .headerRight a.menuSite {width:50px; height:50px; font-size:1.25rem}
	.noticeTit {margin-bottom:20px}
	.noticeWrap .noticeTit > h3, .mainTopRight .mainTopRightTit > h3, .noticeWrap .noticeTit > a > i, .mainTopRight .mainTopRightTit > a > i {font-size:28px}
	.noticeWrap .notiList > li.active > a {background:none; padding:15px}
	.noticeWrap .notiList > li {background:none; list-style:none; padding:0}
	.noticeWrap .notiList > li.active > a .notiTit {margin-left: 0;}
	.notiTit, .notiDate, .noticeWrap .notiList > li.active > a .notiTit, .noticeWrap .notiList > li.active > a .notiDate {font-size:14px}
	.noticeWrap .notiList > li > a {padding:12px 0}
	.subTabStyle > li {width:100%}
	.subTabStyle > li.active {border-bottom:1px solid #ddd; border-radius:5px}
	.subTabStyle > li.active:before {display:none}
	footer {margin-top:50px}
	.pro_left {width:120px}
	.pro_right {width:calc(100% - 140px)}
	.contentsWrap .quick > a {padding:20px}
}
@media screen and (max-width:475px) {
	.contentsWrap .quick > a {padding:10px; font-size:14px}
	.contentsWrap .quick > a > h2 {margin-top:10px}
	.go_site1, .go_site2 {width:100%; margin:2px 0 !important}
	.go_site1 h3 a, .go_site2 h3 a {justify-content:space-between}
	.go_site1_view, .go_site2_view {width:100%}
	.footerTopLeft > li > a:after {display:none}
	.footerTopLeft > li {width:100%; margin-bottom:5px}
	.footerTopLeft > li > a {width:100%; justify-content:center}
}
@media screen and (max-width:425px) {
	.mainSwiper .swiper-button-next:after, .mainSwiper .swiper-button-prev:after {font-size:40px}
}