@charset "UTF-8";

.main-wrap {padding-top:12rem;}

.mainCont-wrap {display:flex;gap:3rem;flex-wrap:wrap;padding:4rem 4rem 9rem;}
.main-r {flex:1;min-width:0;}
.main-r:after {content:"";display:block;clear:both;}

.mctit {font-family: 'GmarketSans', sans-serif;font-weight:500;font-size:2rem;}


/* ---------- 메인 비주얼 ---------- */
.mvis {width:44rem;height:63rem;background-repeat:no-repeat;background-position:center bottom;background-size:100% auto;background-color:#4782cf;position:relative;border-radius:10px;overflow:hidden;}
.mvis:before {content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background: linear-gradient(to top,rgba(42, 103, 186, 0) 20%,rgba(42, 103, 186, 1) 100%);}
.mvis-inwrap {padding:7rem 6rem;position:relative;z-index:1;}
.mvis-title h2 {color:#fff;font-family: 'GmarketSans', sans-serif;font-weight:600;font-size:3rem;margin-bottom:3rem;}
.mchujin h3 {color:#fff;font-family: 'GmarketSans', sans-serif;font-weight:500;font-size:1.8rem;margin-bottom:1rem;}
.currentChujin {width:100%;min-height:6rem;margin-bottom:1rem;display:flex;align-items:center;flex-wrap:wrap;gap:1rem 0;padding:2rem;background:#fff;border-radius:5px;box-shadow:5px 15px 20px rgba(0, 0, 0, 0.15);}
.currentChujin .txt {font-size:1.8rem;margin-right:auto;}
.currentChujin .date {font-size:1.4rem;position:relative;padding-left:22px;color:var(--point-color);font-weight:600;}
.currentChujin .date:before {content:"";position:absolute;top:50%;left:0;margin-top:-8px;display:block;width:16px;height:16px;background:url(/barobaro/home/img/Main/currentChujin-date.svg) no-repeat center center var(--point-color);border-radius:50%;}
.Chujin-allopen {display:block;width:100%;height:5rem;line-height:5rem;border-radius:5px;box-shadow:5px 15px 20px rgba(0, 0, 0, 0.15);background:var(--point-color);text-align:center;}
.Chujin-allopen span {color:#fff;position:relative;padding-left:30px;font-size:1.6rem;}
.Chujin-allopen span:before {content:"";position:absolute;top:50%;left:0;margin-top:-10px;display:block;width:20px;height:20px;background:url(/barobaro/home/img/Main/Chujin-allBtn.svg) no-repeat center center;}
.prevLink{border-bottom:1px solid rgba(255,255,255,0.2); padding-bottom:20px; margin-bottom:24px;}
.prevLink a{display:inline-block; color:#fff; font-weight:bold; font-size:16px; font-family: 'GmarketSans', sans-serif; position:relative; padding-left:30px; line-height:1.3}
.prevLink a:before{content:""; display:block; width:20px; height:20px; background:#fff; border-radius:50%; opacity:0.4; position:absolute; left:0; top:-3px;}
.prevLink a:after{content:""; display:block; width:6px; height:6px; border-bottom:2px solid #fff; border-right:2px solid #fff; transform:rotate(-45deg); position:absolute; top:4px; left:6px;}

/* ---------- 알림마당 ---------- */
.mboard-title {display:flex;align-items:center;margin-bottom:2rem;}
.mboard-title .mctit {min-height:3rem;line-height:3rem;}
.mboard-title .mboard-control {margin-left:auto;display:flex;align-items:center;gap:1rem;}
.mboard-control button {display:block;width:3rem;height:3rem;border-radius:50%;background:#f4f4f4;position:relative;transition:all .3s;}
.mboard-sld-prev:before,
.mboard-sld-next:before {content:"";position:absolute;top:50%;left:50%;margin:-5px 0 0 -5px;display:block;width:11px;height:10px;background:url(/barobaro/home/img/Main/main-arrow.svg) no-repeat center center /11px auto;filter: brightness(1) invert(1);}
.mboard-sld-prev:before {transform:rotate(180deg);}
.mboard-control button.mboard-sld-play {display:none;}
.mboard-sld-pause .icon {position:absolute;top:50%;left:50%;margin:-5px 0 0 -4px;display:flex;gap:4px;width:9px;height:10px;}
.mboard-sld-play .icon {position:absolute;top:50%;left:50%;margin:-5px 0 0 -2px;display:flex;width:10px;height:10px;}
.mboard-sld-pause .icon:before,
.mboard-sld-pause .icon:after {content:"";display:block;width:2px;height:100%;background:#222;}
.mboard-sld-play .icon:before {content:"";display:block;height:0;border-radius:2px;border-bottom: 5px solid transparent;border-top: 5px solid transparent;border-left: 5px solid #222;border-right: 5px solid transparent;}
.mboard-sld .swiper-slide a {height:25rem;margin-left:1px;margin-bottom:3rem;display:flex;flex-direction: column;border:1px solid #e1e4e8;border-radius:10px;padding:3rem;transition:all .3s;}
.mboard-sld .swiper-slide .tit,
.mboard-sld .swiper-slide .txt {line-height:1.6em;height: 3.2em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word;}
.mboard-sld .swiper-slide .tit {font-size:1.8rem;font-weight:600;}
.mboard-sld .swiper-slide .txt {font-size:1.5rem;color:#666;}
.mboard-sld .swiper-slide .bottom {margin-top:auto;display:flex;align-items:center;}
.mboard-sld .swiper-slide .bottom .date {font-size:1.4rem;position:relative;padding-left:20px;}
.mboard-sld .swiper-slide .bottom .date:before {content:"";position:absolute;top:50%;left:0;margin-top:-7px;width:15px;height:15px;display:block;background:url(/barobaro/home/img/Main/mnotice-dateIcon.svg) no-repeat center center;}
.mboard-sld .swiper-slide .bottom .cate {margin-left:auto;font-size:1.4rem;font-weight:600;}
.mboard-sld .swiper-slide .bottom .cate.guchung {color:#2873dd}
.mboard-sld .swiper-slide .bottom .cate.johap {color:#279a75}
.mboard-sld .swiper-slide .bottom .cate.ipchal {color:#e76000}
.mboard-sld_nodata {margin-bottom:3rem;height:25rem;text-align:center;border:1px solid #e1e4e8;border-radius:10px;display:flex;align-items:center;justify-content:center;text-align:center;}
.mboard-sld_nodata span {display:inline-block;color:#767676;}
.mboard-sld_nodata span:before {content:"";display:block;margin:0 auto 2rem;width:19px;height:25px;background:url(/barobaro/home/img/Main/board-nodata.svg) no-repeat center center;}


/* 최근 공개자료 */
.mdata {float:left;width:calc(66.66% - 2px);height:30rem;border:1px solid #e1e4e8;border-radius:10px;padding:4rem 3rem;}
.mdata-title {display:flex;align-items:center;margin-bottom:3rem;}
.mdata-title .mmore {margin-left:auto;}
.mdata ul {position:relative;}
.mdata ul li + li {margin-top:3rem;}
.mdata ul li a {display:flex;align-items:center;}
.mdata ul li a .txt {min-width:0;flex:1;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.mdata ul li a .date {margin-left:auto;font-size:1.4rem;color:#767676;}
.mdata ul li.nodata {padding-top:5rem;text-align:center;color:#767676;}
.mdata ul li.nodata:before {content:"";display:block;margin:0 auto 2rem;width:19px;height:25px;background:url(/barobaro/home/img/Main/board-nodata.svg) no-repeat center center;}




/* 위치도, 배치도, 조감도 */
.mimg {float:right;width:calc(33.33% - 15px);height:30rem;border-radius:10px;padding:4rem 3rem;background:#f4f4f4;}
.mimg-tabWrap {margin-bottom:3rem;}
.mimg-tab {display:flex;align-items:center;justify-content: space-between;}
.mimg-tab a {font-family: 'GmarketSans', sans-serif;font-weight:500;font-size:2rem;color:#888888;margin:0 1rem;}
.mimg-tab li a[aria-selected="true"] {color:#222;}
.mimg-cont figure {position:relative;border-radius:0 0 10px 10px;overflow:hidden;}
.mimg-cont figure:after {content:"";display:block;height:0;padding-bottom:66.66%;}
.mimg-cont figure img {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;}


/* 주요 추진경과 현황 팝업 */
#chujinlPop.layerpop-wrap {display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.8);z-index:999;}
#chujinlPop .layerpop-flex {width:calc(100% - 4rem);height:calc(100% - 6rem);margin:3rem auto;display:flex;align-items:center;justify-content:center;}
#chujinlPop .layerpop {width:580px;max-width:100%;max-height:100%;margin:0 auto;position:relative;display:flex;flex-direction:column;border-radius:10px;overflow:hidden;}
#chujinlPop .layerpop .layerpop-title {flex:0 0 10rem;width:100%;height:10rem;background:var(--point-color);padding:1rem 6rem 1rem 5rem;display:flex;align-items:center;flex-wrap:wrap;}
#chujinlPop .layerpop .layerpop-title:focus-visible {outline:auto;}
#chujinlPop .layerpop .layerpop-title h2 {display:inline-block;padding-left:30px;color:#fff;font-weight:600;font-size:2.4rem;font-family: 'GmarketSans', sans-serif;padding-top:1rem;position:relative;}
#chujinlPop .layerpop .layerpop-title h2:before {content:"";position:absolute;left:0;top:50%;margin-top:-10px;display:block;width:20px;height:20px;background:url(/barobaro/home/img/Main/ChujinlPop-title.svg) no-repeat center center;}
#chujinlPop .layerpop .layerpop-content {width:100%;background:#fff;padding:4rem 3rem 4rem 5rem;}
#chujinlPop .layerpop .layerpop-content:focus-visible {outline:auto;}
#chujinlPop .layerpop .layerpop-content img {max-width:100%;}
#chujinlPop .layerpop .layerpop-close {position:absolute;top:35px;right:3rem;}
#chujinlPop .layerpop .layerpop-close .icon {position:relative;display:block;width:30px;height:30px;}
#chujinlPop .layerpop .layerpop-close .icon:before,
#chujinlPop .layerpop .layerpop-close .icon:after {content:"";position:absolute;top:50%;left:50%;margin:-1px 0 0 -15px;display:block;width:30px;height:1px;border-radius:2rem;background:#fff;}
#chujinlPop .layerpop .layerpop-close .icon:before {transform:rotate(45deg);}
#chujinlPop .layerpop .layerpop-close .icon:after {transform:rotate(-45deg);}
#chujinlPop .layerpop-scr {max-height:calc(100vh - 24rem);overflow:auto;}
#chujinlPop .layerpop-scr::-webkit-scrollbar {width:3px;border-radius:10px;}
#chujinlPop .layerpop-scr::-webkit-scrollbar-thumb {background:#222}
#chujinlPop .layerpop-scr::-webkit-scrollbar-track {background:rgba(0, 0, 0, 0.05);}
#chujinlPop .chujinlPop-lst {position:relative;padding-right:2rem;}
#chujinlPop .chujinlPop-lst:before {content:"";position:absolute;top:0;left:10px;display:block;width:1px;height:100%;background:#eff1f4;}
#chujinlPop .chujinlPop-lst li {position:relative;padding-left:30px;z-index:1;}
#chujinlPop .chujinlPop-lst li + li {margin-top:4rem;}
#chujinlPop .chujinlPop-lst li + li:has(.date) {margin-top:3rem;}
#chujinlPop .chujinlPop-lst li:before {content:"";position:absolute;top:4px;left:0;display:block;width:22px;height:22px;border-radius:50%;background:#eff1f4;}
#chujinlPop .chujinlPop-lst li.end:before {background:url(/barobaro/home/img/Main/ChujinlPop-chk.svg) no-repeat center center #222;}
#chujinlPop .chujinlPop-lst li.now:before {background:url(/barobaro/home/img/Main/ChujinlPop-chk.svg) no-repeat center center var(--point-color);}
#chujinlPop .chujinlPop-lst .txt {font-weight:600;font-size:1.8rem;line-height:160%;color:#767676;}
#chujinlPop .chujinlPop-lst .date {font-weight:600;color:#767676;font-size:1.4rem;margin-top:0.5rem;}
#chujinlPop .chujinlPop-lst li.end .txt {color:#222;}
#chujinlPop .chujinlPop-lst li.now .txt {color:var(--point-color);}
#chujinlPop .chujinlPop-lst li.now .date {color:var(--point-color);}


	@media screen and (min-width:1200px) {
	
		.mboard-sld .swiper-slide a:hover,
		.mboard-sld .swiper-slide a:focus {background:#f4f4f4;box-shadow:0 15px 25px rgba(0, 0, 0, 0.03);}
		.mboard-control button:hover,
		.mboard-control button:focus {background:var(--point-color)}
		.mboard-sld-next:hover:before,
		.mboard-sld-next:hover:after,
		.mboard-sld-next:focus-visible:before,
		.mboard-sld-next:focus-visible:after,
		.mboard-sld-prev:hover:before,
		.mboard-sld-prev:hover:after,
		.mboard-sld-prev:focus-visible:before,
		.mboard-sld-prev:focus-visible:after {filter: brightness(0) invert(1);}
		
		.mboard-sld-pause:hover .icon:before,
		.mboard-sld-pause:focus-visible .icon:before,
		.mboard-sld-pause:hover .icon:after,
		.mboard-sld-pause:focus-visible .icon:after {background:#fff;}
		.mboard-sld-play:hover .icon:before,
		.mboard-sld-play:focus-visible .icon:before {border-left-color:#fff;}
	}
	
	@media screen and (max-width:1500px){
	
		.mimg-tab a {font-size:1.6rem;margin:0;}
	}
	
	@media screen and (max-width:1200px){
		
		.main-wrap {padding-top:11rem;}
		
		.mainCont-wrap {padding-left:2rem;padding-right:2rem;padding-top:2rem;}
		
		.mboard-sld .swiper-slide {width:300px;}
		
		.mainCont-wrap {display:block;}
		
		.mvis {width:100%;margin-bottom:4rem;}
		
		.mdata {height:auto;width:100%;margin-bottom:4rem;}
		.mdata ul li a {display:block;}
		.mdata ul li .txt {margin-bottom:1rem;}
		.mdata ul li.nodata {padding-top:2.5rem;padding-bottom:2rem;}
		
		.mimg {height:auto;width:100%;}
		
		.mimg-tab {justify-content:center}
		.mimg-tab a {font-size:2rem;margin:0 1rem;}
		
		
	}
	
	@media screen and (max-width:500px){
	
		#chujinlPop .layerpop .layerpop-title {padding-left:3rem;}
		#chujinlPop .layerpop .layerpop-close {right:2rem;}
		#chujinlPop .layerpop .layerpop-content {padding-left:3rem;padding-right:2rem;}
		.mvis-inwrap {padding-left:4rem;padding-right:4rem;}
	}