@charset "utf-8";
/* ==============================
* 01. BASE
================================= */
#campus-map {opacity:0;transition:all .3s ease}
#campus-map.stable {opacity:1}

/* ==============================
* 02. 좌측 UI
================================= */
.cmap-wr {}
.cmap-wr .cmap-top {border-radius:30px;border:2px solid #0EA2A4;overflow:hidden;box-sizing:border-box}
.cmap-wr .tit-box {display:flex;flex-flow:row wrap;align-items:center;justify-content:space-between;position:relative;padding:45px 40px 45px 70px;box-sizing:border-box}
.cmap-wr .tit-box h3 {color:#005667;font-size:1.667em;font-weight:400;font-family:"ONE-Mobile-Title", sans-serif;line-height:1.2}
.cmap-wr .tit-box h3 .en {display:block;font-size:.667em;font-family:"Poppins", sans-serif}
.cmap-wr .tit-box ul {display:flex;flex-flow:row wrap;align-items:center;justify-content:center}
.cmap-wr .tit-box ul li {margin-right:30px}
.cmap-wr .tit-box ul li:last-child {margin-right:0}
.cmap-wr .tit-box li a {position:relative;display:block;padding:5px 0 5px 53px;color:#374359;font-size:1.056em;font-family:"ONE-Mobile-Title", sans-serif}
.cmap-wr .tit-box li a:before {content:"";display:block;position:absolute;left:0;top:0;background-color:#f1f1f1;border-radius:50%;width:40px;height:40px;transition:all .3s ease-out}
.cmap-wr .tit-box li a:after {content:"";display:block;position:absolute;left:0;top:50%;width:24px;height:24px;margin:-12px 0 0 8px}
.cmap-wr .tit-box li a.cmap-ico01:before {background-color:#005667}
.cmap-wr .tit-box li a.cmap-ico02:before {background-color:#0EA2A4}
.cmap-wr .tit-box li a.cmap-ico03:before {background-color:#127589}
.cmap-wr .tit-box li a.cmap-ico04:before {background-color:#86A103}
.cmap-wr .tit-box li a.cmap-ico01:after {background-image:url(/resources/_Img/Contents/cmap_ico01.png)}
.cmap-wr .tit-box li a.cmap-ico02:after {background-image:url(/resources/_Img/Contents/cmap_ico02.png)}
.cmap-wr .tit-box li a.cmap-ico03:after {background-image:url(/resources/_Img/Contents/cmap_ico03.png)}
.cmap-wr .tit-box li a.cmap-ico04:after {background-image:url(/resources/_Img/Contents/cmap_ico04.png)}
.cmap-wr .tit-box li a span {display:block}
.cmap-wr .tit-box li a:hover{color:#005667;font-weight:500}
.cmap-wr .tit-box li a:hover:before {box-shadow:0 7px 15px 0 rgba(0, 0, 0, .35)}



.cmap-wr .cmap {display:flex;flex-flow:row wrap;height:630px}
.cmap .cmap-box-wr,
.cmap .cmap-detail-wr {box-sizing:border-box}
.cmap .cmap-box-wr {width:calc(100% - 410px)}
.cmap .cmap-detail-wr {border-left:1px solid #fafafa;width:410px}

.cmap .cmap-box {position:relative;width:100%;height:100%}
.cmap .cmap-box .btn-skip {position:absolute;top:-100%;left:0;background-color:#005667;width:100%;padding:10px 0;color:#fff;text-align:center;opacity:0;z-index:2}
.cmap .cmap-box .btn-skip:focus {top:0;opacity:1}
.cmap .cmap-box #campusMap {position:absolute;left:0;top:0;width:100%;height:100%}
#cmapDetail:focus-visible,
.cmap-guide-txt:focus-visible  {outline:rgb(59, 153, 252) solid 3px;outline-offset:-3px}
#cmapDetail:focus:not(:focus-visible),
.cmap-guide-txt:focus:not(:focus-visible) {outline:0}
.cmap-detail-wr h4 {margin-bottom:24px;color:#222;font-size:1.667em;font-weight:700;letter-spacing:0}
.cmap-detail-wr .cmap-photo-wr {}

.cmap-photo-wr .item {background-color:#e3e3e3}
.cmap-photo-wr .item .cmap-img-box {position:relative;padding-top:65.7894%}
.cmap-photo-wr .item .cmap-img-box> img {position:absolute}
.cmap-photo-wr .item .cmap-img-box:not(.no-img) > img  {left:0;top:0;width:100%;height:100%}
.cmap-photo-wr .item .cmap-img-box.no-img > img {left:50%;top:50%;transform:translate(-50%, -50%);width:auto}
.cmap-photo-wr .owl-dots {display:block !important;margin-top:24px;line-height:1;text-align:center}
.cmap-photo-wr .owl-dots .owl-dot {display:inline-block;background-color:#fff;border:2px solid #C3C7CE;border-radius:50%;width:12px;height:12px;margin:0 4px;box-sizing:border-box}
.cmap-photo-wr .owl-dots .owl-dot.active {background-color:#0EA2A4;border-color:#0EA2A4}
.cmap-cont-wr {margin-top:24px;padding:0 40px 40px;text-align:center;box-sizing:border-box}
.cmap-cont-wr .cmap-name {color:#005667;font-size:1.667em;font-weight:400;font-family:"ONE-Mobile-Title", sans-serif;line-height:1.3}
.cmap-cont-wr .cmap-name .en-name {display:block;font-size:.5667em;font-family:"ONE-Mobile-Regular", sans-serif;opacity:.6}
.cmap-detail-wr .cmap-detail h5 {border-bottom:3px solid #d1d1d1;padding:31px 0 9px;color:#333;font-size:1.389em;font-weight:700;letter-spacing:0;text-align:center}
.cmap-detail-wr .cmap-detail .cmap-guide-wr {box-sizing:border-box}
.cmap-detail-wr .cmap-detail .cmap-guide {height:115px;color:#555;font-size:.944em;line-height:1.647;letter-spacing:-.025em;box-sizing:border-box}
.cmap-detail-wr .cmap-detail .cmap-guide > div {margin-top:30px}
.cmap-detail-wr .cmap-detail .cmap-guide > div > dl {}
.cmap-detail-wr .cmap-detail .cmap-guide > div > dl > dt {float:left;background-color:#fff;border-radius:30px;width:100px;padding:4px 5px 6px;margin-left:3px;color:#005667;font-size:.941em;font-weight:500;letter-spacing:0;text-align:center;box-shadow:0 3px 7px 0 rgba(0, 0, 0, .2);box-sizing:border-box}
.cmap-detail-wr .cmap-detail .cmap-guide > div > dl > dd {min-height:36px;margin:0 0 15px 123px;padding-top:3px;box-sizing:border-box}
.cmap-detail-wr .cmap-detail #cmapView {margin-top:24px}
.cmap-wr .cmap-list {}
.cmap-wr .cmap-list h3.c-tit01 {}
#cmapTab {}
#cmapTab .cmap-tab-list {display:flex;flex-flow:row wrap;align-items:center;justify-content:center;position:relative;z-index:1}
#cmapTab .cmap-tab-list button {background-color:#fff;border:2px solid #005667;border-right:0;min-width:200px;padding:15px 20px;color:#5B5B5B;font-weight:700;box-sizing:border-box}
#cmapTab .cmap-tab-list li:first-child button {border-top-left-radius:50px;border-bottom-left-radius:50px;}
#cmapTab .cmap-tab-list li:last-child button {border-right:2px solid #005667;border-top-right-radius:50px;border-bottom-right-radius:50px;}
#cmapTab .cmap-tab-list li button.active {background-color:#005667;color:#fff}
#cmapTab .camp-panel-box {position:relative;min-height:180px;margin-top:-25px;padding-top:25px}
#cmapTab .camp-panel-box:before,
#cmapTab .camp-panel-box:after {content:"";display:block;position:absolute;left:0;border-width:2px;border-style:solid;width:100%;box-sizing:border-box;z-index:-1}
#cmapTab .camp-panel-box:before {top:0;border-color:#066C70;border-bottom:0;border-top-left-radius:30px;border-top-right-radius:30px;height:100px}
#cmapTab .camp-panel-box:after {bottom:0;border-color:#E9E9E9;border-top:0;border-bottom-left-radius:30px;border-bottom-right-radius:30px;height:calc(100% - 116px)}
#cmapTab .camp-panel-box .tabpanel {padding:55px 20px;display:none;box-sizing:border-box}
#cmapTab .camp-panel-box .tabpanel.active {display:block}
#cmapTab .camp-panel-box .tabpanel ul {display:flex;flex-flow:row wrap;align-items:center;justify-content:center;margin-top:-10px}
#cmapTab .camp-panel-box .tabpanel ul > li {margin:10px 10px 0 0}
#cmapTab .camp-panel-box .tabpanel ul > li:last-child {margin-right:0}
#cmapTab .camp-panel-box .tabpanel .cmap-btn {display:flex;flex-flow:row wrap;align-items:center;justify-content:center;background-color:#fff;border:1px solid rgba(55, 67, 89, .2);border-radius:5px;padding:7px 0;color:#374359;font-size:.944em;box-sizing:border-box;transition:all .3s ease}
#cmapTab .camp-panel-box .tabpanel .cmap-btn .num {border-right:1px solid rgba(55, 67, 89, .2);width:50px;color:#313742;font-size:1.059em;font-weight:500;font-family:"Poppins", sans-serif;text-align:center;box-sizing:border-box}
#cmapTab .camp-panel-box .tabpanel .cmap-btn .txt {width:calc(100% - 50px);padding:0 20px;box-sizing:border-box}
#cmapTab .camp-panel-box .tabpanel li.on .cmap-btn,
#cmapTab .camp-panel-box .tabpanel li .cmap-btn:hover {background-color:#E7F4F4;border-color:#066C70;color:#066C70}
#cmapTab .camp-panel-box .tabpanel li.on .cmap-btn .num,
#cmapTab .camp-panel-box .tabpanel li .cmap-btn:hover .num {color:#066C70}

.cmap-guide-list {overflow:hidden;width:100%}
.cmap-guide-list li {position:relative;padding-left:55px;padding-bottom:20px;font-size:17px;min-height:32px;padding-top:3px}
.cmap-guide-list li .num {position:absolute;top:0;left:0;width:35px;height:35px;border-radius:50%;background:#e5e5e5;font-size:13px;font-weight:700;color:#02673a;line-height:35px;text-align:center}

/** -- 팝업 */
#layout-popup-wrap.cmap-floor-pop > #popup-wrap .pop-head {display:none}
#layout-popup-wrap.cmap-floor-pop > #popup-wrap .pop-cont {background-color:#EAF0F0;height:100% !important;margin:0;padding-top:0;box-sizing:border-box}
.cmap-floor-pop .cmap-pop-top {position:relative;background-color:#fff;padding:40px 0 30px;box-sizing:border-box}
.cmap-floor-pop .cmap-pop-top .cmap-pop-photo {position:absolute;top:85px;right:50px}
.cmap-floor-pop .cmap-pop-top .cmap-pop-photo .photo-wr {position:relative;border-radius:20px;width:300px;overflow:hidden}
.cmap-floor-pop .cmap-pop-top .cmap-pop-photo .photo-wr:before {content:"";display:block;width:0;padding-top:53.3333%}
.cmap-floor-pop .cmap-pop-top .cmap-pop-photo .photo-wr img {position:absolute;top:0;left:0;width:100%;min-height:100%}
.cmap-floor-pop .cmap-pop-top .camp-top-left {width:60%;padding:0 50px;box-sizing:border-box}
.cmap-floor-pop .cmap-pop-top .cmap-pop-tit {color:#005667;font-size:1.111em;font-family:"ONE-Mobile-Title", sans-serif}
.cmap-floor-pop .cmap-pop-top .cmap-pop-txt {margin-top:22px;color:#374359;line-height:1.3;}
.cmap-floor-pop .cmap-pop-btm {padding:30px 60px;box-sizing:border-box}
.cmap-floor-pop .cmap-pop-btm .cmap-btm-tit {color:#0EA2A4;font-size:1.111em;font-family:"ONE-Mobile-Title", sans-serif}
.cmap-floor-pop .cmap-pop-btm #cmapPopTab {margin-top:20px} 
.cmap-floor-pop #cmapPopTab .cmap-floor-list {display:flex;flex-flow:row wrap;align-items:center}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li {background-color:#fff;padding-right:10px;overflow:hidden}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li:first-child {border-top-left-radius:50px;border-bottom-left-radius:50px;}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li:last-child {border-top-right-radius:50px;border-bottom-right-radius:50px;padding-right:0}
.cmap-floor-pop #cmapPopTab .cmap-floor-list button {background-color:#fff;border:0;padding:5px 12px;text-align:center;box-sizing:border-box}
.cmap-floor-pop #cmapPopTab .cmap-floor-list button span {display:inline-block;border-radius:50px;padding:7px 12px;color:#4F4F4F;font-size:.889em;font-weight:700;box-sizing:border-box}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li:first-child button {border-top-left-radius:50px;border-bottom-left-radius:50px;}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li:last-child button {border-top-right-radius:50px;border-bottom-right-radius:50px;}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li button.active {}
.cmap-floor-pop #cmapPopTab .cmap-floor-list li button.active span {background-color:#E7F4F4;color:#066C70}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl {margin-left:-15px;display:none}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl.active {display:block}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail {display:flex;flex-flow:row wrap;align-items:center;padding-top:10px}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail > li {position:relative;margin-top:10px;padding:0 15px;color:#000;font-size:.944em;box-sizing:border-box}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail > li:after {content:"";display:block;position:absolute;right:0;top:50%;background-color:#ccc;width:1px;height:15px;margin-top:-7px}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail > li:last-child {margin-right:0}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail > li:last-child:after {display:none}
.cmap-floor-pop #cmapPopTab .floor-tabpaenl .floor-detail > li > span {font-weight:500;font-family:"Poppins", sans-serif}

@media all and (max-width:1419px) {
	.cmap .cmap-box-wr {width:calc(100% - 380px)}
	.cmap .cmap-detail-wr {width:380px}
}
@media all and (max-width:1199px) {
	.cmap-wr .tit-box {padding:35px 30px}
	.cmap-cont-wr {padding:0 30px 30px}
}
@media all and (max-width:999px) {
	#cmapTab .cmap-tab-list button {min-width:160px}

	.cmap-wr .cmap {display:block;height:auto}
	.cmap .cmap-box-wr,
	.cmap .cmap-detail-wr {width:auto}
	.cmap .cmap-box {height:400px;padding-top:0}
	.cmap-cont-wr {margin-top:0}
	.cmap .cmap-detail-wr {display:flex;flex-flow:row wrap;justify-content:space-between}
	.cmap-detail-wr .cmap-photo-wr {width:48%}
	.cmap-cont-wr {width:50%;padding:20px;box-sizing:border-box}
	.cmap-photo-wr .owl-dots{margin:7px 0}	
	.cmap-cont-wr .cmap-name {margin-bottom:15px;font-size:1.4em}
	.cmap-detail-wr .cmap-detail .cmap-guide > div {margin-top:15px}
	.cmap-detail-wr .cmap-detail #cmapView {margin-top:0;padding-top:15px;}


	#layout-popup-wrap.cmap-floor-pop > #popup-wrap {padding:0 !important;}
	.cmap-floor-pop .cmap-pop-top .cmap-pop-photo {right:35px}
	.cmap-floor-pop .cmap-pop-top .camp-top-left {width:calc(100% - 335px);padding:0 35px}
	.cmap-floor-pop .cmap-pop-btm {padding:20px 35px}
}
@media all and (max-width:899px) {
	.cmap-wr .tit-box ul li {margin-right:15px}
	.cmap-wr .tit-box li a {padding:1px 0 1px 37px;font-size:1em}
	.cmap-wr .tit-box li a:before {width:28px;height:28px;}
	.cmap-wr .tit-box li a:after {background-size:17px auto;width:17px;height:17px;margin:-9px 0 0 5px}
}
@media all and (max-width:799px) {
	.cmap-wr .tit-box {padding:25px 20px}
	.cmap-wr .tit-box ul {width:270px;margin-top:-10px;justify-content:flex-end}
	.cmap-wr .tit-box ul > li {margin-top:10px}
	.cmap-wr .tit-box ul > li:nth-child(2n) {margin-right:0}

	.cmap-detail-wr .cmap-detail .cmap-guide {height:118px}
	.cmap-cont-wr {padding:15px 10px}

	#cmapTab .camp-panel-box .tabpanel {padding:25px 20px}
	
}

@media all and (max-width:768px) {
	.cmap-floor-pop .cmap-pop-top .cmap-pop-photo {right:20px;width:40%}
	.cmap-floor-pop .cmap-pop-top .cmap-pop-photo .photo-wr {width:auto}
	.cmap-floor-pop .cmap-pop-top .camp-top-left {width:calc(60% - 20px);padding:0 20px}
	.cmap-floor-pop .cmap-pop-btm #cmapPopTab {margin-top:15px}
	.cmap-floor-pop #cmapPopTab .cmap-floor-list {background-color:#fff;border-radius:200px;overflow:hidden}

}
@media all and (max-width:499px) {
	#cmapTab .cmap-tab-list button {min-width:115px}
	#cmapTab .camp-panel-box .tabpanel ul > li {width:calc(50% - 5px)}
	#cmapTab .camp-panel-box .tabpanel ul > li:nth-child(2n) {margin-right:0}
	#cmapTab .camp-panel-box .tabpanel .cmap-btn {width:100%}
	#cmapTab .camp-panel-box .tabpanel .cmap-btn .num {width:40px}
	#cmapTab .camp-panel-box .tabpanel .cmap-btn .txt {width:calc(100% - 40px);padding:0 10px}

	.cmap-floor-pop .cmap-pop-top .camp-top-left {width:auto}
	.cmap-floor-pop .cmap-pop-top .cmap-pop-photo {position:static;right:auto;top:auto;width:auto;padding:10px 0 0}
	.cmap-floor-pop .cmap-pop-btm {padding:25px 20px 0}
	.cmap-floor-pop #cmapPopTab .cmap-floor-list li {width:20%;padding-right:0;text-align:center;}
}
@media all and (max-width:469px) {
	.cmap-wr .tit-box {flex-direction:column;padding:20px 15px 15px}
	.cmap-wr .tit-box ul {justify-content:space-around;width:245px;margin-top:5px}
	.cmap-wr .tit-box ul li {width:calc(50% - 3px);margin-right:5px}
	.cmap-wr .tit-box li a {padding:5px 0 5px 33px;font-size:.889em}
	
}
@media all and (max-width:399px) {
	.cmap .cmap-detail-wr {display:block}
	.cmap-detail-wr .cmap-photo-wr,
	.cmap-cont-wr {width:auto}
	.cmap-detail-wr .cmap-detail .cmap-guide {height:94px}

	.cmap-floor-pop #cmapPopTab .cmap-floor-list li {width:33.33%}
}