@charset "utf-8";
@import url('/common/font/atomy/atomy.css');
/*
	-----------------------------------------------
	* main.css (포털 메인)
	-----------------------------------------------
*/

#m_conts .inner.pos-rel {position:relative;}
#m_conts .inner:after {content:""; display:block; clear:both;}

.visualWrap,
.boardWrap,
.broadWrap,
.citizenWrap {padding-left:3rem !important; padding-right:3rem !important;}

@media all and (max-width:1024px) {
	.visualWrap,
	.boardWrap,
	.broadWrap,
	.citizenWrap {padding-left:2rem !important; padding-right:2rem !important;}
}
@media all and (max-width:380px) {
	.visualWrap,
	.boardWrap,
	.broadWrap,
	.citizenWrap {padding-left:1rem !important; padding-right:1rem !important;}
}


body.stop_scrolling {overflow:hidden;}
body.stop_scrolling .headWrap,
body.stop_scrolling #gnbWrap,
body.stop_scrolling .nuri_txt {z-index:1 !important;}

.both {display:block; clear:both;}
hr {border:none; padding:0; margin:0; height:auto;}

.popup-slide-view {display:none;position:fixed;top:0;left:0;right:0;bottom:0;padding: 1em 0;background:rgba(0,0,0,0.3);z-index:9999999;}
.popup-slide-view .popup {position:absolute;margin:0 auto;font-size:1em;top:50%;margin-top: -24em;left:50%;margin-left:-43em;width:85em;height: 45em;max-width:100%;z-index:1;background:#C8E9FF;border-radius:15px;box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);-webkit-box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);-moz-box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);}
.popup-slide-view .popup:after {content:"";display:block;position:absolute;top: 10em;left:0; right:0; bottom:0; background:#fff; z-index:-1;}
.popup-slide-view .pop-title {display:block;position:relative;text-align:left;padding:2.5em 4.18em 2.5em;}
.popup-slide-view .pop-title p {display:inline-block; position:relative; width:auto; height:auto; left:auto; font-size:3rem; font-weight:800; color:#216cda;}
.popup-slide-view .pop-title p:after {content:""; display:block; position:absolute; right:-1.5em; top:-.1em; width:1.3111em; height:1.08888em; background:url('../img/main/ico_gc_title.png') no-repeat 50% 50%; background-size:contain;}
.popup-slide-view .pop-title strong {color:#0a3a7b; font-weight:800;}
.popup-slide-view .pop-title .info {display:block; float:right;}
.popup-slide-view .pop-title span {display:block; padding-top:.5em; font-size:1em; color:#333333;}
.popup-slide-view .pop-title span > em,
.popup-slide-view .pop-title span > i {color:#1F73E6;}
.popup-slide-view .visual-goto {display:block;position:absolute;right:2em;top:-1.5em;overflow:hidden;text-indent:-999px;width:3.75em;height:3.75em;background:url('../img/main/ico_pop_close.png') no-repeat 50% 50% #3c4756;background-size:2.2rem auto;border-radius:9em;z-index:101;}
.popup-slide-view .list {display:block;padding:40px;background: #fff;border-radius:15px 0 15px 15px;}
.popup-slide-view .list ul:after {content:""; display:block; clear:both;}
.popup-slide-view .list ul::-webkit-scrollbar {width: 8px; height: 8px;}
.popup-slide-view .list ul::-webkit-scrollbar-thumb {background: #1273d7; border-radius: 10px;}
.popup-slide-view .list ul::-webkit-scrollbar-thumb:hover{background: #1273D7;}
.popup-slide-view .list ul::-webkit-scrollbar-track{background: #eaf0f5; border-radius: 8px;}
.popup-slide-view .list ul {overflow:auto;height: 35em;padding-right:1.3em; display:flex; flex-wrap:wrap;}
.popup-slide-view .list li {display: block; position:relative; box-sizing:border-box; width:33.33%; padding:10px; border-radius:10px; overflow:hidden;}
.popup-slide-view .list li a {position:relative; width:100%; height:0; border-radius:1em; overflow:hidden;}
.popup-slide-view .list li a img {position:absolute; top:0; left:0;}
.popup-slide-view .list li img {width:100%; height:auto; border-radius:1em;}
.popup-slide-view .list li span,
.popup-slide-view .list li a {display:block; position:relative; padding:0;}
.popup-slide-view .list li strong {display:block; font-size:1em; color:#333; font-weight:600; line-height:1.2; padding-top:.5em; text-align:center;}

.mainVisual .popup-slide-view .list li a {padding-top:54.83%;}
.mainPopup .popup-slide-view .list li a {padding-top:84.21%;}

@media all and (max-width:1040px) {
	.popup-slide-view .popup {left:1em; right:1em; width:auto; margin-left:0;}
}

@media all and (max-height:914px) {
	.popup-slide-view {overflow:auto;}
	.popup-slide-view .popup {/* position:relative; *//* margin:0 auto; *//* left:auto; *//* right:auto; *//* top:auto; *//* bottom:auto; *//* height:auto; *//* min-height:100%; */}
	.popup-slide-view .popup-body {height:auto; min-height:37em;}
}

@media all and (max-width:1024px) {
	.popup-slide-view {padding:0;}
	.popup-slide-view .visual-goto {top:2em; right:1em; width:3em; height:3em;}
	.popup-slide-view .popup  {position:relative; top:auto; left:auto; right:auto; bottom:auto; width:100%; height:auto; min-height:100%; border-radius:0; margin:0;}
	.popup-slide-view .list {padding:1em;}
	.popup-slide-view .pop-title {padding:2em 1em;}
	.popup-slide-view .pop-title p {font-size:1.6em;}
	.popup-slide-view .pop-title .info {float:unset; margin-top:.5em;}
	.popup-slide-view .list ul {padding-right:0; height:auto;}
	.popup-slide-view .list li {display:inline-block; vertical-align:top;}
}

@media all and (max-width:640px) {
	.popup-slide-view .popup .list li {width:100%; float:none;}
}


/****************************************************************
	Visual Area
****************************************************************/

.visualWrap {display:block; /*position:relative;*/ padding: 8rem 0rem 3rem; /* max-width:1800px; */ margin:0 auto; background: linear-gradient(#f3f3ff , #fefeff); background-color: #f1f1ff; border-top: 1px solid #ddd; box-sizing:border-box; z-index:9999999;}
.visualWrap:before,
.visualWrap:after {content:""; display:block; position:absolute;}
.visualWrap:before {top:0; left:0; width:30.9rem; height:29.5rem; background:url('../img/main/bak_visual_acc01.png') no-repeat 0 0; background-size:contain;}
.visualWrap:after {bottom:0; right:0; width:50.6rem; height:26.2rem; background:url('../img/main/bak_visual_acc02.png') no-repeat 100% 100%; background-size:contain;}
.visualWrap > .inner {z-index:1;}

.visualWrap hr {height:5rem;}

.mainCorona {display:block;position:relative;width: 36rem;float:right;z-index:999;}
.mainCorona .tit {margin-bottom:1.6rem; margin-left: 1rem;}
.mainCorona .tit strong {display:inline-block;vertical-align:middle;font-weight:800;font-size:2.4rem;color: #333;font-family:'atomy', sans-serif;margin-right:1rem;}
.mainCorona .tit strong span{color:#2128ab;}
.mainCorona .tit .more {display:inline-block;vertical-align:middle;font-size: 1.7rem;color: #333;background:#fff;border-radius:9em;height: 3rem;width: 12.5rem;text-align:center;border: 1px solid #ddd;line-height: 2.8rem;}
.mainCorona .con {border-radius:.8rem; overflow:hidden;}
.mainCorona table {width:100%;table-layout:fixed;background: #0e9b87;text-align:center;}
.mainCorona table th,
.mainCorona table td {border: 1px solid #10a791;font-size:1.7rem;padding:1.2rem 1rem;color:#ffffff;}
.mainCorona table thead th {background: #128b7a;}
.mainCorona table tbody th {color:#fffa61; font-weight:800;}
.mainCorona table tbody td {font-weight:800;}
.mainCorona table tbody td#coronaCnt1 {color:#fffa61; font-weight:800;}

.mainCorona ul li {display:block;position:relative;width:50%;padding:1rem;float:left;}
.mainCorona li a {display:block;position:relative;color:#46474f;text-indent:-999px;background-repeat:no-repeat;background-position:50% 50%;border-radius:.8rem;overflow:hidden;width:100%;height:160px;}
.mainCorona li:nth-of-type(1) a {padding: 1rem;background-image:url('../img/main/img_banner01.png');}
.mainCorona li:nth-of-type(2) a {padding: 4rem 3rem 4rem;background-image:url('../img/main/img_banner02.png');}

.mainSearch {display:block;position:absolute;top:0;left: 43rem;right: 43rem;z-index:1;}
.mainSearch:after {content:""; display:block; position:absolute; top:-1.4rem; right:-3.6rem; z-index:-1; width:21.3rem; height:6.5rem; background:url('../img/main/bak_visual_search.png') no-repeat 100% 0; background-size:contain;}
.mainSearch .total_search {display:block;position:relative;padding-right:9rem;height:7rem;border-radius: 1rem;background:#fff;overflow:hidden;z-index:0;margin-bottom:2.4rem;border: 2px solid #d3d4df;}
.mainSearch .total_search input[type="text"] {display:block; position:relative; width:100%; height:100%; border:none; padding-left:2rem; font-size:2rem;}
.mainSearch .total_search input[type="submit"] {display:block; position:absolute; top:0; right:0; width:9rem; height:100%; text-indent:-999px; background:url('../img/main/ico_main_search.png') no-repeat 50% 50%; background-size:3.1rem auto; overflow:hidden;}
.mainSearch .papular {display:table; width:100%; table-layout:fixed;}
.mainSearch .papular > * {display:table-cell; vertical-align:middle;}
.mainSearch .papular dt {color: #2128ab;font-size:1.7rem;width:5em;white-space:nowrap;font-weight:800;}
.mainSearch .papular dd a {color: #555;margin-left:1.6rem;font-sizE:1.7rem;display:inline-block;vertical-align:middle;}
.mainSearch .papular dd a:before {content:"#";}
.mainSearch .papular dd a:hover {border-bottom:1px solid rgba(255,255,255,.5);}

.mainWeather {display:block;position:relative;float:left;padding: 4rem 3rem 4rem;border-radius:.8rem;overflow:hidden;background:url('../img/main/img_banner.png') no-repeat 0 0;color: #46474f;width: 360px;height: 159px;}
.mainWeather .date {display:block;position:relative;padding:0 1rem;font-family:'atomy', sans-serif;font-size: 1.8rem;margin-bottom: 1.3rem;color: #52535a;letter-spacing: 0;font-weight: 600;}
.mainWeather .con {display:table; width:100%; table-layout:fixed;}
.mainWeather .con > * {display:table-cell; vertical-align:middle;}
.mainWeather .con .icon {width:6.4rem; text-align:center;}
.mainWeather .con .temp {width:8rem;font-size:3.2rem;font-family:'atomy', sans-serif;font-weight: 800;}
.mainWeather .con .temp i {font-size:.8em;}
.mainWeather .con .dust dl {display:table; width:100%; table-layout:fixed;}
.mainWeather .con .dust dl > * {display:table-cell; vertical-align:middle; font-size:1.5rem; padding:.4rem 0;}
.mainWeather .con .dust dt {width:9rem; padding-left:1rem; box-sizing:border-box; font-weight:300;}
.mainWeather .con .dust dd {text-align:center;font-weight:600;color: #0056c1;}

html {scroll-behavior: smooth;}
@media (prefers-reduced-motion: reduce) {html {scroll-behavior: auto;}}

.mainLinkBnr {display: block; position: relative; width:36rem;}
.mainLinkBnr a {display:block; border-radius:0.8rem; overflow:hidden;}
.mainLinkBnr img {display:block; }

.mainVisual {display:block; position:relative; width:62rem; height:34rem; float:left;}
.mainVisual .control {display:block; position:absolute; left:2.5rem; bottom:-2.6rem; padding:0 2rem; height:4rem; border-radius:9em; background:#fff; z-index:1;
	-webkit-box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1);
	-moz-box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1);
	box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1);
}
.mainVisual .control > * {display:inline-block; position:relative; vertical-align:middle; bottom:auto; left:auto; right:auto; top:auto; height:4rem; line-height:3.7rem; font-family:'atomy', sans-serif;}
.mainVisual .control .pager {width:auto; color:#777777; margin-right:1rem;}
.mainVisual .control .pager > * {display:inline-block; position:relative; vertical-align:middle;}
.mainVisual .control .pager em {color: #00A889;font-weight:800;}
.mainVisual .control .pager i {margin:0 .8rem; width:1rem;}
.mainVisual .control .pager i:before {content:""; display:block; position:absolute; top:50%; left:0; right:0; height:1px; background:#999;}
.mainVisual .control button {width:2rem; overflow:hidden; text-indent:-999px;}
.mainVisual .control button:before {content:""; display:block; position:absolute; width:1.2rem; height:1.8rem; top:50%; left:50%; margin-top:-.9rem; margin-left:-.6rem; background:url('../img/main/spr_main.png') no-repeat 0 0; background-size:40rem auto;}
.mainVisual .control button.prev:before {background-position:0 0;}
.mainVisual .control button.next:before {background-position:-4.3rem 0;}
.mainVisual .control button.stop:before {background-position:-2.2rem 0;}
.mainVisual .control button.play {display:none;}
.mainVisual .control button.play:before {background-position:-6.3rem 0;}

.mainVisual .mainVisual_total {display:block; position:absolute; right:2.5rem; bottom:-2.6rem; padding:0 1.2em 0 1em; height:4rem; line-height:4rem; border-radius:9em; background:#fff; z-index:1;-webkit-box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1);-moz-box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1); box-shadow: .2rem .2rem .5rem 0px rgba(0,0,0,0.1);}
.mainVisual .mainVisual_total button.total {position:relative; color:#06A888;}
.mainVisual .mainVisual_total button span.ico {display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; margin-top:-.25em; margin-left:.5em; background:url('../img/main/spr_visual_total.svg') no-repeat 0 0;}

.mainVisual .slider {display:block; position:relative; height:100%; border-radius:.8rem; overflow:hidden;background:url(/portal/img/main/sample_waiting.png) no-repeat 50% 50% #edf1fa;}
.mainVisual .slider .swiper-container {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:0; border-radius:.8rem; overflow:hidden;}
.mainVisual .slider .swiper-container,
.mainVisual .slider .swiper-wrapper,
.mainVisual .slider .swiper-slide {height:100%;}
.mainVisual .slider .swiper-slide {}
.mainVisual .slider .swiper-slide img[src*="noimage"] {opacity:0;}
.mainVisual .slider .swiper-slide > * {display:block;}
.mainVisual .slider .swiper-slide img {display:block;}
.mainVisual .slider .swiper-slide a:focus {content:"";display:block;position:absolute;top:0;left:20px;right:20px;bottom:0;z-index:99;border: 1px solid #000;}


.mainMayor {display:block;position:absolute;bottom:0;right:0;left: 95rem;height:34rem;padding: 2rem 0 0 4rem;overflow:hidden;box-sizing:border-box;border-radius:.8rem;background: #fff url(../img/main/bak_mayor.png) no-repeat 50% 100%;background-size: cover;}
.mainMayor:before {content:"";display:block;position:absolute;max-width:70%;width: 28.8rem;height:31.8rem;background:url('../img/main/img_mayor.png?v=1') no-repeat 100% 100%;background-size:contain;bottom:0;right: 0;}
.mainMayor .tit {display:block; position:relative; margin-bottom:3rem; margin-top: 0.6rem;}
.mainMayor .tit > * {display:block;}
.mainMayor .tit strong {font-size:3.7rem;color:#000;padding-top: 1rem;letter-spacing:-.08em;}
.mainMayor ul {display:block; position:relative;}
.mainMayor li {display:block;position:relative;margin-bottom: 1.3rem;padding-left:1rem;}
.mainMayor li:before {content:""; display:block; position:absolute; width:.5rem; height:.5rem; background:#747474; border-radius: 0.3rem; top:.5em; left:0;}
.mainMayor li a {color:#242424; font-size:1.7rem; line-height:1.2;}

/* 신년 명절 시 시장실 디자인 : 24.1.7. 까지만 적용
.mainMayor.newYear {display:block;position:absolute;bottom:0;right:0;left: 95rem;height:34rem;padding: 4rem 0 0 3rem;overflow:hidden;box-sizing:border-box;border-radius:.8rem;background: #fff url(../img/main/bak_newyear_mayor.png) no-repeat 50% 100%;background-size: cover;}
.mainMayor.newYear:before {content:"";display:block;position:absolute; width: 33rem; height:34rem;background:url('../img/main/img_newyear_mayor.png') no-repeat 100% 100%;background-size:contain;bottom:0;right: 0;}
.mainMayor.newYear .tit {display:block; position:relative; margin-bottom:3rem; margin-top: 0.6rem; font-size:18px;}
.mainMayor.newYear .tit > * {display:block;}
.mainMayor.newYear .tit span em {font-weight:700; color:#2f2f93; font-style:normal;}
.mainMayor.newYear .tit strong {padding-top:1.5rem;}
.mainMayor.newYear .tit strong img {max-width:100%;}

.mainMayor.newYear .newYear-btn {position:relative; margin-top:3rem; margin-bottom:6rem; z-index:5;}
.mainMayor.newYear .newYear-btn a {position:relative; color:#20226e; padding-right:20px; background:url(../img/main/ico_newyear_go.png) no-repeat right center; background-size:17px auto;}
.mainMayor.newYear .newYear-btn a:hover {text-decoration:underline;}
.mainMayor.newYear ul {display:block; position:relative; z-index:5;}
.mainMayor.newYear li {display:inline-block;}
.mainMayor.newYear li + li {margin-left:1rem;}
.mainMayor.newYear li a {display:inline-block; padding:10px 20px; color:#20226e; border:1px solid #20226e; background:rgba(255, 255, 255, .9); border-radius:20px;}
.mainMayor.newYear li a:hover {background:#20226e; color:#fff; transition:ease .1s;}
*/
.mainMayor.newYear:before {width:auto; height:18.7em; left:11.2em; background-image:url(../img/main/img_mayor_chu.png); background-position:100% 100%;}

.mainVisualQuick {display:block;position:relative;float:left;width: 27rem;height:34rem;margin-left: 3rem;background:#fff;border-radius:.8rem;padding:1rem;box-sizing:border-box;}
.mainVisualQuick ul {display:block; position:relative; height:100%;}
.mainVisualQuick li {display:block;position:relative;width:50%;height:50%;float:left;padding: 1.5rem;box-sizing:border-box;text-align:center;}
.mainVisualQuick li a,
.mainVisualQuick li a em,
.mainVisualQuick li a span {display:block; position:relative; white-space:nowrap;}
.mainVisualQuick li a em {width:9rem;height:9rem;border-radius:2.6rem;overflow:hidden;background: #f6f6fa;margin:0 auto 1.5rem;max-width:100%;}
.mainVisualQuick li a em img {display:block; max-width:100%; transition:.3s all; -webkit-transition:.3s all;}
.mainVisualQuick li a:hover em img {transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg);}
.mainVisualQuick li a span {color:#333; font-size:1.7rem;}

@media all and (max-width:1024px) {
	.visualWrap {overflow:hidden;padding: 3em 0 0;}
	.visualWrap hr {display:none;}

	.mainCorona {position:absolute; right:0; }
	.mainCorona a {background:#bac6f8 url(../img/main/img_banner.png) no-repeat 0 0; height:175px;}
	.mainCorona .tit {float: right;}
	.mainCorona .tit strong {font-size:2.5rem;}
	.mainCorona table th,
	.mainCorona table td {height:5.6rem; vertical-align:middle;}
	.mainLinkBnr {margin-bottom:3rem;}

	.mainSearch {position:relative; top:auto; left:auto; right:auto; margin:0 0 4rem;}
	.mainSearch:after {top:18.6rem;}
	.mainSearch .papular dt,
	.mainSearch .papular dd,
	.mainSearch .papular dd a {font-size:1.9rem;}

	.mainVisual {float:none; margin:0 auto 4rem; max-width:100%; height:auto;}
	.mainVisual .slider {height:auto; padding-top:54.8387%;}
	.mainVisual img {max-width:100%;}
	
	.mainMayor {position:relative; left:auto; float:none; margin-right:29rem;}
	/* .mainMayor.newYear {position:relative; left:auto; float:none; margin-right:29rem;} */
	.mainMayor.newYear:before {width:16.9em; left:auto;}
	
	.mainVisualQuick {position:absolute; right:0; bottom:0; float:none;}
}

@media all and (max-width:768px) {
	.mainCorona {position:relative; float:none; margin:0 auto 2rem; right:auto; height:175px;}
	.mainCorona .tit {float: none; text-align:center;}
	.mainLinkBnr {position: relative; margin:0 auto 2rem;}

	.mainWeather {margin-bottom:2rem; padding:2rem 1.5rem;}
	.mainWeather .date {text-align:left;}
	.mainWeather .con {display:table; width:100%;}
	.mainWeather .con > * {display:table-cell; width:auto !important; vertical-align:middle;}
	.mainWeather .con .icon,
	.mainWeather .con .temp {display:table-cell; vertical-align:middle;}
	.mainWeather .con .icon {width:7rem !important;}
	.mainWeather .con .temp {width:7rem !important;}

	.mainWeather .con .dust dt {text-align:left; width:9rem;}
	.mainWeather .con .dust dd {text-align:right; padding-right: 2rem;}

	
	.mainVisualQuick {position:relative; width:auto; height:auto; margin:0 0 2rem; padding:0 1rem;}
	.mainVisualQuick ul {display:table; table-layout:fixed; width:100%;}
	.mainVisualQuick ul > li {display:table-cell; width:25%; text-align:center; vertical-align:middle; height:auto; padding:3rem 0;}
	.mainVisualQuick ul a {}
	.mainVisualQuick li a em {height:auto;}
	.mainVisualQuick li a span {font-size:1.7rem;}

	.mainMayor {margin-right:0; padding:3rem 0 0 4.4rem;}
	/* .mainMayor.newYear {margin-right:0; padding:3rem 0 0 4.4rem;} */

}
@media all and (max-width:640px) {
	/* .mainVisual .control {right:0;} */
}
@media all and (max-width:615px) {

	.mainCorona .tit strong {font-size:2.2rem; margin-right:1rem;}
	.mainCorona .tit .more {width:8rem;}

	.mainSearch {margin:0 0 3rem;}
	.mainSearch .total_search {height:5rem; padding-right:5rem;}
	.mainSearch .total_search input[type="text"] {font-size:1.7rem;}
	.mainSearch .total_search input[type="submit"] {width:5rem; background-size:2.1rem auto;}

	.mainMayor {height:auto; padding:2rem 0 2rem 2.5rem;}
	.mainMayor:before {height:25rem;}
	.mainMayor .tit {margin-bottom:3rem; margin-top: 0;}
	.mainMayor .tit img {height:3.5rem;}
	.mainMayor .tit strong {font-size:3rem; padding-top: 0.8rem;}
	.mainMayor .tit strong img {height:auto;}
	.mainMayor li a {font-size:1.6rem;}
	
	/* .mainMayor.newYear {height:auto; padding:2rem 0 2rem 2.5rem;}
	.mainMayor.newYear:before {height:23rem;}
	.mainMayor.newYear .newYear-btn {margin-top:2.5rem; margin-bottom:3.5rem;} */

	.mainSearch .papular dt,
	.mainSearch .papular dd,
	.mainSearch .papular dd a {font-size:1.7rem;}
}

@media all and (max-width:490px) {
	.mainVisual .control .pager em {font-size:1.6rem;}
	.mainVisualQuick ul > li {padding:2rem 0;}
	.mainVisualQuick li a em {width:7rem; border-radius:1.5rem;}
	.mainVisualQuick li a span {font-size:1.5rem;}
	
	.mainMayor.newYear:before {width:auto; height:17em; left:10em;}
}
@media all and (max-width:420px) {
	.mainCorona {width:100%; height:150px;}
	.mainCorona a {background-size:cover; background-position:center center; height:150px;}
	.mainLinkBnr {width:100%;}
	.mainLinkBnr img {width:100%;}
}
@media all and (max-width:375px) {
	.mainVisualQuick li a em {width:5rem;}
	/*.mainVisualQuick li a span {font-size:1.4rem;}*/
	
	/* .mainMayor.newYear:before {height:22rem;}
	.mainMayor.newYear .tit strong {width:60%;}
	.mainMayor.newYear li + li {margin-left:.75rem;}
	.mainMayor.newYear li a {font-size:15px; padding:8px 15px;} */
	
}




/****************************************************************
	Board Area
****************************************************************/

.boardWrap {display:block;position:relative;padding: 8rem 0 4rem;}
.boardWrap .tit {display:block; position:relative; text-align:center; margin-bottom:4rem;}
.boardWrap .tit span {display:inline; position:relative;}
.boardWrap .tit img {height:4rem;}
.boardWrap .tit span:after {content:""; display:block; position:absolute; top:-4.5rem; right:-5.7rem; width:5.5rem; height:4.9rem; background:url('../img/main/spr_main.png') no-repeat 0 -7.5rem; background-size:40rem auto;}

.boardWrap .group {position:relative; margin-bottom:4rem;}
.boardWrap .group:after {content:""; display:block; clear:both;}

.mainBoard {display:block; position:relative; margin-right:79rem; height:34rem;}
.mainBoard .tabs {padding-right:5rem;background:#f8f8f8;border-radius:.4rem;}
.mainBoard .tabs ul:after {content:""; display:block; clear:both;}
.mainBoard .tabs li button:focus-visible {outline: 2px solid #f16d25;}
.mainBoard .tabs li {width:auto; float:left;}
.mainBoard .tabs li button {display:block; padding:0 .9rem; height:5rem; text-align:center; color:#777;}
.mainBoard .tabs li button.on {color:#fff;background: #2128ab;padding:0 1.8rem;margin-right:1rem;border-radius:.4rem;}
.mainBoard .tabs li button.on span.select_tab{display: block; position: absolute; z-index: -999999; opacity: 0;}
.mainBoard .tabs li button span.select_tab{display: none;}
.mainBoard .tabs li + li button.on {margin-left:1rem;}
.mainBoard .list {display:none;}
.mainBoard .list.on {display:block;}
.mainBoard .list li {display:block; position:relative; padding-left:1rem; line-height:1.2; overflow:hidden;}
.mainBoard .list li + li {margin-top:1.2rem;}
.mainBoard .list li:before {content:""; display:block; position:absolute; width:.3rem; height:.3rem; background:#555; left:0; top:.6em; margin-top:-.15rem;}
.mainBoard .list li a {display:block; position:relative; font-size:1.5rem; color:#555;}
.mainBoard .list li a:focus {display:block; border:solid 2px #000;}
.mainBoard .list li a .subj {display:block; position:relative; max-width:70%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:400;}
.mainBoard .list li a .con {display:none;}
.mainBoard .list li a .name {display:block; position:absolute; top:0; bottom:0; right:9.6rem; letter-spacing:-0.03em;}
.mainBoard .list li a .name:before {content:"["; margin-right:-.3rem;}
.mainBoard .list li a .name:after {content:"]"; margin-left:-.3rem;}
.mainBoard .list li a .name.ty1 {color:#355fe1;}
.mainBoard .list li a .name.ty2 {color:#f65237;}
.mainBoard .list li a .name.ty3 {color:#00a59e;}
.mainBoard .list li a .name.ty4 {color:#e4007f;}
.mainBoard .list li a .name.ty5 {color:#e17600;}
.mainBoard .list li a .date {display:block; position:absolute; top:0; bottom:0; right:0;}
.mainBoard .list li a .date > * {display:inline-block; vertical-align:middle; position:relative;}
.mainBoard .list li a .date i {width:.3em; height:1.2em; overflow:hidden; text-indent:-999px;}
.mainBoard .list li a .date i:before {content:"."; display:block; position:absolute; top:0; left:0; width:100%; bottom:0; text-indent:0; text-align:center; font-weight:800;}
.mainBoard .list li a .date strong {font-weight:400;}
.mainBoard .list li:first-child {padding:0;}
.mainBoard .list li:first-child:before {display:none;}
.mainBoard .list li:first-child a {padding:2.7rem 0 2.7rem 13rem; margin-bottom:1.2rem; border-bottom:1px solid #dddddd;}
.mainBoard .list li:first-child a .name {display:none;}
.mainBoard .list li:first-child a .subj {color:#333; font-size:1.7rem; font-weight:800; max-width:100%;}
.mainBoard .list li:first-child a .con {display:block; position:relative; font-size:1.5rem; color:#333333; line-height:1.4; height:2.9em; overflow:hidden; margin-top:1.9rem;}
.mainBoard .list li:first-child a .date {display:block; position:absolute; width:10rem; height:10rem; border-radius:100%; background:#f8f8f8; color:#333333; text-align:center; padding-top:2rem; box-sizing:border-box; left:0; top:50%; margin-top:-5rem;}
.mainBoard .list li:first-child a .date strong {display:block; font-size:4rem;}
.mainBoard .list li:first-child a .date i ~ i {position:absolute; top:0; right:0; z-index:-999; opacity:0;}
.mainBoard .list .more {display:block; position:absolute; width:5rem; height:5rem; top:0rem; right:0; overflow:hidden; text-indent:-999px;}
.mainBoard .list .more:after {content:""; display:block; position:absolute; width:1.6rem; height:1.6rem; top:50%; left:50%; margin-top:-.8rem; margin-left:-1.1rem; background:url('../img/main/spr_main.png') no-repeat 0 -3.7rem; background-size:40rem auto;}

.mainBoardQuick {display:block;position:absolute;top:0;width:28rem;height:34rem;top:0;right:48rem;border-radius:.8rem;background: #f6f6fa;}
.mainBoardQuick ul {display:block; height:100%;}
.mainBoardQuick ul li {display:block; position:relative; width:50%; height:50%; float:left; box-sizing:border-box;}
.mainBoardQuick ul li:nth-child(2n) {border-left: 1px solid #fff;}
.mainBoardQuick ul li:nth-child(2) ~ li {border-top:1px solid #fff;}
.mainBoardQuick ul li a {display:block; position:relative; padding:1.7rem 1rem 1rem;}
.mainBoardQuick ul li a em {display:block; position:relative; width:8rem; height:8rem; margin:0 auto 1rem; transition:.3s all; -webkit-transition:.3s all;}
.mainBoardQuick ul li a:hover em {transform:translateY(-20%); -webkit-transform:translateY(-20%);}
.mainBoardQuick ul li a span {display:block; position:relative; font-size:1.7rem; color:#333333; text-align:center; line-height:1.2; font-weight:400;}

.mainPopup {display:block;position:absolute;width:45rem;height:34rem;border-radius:.8rem;right:0;top:0;background: #cce8ff;padding:1rem 6rem 1rem 1rem;box-sizing:border-box;}
.mainPopup .control {display:block; position:absolute; top:2rem; right:.4rem; bottom:1.4rem; width:5.6rem;}
.mainPopup .control .pager {text-align:center;}
.mainPopup .control .pager > * {display:block;position:relative;font-family:'atomy', sans-serif;color: #333;}
.mainPopup .control .pager em {color: #333;font-weight:800;}
.mainPopup .control .pager i {width:1px;margin:1rem auto;height:1.5rem;background: #333;}
.mainPopup .control .fr {display:block; position:absolute; left:0; right:0;}
.mainPopup .control button {display:block; position:relative; width:100%; height:2.5rem; overflow:hidden; text-indent:-999px;}
.mainPopup .control button.swiper-button-disabled {opacity:.8;}
.mainPopup .control button:before {content:""; display:block; position:absolute; width:1.8rem; height:1.8rem; top:50%; left:50%; margin-top:-.9rem; margin-left:-.9rem; background:url('../img/main/spr_main.png') no-repeat 0 -3.7rem; background-size:40rem auto;}
.mainPopup .control .play {display:none;}
.mainPopup .control .prev:before {background-position:0 -14.9rem;}
.mainPopup .control .next:before {background-position:0 -19.8rem;}
.mainPopup .control .stop:before {background-position:0 -17.3rem;}
.mainPopup .control .play:before {background-position:-2.4rem -17.3rem;}

.mainPopup .slider {position:relative; overflow:hidden; z-index:0; height:100%;}
.mainPopup .slider .swiper-container {height:100%;}
.mainPopup .slider .swiper-slide {background:url(/common/img/board/sample_noimage.jpg) no-repeat 50% 50% #edf1fa;}
.mainPopup .slider .swiper-slide img[src*="noimage"] {opacity:0;}
.mainPopup .swiper-slide span,
.mainPopup .swiper-slide a,
.mainPopup .swiper-slide img {display:block; position:relative;}
.mainPopup .swiper-slide img {max-width:100%;}
.mainPopup .swiper-slide strong {display:none;}
.mainPopup.fix-scroll .swiper-slide a:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:99; border:10px solid #000;}

.mainPopup .popup_total {position:absolute; bottom:0; left:0; margin-left:.3rem; padding:0 .5rem;}
.mainPopup .control .popup_total .total {background:#5F5F8B; color:#fff; text-indent:0;}
.mainPopup .control .popup_total .total {height: 9.5rem;padding: 1.3rem .2rem 4rem .2rem; border-radius:3rem; line-height:1.3;}
.mainPopup .control .total:before {background: url('../img/main/spr_pop_total.svg') no-repeat 0 0;top:70%; margin-top:-.5rem;}

.mainQuick {display:block; position:relative; /*padding:0 4rem;*/}
.mainQuick .control {/*display:none;*/}
.mainQuick .control > * {display:block; position:absolute; width:4rem; height:14rem; overflow:hidden; text-indent:-999px;}
.mainQuick .control > *:before {content:""; display:block; position:absolute; top:50%; margin-top:-1.1rem; width:1.2rem; height:2.2rem; background:url('../img/main/spr_main.png') no-repeat 0 -10.1rem; background-size:40rem auto;}
.mainQuick .control .prev {left:0;}
.mainQuick .control .prev:before {background-position:-10.1rem 0; left:0;}
.mainQuick .control .next {right:0;}
.mainQuick .control .next:before {background-position:-14.8rem 0; right:0;}
.mainQuick .swiper-slide {/*width:auto;*/ padding:0 1.2rem;}
.mainQuick .swiper-slide a {display:block; position:relative; width:14rem; height:14rem; text-align:center; font-size:1.6rem; color:#000; border-radius:100%; padding:1.7rem 1rem; box-sizing:border-box;}
.mainQuick .swiper-slide a > * {display:block;}
.mainQuick .swiper-slide a em {display:block; position:relative; margin:0 auto; width:7.3rem; height:7.3rem; background:url('../img/main/spr_quick2.png') no-repeat 0 0; background-size:auto 7.3rem;}
.mainQuick .swiper-slide a:hover {color:#fff; background:#0066b4;}
.mainQuick .swiper-slide a:hover em {background-image:url('../img/main/spr_quick2_on.png');}
.mainQuick .swiper-slide a em.ty1 {background-position:2rem 0;}
.mainQuick .swiper-slide a em.ty2 {background-position:-14.4rem 0;}
.mainQuick .swiper-slide a em.ty3 {background-position:-30.4rem 0;}
.mainQuick .swiper-slide a em.ty4 {background-position:-46.5rem 0;}
.mainQuick .swiper-slide a em.ty5 {background-position:-62.4rem 0;}
.mainQuick .swiper-slide a em.ty6 {background-position:-78.5rem 0;}
.mainQuick .swiper-slide a em.ty7 {background-position:-94.5rem 0;}
.mainQuick .swiper-slide a em.ty8 {background-position:-110.6rem 0;}
.mainQuick .swiper-slide a em.ty9 {background-position:-126.7rem 0;}
.mainQuick .swiper-slide a em.ty10 {background-position:-142.7rem 0;}
.mainQuick .swiper-slide a em.ty11 {background-position:-158.7rem 0;}

@media all and (max-width:1024px) {
	.mainBoard {margin-right:0; height:auto; margin-bottom:3rem;}
	.mainBoard .tabs {text-align:center;}
	.mainBoard .tabs li {display:inline-block; vertical-align:middle; float:none;}

	.mainBoardQuick {position:relative; right:auto; margin:2rem 0 3rem; width:auto; height:auto;}
	.mainBoardQuick ul {display:table; table-layout:fixed;  width:100%; height:auto;}
	.mainBoardQuick ul li {display:table-cell; width:25%; float:none; height:auto; vertical-align:top; border:1px solid #fff;}
	.mainBoardQuick ul li a {padding:1.5rem 1rem 1.8rem;}
	.mainBoardQuick ul li a em {width:6rem; height:6rem;}
	.mainBoardQuick ul li a em img {max-width:100%; max-height:100%;}
	.mainBoardQuick ul li a span {word-break:keep-all; font-size:1.5rem;}

	.mainPopupRows {position:relative;background: #cce8ff;margin:0 -2rem;}
	.mainPopup {position:relative; margin:0 auto;}

	.mainQuick {padding:0 4rem;}
	.mainQuick .control {display:block;}
	.mainQuick .swiper-slide {width:auto;}
}
@media all and (max-width:1024px) and (min-width:450px) {
	.mainBoardQuick ul li a span br {display:none;}
}
@media all and (max-width:640px) {
	.boardWrap {padding:5rem 0 2rem; overflow:hidden;}
	.boardWrap .group {margin-bottom:2rem;}
	.boardWrap .tit {margin-bottom:2rem;}
	.boardWrap .tit img {height:3.5rem;}

	.mainBoard .tabs {padding:0; border-radius:0;}
	.mainBoard .tabs li {width:33.33%; float:left; position:relative; z-index:0;}

	.mainBoard .tabs li button {display:block; width:100%; height:6rem; font-size:2rem; border-radius:0; border:1px solid #ddd;}
	.mainBoard .tabs li + li button {border-left-width:0;}
	.mainBoard .tabs li + li button.on {margin-left:0;}
	.mainBoard .tabs li:nth-child(4) button {border-left-width:1px;}
	.mainBoard .tabs li:nth-child(3) ~ li button {border-top-width:0;}
	.mainBoard .tabs li button.on {border-radius:0;}
	.mainBoard .list li a {font-size:1.7rem;}
	.mainBoard .list li:first-child a {padding:4rem 0 4rem 13rem;}
	.mainBoard .list li:first-child a .subj {font-size:2.5rem; white-space:normal; word-break:keep-all; line-height:1.2; height:2.4em; overflow:hidden;}
	.mainBoard .list li:first-child a .con {display:none;}

	.mainBoard .list .more {display:block; position:relative; width:16rem; height:5rem; line-height:5rem; margin:2.5rem auto 0; text-indent:0; text-align:center; font-size:1.7rem; border:1px solid #dddddd; border-radius:9em;}
	.mainBoard .list .more:after {display:inline-block; position:relative; vertical-align:middle; top:auto; left:auto; margin:0; margin-left:.5rem; margin-top:-.4rem;}
	.mainBoard .list li a .name {right:0;}

	.mainBoard .list[data-content="과천소식"] li a .date {display:none;}
	.mainBoard .list[data-content="과천소식"] li:first-child a .date {display:block;}
	.mainPopup .control .pager{font-size:1.6rem;}
	.mainQuick {margin:0 -2rem; padding:0; }
	.mainQuick .control > * {width:3rem; height:10rem; z-index:999;}
	.mainQuick .control .prev {left:1rem;}
	.mainQuick .control .next {right:1rem;}
	.mainQuick .swiper-slide a {width:10rem; height:10rem; font-size:1.4rem; padding:0;}
	.mainQuick .swiper-slide a em {transform:scale(.8); -webkit-transform:scale(.8);}
	.mainQuick .swiper-slide a span {margin-top:-5px;font-size: 1.5rem;}

	.mainBoardQuick ul li a {padding:1.5rem 0 1.8rem;}
	/*.mainBoardQuick ul li a span {font-size:1.2rem;}*/
}
@media all and (max-width:610px) {
	.mainBoard .tabs li button {height:5rem; font-size:1.7rem;}
	.mainBoard .list li:first-child a .subj {font-size:2rem;}
}
@media all and (max-width:450px) {
	.mainPopup {width:auto; height:auto;}
	.mainPopup:before {content:""; display:block; position:relative; padding-top:84.21052631%; z-index:-999;}
	.mainPopup .slider {position:absolute; top:1rem; left:1rem; right:6rem; bottom:1rem; height:auto;}
	.mainBoard .list li a .subj{font-size:1.6rem;}
}
@media all and (max-width:430px) {
	.mainBoard .list li:first-child a {padding:3.5rem 0 3.5rem 8rem;}
	.mainBoard .list li:first-child a .subj {font-size:1.8rem;}
	.mainBoard .list li:first-child a .con {font-size:1.4rem; margin-top:1rem;}
	.mainBoard .list li:first-child a .date {width:7rem; height:7rem; margin-top:-3.5rem; font-size:1.5rem; padding-top:1.5rem;}
	.mainBoard .list li:first-child a .date strong {font-size:2rem;}

	.mainBoard .list li a {font-size:1.4rem;}

	.mainBoard .list .more {height:4rem; /*font-size:1.5rem;*/ line-height:4rem;}
	.mainBoard .list .more:after {transform:scale(.8); -webkit-transform:scale(.8);}

	.mainBoardQuick {margin-left:-1rem; margin-right:-1rem;}
}
@media all and (max-width:380px) {
	.mainWeather {width:90%;}
	.mainLinkBnr img {max-width:100%;}
	.mainCorona {max-width:100%;}
	.mainWeather {width:100%; height:159px; background:#bac6f8 url(../img/main/img_banner.png) no-repeat center center;}

	.mainBoard .tabs li button {font-size:1.6rem; height:4.5rem;}

	.mainBoardQuick ul,
	.mainBoardQuick ul li {display:block;}
	.mainBoardQuick ul {overflow:hidden;}
	.mainBoardQuick ul li {width:50%; float:left;}
	.mainBoardQuick ul li a span {height:2.5em;}

	.mainQuick {margin:0 -1rem;}
	.mainPopupRows {margin:0 -1rem;}
}


/****************************************************************
	Broad Area
****************************************************************/

.broadWrap {display:block;position:relative;padding: 8rem 0 11.5rem;background: url(../img/main/bak_broad.png) no-repeat 50% 50% #dbebfe;background-size:192rem auto;}
.broadWrap.spring {background-image:url(../img/main/bak_broad_spring.png);}
.broadWrap.summer1 {background-image:url(../img/main/bak_broad_summer1.png);}
.broadWrap.summer2 {background-image:url(../img/main/bak_broad_summer2.png);}
.broadWrap .tit {margin-bottom:4rem;}
.broadWrap .tit img {height:4rem;}

.mainBroad {display:block; position:relative; float:left;}
.mainBroad img {display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); max-width:100%;}

.mainBroad > * {width:26rem; position:relative; float:left; margin-right:2rem; box-sizing:border-box; height:40rem;}
.mainBroad .magazine {display:block;}
.mainBroad .magazine a {display:block; position:relative; border-radius:.8rem .8rem 0 .8rem; overflow:hidden; height:100%; background:#fff;
	-webkit-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
	-moz-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
	box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
}
.mainBroad .magazine a:after {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; border:0px solid rgba(0,0,0,.5);}
.mainBroad .magazine a:focus:after {border-width:5px;}

.mainBroad .magazine a span {display:block; position:absolute; bottom:0; right:0; width:12rem; height:4rem; font-size:1.5rem; line-height:4rem; color:#fff; padding-left:1.5rem; box-sizing:border-box; background: #0099a1;}
.mainBroad .magazine a span:after {content:""; display:inline-block; position:relative; margin-left:1rem; vertical-align:middle; width:2.5rem; height:.7rem; background:url('../img/main/ico_magazine.png') no-repeat 50% 50%; background-size:contain;}
.mainBroad .gallery {padding:.4rem 1.4rem 0; background:#fff; border-radius:.8rem; overflow:hidden; margin-right:0; overflow:hidden;
	-webkit-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
	-moz-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
	box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
}
.mainBroad .gallery .title {display:block; padding:2.3rem 0; font-size:2.5rem; color:#2f318f; font-weight:500;}
.mainBroad .gallery a {display:block;}
.mainBroad .gallery a > em {display:block; position:relative; height:23rem; overflow:hidden;}
.mainBroad .gallery a > em > img {display:block; position:absolute; height:100%; width:auto; max-width:50000%; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.mainBroad .gallery a strong {display:block; padding:2rem 0 1.7rem; font-size:1.7rem; color:#333333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainBroad .gallery a i {display:block; font-size:1.5rem; color:#999;}
.mainBroad .gallery .more {display:block; position:absolute; top:1.3rem; right:0; width:4.8rem; height:4.8rem; overflow:hidden; text-indent:-999px;}
.mainBroad .gallery .more:before {content:""; display:block; position:absolute; top:50%; left:50%; margin-top:-.8rem; margin-left:-.8rem; width:1.6rem; height:1.6rem; background:url('../img/main/spr_main.png') no-repeat -4.3rem -3.7rem; background-size:40rem auto;}

.mainSNS {display:block; position:relative; width:79rem; float:right;}
.mainSNS .nav,
.mainSNS .control,
.mainSNS .scrollbar {position:absolute; right:0;}
.mainSNS .control,
.mainSNS .scrollbar {width:100%; max-width:67rem; z-index:1;}
.mainSNS .nav {top:-7.2rem; text-align:right; z-index:2;}
.mainSNS .nav li {display:inline-block; vertical-align:bottom; padding:0 .2rem;}
.mainSNS .nav a {display:block; position:relative; text-indent:-999px; text-align:left; width:4rem; height:4rem; background:#fff; border-radius:100%; overflow:hidden; transition:.3s all; -webkit-transition:.3s all;}
.mainSNS .nav a:hover {transform:translateY(-30%); -webkit-transform:translateY(-30%);}
.mainSNS .nav a:before {content:""; display:block; position:absolute; top:50%; left:50%; margin-top:-1.3rem; margin-left:-1.3rem; width:2.6rem; height:2.6rem; background:url('../img/main/spr_main.png') no-repeat -9.4rem -18.1rem; background-size:40rem auto;}
.mainSNS .nav a.instagram:before {background-position:-14.4rem -18.1rem;}
.mainSNS .nav a.blog:before {background-position:-19.4rem -18.1rem;}
.mainSNS .nav a.youtube:before {background-position:-24.5rem -18.1rem;}
.mainSNS .nav a.kakao:before {background-position:-29.3rem -18.1rem;}
.mainSNS .nav a.gctv {text-indent:0; width:14rem; border-radius:9em; overflow:visible; line-height:4rem; padding:0 1.5rem; color:#fff; background:#f83b36; font-size:1.5rem; white-space:nowrap;}
.mainSNS .nav a.gctv:before {width:1.7rem; height:2.1rem; background-position:-35.5rem -18.3rem; right:2rem; top:-1.1rem; margin:0; left:auto;}

.mainSNS .control {top:-6.6rem;}
.mainSNS .control > * {display:inline-block; position:relative; vertical-align:middle; bottom:auto; left:auto; right:auto; top:auto; height:4rem; line-height:3.7rem; font-family:'atomy', sans-serif;}
.mainSNS .control .pager {width:auto; color:#000; margin-right:1rem;}
.mainSNS .control .pager > * {display:inline-block; position:relative; vertical-align:middle;}
.mainSNS .control .pager em {color:#000; font-weight:800;}
.mainSNS .control .pager i {margin:0 .8rem; width:2rem;}
.mainSNS .control .pager i:before {content:""; display:block; position:absolute; top:50%; left:0; right:0; height:1px; background:#000;}
.mainSNS .control button {width:2rem; overflow:hidden; text-indent:-999px;}
.mainSNS .control button:before {content:""; display:block; position:absolute; width:1.4rem; height:1.8rem; top:50%; left:50%; margin-top:-.9rem; margin-left:-.7rem; background:url('../img/main/spr_main.png') no-repeat 0 0; background-size:40rem auto;}
.mainSNS .control button.prev:before {background-position:-10rem -4.4rem;}
.mainSNS .control button.next:before {background-position:-15.8rem -4.4rem;}
.mainSNS .control button.stop:before {background-position:-12.9rem -4.4rem;}
.mainSNS .control button.play {display:none;}
.mainSNS .control button.play:before {background-position:-18.7rem -4.4rem;}

.mainSNS .scrollbar {bottom:-4.3rem; height:.3rem; background:#fff;}
.mainSNS .swiper-scrollbar-drag {background:#000;}
.mainSNS .swiper-slide {padding:0 1rem 1rem;}
.mainSNS .swiper-slide a {display:block; position:relative; height:40rem; border-radius:1rem; background:#fff; overflow:hidden;
	-webkit-box-shadow: .5rem .5rem .5rem 0px rgba(0,0,0,0.2);
	-moz-box-shadow: .5rem .5rem .5rem 0px rgba(0,0,0,0.2);
	box-shadow: .5rem .5rem .5rem 0px rgba(0,0,0,0.2);
}
.mainSNS .thumb {display:block; position:relative; border-radius:0 0 1rem 1rem; overflow:hidden; height:25rem; margin-bottom:2.5rem;}
.mainSNS .thumb img {display:block; position:absolute; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); height:100%; min-width:100%;}
.mainSNS .thumb .title {display:table; width:100%; height:100%;}
.mainSNS .thumb .title > p {display:table-cell; vertical-align:middle; text-align:center; padding:1em;}
.mainSNS .thumb .title span,
.mainSNS .thumb .title strong {display:block;}
.mainSNS .thumb .title span {display:inline-block; line-height:2.5em; font-size:1.3rem; background:#fff; border-radius:9em; padding:0 1.5em;}
.mainSNS .thumb .title strong {color:#fff; font-size:2.2rem; padding-top:1em; word-break:break-all; line-height:1.4;}
.mainSNS .cate,
.mainSNS .subj,
.mainSNS .con {display:block; padding:0 2rem;}
.mainSNS .cate {display:block; margin-bottom:2rem; font-size:1.6rem; font-weight:600;}

.mainSNS *[data-cate="facebook"] .cate {color:#114395;}
.mainSNS *[data-cate="instagram"] .cate {color:#f7367b;}
.mainSNS *[data-cate="Naver Blog"] .cate {color:#00ab2e;}
.mainSNS *[data-cate="Youtube"] .cate {color:#d62422;}
.mainSNS *[data-cate="kakao"] .cate {color:#391b1b;}

.mainSNS *[data-cate="facebook"] .title {background:#114395; background: linear-gradient(135deg, #114395 0%, #07629b 100%);}
.mainSNS *[data-cate="facebook"] .title span,
.mainSNS *[data-cate="facebook"] .title span * {color:#114395 !important;}

.mainSNS *[data-cate="Naver Blog"] .title {background: rgb(33,216,118); background: linear-gradient(135deg, rgb(0 159 208) 0%, rgb(4 151 148) 100%);}
.mainSNS *[data-cate="Naver Blog"] .title span,
.mainSNS *[data-cate="Naver Blog"] .title span * {color:#238e65 !important;}

.mainSNS *[data-cate="instagram"] .title {background:#d62422; background: linear-gradient(135deg, #feca67 0%, #c8399e 50%, #775ac4 100%);}
.mainSNS *[data-cate="instagram"] .title span,
.mainSNS *[data-cate="instagram"] .title span * {color:#f7367b !important;}

.mainSNS *[data-cate="Youtube"] .title {background: #d62422; background: linear-gradient(135deg, #d62422 0%, #d65122 100%);}
.mainSNS *[data-cate="Youtube"] .title span,
.mainSNS *[data-cate="Youtube"] .title span * {color:#d62422 !important;}

.mainSNS *[data-cate="과천시 인터넷방송"] .cate {color:#f83935;}
.mainSNS .con {font-size:1.5rem; line-height:1.5; color:#333333; height:4.6em; overflow:hidden; letter-spacing:-0.04em;}

@media all and (max-width:1450px) {
	.mainSNS {width:76rem;}
}

@media all and (max-width:1024px) {
	.broadWrap {background: #dbebfe;background-size:auto 60rem;padding-top:0;padding-bottom:10rem;}
	.broadWrap .tit {position:absolute; top:8rem; left:0; right:0; z-index:1;}
	.broadWrap .tit img {display:block; margin:0 auto;}
	.mainBroad {float:none; width:auto; text-align:center; padding:15rem 0 4rem; margin:0 -2rem; background:url('../img/main/bak_broad_mo.png') no-repeat 50% 0; background-size:cover; z-index:0;}
	.mainBroad > * {float:none; display:inline-block !important; text-align:left;}

	.mainSNS {width:auto; float:none; margin:12rem -2rem 0;}
	.mainSNS .control,
	.mainSNS .scrollbar {max-width:100%; width:auto; left:2rem; right:2rem;}
	.mainSNS .nav {right:2rem;}

}
@media all and (max-width:620px) {
	.broadWrap {padding:0 0 8rem; overflow:hidden;}
	.broadWrap .tit {top:5rem;}
	.broadWrap .tit img {height:3.5rem;}

	.mainBroad {padding:10rem 2rem 4rem;}
	.mainBroad > * {height:auto; float:none;  width:auto;}
	.mainBroad .magazine {display:block !important; float:none; margin:0;}
	.mainBroad .magazine a {height:20rem; padding:0 2rem; background:transparent; box-shadow:none; -webkit-box-shadow:none; border-radius:0; overflow:hidden; border-bottom:2px solid #fff;}
	.mainBroad .magazine a em {display:block; position:absolute; top:1rem; left:2rem; bottom:0; max-width:70%; transform:translate(0); -webkit-transform:translate(0); border-radius:.8rem .8rem 0 0; overflow:hidden;
		-webkit-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
		-moz-box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
		box-shadow: .5rem .5rem 1rem 0px rgba(0,0,0,0.2);
	}
	.mainBroad .magazine a em img {position:relative; transform:translate(0); -webkit-transform:translate(0); top:auto; left:auto;}
	.mainBroad .magazine a span {right:2rem; bottom:auto; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:12rem; height:12rem;font-size: 1.7rem;line-height:1.2; box-sizing:border-box; padding:4.5rem 0 0; text-align:center; border-radius:100%;}
	.mainBroad .magazine a span:after {display:block; margin:1rem auto 0;}

	.mainBroad .gallery {display:block !important; margin-top:4rem;}
	.mainBroad .gallery .title {font-size:2.3rem; padding:1.5rem 0;}
	.mainBroad .gallery .more {top:0;}
	.mainBroad .gallery .list a {display:table; table-layout:fixed; width:100%; padding:0 0 1.5rem 0;}
	.mainBroad .gallery .list a > * {display:table-cell; vertical-align:middle;}
	.mainBroad .gallery .list a > em {width:15rem; height:9.5rem;}
	/* .mainBroad .gallery .list a > em img {display:block; max-width:100%; height:auto; position:relative; top:auto; left:auto; transform:translate(0); -webkit-transform:translate(0);} */
	.mainBroad .gallery .list a > span {padding:1rem; padding-right:0; vertical-align:top;}
	.mainBroad .gallery .list a > span strong {padding-top:0; /*font-size:1.6rem;*/ white-space:normal; word-break:keep-all; line-height:1.4;}
	/*.mainBroad .gallery a i {font-size:1.3rem;}*/
	.mainSNS .control .pager{font-size:1.6rem;}
	.mainSNS {margin-top:2rem;}
	.mainSNS .nav {position:relative; top:auto; left:auto; right:auto; margin-bottom:0rem; text-align:center;}
	.mainSNS .nav ul > * {margin:1rem 0;}
	.mainSNS .control {top:auto; position:relative; text-align:right; width:auto; left:auto; right:auto; padding:0 2rem;}
}
@media all and (max-width:380px) {
	.mainSNS {margin-left:-1rem; margin-right:-1rem;}

	.mainBroad .gallery .list a,
	.mainBroad .gallery .list a > * {display:block; width:auto !important; height:auto !important;}
	.mainSNS .thumb {height:20rem;}
	.mainSNS .swiper-slide a {height:36rem;}
}



/****************************************************************
	Calendar Wrap
****************************************************************/
.calendarWrap {position:relative; padding:9.5rem 0;}
.calendarWrap:before {content:""; position:absolute; top:0; left:0; z-index:-1; width:180rem; height:32rem; display:block; border-radius:0 0 13rem 0; background:#F7EBF0 url(../img/main/main_calendar_bg.svg) no-repeat 50% 50%;}
.calendarWrap:after {content:""; position:absolute; top:0; bottom:0; left:0; right:0; z-index:-2; background:url(../img/main/main_calendar_obj.png) no-repeat 0 100%; background-size:contain;}
.calendarWrap h4  {position:relative; margin-bottom:5rem;}
.calendarWrap h4:before {content:""; position:absolute; top:0; left:0; margin-top:-4.6rem; width:22.1rem; height:19.4rem; background:url(../img/main/main_calendar_tit_obj.png) no-repeat 50% 50%; background-size:contain;}
.calendarWrap h4 > * {display:block;}
.calendarWrap h4 strong {font-size:4.2rem; font-weight:600; margin-bottom:1.5rem;}


.mainCalendar .calendar-top {position:relative;}
.mainCalendar .calendar-top select::-ms-expand {display:none;}
.mainCalendar .calendar-top select {position:relative; padding:0 1.5em 0 0.8rem; font-weight:600; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; font-size:2.6rem; border:0; background:url(../img/main/ico_cal_select.svg) no-repeat top 50% right 0.5rem; background-size:2.4rem auto;}
.mainCalendar .calendar-top option {font-size:1.6rem;}
.mainCalendar .calendar-top button {padding:0.5rem 1.4rem; font-size:1.5rem; border-radius:2rem;}
.mainCalendar .calendar-top .btn-today {position:absolute; top:0; right:0; border:1px solid #dedede; color:#777;}
.mainCalendar .calendar-top .btn-go {background-color:#334266; color:#fff;}
.mainCalendar .calendar-top .btn-go:focus {outline:2px dashed red;}

.mainCalendar > * {padding:4rem 5.5rem; border-radius:2rem;}
.mainCalendar #yhdCalendar {margin-top:2rem;}
.mainCalendar .calendar-box {background:#fff; box-shadow:.5rem .5rem 1em rgba(0,0,0,0.25);}
.mainCalendar table {width:100%;}
.mainCalendar th {width:14.285%; font-weight:600; height:5.4rem; line-height:5.4rem; background:#FAFAFA;}
.mainCalendar td {position:relative; text-align:center; height:7.3rem; padding:0 0.25em; font-weight:500;}
.mainCalendar tbody td > * {display:inline-block; width:100%; border-radius:0.5em; line-height:7.3rem;}
.mainCalendar tbody td > a {box-sizing:border-box; line-height:7.3rem;}
.mainCalendar tbody td > a:before {content:"행사있음";text-indent:-9999px;display:block;position:absolute; bottom:0.8em; left:calc(50% - 2.5px); width:5px; height:5px; background:#333333; border-radius:100%;}
.mainCalendar tbody td.today > * {border:1px solid #DFE7EF;}
.mainCalendar tbody td.today > *:after {content:""; position:absolute; top:-0.6em; left:calc(50% - 2.2rem); display:block; width:4.4rem; height:3.1rem; background:url(../img/main/spr_calender_today.svg) no-repeat 50% 50%; background-size:4.4rem auto;}
.mainCalendar th:first-child,
.mainCalendar td:first-child {color:#E4007F;}
.mainCalendar th:last-child,
.mainCalendar td:last-child {color:#0068B7;}


.mainCalendar .calendar-list {background:linear-gradient(120deg, #CF4D6C, #9C68C6);}
.mainCalendar .calendar-list .title {margin-bottom:2rem; padding-left:3rem; background:url(../img/main/ico_cal_list.svg) no-repeat top 50% left 0; background-size:2.6rem auto;}
.mainCalendar .calendar-list .title strong {font-size:2.4rem; color:#600; color:#fff;}
.mainCalendar .calendar-list ul {height:42rem; overflow:auto; padding-right:3rem;}
.mainCalendar .calendar-list li + li {margin-top:2rem;}
.mainCalendar .calendar-list li a {display:block; padding:2rem; background:rgba(255,255,255,0.15); border-radius:1rem;}
.mainCalendar .calendar-list li a > * {display:block;}
.mainCalendar .calendar-list li a span {color:rgba(255,255,255,0.8); font-weight:400; margin-bottom:1rem;}
.mainCalendar .calendar-list li a .subj {color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainCalendar tbody td > a:hover,
.mainCalendar tbody td > a:focus {background:#CF4D6C; color:#fff;}
.mainCalendar tbody td > a:hover:before,
.mainCalendar tbody td > a:focus:before {background:#fff;}


/*스크롤바 스타일*/
.mainCalendar .calendar-list ul::-webkit-scrollbar {width:5px;border-radius:100px;background:rgba(0,0,0,0);}
.mainCalendar .calendar-list ul::-webkit-scrollbar-thumb {background:#fff;border-radius: 100px;border:2px solid #fff;}
.mainCalendar .calendar-list ul::-webkit-scrollbar-track {width:5px;background-color:rgba(255,255,255,0.15);border-radius:100px;}


@media (min-width:891px){
	.calendarWrap h4  {padding-left:24rem;}
	.mainCalendar .calendar-top select#dateType {display:none;}
	
	.mainCalendar {display:flex; flex-wrap:wrap;}
	.mainCalendar > * {width:calc(50% - 1.5rem);}
	.mainCalendar .calendar-list  {margin-left:3rem;}
}
@media (max-width:1024px){
	.calendarWrap {padding-left:1.5rem; padding-right:1.5rem;}
	
	.mainCalendar > *  {padding:3rem 3rem;}
}
@media (max-width:890px){
	.calendarWrap {padding-top:5rem; padding-bottom:5rem;}
	.calendarWrap h4:before {left:auto; right:0; width:16rem; margin-top:-2.6rem;}
	.mainCalendar #yhdCalendar {display:none;}
	.mainCalendar .calendar-box {padding:2rem;}
	.mainCalendar .calendar-list  {margin-top:2rem;}
}
@media (max-width:580px){
	.calendarWrap h4 {margin-bottom:3rem;}
	.calendarWrap h4:before {width:12rem; height:10rem; margin-top:0.6rem;}
	.calendarWrap h4 strong {font-size:3.2rem;}
	.mainCalendar .calendar-top select  {font-size:1.8rem;}
}
@media (max-width:420px){
	.calendarWrap h4:before {display:none;}
	
	.mainCalendar .calendar-top .btn-today {position:relative; top:auto; right:auto;}
	.mainCalendar .calendar-list .title strong {font-size:1.8rem;}
	.mainCalendar .calendar-list ul {padding-right:2rem;}
}