/* include 공통 CSS */

/************************* 공통 시작*************************/
.inner {max-width:1300px; width: 100%; margin: 0 auto;}
.bold {font-weight: 500;}
.color {color: #009ad8;}
.light {font-weight: 300;}
.content_desc {min-height:500px;}

@media(max-width:1280px){
.inner {padding: 0 4%;}
}

/************************* 공통 끝 *************************/

/************************* header_inc 시작*************************/
/**/
.header_t {width:100%; margin:0 auto; position:fixed; left:0; top:0px; z-index:99; transition: all 300ms ease-out; display: flex; align-items:center; justify-content:space-between; padding: 25px 6.5% 0;}
.header_t a {color: #fff;}
.header_t .left, .header_t  .right {display: flex; align-items:center;}
.header_t .header_logo img {width: 90px;}
.header_t .c_logo {display: none;}
.f-nav {background:rgba(0,0,0,0.6); padding: 0px 6.5%;}
.f-nav .header_logo img {width: 70px;}
.f-nav .c_logo {display: none;}
.f-nav .w_logo {display: inline;}

.header_sns {display: flex; margin-right: 20px;}
.header_sns a {font-size: 28px; color: #fff; display: block;}
.header_sns li {margin-left: 20px;}
.header_lang, .hd_search {margin-left: 40px;}


.header_gnb_bg {margin-left: 70px;}
/* global navigation bar */
.gnb {position:relative; z-index:999;}
/* gnb Common */
.menu {position:relative;}
.menu .major > ul {height: 80px; display:flex; justify-content:flex-end; align-items:center; width:100%;}
.menu .major ul li {position:relative; text-align: center;}
.menu .major ul li a {position:relative; padding:0; line-height: 1; font-size:18px; font-weight: 300; padding: 0 30px;}
.menu .major ul li a span {position: absolute; left: 50%; bottom: -5px; display: block; width: 0; height: 15px; z-index: -1; transition:all 0.3s;}


/* gnb Hover */
.menu .major li.active{z-index:2}
.menu .major li a:hover span,.menu .major li a:active span,.menu .major li a:focus span{width: 100%; left: 0; transition:all 0.3s; background: rgba(0,172,235,0.2);}
.menu .major li.active a span{width: 100%; left: 0; transition:all 0.3s; background: rgba(0,172,235,0.2);}
/*대메뉴 포커스 효과 변경시 */
.menu .major li.pactive a span{width: 100%; left: 0; transition:all 0.3s; background: rgba(0,172,235,0.2);}
.menu .major li.pactive ul.sub{display:none;}
/*대메뉴 포커스 효과 변경시 */

/* gnb 2depth */
.menu .major ul.sub							{position:absolute; width: 180px; top:49px; display:none; border:1px solid #ddd; background:#fff; left: 50%; transform:translateX(-50%);}
.menu .major li.active ul.sub		{display:block;}
.menu .major ul.sub li					{clear:both; margin:0;}
.menu .major ul.sub li a				{color:#585858; display: block; padding:15px 0; font-size:16px;}
.menu .major ul.sub li a:hover	{background: #00aceb; color: #fff !important;}

/* 햄벅 */
.mo_nav {display:none;}
.mo_nav *{transition: all 300ms ease-out;}
.mo_nav .navbar-toggle {position: relative; display: block; padding:0; background-color:transparent; background-image:none; border-radius:0; border:0;}
.mo_nav .navbar-toggle:focus {outline: 0;}
.mo_nav .navbar-toggle .icon-bar {background:#fff; display:block; width:20px; height:2px; border-radius:0;}
.mo_nav .navbar-toggle .icon-bar:nth-child(2) {margin: 5px 0;}

@media(max-width:1280px){
.menu .major ul li {margin-left:10px;}
.menu .major ul li a {font-size:16px;}
.header_sns {margin-left: 10px;}
}

@media(max-width:1080px){
.mo_nav {display:block;}
.header_t {padding: 10px 4%;}
.header_t .header_gnb_bg {display:none;}
.header_t .header_sns {display:none;}
.header_t .header_lang, .header_t .hd_search {display: none;}

}


@media(max-width:800px){
.header_t .inner {height:70px;}
.header_t .header_logo img {width: 60px;}
}


#quick_banner {position: fixed; top: 25%; left: 85vw; z-index: 999; box-shadow:2px 2px 8px rgba(0,0,0,0.3); display: none;}
#quick_banner img {display: block; max-width:150px; width: 100%;}

@media(max-width:1700px){
#quick_banner {left: 87vw;}
}

@media(max-width:1500px){
#quick_banner {left: auto; right: 4%;}
}

@media(max-width:1280px){
#quick_banner {width: 110px; top: auto; bottom: 270px; right: 10px;}
}

@media(max-width:800px){
#quick_banner {width: 90px; bottom: 230px;}
}

@media(max-width:600px){
#quick_banner {width: 70px; bottom: 60px;}
}

/************************* header_inc 끝*************************/

/************************* main_inc 시작*************************/
.more { font-size: 14px; display: flex; align-items:center; }

.hiddentxt	{width:0; height:0; overflow:hidden; text-indent:-9999px;}

.main_visual {position:relative; margin:0 auto;}
.main_visual .mo {display: none;}
.main_visual .slide {height: 100vh; max-height:740px; color: #fff; line-height: 1.6; }
.main_visual .slide .inner {position: relative; top: 50%; transform:translateY(-50%);}
.main_visual .slide h2 {font-size: 34px; font-weight: 400; line-height: 1.4;}
.main_visual .slide h2 span {font-weight: 700;}
.main_visual .slide03 .more {margin-top: 20px;}
.main_visual .more {width: 200px; padding:10px 3px; text-align: center; border-radius:5px; background: #212121; color: #fff; font-size: 16px; display: flex; justify-content:center; align-items:center; margin-top: 35px; transition:all 0.3s;}
.main_visual .more span {margin-left: 13px; font-size: 13px;}
.main_visual .more:hover {background: #00b5ff;}

.main_visual .wid-01 {width: 100%; position: absolute; left: 0; top: 0; padding-top: 260px;}
.main_visual .wrap_spn {display: flex; align-items:center; font-size: 14px; color: rgba(255,255,255,0.8);}
.main_visual .slider-progress {margin: 0 10px; width: 180px; height: 2px; background: rgba(255,255,255,0.3);}
.main_visual .slider-progress .progress {width: 0%; height: 100%; background: rgba(255,255,255,0.8);}
.main_visual .play_pause {font-size: 20px; line-height: 1; margin: 0 10px;}

.main_visual .slick-dots {bottom: 40px;}
.main_visual .arrow .slide_arrow {line-height: 1; cursor: pointer;}
.main_visual .arrow .slide_arrow img {max-width:33px; width: 100%; display: block;}
.main_visual .arrow .slide_prev {position: absolute; left: 6%; top: 50%; transform:translateY(-50%);}
.main_visual .arrow .slide_next {position: absolute; right: 6%; top: 50%; transform:translateY(-50%);}



@media(max-width:1560px){
.main_visual .arrow .slide_prev, .main_visual .arrow .slide_next {display: none !important;}
}
@media(max-width:1500px){
.inner {padding: 0 4%;}
.main_visual .slide {height: 50vw;}
.main_visual .arrow .slide_prev {left: 5%;}
.main_visual .arrow .slide_next {right: 5%;}
}

@media(max-width:1080px){
.main_visual .slide h2 {font-size: 26px;}
.main_visual .more {width: 180px; margin-top: 25px;}
.main_visual .more span {margin-left: 10px;}
}

@media(max-width:800px){
.main_visual .mo {display: block;}
.main_visual .pc {display: none;}
.main_visual .slide {max-height:1000px; height: 100vw;}
}

@media(max-width:600px){
.main_visual .slide h2 {font-size: 20px;}
.main_visual .more {width: 160px; margin-top: 15px; font-size: 15px;}
}

.m_wrap .main_tit {display: flex; align-items:center; justify-content:space-between; margin-bottom: 20px;}
.m_wrap .main_tit h2 {font-size: 24px; font-weight: 500; color: #121212;}
.m_wrap .main_tit a {display: flex; align-items:center; font-size: 16px; font-weight: 300; color: #797979; line-height: 1;}
.m_wrap .main_tit a span {display: inline-block; margin-left: 8px; font-size: 13px; line-height: 1;}

.m_wrap .press {margin: 70px auto 40px;}

.m_wrap .flx {display: flex; flex-flow:row wrap; justify-content:space-between; margin-bottom:120px;}
.m_wrap .flx > div {width: 48%;}

.m_wrap .insta {margin: 50px auto 120px;}

@media(max-width:800px){
.m_wrap .press {margin: 60px auto 20px;}
.m_wrap .main_tit h2 {font-size: 20px;}
.m_wrap .main_tit {margin-bottom: 10px;}
.m_wrap .flx > div {width: 100%;}
}
/************************* main_inc 끝*************************/

/************************* sub 시작 *************************/
.content_desc {padding: 50px 0 100px;}
.sub_title {max-width:1300px; margin: 0 auto; width: 100%; display: flex; align-items:flex-end;}
.sub_title h1 {font-size: 36px; font-weight: 700; color: #00aceb; margin-right: 40px; line-height: 1;}
.sub_title .line {flex:auto; height: 1px; background: #00aceb;}
.sub_title img {display: block;}
.sub_title h3 {color: #9e9e9e; font-size: 16px;}
.sub_title h4 {color: #212121; font-size: 16px;}
.sub_title span {display: inline-block; margin: 0 10px; font-size: 22px; color: #a8a8a8; position: relative; top: 3px;}

.count ul {display: flex; flex-flow:row wrap; justify-content:space-between; text-align: center;}
.count .num {display: flex; align-items:center; justify-content:center;}
.count .num span {font-size: 24px; padding-left: 5px;}

.s111 {background:url('./img/s111_bg.jpg') no-repeat center; background-size:cover; padding: 110px 0;}
.s111 .swiper-slide {justify-content:space-between;}
.s111 .swiper-slide .img {width: 800px; display: flex; align-items:center; justify-content:center; height: 650px;}
.s111 .swiper-slide .img h2 {color: #fff; font-size: 24px; text-shadow:0 0 5px rgba(0,0,0,0.8); }
.s111 .slide01 .img {background:url('./img/slide01.jpg') no-repeat center; background-size:cover;}
.s111 .slide02 .img {background:url('./img/slide02.jpg') no-repeat center; background-size:cover;}
.s111 .slide03 .img {background:url('./img/slide03.jpg') no-repeat center; background-size:cover;}
.s111 .slide04 .img {background:url('./img/slide04.jpg') no-repeat center; background-size:cover;}
.s111 .swiper-slide .txt {width: 500px; height: 550px; margin-left: -100px; background: #fff; padding: 60px; text-align: left; position: relative;}
.s111 .swiper-slide .txt .txt_style {font-size: 18px; color: #585858; line-height: 1.6;}
.s111 .swiper-slide .txt > h1 {font-size: 30px; line-height: 1.4; margin: 10px 0;}
.s111 .swiper-slide .txt > p + p {margin-top: 10px;}
.s111 .swiper-slide .txt .bold {color: #212121;}
.s111 .swiper-slide .txt small {font-size: 14px; font-weight: 300; color: #888; display: block; margin-top: 10px;}
.s111 .pager_line {display: flex; align-items:center; position: absolute; left: 60px; bottom: 60px;}
.s111 .pager_line * {line-height: 1; width: auto; font-size: 18px;}
.s111 .pager_line .swiper-pager i {font-size: 130%; cursor: pointer;}
.s111 .pager_line .pager_fraction {margin: 0 30px; color: #888; font-weight: 300;}
.s111 .pager_line .pager_fraction .swiper-pagination-current {color: #212121; font-weight: 400;}


.s112 {position: relative;}
.s112 > div {padding-top: 110px;}
.s112 .left {background:#287bb8 url('./img/s112_bg1.png') no-repeat left bottom; background-size: 50%; color: #fff; padding-bottom: 280px;}
.s112 .left h2 {color: #bcdaf1; font-size: 28px; line-height: 1.6; margin-bottom: 25px;}
.s112 .left h2 .bold {color: #fff; font-size: 120%;}
.s112 .left ul {font-size: 24px; line-height: 1.6; font-weight: 300; margin-top: 60px;}
.s112 .left ul li {margin-bottom: 10px; padding-left: 10px; position: relative;}
.s112 .left ul li::before {content: '·'; display: block; position: absolute; left: 0; top: 0;}
.s112 .right {position: absolute; width: 50%; height: 100%; right: 0; top: 0; background:url('./img/s112_bg2.jpg') no-repeat right bottom; background-size: cover;}
.s112 .right .count11 {width: 600px; padding: 0 70px;}
.s112 .right li {background: #fff; width: 200px; margin-bottom: 70px; border-bottom-right-radius: 50px; box-shadow: 1px 1px 15px rgba(0,0,0,0.3); font-weight: 400;}
.s112 .right li .head {background: linear-gradient(90deg, rgba(0,162,227,1) 0%, rgba(0,118,206,1) 100%); color: #fff; padding: 10px 0; font-size: 15px;}
.s112 .right li .in {padding: 20px 0;}
.s112 .right li .in p {font-size: 18px; line-height: 1.4; padding: 15px 0 10px; font-weight: 500;}
.s112 .right li .in .num h1 {font-size: 65px; line-height: 1; font-weight: 500;}

.s113 {padding: 100px 0 80px; text-align: center; }
.s113 .tit {font-size: 48px; font-weight: 500; letter-spacing: 0;}
.s113 .partners_list ul {display: flex; flex-flow:row wrap; align-items:center; margin-top: 50px;}
.s113 .partners_list li {width: 19%; margin-bottom: 1.25%; }
.s113 .partners_list li:not(:nth-child(5n)) {margin-right: 1.25%; }
.s113 .partners_list li a {display: block; border: 1px solid #ccc; width: 100%; height: 70px; display: flex; align-items:center; justify-content:center; font-size: 16px; font-weight: 400; color: #888; line-height: 1.2; padding: 10px; position: relative;}
.s113 .partners_list li a:hover {border: 2px solid #00aceb; color: #212121; font-weight: 500;}
.s113 .partners_list li a img {max-width:200px; width: 100%; display: block; margin: 0 auto;}
.s113 .partners_list li a p {position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%); width: 100%;}


@media(max-width:1280px){
.sub_title {padding: 0 4%;}
.sub_title h1 {font-size: 30px; margin-right: 30px;}
.count .num span {font-size: 20px;}

.s111 {padding: 80px 0;}
.s111 .swiper-slide .img {width: 70%; max-height: 650px; height: 70vw; padding: 0 20% 0 15%;}
.s111 .swiper-slide .img h2 {font-size: 18px; padding-right: 50px;}
.s111 .swiper-slide .txt {width: 50%; max-height: 550px; height: 60vw; margin-left: -20%; padding: 6vw;}
.s111 .swiper-slide .txt .txt_style {font-size: 16px;}
.s111 .swiper-slide .txt > h1 {font-size: 28px; margin: 20px 0;}
.s111 .pager_line {left: 6vw; bottom: 6vw;}
.s111 .pager_line * {font-size: 16px;}

.s112 > div {padding: 80px 0;}
.s112 .left {padding-bottom: 250px;}
.s112 .left h2 {font-size: 19px; margin-bottom: 20px;}
.s112 .left ul {font-size: 18px; margin-top: 40px;}
.s112 .right .count11 {width: 100%; padding: 0 8%;}
.s112 .right li {width: 46%; margin-bottom: 8%; border-bottom-right-radius: 30px;}
.s112 .right li .head {padding: 7px 0; font-size: 14px;}
.s112 .right li .in img {max-width:59px; width: 30%;}
.s112 .right li .in p {font-size: 16px; padding: 10px 0 5px;}
.s112 .right li .in .num h1 {font-size: 48px;}

.s113 {padding: 80px 0;}
.s113 .tit {font-size: 36px;}
.s113 .partners_list ul {margin-top: 50px;}
.s113 .partners_list li {width: 23.5%; margin-bottom: 2%;}
.s113 .partners_list li:not(:nth-child(5n)) {margin-right: 0;}
.s113 .partners_list li:not(:nth-child(4n)) {margin-right: 2%;}
.s113 .partners_list li a {font-size: 15px; height: 60px;}
}

@media(max-width:800px){
.content_desc {padding: 60px 0;}
.sub_title h1 {font-size: 24px; margin-right: 30px;}
.count .num span {font-size: 16px;}

.s111 {padding: 10% 0;}
.s111 .swiper-slide {flex-flow:row wrap;}
.s111 .swiper-slide .img {width: 100%; padding: 0;}
.s111 .swiper-slide .img h2 {font-size: 20px; padding-right: 0; padding-bottom: 15vw;}
.s111 .swiper-slide .txt {width: 90%; height: 55vw; margin: -20vw auto 0;}
.s111 .swiper-slide .txt > h1 {font-size: 24px; margin: 15px 0; font-weight: 400;}
.s111 .swiper-slide .txt > h1 br:last-child {display: none;}
.s111 .swiper-slide .txt > p + p {margin-top: 5px;}
.s111 .swiper-slide .txt small {margin-top: 5px;}
.s111 .pager_line * {font-size: 16px;}

.s112 > div {padding: 10% 0;}
.s112 .left {padding-bottom: 25%; background-size: 100%;}
.s112 .left h2 {font-size: 20px; margin-bottom: 15px;}
.s112 .left ul {font-size: 16px; margin-top: 30px;}
.s112 .right {position: relative; width: 100%;}
.s112 .right .count11 {padding: 0 4%;}
.s112 .right li {width: 23%; margin-bottom: 0; border-bottom-right-radius: 30px;}
.s112 .right li .head {padding: 5px 0; font-size: 12px;}
.s112 .right li .in p {font-size: 14px; padding: 10px 0 5px;}
.s112 .right li .in .num h1 {font-size: 40px;}

.s113 {padding: 10% 0;}
.s113 .tit {font-size: 30px;}
.s113 .partners_list ul {margin-top: 30px;}
.s113 .partners_list li {width: 32%; margin-bottom: 2%;}
.s113 .partners_list li:not(:nth-child(5n)) {margin-right: 0;}
.s113 .partners_list li:not(:nth-child(4n)) {margin-right: 0;}
.s113 .partners_list li:not(:nth-child(3n)) {margin-right: 2%;}
.s113 .partners_list li a {font-size: 15px; height: 60px; border: 1px solid #ccc; color: #212121; font-weight: 400;}
.s113 .partners_list li a:hover {border: 1px solid #ccc; color: #212121; font-weight: 400;}
}

@media(max-width:600px){
.content_desc {padding: 12% 0;}
.sub_title h1 {margin-right: 20px;}
.count .num span {font-size: 14px;}

.s111 {padding: 12% 0;}
.s111 .swiper-slide .img h2 {font-size: 18px; padding: 0 4%; padding-bottom: 10vw;}
.s111 .swiper-slide .txt {width: 94%; height: 330px; margin: -10vw auto 0; padding: 5%;}
.s111 .swiper-slide .txt .txt_style {font-size: 14px;}
.s111 .swiper-slide .txt > h1 {font-size: 18px; margin: 10px 0;}
.s111 .pager_line * {font-size: 14px;}
.s111 .pager_line {left: 5%; bottom: 5%;}

.s112 > div {padding: 12% 0;}
.s112 .left {padding-bottom: 20%;}
.s112 .left h2 {font-size: 16px; margin-bottom: 15px;}
.s112 .left ul {font-size: 14px; margin-top: 20px; display: block;}
.s112 .right {padding: 0 2%;}
.s112 .right li {width: 46%; margin: 8% 0;}
.s112 .right li .in .num h1 {font-size: 36px;}

.s113 {padding: 12% 0;}
.s113 .tit {font-size: 24px;}
.s113 .partners_list ul {justify-content:space-between;}
.s113 .partners_list li {width: 48%; margin-bottom: 4%;}
.s113 .partners_list li:not(:nth-child(5n)) {margin-right: 0;}
.s113 .partners_list li:not(:nth-child(4n)) {margin-right: 0;}
.s113 .partners_list li:not(:nth-child(3n)) {margin-right: 0;}
.s113 .partners_list li a {font-size: 14px; height: 56px;}
}

.s21 .s21_tit {display: flex; justify-content:center; align-items:flex-end; font-size: 30px; font-weight: 500; text-align: center; line-height: 1;}
.s21 .s21_subtit {text-align: center; font-size: 18px; color: #888; margin-top: 10px; font-weight: 300;}
.s21 .result_txt p {display: flex; justify-content:center; align-items:flex-end; font-size: 24px; height: 36px; margin-bottom: 20px;}
.s21 .result {min-width: 40px; margin: 0 5px 0 15px; padding: 0 10px; border-bottom: 2px solid #00aceb; padding-bottom: 5px;}

.s21 .result.active {border-bottom: 0; padding-bottom: 0; font-size: 36px; font-weight: 500; color: #00aceb; line-height: 1;}
.s21 .result_txt .pop_btn.active, .s21 .val_tit.active, .s21 .result_val1.active {font-weight: 700; font-size: 33px; text-align: right; color: #00aceb;position:relative;}

.s21 .result_txt .pop_btn.active	{text-align:left; padding-right:35px;}
.s21 .result_txt .pop_btn:before	{content:''; display:block; bottom:-5px; left:0; width:100%; height:1px; background:#00aceb; position:absolute;}
.s21 .result_txt .pop_btn:after		{content:''; display:block; bottom:10px; right:10px;  width: 0px; height: 0px;  border-top: 12px solid #00aceb;  border-left: 7px solid transparent;  border-right: 7px solid transparent; position:absolute;}


.s211 .result_txt {margin: 70px 0; text-align: center;}
.s211 .result_txt .pop_btn {font-size: 16px; color: #888; margin-left: 0; cursor: pointer; min-width: auto;}
.s211 .result_txt .pop_btn i {margin-left: 30px;}
.s211 .result_pop {display:none; position:absolute; background: #fff; padding: 20px; border-radius: 10px; text-align:left; font-size: 18px; border: 1px solid #ccc; box-shadow:1px 1px 5px rgba(0,0,0,0.3);}
.s211 .result_pop .close_btn {position: absolute; right: 20px; top: 20px; font-size: 14px;}
.s211 .result_pop li {border-bottom:1px solid #ccc; margin-bottom: 10px; padding: 0 10px; padding-bottom: 10px;}
.s211 .result_pop li:last-child {border-bottom: 0; padding-bottom: 0; margin-bottom: 0;}
.s211 .result_pop li * {display: inline-block;}
.s211 .result_pop li > span {font-weight: 400; margin-right: 20px;}
.s211 .result_pop li a {background: #059edc; padding: 0 10px 2px; border-radius: 5px; color: #fff; font-size: 16px; margin-right: 5px; font-weight: 300;}
.s211 .result_pop li a span {font-weight: 400; letter-spacing: 2px;}
.s211 .counting, .s212 {padding: 70px 0;}
.s211 .counting {border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.s211 .count21 ul {margin-top: 50px;}
.s211 .count21 li {width: 25%; text-align: center;}
.s211 .count21 li .num {margin: 20px 0;}
.s211 .count21 li .num h1 {font-size: 50px; line-height: 1; font-weight: 500;}
.s211 .count21 li p {font-size: 20px; font-weight: 500; line-height: 1;}

.s212 {padding-bottom: 0 !important;}
.s212 .map_ifr {margin: 50px 0 0;}
.s212 .map_ifr iframe {display: block;}
.s212 .result_txt p {margin-bottom: 10px;}
.s212 .result {border-bottom: 0 !important; padding-bottom: 0; line-height: 1; text-align: right; color: #00aceb;}
.s212 .result_val1 {font-weight: 700; font-size: 34px; margin-left: 0; padding-left: 0;}
.s212 .result_val2 {font-weight: 500; font-size: 36px; margin-left: 0;}

/* map */
#south {height:520px; width: 420px; margin: 0 auto;}
#south svg {transform:scale(1.3); transform-origin: 0 0;}
div.loc_div {position: absolute; font-size:18px; text-align: center; display: none;}
div.loc_div h4 {font-weight: 400;}
div.loc_div p .num {font-size: 48px; font-weight: 500;}

@media(max-width:1280px){
.s21 .s21_tit {font-size: 28px;}
.s21 .s21_subtit {font-size: 16px; margin-top: 5px;}
.s21 .result {margin: 0 5px 0 10px;}
.s21 .result_txt p {font-size: 20px; height: 30px;}
.s21 .result.active {font-size: 30px; padding: 0;}
.s21 .result_txt .pop_btn.active, .s21 .val_tit.active, .s21 .result_val1.active {font-size: 28px;}

.s211 .result_txt {margin: 60px 0;}
.s211 .result_txt .pop_btn {font-size: 14px; min-width: 100px;}
.s211 .result_txt .pop_btn i {margin-left: 20px;}
.s211 .result_pop {font-size: 16px;}
.s211 .result_pop li > span {margin-right: 15px;}
.s211 .result_pop li a {font-size: 15px; padding: 2px 8px 3px;}
.s211 .counting, .s212 {padding: 60px 0;}
.s211 .count21 ul {margin-top: 40px;}
.s211 .count21 li .num {margin: 15px 0;}
.s211 .count21 li .num h1 {font-size: 40px;}
.s211 .count21 li p {font-size: 18px;}

#south {width: 385px; height: 480px;}
#south svg {transform:scale(1.2);}

.s212 .map_ifr {margin: 40px 0 20px;}
.s212 .result_val1 {font-size: 30px;}
.s212 .result_val2 {font-size: 33px;}
div.loc_div {font-size: 16px;}
div.loc_div p .num {font-size: 36px;}
}

@media(max-width:800px){
.s21 .s21_tit {font-size: 24px;}
.s21 .s21_subtit {font-size: 14px;}
.s21 .result {margin: 0 5px 0 10px; padding: 0 5px; border-bottom: 1px solid #00aceb;}
.s21 .result_txt p {font-size: 18px; height: auto; flex-flow:row wrap;}
.s21 .result.active {font-size: 26px; min-width:auto;}
.s21 .result_txt .pop_btn.active, .s21 .val_tit.active, .s21 .result_val1.active {font-size: 24px;}

.s211 .result_txt {margin: 50px 0;}
.s211 .result_txt .pop_btn i {margin-left: 20px;}
.s211 .result_pop {font-size: 14px; padding: 15px;}
.s211 .result_pop .close_btn {right: 15px; top: 15px;}
.s211 .result_pop li {padding: 0 5px 10px;}
.s211 .result_pop li > span {margin-right: 10px;}
.s211 .result_pop li a {font-size: 13px; padding: 2px 6px 3px;}

.s211 .counting, .s212 {padding: 50px 0;}
.s211 .count21 li img {max-width:47px; width: 30%;}
.s211 .count21 li .num {margin: 15px 0; line-height: 1;}
.s211 .count21 li .num h1 {font-size: 30px;}
.s211 .count21 li p {font-size: 15px;}

#south {width: 350px; height: 440px;}
#south svg {transform:scale(1.1);}

.s212 .result_txt p {margin-bottom: 5px;}
.s212 .result_val1 {font-size: 24px;}
.s212 .result_val2 {font-size: 26px;}
div.loc_div {font-size: 14px;}
div.loc_div p .num {font-size: 30px;}
}

@media(max-width:600px){
.s21 .inner {overflow: hidden;}
.s21 .s21_tit {font-size: 16px;}
.s21 .result {margin: 0 5px 0 10px; padding: 0 5px;}
.s21 .result_txt p {font-size: 14px; text-align: center;}
.s21 .result.active {font-size: 20px;}
.s21 .result_txt .pop_btn.active, .s21 .val_tit.active, .s21 .result_val1.active {font-size: 16px;}

.s211 .result_txt {margin: 40px 0;}
.s211 .result_txt .pop_btn i {margin-left: 20px;}
.s211 .result_pop {font-size: 14px; padding: 10px;}
.s211 .result_pop .close_btn {right: 10px; top: 10px;}
.s211 .result_pop li a {font-size: 13px; padding: 2px 6px 3px; display: block; margin: 5px 0;}
.s211 .result_pop li a:last-child {margin-bottom: 0;}

.s211 .counting, .s212 {padding: 40px 0;}
.s211 .count21 ul {margin-top: 30px;}
.s211 .count21 li {width: 50%; margin-bottom: 20px;}
.s211 .count21 li .num {margin: 10px 0;}
.s211 .count21 li .num h1 {font-size: 22px;}
.s211 .count21 li p {font-size: 13px; line-height: 1.2; padding: 0 5px;}

#south {width: 288px; height: 360px;}
#south svg {transform:scale(0.9);}

.s212 .map_ifr {margin: 20px 0 10px;}
.s212 .result_txt p {margin-bottom: 5px;}
.s212 .result_val1 {font-size: 16px; min-width:0; padding: 0; margin-left: 0;}
.s212 .result_val2 {font-size: 18px; min-width:0; padding: 0;}
div.loc_div {display: none !important;}
}

.s31_ul {display:flex; justify-content:space-between; margin-top: 50px;}
.s31_ul li {flex:1; border:1px solid #ccc; text-align:center; background: #fff;}
.s31_ul li:not(:last-child) {margin-right:10px;}
.s31_ul li a {display:block; padding: 10px 0; font-size: 20px; color: #585858; font-weight: 400; letter-spacing: 0;}
.s31_ul li.onon {background:#009ad8; border:1px solid #009ad8;}
.s31_ul li.onon a {color:#fff;}

.s31_ul_last {display:none; background: #009ad8; padding: 15px 40px;}
.s31_ul_last li:not(:last-child)::after {content: ''; display: inline-block; width: 6px; height: 6px; border-radius:3px; background: #fff; opacity: 0.7; margin: 0 30px 2px;}
.s31_ul_last li a {color: #fff; font-size: 16px; opacity: 0.7; font-weight: 300; letter-spacing: 0;}
.s31_ul_last li.onon_show a {border-bottom:1px solid #fff; font-weight: 500; opacity: 1;}

.s31 {max-width: 1300px; margin: 0 auto;}
.s31 .top_txt {padding: 20px 0; font-size: 18px; line-height: 1.6;}
.s31 .star {color: #009ad8 !important;}
.s31 small {font-size: 100%; font-weight: 300;}
.s31 .map_wrap {width:calc(100% - 370px);}
.s31 #map {width:100%; height:530px; max-width: 1200px; margin: 0 auto;}
.s31 .bottom_txt {padding-top: 10px;}
.s31 .bottom_txt .footnote {font-size: 14px; display: flex; line-height: 1.6;}
.s31 .bottom_txt .star {padding-right: 4px;}
.s31 .bottom_txt .footnote .bold {min-width:70px;}

.s31 .bottom_txt .source {display: flex; margin-top: 20px;}
.s31 .bottom_txt .source h2 {font-weight: 500; font-size: 16px; margin-right: 20px;}
.s31 .bottom_txt .source p {font-size: 16px;}

.map_wrap {position:relative;}
#sorting {position: absolute; top: 0; left: 0; z-index: 90; width:70px; height:100%; background: rgba(0,0,0,0.7); padding-top: 30px; text-align: center;}
#sorting ul li {margin-bottom: 30px;}
#sorting ul li a {color: #fff; font-size: 16px; font-weight: 400;}
#sorting ul li a.onon {color: #00aceb; border-bottom:2px solid #00aceb;}
#sorting .youtube_btn {position: absolute; left: 0; bottom: 0; width: 100%;}
#sorting .youtube_btn a {display: block; padding: 10px 0; background: linear-gradient(30deg, rgba(6,109,204,1) 0%, rgba(0,162,227,1) 100%); color: #fff; font-size: 14px; font-weight: 300; text-shadow: 1px 1px 3px rgba(0,0,0,0.5);}
#sorting .youtube_btn a img {display: block; margin: 0 auto;}
#sorting .youtube_btn a span {line-height: 1.2; margin-top: 3px;}

.mfp-wrap .mfp-container {top: 60px;}
.mfp-wrap .mfp-iframe-holder .mfp-content {line-height: 0; width: 100%; max-width: 1200px; height:700px; min-height:auto;}

/* infowrap */
.infowrap {min-width: 300px; border-radius:10px; background: #fff; box-shadow:0px 0px 10px rgba(0,0,0,0.2); border: 1px solid #ccc; position: relative; padding: 20px; z-index:999}
.infowrap::after {content: ''; display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 12px solid #fff; position: absolute; left: 50%; bottom: -12px; margin-left: -8px;}
.infowrap button {border: 0; border-radius:50%; width: 30px; height: 30px; background: #333; padding: 0; position: absolute; display: flex; align-items:center; justify-content:center; right: -20px; top: -10px; font-size: 16px; color: #fff; box-shadow:0px 0px 10px rgba(0,0,0,0.2);}
.infowrap .infotitle {display: flex; justify-content:space-between; align-items:center; margin-bottom: 20px;}
.infowrap .infotitle h2 {font-size: 19px; font-weight: 400; color: #009ad8; line-height: 1; margin-right: 10px;}
.infowrap .infotitle span {padding: 5px 10px; background: #009ad8; color: #fff; line-height: 1; font-size: 14px; font-weight: 300;}
.infowrap .infolist {border-top: 1px solid #333; border-bottom: 1px solid #333;}
.infowrap .infolist li {display: flex; align-items:center; padding: 6px 10px; font-size: 15px; font-weight: 400;}
.infowrap .infolist li:not(:last-child) {border-bottom: 1px solid #eee;}
.infowrap .infolist li > p {flex:1; font-weight: 500;}
.infowrap .infolist li > span {flex:1; padding-left: 20px; color: #585858;}


.local_sch {display: flex; justify-content:space-between; align-items:center; padding: 0 0 13px;}
.filter select {border: 1px solid #ccc; font-size: 14px; height: 40px; padding: 0 10px; color: #212121; min-width:100px; background: #fff url('./img/select_arrow.png') no-repeat 170px center;}
.excel_btn {display: flex; justify-content:space-between; align-items:center; border: 1px solid #ccc; background: #fff; color: #585858; border-radius: 0; height: 40px; padding: 0 10px;}
.excel_btn input {border: none; padding: 0; background: none; outline:none; margin-left: 10px; font-weight: 500; font-size: 14px; cursor: pointer;}

.excel_only {padding: 0 0 13px;}
.excel_only::after {content: ''; display: block; clear: both;}
.excel_only .excel_btn {float: right;}

.table_wrap {border:1px solid #ccc;}
.guest_table {border-collapse:collapse; padding:0; width:100%; background:#fff; font-size: 14px;}
.guest_table th {background: #eee; padding: 12px 5px; border-bottom: 1px solid #ccc; border-right: 1px solid #ddd; font-weight: 450;}
.guest_table td {text-align:center; border-bottom:1px solid #eee; border-right: 1px solid #eee; font-weight: 400; color: #585858; padding: 7px 15px;}
.guest_table th:last-child, .guest_table td:last-child {border-right: 0;}

@media(max-width:1400px){
.s31 .top_txt {padding: 10px 4% 15px;}
}

@media(max-width:1280px){
.s31_ul {margin-top: 30px;}
.s31_ul li a {padding: 8px 0; font-size: 18px;}
.s31_ul_last {padding: 10px 20px;}
.s31_ul_last li:not(:last-child)::after {width: 4px; height: 4px; border-radius:2px; margin: 0 20px 2px;}
.s31_ul_last li a {font-size: 15px;}

.mfp-wrap .mfp-container {padding: 0; top: 5%;}
.mfp-wrap .mfp-iframe-holder .mfp-content {width: 92%; margin: 0 auto; height:600px;}

.table_wrap {height: 500px; overflow-x: scroll; overflow-y: scroll; position: relative;}
.guest_table {font-size: 14px;}
.guest_table th {padding: 5px 5px;}
.guest_table td {padding: 7px 10px;}
}

@media(max-width:800px){
.s31_ul {margin-top: 20px;}
.s31_ul li {margin-bottom: 5px !important;}
.s31_ul li:last-child.onon {margin-bottom: 0px !important;}
.s31_ul li:not(:last-child) {margin-right:5px; }
.s31_ul li a {padding: 8px 0; font-size: 16px;}
.s31_ul_last {padding: 8px 10px;}
.s31_ul_last li:not(:last-child)::after {margin: 0 10px 2px;}
.s31_ul_last li a {font-size: 14px;}

.local_sch {padding: 0 0 10px;}
.filter select {height: 36px; padding: 0 10px; font-size: 12px; background: #fff url('./img/select_arrow.png') no-repeat 140px center;}
.excel_btn {height: 36px; padding: 0 10px;}
.excel_btn input {font-size: 12px;}
.excel_only {padding: 0 0 10px;}

.s31 .top_txt {padding: 10px 4% 15px; font-size: 14px; margin-bottom: 0;}
.s31 #map {height:400px;}
.s31 .bottom_txt .footnote {font-size: 12px;}
.s31 .bottom_txt .source {margin-top: 10px;}
.s31 .bottom_txt .source h2 {font-size: 14px; margin-right: 15px;}
.s31 .bottom_txt .source p {font-size: 14px;}

#sorting {width:50px; padding-top: 20px;}
#sorting ul li {margin-bottom: 20px;}
#sorting ul li a {font-size: 14px;}
#sorting ul li a.onon {border-bottom:1px solid #00aceb;}
#sorting .youtube_btn a {height: auto; font-size: 12px; padding: 10px 0;}
#sorting .youtube_btn a span {display: none;}

.mfp-wrap .mfp-container {top: 0;}
.mfp-wrap .mfp-iframe-holder .mfp-content {height:90vw;}
.mfp-iframe-txt {font-size: 14px !important;}

.table_wrap {height: 400px;}
.table_wrap .mCSB_outside + .mCSB_scrollTools {right: -16px;}
.table_wrap .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {bottom: -16px;}
.guest_table {font-size: 12px;}
.guest_table td {padding: 5px 10px;}

.infowrap {min-width: 230px; border-radius:10px; padding: 15px;}
.infowrap button {font-size: 14px;}
.infowrap .infotitle {margin-bottom: 15px;}
.infowrap .infotitle h2 {font-size: 16px;}
.infowrap .infotitle span {padding: 3px 8px; font-size: 12px;}
.infowrap .infolist li {padding: 4px 8px; font-size: 13px;}
.infowrap .infolist li > span {padding-left: 15px;}

}

@media(max-width:600px){
.s31_ul li a {padding: 5px 0; font-size: 3.5vw; letter-spacing: -0.3vw;}
.s31_ul_last {padding: 7px 5px; justify-content:space-between; align-items:center; line-height: 1;}
.s31_ul_last li {flex:1; text-align: center;}
.s31_ul_last li:not(:last-child)::after {display: none;}
.s31_ul_last li a {font-size: 3.3vw; letter-spacing: -0.3vw;}
.s31_ul_last li.onon_show a {border-bottom:0;}

.filter select {height: 8vw; padding: 0 7px;}
.excel_btn {height: 8vw; padding: 0 7px;}

.s31 .top_txt {font-size: 12px;}
.s31 #map {height:85vw;}

#sorting {width:12vw; padding-top: 3%;}
#sorting ul li {margin-bottom: 10px;}
#sorting ul li a {font-size: 3.7vw;}

.table_wrap {height: 85vw;}
.guest_table {font-size: 12px;}
.guest_table td {padding: 5px 10px;}
}

/* 캠페인 */
.cam_title {font-size: 24px; color: #00b5ff; font-weight: 500; margin-bottom: 20px;}
.cam_slide {margin-bottom:60px;}
.c_list_top {display: flex; justify-content:space-between; align-items:center; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #e1e1e1;}
.cam_list_title {font-size: 24px; font-weight: 500; color: #00b5ff;}

@media(max-width:600px){
.cam_slide {margin-bottom: 30px;}
.cam_title {font-size: 20px;}
.cam_list_title {font-size: 20px;}
}

/************************* sub 끝 *************************/


/************************* footer_inc 시작 *************************/
.footer_t {background: #111; color: #fff; padding: 60px 0; font-size: 14px;}
.footer_t a {color: #fff; font-size: 14px;}
.footer_logo {margin-bottom: 40px;}
.footer_t .inner {display: flex; justify-content:space-between; position: relative;}
.footer_t .left {flex:3 0 auto;}
.footer_t .left a {display: inline-block; margin-right: 10px;}
.footer_t .left .copy {color: #888; font-weight: 300; font-size: 12px; margin-top: 5px;}
.footer_t .sitemap {flex:1 0 auto;}
.footer_t .sitemap li:not(:last-child) {margin-bottom: 20px;}
.footer_t .right h2 {font-size: 18px;}
.footer_t .right > a {color: #bbb; display: block; margin: 10px 0 60px;}
.footer_t .right .sns {display: flex;}
.footer_t .right .sns a {display: block; margin-right: 10px; font-size: 24px;}

@media(max-width:900px){
.footer_t {padding: 40px 0;}
.footer_t .sitemap {display: none;}
}

@media(max-width:600px){
.footer_t {padding: 30px 0px;}
.footer_logo {margin-bottom: 110px;}
.footer_t .right {position: absolute; left: 4%; top: 70px;}
.footer_t .right h2 {font-size: 18px;}
.footer_t .right > a {margin: 10px 0 10px;}
.footer_t .left {flex:none; width: 100%;}
}

/************************* footer_inc 끝 *************************/

/************************* ui.totop 시작 *************************/
#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	overflow:hidden;
	width:51px;
	height:51px;
	border:none;
	text-indent:100%;
	background:url("./img/ui.totop6.png") no-repeat left top;
}

#toTopHover {
	background:url("./img/ui.totop6.png") no-repeat left -51px;
	width:51px;
	height:51px;
	display:block;
	overflow:hidden;
	float:left;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
	outline:none;
}
/************************* ui.totop 끝 *************************/



.s21 ::-webkit-input-placeholder { /* Safari, Chrome and Opera */
  color: #00aceb;
	padding-left:5px;
}

.s21 :-moz-placeholder { /* Firefox 18- */
  color: #00aceb;
	padding-left:5px;
}

.s21 ::-moz-placeholder { /* Firefox 19+ */
  color: #00aceb;
	padding-left:5px;
}

.s21 :-ms-input-placeholder { /* IE 10+ */
  color: #00aceb;
	padding-left:5px;
}

.s21 ::-ms-input-placeholder { /* Edge */
  color: #00aceb;
	padding-left:5px;
}

.s21 :placeholder-shown { /* Standard one last! */
  color: #00aceb;
	padding-left:5px;
}

.tit_category	{margin-top:140px;}
.tit_category > span.tit	{color:#4f3b1d;font-size:20px;display:inline-block;}
.tit_category > span.desc	{color:#4f3b1d;font-size:15px;margin-left:15px;display:inline-block;}
/* loc_01~17 서울, 부산, 대구, 인천, 광주, 대전, 울산, 세종, 경기, 강원, 충북, 충남, 전북, 전남, 경북, 경남, 제주 */
#loc_01{ left:370px; top:100px; }/* 서울 */
#loc_02{ right:400px; top:350px; }/* 부산*/
#loc_03{ right:380px; top:240px; }/* 대구*/
#loc_04{ left:390px; top:110px; }/* 인천   */
#loc_05{ left:370px; top:310px; }/* 광주 */
#loc_06{ left:380px; top:195px; }/* 대전 */
#loc_07{ right:370px; top:300px; }/* 울산 */
#loc_08{ left:390px; top:175px; }/* 세종 */
#loc_09{ left:370px; top:100px; }/* 경기 */
#loc_10{ right:420px; top:50px; }/* 강원 */
#loc_11{ right:420px; top:90px; }/* 충북 */
#loc_12{ left:360px; top:200px; }/* 충남 */
#loc_13{ left:380px; top:270px; }/* 전북 */
#loc_14{ left:360px; top:310px; }/* 전남 */
#loc_15{ right:370px; top:230px; }/* 경북 */
#loc_16{ right:380px; top:275px; }/* 경남 */
#loc_17{ right:500px; top:430px; }/* 제주 */

@media(max-width:1280px){
#loc_01{ left:24vw; top:100px; }/* 서울 */
#loc_02{ right:26vw; top:350px; }/* 부산*/
#loc_03{ right:24vw; top:240px; }/* 대구*/
#loc_04{ left:24vw; top:110px; }/* 인천   */
#loc_05{ left:22vw; top:310px; }/* 광주 */
#loc_06{ left:23vw; top:195px; }/* 대전 */
#loc_07{ right:25vw; top:300px; }/* 울산 */
#loc_08{ left:25vw; top:175px; }/* 세종 */
#loc_09{ left:23vw; top:100px; }/* 경기 */
#loc_10{ right:31vw; top:50px; }/* 강원 */
#loc_11{ right:28vw; top:90px; }/* 충북 */
#loc_12{ left:23vw; top:200px; }/* 충남 */
#loc_13{ left:25vw; top:270px; }/* 전북 */
#loc_14{ left:22vw; top:310px; }/* 전남 */
#loc_15{ right:24vw; top:230px; }/* 경북 */
#loc_16{ right:24vw; top:275px; }/* 경남 */
#loc_17{ right:43vw; top:430px; }/* 제주 */
}

@media(max-width:800px){
#loc_02{ right:24vw; top:300px; }/* 부산*/
#loc_03{ right:22vw; top:240px; }/* 대구*/
#loc_05{ left:19vw; top:290px; }/* 광주 */
#loc_06{ left:23vw; top:195px; }/* 대전 */
#loc_07{ right:23vw; top:260px; }/* 울산 */
#loc_09{ left:22vw; top:100px; }/* 경기 */
#loc_10{ right:29vw; top:50px; }/* 강원 */
#loc_11{ right:23vw; top:120px; }/* 충북 */
#loc_12{ left:21vw; top:180px; }/* 충남 */
#loc_13{ left:21vw; top:250px; }/* 전북 */
#loc_14{ left:19vw; top:300px; }/* 전남 */
#loc_15{ right:20vw; top:200px; }/* 경북 */
#loc_16{ right:21vw; top:275px; }/* 경남 */
#loc_17{ right:43vw; top:380px; }/* 제주 */
}

.selectbox2	{border:1px solid #999999;background-color:#f2f2f2;color:#000000;width:150px;height:30px;}
.inputbox2	{border:1px solid #a9a9a9;height:30px;width:332px;padding-left:5px;}

#map_right_wrapper{float:left; margin-left:30px; width:350px;}
.map_right_title1 {margin:20px 0 7px 0;}
.map_right_title2 {margin:30px 0 7px 0;}

#bo_sch { margin-bottom:10px;padding-top:5px;text-align:left; }
#bo_sch legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}

#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {margin-bottom:10px;padding-left:1px;width:100%;zoom:1; display: flex; flex-flow: row wrap;}
#bo_cate li {width: auto;}
#bo_cate li:not(:last-child) {margin-right: 5px;}
#bo_cate a {display: inline-block;position:relative;border:1px solid #ccc;background:#fff;color:#111;text-align:center; cursor:pointer; width: 100%; padding: 10px 25px; font-size: 15px; font-weight: 400;}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none}
#bo_cate #bo_cate_on {z-index:2;border:1px solid #111;background:#111;color:#fff;font-weight:500;}

@media(max-width:1080px){
#bo_cate a {font-size: 14px; padding: 8px 22px;}
}
@media(max-width:768px){
#bo_cate li {margin-bottom: 5px;}
#bo_cate a {font-size: 13px; padding: 7px 14px;}
}

.td_branch_img {} 
.td_subject { }
.td_branch_name {width:100px; text-align:left;}
.td_branch_addr{width:260px;}
a.list_branch_tit	{color:#4f3b1d;font-size:24px;}

/* 게시글 보기 */
#bo_v_info{margin-bottom:10px;}

#bo_v_img_branch {float:left; margin:0 10px 10px 0;overflow:hidden;zoom:1}
#bo_v_img_branch:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_img_branch img {margin-bottom:20px;max-width:100%;height:auto}

#bo_v_con_branch {float:left; margin:0; padding:0; list-style:none; width:70%;line-height:1.7em;word-break:break-all;overflow:hidden}
#bo_v_con_branch li span.con_branch_title{display:inline-block; width:60px;}
#bo_v_con_branch a {color:#000;text-decoration:underline}
#bo_v_con_branch img {max-width:100%;height:auto}

.mapwrap2 {text-align: left; padding:10px; background:none; border-radius:20px;}
.mapwrap2 * {padding: 0;margin: 0;}
.mapinfo {width: 288px; height: 225px; border-radius:10px;}
.mapinfo .maptitle {padding-bottom:10px; height: 30px; font-size: 18px; color: #009ad8;}
.mapinfo .maptitle span {background:#009ad8; color:#fff; padding:5px; font-size:14px; float:right;}

.mapinfo .mapbody {margin-top:20px; border-top:1px solid #000; border-bottom:1px solid #000;}
.mapinfo .mapbody .mapdesc li {padding:5px; display:flex;}
.mapinfo .mapbody .mapdesc li:not(:last-child) {border-bottom:1px solid #ccc;}
.mapinfo .mapbody .mapdesc li span {width:40%;}

#wrap_total {display:flex; position:relative;}
#wrap_total #map_sorting {width:330px; height:530px; border:1px solid #ccc; margin-right:45px; padding:0 30px; display: flex; flex-direction: column-reverse;}
#wrap_total #map_sorting .loc_wrap {height:80%; overflow-y:scroll;}
#wrap_total #map_sorting .loc_wrap ul {display:none;}
#wrap_total #map_sorting .loc_tit {padding:20px 0; font-size: 16px;}
#wrap_total #map_sorting .loc_tit span {color:#00b5ff; font-weight:500;}
#wrap_total #map_sorting .loc_total {font-size:18px; font-weight:500; margin-bottom:20px;}
#wrap_total #map_sorting .loc_wrap > li > ul {padding:20px;}
#wrap_total #map_sorting .loc_wrap > li > ul > a {display:block; padding:5px 0;}
#wrap_total #map_sorting .loc_wrap > li > a	{display: flex; justify-content: space-between; padding:20px 10px; border-bottom: 1px solid #eee; font-size:16px; font-weight:400;}
#wrap_total #map_sorting .loc_wrap > li > a > p {color:#00b5ff;}
#wrap_total #map_sorting .loc_wrap > li > a > p > span {color:#000; font-weight:normal; margin-left:5px;}
#wrap_total #map_sorting .loc_wrap > li > a > p > span::after {content:'┼';}
#wrap_total #map_sorting .loc_wrap > li > a.onon_show {color:#00b5ff; background:#f6f6f6;}
#wrap_total #map_sorting .loc_wrap > li > a.onon_show > p > span::after {content:'─';}
#wrap_total #map_sorting .loc_wrap > li > ul a {display:block; padding-top:10px;}
#wrap_total #map_sorting .loc_wrap > li > ul a.onon_show2 {color:#00b5ff;}



@media(max-width:800px){
#wrap_total {display: block;}
#wrap_total #map_sorting {width: 100%; height: 300px; margin-right: 0; padding: 0 15px;}
#wrap_total #map_sorting .loc_wrap > li > a {padding: 10px; font-size: 14px;}
#wrap_total #map_sorting .loc_wrap > li > ul {padding: 10px;}
#wrap_total #map_sorting .loc_wrap > li > ul a {padding-top: 5px;}
#wrap_total #map_sorting .loc_total {font-size: 14px; margin-bottom: 0;}
#wrap_total #map_sorting .loc_total {font-size: 16px; margin-bottom: 10px;}
.s31 .map_wrap {width: 100%; margin-top: 20px;}
#sorting {height: 300px;}
}
