@import url("/font/Montserrat/fonts.css"); 

/* 공통 */
h2.heading { position: relative; display: flex; align-items:center; justify-content:center; font-size: 1.75rem; color: #111; font-weight: 600; line-height: 1;}
h2.heading + p {color:#bfccdc; font-size:0.8rem; font-weight:400; display: flex; align-items:center; justify-content:center; margin-top:0.8rem;}
#wrap {overflow:hidden;}

.section {position: relative; overflow: hidden; }
.section > .container { max-width: 80rem; margin: 0 auto; display:flex; align-items:center; justify-content:center; flex-direction:column;}
.cursor {display:none; position: fixed; width: 7.5rem; height: 7.5rem; transform: translate(-50%, -50%); pointer-events: none;}
.cursor span {display:flex; align-items:center; justify-content:center; position:relative; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.cursor span:before { }
.hover-cursor {display:block; z-index:3;} 
.hover-cursor:before {content:'\EA70'; font-family: 'remixicon'; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:0;  font-size:1.5rem; color:#fff; font-weight:400;}
.hover-cursor:after {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width: 7.5rem; height: 7.5rem; background:url('/images/web/cls/main/img_photo_cursor.png') no-repeat 50% 50%; animation: rotate 10s linear infinite;}


/* 메인비주얼 */ 
.MC_wrap1 {height:45.5rem;}
.MC_wrap1 .container {position:relative; height:100%; pointer-events: none;}
.MC_wrap1 .container .control {position: absolute; left: 0; bottom:calc(50% - 5rem); display: flex; align-items: center; pointer-events:visible;}
.MC_wrap1 .container .control a {color:#fff; font-size: 1.15rem; }
.MC_wrap1 .container .control a.play { display: none; }
.MC_wrap1 .container .control a.play,
.MC_wrap1 .container .control a.stop {order:2; font-size: 0.9rem; width: 1.9rem; height: 1.9rem; line-height: 1.9rem; border-radius: 50%; border: 1px solid rgba(255,255,255,0.6); text-align: center; color: #fff; }
.MC_wrap1 .container .control .visual-dots {order:1; position:relative; z-index:2; color:#fff; display:flex; gap:0rem; margin-right:0.75rem;}
.MC_wrap1 .container .control .visual-dots li button {display:flex; align-items:center; color:#fff; width:15px; height:16px; background:url('/images/web/cls/main/control_off.png') no-repeat 50% 50%; text-indent:-9999px; padding:0;}
.MC_wrap1 .container .control .visual-dots li.slick-active button {background:url('/images/web/cls/main/control_on.png') no-repeat 50% 50%;}
.MC_wrap1 .container .control .page { display: flex; align-items: center; color: #fff; font-size: 0.9rem; }
.MC_wrap1 .container .control .page > strong { font-weight: bold; }
.MC_wrap1 .container .control .page > span { font-weight: 400; }
.MC_wrap1 .container .control .page .bar { position: relative; width: 9.7rem; height: 3px; background: rgba(255,255,255,0.4); margin: 0 0.75rem; }
.MC_wrap1 .container .control .page .bar::before { width: 0%; position: absolute; content: ""; left: 0; top: 0; height: 100%; background: #fff; }
.MC_wrap1 .container .control .page .bar.move::before { animation: move 4s forwards linear; }
.MVisual {position: absolute; width: 100%; height: 100%; background-position: center; z-index: 0; overflow: hidden;}
.MVisual .item img {height:100%; left:50%; position: relative; transform: translate(-50%, 0); z-index:0;}
.MVisual .item .txt {position:absolute; width:100%; top:calc(50% - 10rem); left:50%; transform:translate(-50%, 0); max-width:80rem; display:flex; align-items:flex-start; justify-content:flex-start; z-index:1; flex-direction:column;}
.MVisual .item .txt p {font-size:3rem; font-weight:100; line-height:1.2; opacity: 0; transform: translateX(-2.5rem); transition: opacity 0.5s ease-in, transform 0.5s ease-in; color:#fff;}
.MVisual .item .txt p.sub {font-size:1.2rem; font-weight:400; color:#ffffff; margin-top:1rem;}
.MVisual .item.slick-active .txt p {opacity: 1; transform: translateX(0);}
.MVisual .item.slick-active .txt p:nth-child(1) {transition-delay: 0.1s;}
.MVisual .item.slick-active .txt p:nth-child(2) {transition-delay: 0.3s;}
.MVisual .item.slick-active .txt p:nth-child(3) {transition-delay: 0.5s;}
.MVisual_panel {width:27.5rem; display:flex; position:absolute; height:calc(100% - 6.2rem); right:-24.7rem; bottom:0; transition:all 0.2s;}
.MVisual_panel .panel_btn {height:100%; display:flex; align-items:center; justify-content:center;}
.MVisual_panel .panel_btn a {width:2.5rem; height:7rem; background:url('/images/web/cls/main/panel_btn_bg.png') no-repeat 50% 50%; display:flex; align-items:center; justify-content:center;}
.MVisual_panel .panel_btn a i {font-size:1.4rem; color:#fff; font-weight:400; margin-left:0.25rem;}
.MVisual_panel .panel_wrap {width:calc(100% - 4rem); padding:3rem; height:100%; flex-grow:1; background:rgba(0,0,0,0.5); border-radius:5rem 0 0 5rem;}
.MVisual_panel.active {right:0;}
.panel_accordion ul {list-style:none; padding:0; margin:0;}
.panel_accordion .tit {cursor:pointer; font-size:1.2rem; color:#fff; font-weight:400; height:4rem; padding-left:0; display:flex; align-items:center; justify-content:flex-start; border-bottom:1px solid #737576; transition:all 0.2s; gap:0.5rem;}
.panel_accordion .sub_depth {display:none; transition:all 0.2s; padding:1rem 0; border-bottom:1px solid #737576; max-height:15rem; overflow:auto;}
.panel_accordion .sub_depth li {line-height:2;}
.panel_accordion .sub_depth li a {position:relative; padding-left:0.75rem; color:#fff; font-size:1rem; font-weight:500;}
.panel_accordion .sub_depth li a:before {content:''; position:absolute; left:0; top:50%; transform:translate(0, -50%); width:4px; height:4px; border-radius:50%; background:#fff;}
.panel_accordion .sub_depth li a:hover,
.panel_accordion .sub_depth li a:focus {text-decoration:underline;}
.panel_accordion .tit a.more {margin-right:0.35rem; margin-left: auto;}
.panel_accordion li.active .tit {border-bottom:2px solid #fff;}
.panel_accordion li.active .sub_depth {display:block;}
.panel_accordion li:hover .tit a.more,
.panel_accordion li:focus .tit a.more,
.panel_accordion li.active .tit a.more {margin-right:0rem; width:2rem; height:2rem; border-radius:50%; border:1px solid #fff; display:flex; align-items:center; justify-content:center;}
.panel_accordion li:hover .tit a.more i,
.panel_accordion li:focus .tit a.more i,
.panel_accordion li.active .tit a.more i {color:#0098d1; transition:all 0.2s;}
.panel_accordion li:hover .tit,
.panel_accordion li:focus .tit {padding-left:1rem;}
.panel_accordion li:hover .tit a.more i,
.panel_accordion li:focus .tit a.more i {transform:rotate(180deg);}

/* 포토갤러리 */
.MC_wrap2 {height:42.5rem; display:flex; align-items:center; justify-content:center; background:#fff; z-index:2;}
.MC_wrap2 .container h2.heading {justify-content:flex-start; font-size:2rem; font-weight:600; color:#222;}
.MC_wrap2 .container h2.heading + p {justify-content:flex-start; color:#606060;}
.MC_wrap2 .container h2.heading a {width:auto; font-weight:400; border-radius:50%; width:2.5rem; height:2.5rem; font-size:1.75rem; border:1px solid #d9d9d9; display:flex; align-items:center; justify-content: center; margin-left:0.5rem;}
.MC_wrap2 .container h2.heading a i {transition:all 0.2s;}
.MC_wrap2 .container h2.heading a:hover,
.MC_wrap2 .container h2.heading a:focus {top:0;}
.MC_wrap2 .container h2.heading a:hover i,
.MC_wrap2 .container h2.heading a:focus i {transform:rotate(180deg);}
.MC_wrap2 .container em {color:#666; margin-bottom:0.25rem;}
.gallery ul {display:flex; justify-content: space-between; flex-wrap: wrap; gap:2rem 4rem;}
.gallery ul li {display:flex; align-items:center; justify-content:center; width: calc(33.3333% - 4rem);}
.gallery ul li:nth-child(1) {flex-direction:column; align-items:flex-start; justify-content:flex-start; padding-top:0.5rem;}
.gallery ul li a {position:relative; width:100%; z-index:0; transition: all 0.2s; top:0; opacity:0;}
.gallery ul li a .img {position:relative; width:100%; border-radius:1rem; overflow:hidden; z-index:0;}
.gallery ul li a .img:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,152,209,0.7); z-index:2; opacity:0; transition: all 0.2s;}
.gallery ul li a .img:after {content:''; position:absolute; top:50%; left:50%; width:4.5rem; height:4.5rem; background:url('/images/web/cls/main/gallery_symbol.png') no-repeat 50% 50%; transform:translate(-50%, -50%); opacity:0; transition: all 0.2s; z-index:3;}
.gallery ul li a .img img {display:block; width:100%; position:relative; z-index:0;}
.gallery ul li a .tit {margin-top:1.25rem; color:#222; font-weight:700; font-size:0.9rem; width:100%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.gallery ul li a .date {display:flex; justify-content:flex-end; font-size:0.75rem; color:#666666; font-weight:400;}
.gallery ul li a:hover,
.gallery ul li a:focus {top:-1.5rem;}
.gallery ul li a:hover .img:before,
.gallery ul li a:focus .img:before {opacity:1;}
.gallery ul li a:hover .tit,
.gallery ul li a:focus .tit {text-decoration:underline;}
.gallery ul li a:hover .img:after,
.gallery ul li a:focus .img:after {opacity:1;} 



/* 계열 소개 */
.MC_wrap3 {height:42.5rem; position:relative; background:#113a6b; z-index:0; display:flex; align-items:center; justify-content:center;}
.MC_wrap3:before {content:''; position:absolute; width:32.5rem; height:32.5rem; background:url('/images/web/cls/main/wrap3_before_bg.png') no-repeat 50% 50%; right:-8rem; top:-2.5rem; z-index:-1;}
.MC_wrap3:after {content:''; position:absolute; width:32.5rem; height:32.5rem; background:url('/images/web/cls/main/wrap3_after_bg.png') no-repeat 50% 50%; left:-6.5rem; bottom:-13.5rem; z-index:-1;}
.MC_wrap3 .container .heading {color:#fff;}
.MC_wrap3 .container {max-width: 80rem; width: 100%;}
.introduce {width:100%; display:flex; flex-direction:column;}
.introduce ul { display: flex; justify-content: space-between; flex-wrap: wrap; gap:2.5rem; margin-top:3rem;}
.introduce ul li {display:flex; align-items:center; justify-content:center; width: calc(25% - 2.5rem); opacity:0;}
.introduce ul li a {position:relative; width:100%; z-index:0; transition: all 0.2s; top:0;}
.introduce ul li a:before {content:''; position:absolute; bottom:0; width:100%; height:18.5rem; border-radius:1.5rem; z-index:-1;}
.introduce ul li a .box {position:relative; width:calc(100% - 2.5rem); margin:0 auto;}
.introduce ul li a .box .tit {position:absolute; left:50%; top:-0.5rem; z-index:1; height:3rem; width:calc(100% - 5rem); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.1rem; font-weight:600; color:#fff; margin:0 auto; border-radius:0.5rem 0.5rem 1.5rem 1.5rem; transform:translate(-50%, 0);}
.introduce ul li a .box .img {position:relative; background:#fff; width:100%; height:100%; border-radius:1.5rem; height:15rem; overflow:hidden;}
.introduce ul li a .box .img  img {display: block; margin: 0 auto; position: absolute; left: 50%; transform: translate(-50%, 0);}
.introduce ul li a .cont {margin:1.5rem 0 2rem; word-break:keep-all; display:block; text-align:center; font-size:0.75rem; color:#3b3966; font-weight:500;}
.introduce ul li a i {position:absolute; transform:translateY(1rem); bottom:-1.25rem; right:2rem; width:2.5rem; height:2.5rem; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; color:#000; font-size:1.5rem; font-weight:400; opacity:0; transition:all 0.2s;}
.introduce ul li:nth-child(1) a .cont {color:#fff;}
.introduce ul li:nth-child(1) a .box .tit {background:#007aec;}
.introduce ul li:nth-child(2) a .box .tit {background:#008863;}
.introduce ul li:nth-child(3) a .box .tit {background:#e8770f;}
.introduce ul li:nth-child(4) a .box .tit {background:#870fe6;}
.introduce ul li:nth-child(1) a:before {background:#007aec;}
.introduce ul li:nth-child(2) a:before {background:#e1fff7;}
.introduce ul li:nth-child(3) a:before {background:#fff2e6;}
.introduce ul li:nth-child(4) a:before {background:#f4e7ff;}
.introduce ul li a:hover,
.introduce ul li a:focus {top:-1rem;}
.introduce ul li a:hover i,
.introduce ul li a:focus i {opacity:1; transform:translateY(0);}



/* 바로가기 서비스 */
.MC_wrap4 {height:42.5rem; display:flex; align-items:center; justify-content:center;}
.MC_wrap4 .MC_box4 {max-width: 80rem; width: 100%;}
.service ul { display: flex; justify-content: space-between; flex-wrap: wrap; gap:2.5rem 0; margin-top:3rem;}
.service ul li {display:flex; align-items:center; justify-content:center; width: 20%; opacity:0;}
.service ul li a { display: block; position: relative; color: #222; display: flex; justify-content: center; align-items: center; height: 11.75rem; width:11.75rem; margin:0 auto; flex-direction: column; border-radius:50%; transition:all 0.2s;}
.service ul li:nth-child(1) a {background:#f9f9f9;}
.service ul li:nth-child(2) a {background:#ebfaff;}
.service ul li:nth-child(3) a {background:#fff2f1;}
.service ul li:nth-child(5) a {background:#f8f0ff;}
.service ul li:nth-child(7) a {background:#fff7ec;}
.service ul li:nth-child(8) a {background:#e8fff9;}
.service ul li:nth-child(9) a {background:#f1f5ff;}
.service ul li.sr04 p.bg,
.service ul li.sr06 p.bg,
.service ul li.sr10 p.bg {height: 10rem; width:10rem; overflow:hidden; border-radius:50%; margin:0 auto;}
.service ul li a:hover,
.service ul li a:focus {background:#fff; border:1px solid #007aec;}
.service ul li a p { font-size: 1.1rem; font-weight: 600; position: relative; z-index: 2;}
.service ul li a:hover,
.service ul li a:focus { transform: scale(1.1);}


/* 최근 소식 */
.MC_wrap5 {height:44rem; background:#f6f6f6; display:flex; align-items:center; justify-content:center;}
.MC_wrap5 .MC_box5 {max-width: 80rem; width: 100%;}
.MC_wrap5 .container h3.heading {justify-content:flex-start; font-size:1.6rem; font-weight:600; color:#222;}
.MC_wrap5 .container h3.heading + p {font-size:0.8rem; justify-content:flex-start; color:#606060;}
.MC_wrap5 > .container {display:flex; flex-direction:column; gap:4rem; width:100%;}
.list {width:100%; display:flex; align-items:center; justify-content:center; gap:3.7rem;}
.list .calendar {flex-grow:1; width:calc(100% - 39rem); opacity:0;}
.list .calendar .title {display:flex; justify-content:space-between;}
.list .calendar .cal_info {display:flex; flex-direction:column; align-items:flex-end;}
.list .calendar .cal_info .more {width:auto; font-weight:400; border-radius:50%; width:2rem; height:2rem; font-size:1.75rem; border:1px solid #d9d9d9; display:flex; align-items:center; justify-content: center; margin-left:1rem; background:#fff;}
.list .calendar .cal_info .more i {transition:all 0.2s; font-weight:400; font-size:1.2rem; color:#000;}
.list .calendar .cal_info .more:hover i,
.list .calendar .cal_info .more:focus i {transform:rotate(180deg);}
.list .calendar .cal_info p {color:#666666; font-weight:500; font-size:1rem; position:relative; top:0.5rem; right:2rem;}
.list .calendar .cal_info strong {color:#222; font-weight:800;}
.list .calendar .list_box {position:relative; border:1px solid #d9d9d9; border-radius:1rem; padding:1.5rem; margin-top:1.5rem; background:#fff; height:22.5rem;}
.list .calendar .list_box:after {content:''; position:absolute; right:3.5rem; bottom:1.5rem; width:4rem; height:4.15rem; background:url('/images/web/cls/main/img_calendar_bg.png') no-repeat 50% 50%;}
.list .calendar .list_box .item {position:relative; width:100%; height:100%; overflow:auto;}
.list .calendar .list_box .item::-webkit-scrollbar { background-color: rgba(207,207,207,1.0); width: 2px}
.list .calendar .list_box .item::-webkit-scrollbar-track { background-color: transparent;}
.list .calendar .list_box .item::-webkit-scrollbar-thumb { background:rgba(0,0,0,1); border-radius: 0 ;}
.list .calendar .list_box .item ul {display:flex; flex-direction:column; padding-right:1.5rem; padding-bottom:10rem;}
.list .calendar .list_box .item ul > li {height:5rem; border-bottom:1px solid #e2e2e2;}
.list .calendar .list_box .item ul > li:last-child {border-bottom:0;}
.list .calendar .list_box .schedule_box {display:flex; height:100%; align-items:center; padding:0 1.5rem;}
.list .calendar .list_box .schedule_box p {width:33.33%; display:flex; align-items:flex-start; font-size:1rem; color:#222222;}
.list .calendar .list_box .schedule_box p.date {font-size:0.9rem; color:#134b8e; font-weight:900;}
.list .calendar .list_box .schedule_box p.schedule {flex-shrink:0; max-width:5rem; font-weight:600;}
.list .calendar .list_box .schedule_box p.txt {font-weight:400; flex-grow:1;}
.list .calendar .list_box .item ul > li:hover,
.list .calendar .list_box .item ul > li:focus {border-radius:0.5rem; border:1px solid #00b9ff; box-shadow:0 3px 10px rgba(0,152,209,0.2);}

/* 추가 */
.list .notice {width:39rem; height:27.8rem;}
.notice .notice-container {display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto 1fr; width: 100%; height: 100%; position: relative;}
.notice .notice-container .titTab {grid-area: 1 / 1 / 2 / 2; position: absolute; top: 0; left: 0;}
.notice .notice-container .titTab .box1 {position:relative; z-index:2; padding-left:1rem; display:flex; flex-direction:column; gap:0.75rem; margin-top:2rem; }
.notice .notice-container .titTab .box1 > ul {flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:0.75rem;}
.notice .notice-container .titTab .box1 > ul:before {content:''; position:absolute; width:2px; height:calc(100% - 0.5rem); top:0.25rem; background:#cfcfcf; left:0;}
.notice .notice-container .titTab li {position:relative; width: 100%; height:auto; padding:0;}
.notice .notice-container .titTab li:before {content:''; position:absolute; width:2px; left:-1rem; height:calc(100% - 0.5rem); background:#000; top:0.25rem; opacity:0;}
.notice .notice-container .titTab li a {width: 100%; background:transparent; border:0; height:auto; display:block; padding:0; outline:0; font-size:1rem; font-weight:600;}
.notice .notice-container .titTab .box1 li {position:relative; display:flex; z-index:2;}
.notice .notice-container .titTab .box1 li a i {margin-left:1.5rem; opacity:0; transition:all 0.2s;}
.notice .notice-container .titTab .box1 li:hover a i,
.notice .notice-container .titTab .box1 li:focus a i,
.notice .notice-container .titTab .box1 li.active a i {opacity:1;}
.notice .notice-container .titTab .box1 li:hover:before,
.notice .notice-container .titTab .box1 li:focus:before, 
.notice .notice-container .titTab .box1 li.active:before {opacity:1;}
.notice .notice-container .tabWrap {grid-area: 2 / 1 / 3 / 3; display: none; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 1.5rem; position: relative;}
.notice .notice-container .tabWrap > div {max-width:17.8rem;}
.notice .notice-container .tabWrap .box2 {grid-area: 1 / 2 / 2 / 3;}
.notice .notice-container .tabWrap .box3 {grid-area: 2 / 1 / 3 / 2;}
.notice .notice-container .tabWrap .box4 {grid-area: 2 / 2 / 3 / 3;}
.notice .notice-container .tabWrap a {position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; gap:1.2rem; width:100%; height:100%; border-radius:1rem; outline:1px solid #929292; background:#fff; padding:2rem 1.5rem; z-index:0; opacity:0;}
.notice .notice-container .tabWrap a:before {content:''; position:absolute; right:0; bottom:0; opacity:0; transform:translateX(100%); width:15rem; height:8rem; background:url('/images/web/cls/main/notice_before.png') no-repeat 50% 50%; transition:all 0.2s; z-index:-1;}
.notice .notice-container .tabWrap a .tit {height:3.2rem; font-size:1rem; color:#111111; font-weight:600; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; flex-shrink: 0; transition:all 0.2s;}
.notice .notice-container .tabWrap a .txt {height:2.2rem; font-size:0.8rem; line-height:1.4; color:#666666; font-weight:500; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; flex-shrink: 0; margin-top: auto;}
.notice .notice-container .tabWrap a .date {display:flex; justify-content:flex-end; color:#666666; font-size:0.75rem;}
.notice .notice-container .tabWrap a:hover,
.notice .notice-container .tabWrap a:focus {outline:2px solid #00b9ff;}
.notice .notice-container .tabWrap a:hover:before,
.notice .notice-container .tabWrap a:focus:before {opacity:1; transform:translateX(0rem);}
.notice .notice-container .tabWrap a:hover .tit,
.notice .notice-container .tabWrap a:focus .tit {color:#00b9ff;}

.notice .notice-container .tabWrap.on {display:grid;}

/* 오시는 길 */
.MC_wrap6 {background:#363a55; display:flex; align-items:center; justify-content:center;}
.MC_wrap6 > .container {position:relative; width:100%; height:100%; align-items:flex-end; justify-content:flex-end;}
.MC_wrap6 > .container .title {position:absolute; opacity:0; left:0; top:calc(50% - 8rem); transform:translate(0, -50%); width:100%; display:flex; flex-direction:column; align-items:flex-start; color:#fff; z-index:2;}
.MC_wrap6 > .container .heading {color:#fff;}
.MC_wrap6 .container h2.heading + p {justify-content:flex-start; color:#fff;}
.MC_wrap6 .container h2.heading a {width:auto; font-weight:400; border-radius:50%; width:2rem; height:2rem; font-size:1.75rem; border:1px solid #d9d9d9; display:flex; align-items:center; justify-content: center; margin-left:1rem;}
.MC_wrap6 .container h2.heading a i {transition:all 0.2s; font-weight:400; font-size:1.2rem;}
.MC_wrap6 .container h2.heading a:hover,
.MC_wrap6 .container h2.heading a:focus {top:0;}
.MC_wrap6 .container h2.heading a:hover i,
.MC_wrap6 .container h2.heading a:focus i {transform:rotate(180deg);}
/*.map_link {height:3rem; background:#e1485a; color:#fff; font-size:0.9rem; font-weight:700; border-radius:1.5rem; display:flex; align-items:center; justify-content:center; margin-top:2rem; width:9.5rem; gap:0.5rem; transition:all 0.2s;}
.map_link i {font-size:1.2rem; font-weight:400;}
.map_link:hover,
.map_link:focus {background:#ce4454;}
.map_area {position:relative; bottom:0; width:66.5rem; height:45rem; opacity:0; background:url('/images/web/cls/main/map.png') no-repeat 100% 100%;}
.map_area .point_icon {position:absolute; opacity:0; transform: translate(-50%, -50%); display:flex; flex-direction:column; gap:0.5rem; }
.map_area .point_icon em {background:rgba(49,128,221,0.8); border-radius:0.75rem; padding:0.3rem 0.5rem; font-size:0.8rem; color:#fff; font-weight:700;}
.map_area .point_icon span {position: relative; z-index: 0; display:block; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: #35c8ff;}
.map_area .point_icon span:before {content:''; width:100%; height:100%; position:absolute; border-radius:50%; background:#35c8ff; z-index:1;}
.map_area .point_icon span:after {content: ''; position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(255, 255, 255, 0.75); animation: siteSpread 1.5s infinite linear; transform-origin: top left; z-index: 0;}
.map_area .point_icon:nth-child(1) {align-items:flex-end;}
.map_area .point_icon:nth-child(2) {align-items:center;}
.map_area .point_icon:nth-child(4) {align-items:center;}*/

.map h2.heading {display: flex; color: #fff;}
.map .more {width:auto; font-weight:400; border-radius:50%; width:2rem; height:2rem; font-size:0.9rem; border:1px solid #d9d9d9; display:flex; align-items:center; justify-content: center; margin-left:1rem;}
.map_link {display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 2rem; width: 9.5rem; height: 3rem; font-size: 0.9rem; font-weight: 700; color: #fff; background: #e1485a; border-radius: 1.5rem; transition: all 0.2s;}
.map_link i {font-size: 1.2rem; font-weight: 400;}
.map_link:hover,
.map_link:focus {background: #ce4454;}
.map_lst {display: flex; margin-top: 5rem; width: 100%; flex-wrap: wrap; gap: 1rem;}
.map_lst .point_icon {position: relative;}
.map_lst .point_icon em {font-size: 0.8rem; text-shadow: none;}
.map_area {text-align: center; line-height: 0;}
.map_area .map_box {position: relative; display: inline-block; margin: 0 auto;}
.map_area img {max-width: 100%; font-size: 0;}
.point_door {position: absolute; display: inline-block; padding: 0 0.75rem; height: 1.5rem; line-height: 1.5rem; font-size: 0.75rem; white-space: nowrap; background: #656985; border-radius: 0.75rem;}

.map_area .point_icon {position:absolute; opacity:0; transform: translate(-50%, -50%); display:flex; flex-direction:column; gap:0.5rem; }
.map_area .point_icon em {background:rgba(49,128,221,0.8); border-radius:0.75rem; padding:0.3rem 0.5rem; font-size:0.8rem; color:#fff; font-weight:700;display: flex; height: 1.5rem; align-items: center;}
.map_area .point_icon span {position: relative; z-index: 0; display:block; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: #35c8ff;}
.map_area .point_icon span:before {content:''; width:100%; height:100%; position:absolute; border-radius:50%; left:50%; top:50%; transform:translate(-50%, -50%); background:#35c8ff; z-index:1;}
.map_area .point_icon span:after {content: ''; position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(255, 255, 255, 0.75); animation: siteSpread 1.5s infinite linear; transform-origin: top left; z-index: 0;}

.map_area .spot1 {top: 31.5%;left: 41.2%;}
.map_area .spot1 span {margin:0 auto;}
.map_area .spot2 {top: 29.5%;left: 53.5%;}
.map_area .spot3 {top: 40.3%;left: 53%;}
.map_area .spot4 {top: 85.8%;left: 78.7%;}
.map .rsp_img {display: none;}

/* 이미지 사이즈 : 확대보기 */
.rsp_img {position: relative; width: auto; max-width: 100%; line-height: 0;}
.rsp_img img {max-width: 100%;}
.rsp_img .zoom {width: 100%;}
.rsp_img .btn-zoom {position: absolute; bottom: 0; right: 0; width: 45px; height: 45px; display: block; z-index: 1; background: url("/images/web/cls/layout/ico_rsp_img.png") no-repeat;}



#myMenu {position:fixed; top:50%; left:1rem; transform:translate(0, -50%); z-index:5;}
#myMenu > li > a {position: relative; display: block; padding-left: 1rem; height: 1.5rem; font-size: 0.75rem; font-weight: 600; cursor:pointer;}
#myMenu > li > a:before {position: absolute; top: calc(50% - 5px); left: 0; width: 10px; height: 10px; background: transparent; border:1px solid #ccc; border-radius: 50%; content: ""; z-index: 2;}
#myMenu > li > a span {display: inline-block; line-height: 1.5rem; opacity: 0; transition: all 0.15s; color:#ddd; }
#myMenu > li > a:hover span,
#myMenu > li > a:focus span,
#myMenu > li > a.active span {opacity: 1; color:#0098d1;}
#myMenu > li > a.active:before {background: #0098d1; border-color:#0098d1;}
#myMenu > li > a.active::after {opacity: 1;}

@keyframes rotate {
  from {transform: translate(-50%, -50%) rotate(0deg);}
  to {transform: translate(-50%, -50%) rotate(360deg);}
}

@keyframes siteSpread {
    0% {transform: scale(1) translate(-50%, -50%); opacity: 1;}
    100% {transform: scale(2.5) translate(-50%, -50%); opacity: 0;}
}





@media (max-width: 1760px) {
	#myMenu {display:none;}
	.MC_wrap6 {height:auto;}
	.MC_wrap6 > .container {align-items:center;}
	.map_area {width:100%; background-size:cover; background-position:50% 50%;}
}


@media (max-width: 1600px) {	
	.section > .container {max-width:100%; padding:0 1rem;}	
	.MC_wrap6 > .container {padding:0;}
	.MC_wrap6 > .container .title {left:1rem;}
}


@media (max-width: 1280px) {
	#header {position:relative;}
	.MC_wrap1 {height:auto;}
	.MVisual {position:relative;}
	.MC_wrap1 .container {position:absolute; width:100%; top:0;}
	.MC_wrap1 .container .control {left:1rem;}
	.MVisual .item .txt {top:-2rem; height:100%; justify-content:center; padding:0 1rem;}
	.MVisual .item .txt p {font-size:2rem;}
	.MVisual .item .txt p.sub {font-size:1rem;}
	.MVisual .item img {width:100%; height:auto;}
	.MVisual_panel {height:calc(100% - 0.5rem); bottom:0.5rem;}
	.MVisual_panel .panel_wrap {overflow:auto; padding:1.5rem; border-radius:0;}
	.MVisual_panel .panel_btn a {background-size:contain;}
	.panel_accordion .tit {height:3.5rem; font-size:0.9rem;}
	.MC_wrap2 {height:auto; padding:2rem 0 3rem;}
	.MC_wrap3,
	.MC_wrap4,
	.MC_wrap5 {height:auto; padding:5rem 0;}
	.gallery ul li {width:calc(50% - 2rem);}
	.introduce ul {gap:3rem 1rem;}
	.introduce ul li {width:calc(50% - 1rem);}
	.service ul {justify-content:space-around;}
	.service ul li {width:25%;}
	.service ul li.sr04,
	.service ul li.sr10 {display:none;}	
	.MC_wrap5 > .container {gap:2rem;}
	.list {flex-direction:column; gap:2rem;}
	.list .notice,
	.list .calendar {width:100%;}	
	.notice .notice-container .tabWrap > div {max-width:100%;}
}

@media (max-width: 900px) {
	.gallery ul {gap:1rem 2rem;}
	.gallery ul li {width:calc(50% - 1rem);}
	.gallery ul li a .tit {white-space:normal;}
	.service ul li {width:33.33333%;}
	.service ul li.sr10 {display:block;}
	/* 오시는 길 */
	.map .title,
	.map_area {display: none;}
	.map .rsp_img {display: block;}
	
	.MC_wrap6 > .container .title {left:2rem; width:20rem; top: auto; bottom: 2rem; transform: translate(0, 0) !important;}
	.map_link {width:7.5rem; height:2.5rem; margin-top:1rem;}
}



@media (max-width: 620px) {
	h2.heading + p,
	.MC_wrap5 .container h3.heading + p {text-align:center;}
	.MVisual {min-height:15rem;}
	.MVisual .item .txt p {font-size:1.25rem;}
	.MVisual .item .txt p.sub {font-size:0.85rem;}
	.MVisual .item img {height:100%; width:auto; max-height: 15rem;}
	.gallery ul,
	.introduce ul {flex-direction:column;}
	.gallery ul li,
	.introduce ul li {width:100%;}
	.service ul {gap:1rem;}
	.service ul li {width:calc(50% - 1rem);}
	.service ul li.sr10 {display:none;}
	.service ul li a {width:8rem; height:8rem;}
	.service ul li.sr06 p.bg {width:6rem; height:6rem;}
	.service ul li a .img {width:2.5rem; height:2.5rem;}
	.service ul li a .img img {width:100%;}
	.service ul li a p {font-size:0.85rem;}
	.gallery ul li:nth-child(1) {align-items:center; margin-bottom:2rem;}
	
	.list .notice ul {flex-direction:column; gap:1rem;}
	.list .notice ul li {width:100%;}
	.list .notice ul li:nth-child(1) {display:flex; height:auto; align-items:center;}
	.list .notice ul.tab {display:flex; width:100%; padding:0; flex-direction:row; border-bottom:1px solid #ddd; padding-bottom:0.5rem;}
	.list .notice ul.tab:before {display:none;}
	.list .notice ul.tab > li:before {display:none;}
	.list .notice ul.tab li {width:33.33333%;}
	.list .calendar .cal_info p {right:0;}
	
	.MC_wrap5 .container h3.heading {text-align:center;}
	.list .calendar .title {flex-direction:column;}
	.list .calendar .cal_info {align-items:center;}
	.list .calendar .cal_info .more {margin-left:0; margin-top:0.5rem;}
	.list .calendar .list_box .item ul > li {height:auto;}
	.list .calendar .list_box .schedule_box {padding:1rem; flex-direction:column; align-items:flex-start;}
	.list .calendar .list_box .schedule_box p {width:100%; font-size:0.85rem;}
	.list .calendar .list_box:after {background-size:contain;}	
	.MVisual_panel.active {width:100%;}
	
	.list .notice {height:auto;}
	.notice .notice-container .titTab {position:relative;}
	.notice .notice-container {grid-template-columns: 1fr; grid-template-rows: auto;}
	.notice .notice-container > .box1 li {flex-direction:row; margin:2rem 0 1rem;}

	.notice .notice-container .tabWrap {flex-direction:column;}
	.notice .notice-container .tabWrap.on {display:flex;}
}


@media (max-width: 520px) {
	.MC_wrap6 > .container .title {opacity:1;}
	.MC_wrap6 > .container .heading {font-size:1.3rem;}
	.MC_wrap6 .container h2.heading a {width:1.5rem; height:1.5rem;}
	.MC_wrap6 .container h2.heading + p {margin-top:0.3rem;}
}

@media (max-width: 340px) {
	.service ul li a {width:6rem; height:6rem;}
}