@charset "utf-8";
@import url('/common/font/thedodam/thedodam.css');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap');
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.tab-group .tab-con {display:none;}
.tab-group .tab-con.on {display:block;}

@media all and (max-width:1440px) {
	.conWrap {padding-left:2rem !important; padding-right:2rem !important;}
}
@media all and (max-width:380px) {
	.conWrap {padding-left:1rem !important; padding-right:1rem !important;}
}



/***********************************************
	Visual Layout
***********************************************/

.visualWrap {display:block; position:relative; overflow:hidden;}
.visualWrap .mainVisual {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1;}
.visualWrap .mainVisual .slider,
.visualWrap .mainVisual .swiper-container,
.visualWrap .mainVisual .swiper-wrapper,
.visualWrap .mainVisual .swiper-slide,
.visualWrap .mainVisual .swiper-slide em {height:100%;}
.visualWrap .mainVisual .slider {position:relative; z-index:0;}
.visualWrap .mainVisual .swiper-slide em {display:block; position:relative; background:no-repeat 50% 50%; background-size:cover;}

.visualWrap .mainVisual .txt {display:block; position:absolute; z-index:1; top:50%; left:50%; margin-left:-70rem; width:140rem; transform:translateY(-50%); -webkit-transform:translateY(-50%); color:#fff;}
.visualWrap .mainVisual .txt p {font-size:1.4rem;}
.visualWrap .mainVisual .txt p + p {margin-top:3rem;}
.visualWrap .mainVisual .txt img {display:block; position:relative; height:12rem;}

.visualWrap .mainQuick {display:block; position:relative; z-index:1;}
.visualWrap .mainQuick:before {content:""; display:block; position:absolute; top:0; left:-7rem; right:0; bottom:0; z-index:-1;
	background: rgb(40,170,95);
	background: -moz-linear-gradient(-30deg, rgbargba(1,162,122,1) 0%, rgba(40,170,95,1) 100%);
	background: -webkit-linear-gradient(-30deg, rgba(1,162,122,1) 0%, rgba(40,170,95,1) 100%);
	background: linear-gradient(-30deg, rgba(1,162,122,1) 0%, rgba(40,170,95,1) 100%);

	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4bbea1",endColorstr="#6ac691",GradientType=1);
}

.visualWrap .mainQuick .in {display:block; position:relative; padding:8.3rem 0; max-width:79rem;}
.visualWrap .mainQuick .in .tit {display:block; position:relative; padding-left:3rem; margin-bottom:4.3rem;}
.visualWrap .mainQuick .in .tit p {display:table; width:100%; table-layout:fixed;}
.visualWrap .mainQuick .in .tit p > * {display:table-cell; position:relative; vertical-align:middle;}
.visualWrap .mainQuick .in .tit span {color:#fff; font-size:3.2rem; font-family:'Raleway'; font-weight:700; width:7em;}
.visualWrap .mainQuick .in .tit i {background:url('../img/main/bak_quick_title.png') repeat-x 50% 50%;}
.visualWrap .mainQuick .tabs {padding-left:.5rem; margin-bottom:2.4rem;}
.visualWrap .mainQuick .tabs:after {content:""; display:block; clear:both;}
.visualWrap .mainQuick .tabs li {display:block; position:relative; float:left; padding:0 2.5rem;}
.visualWrap .mainQuick .tabs li + li:before {content:""; display:block; position:absolute; top:50%; left:0; margin:-4px 0 0 -3px; width:6px; height:8px; background:url('../img/main/spr_main.png') no-repeat 0% 0%;}
.visualWrap .mainQuick .tabs button {color:#fff; font-size:1.8rem; font-weight:300; height:5rem;}
.visualWrap .mainQuick .tabs .tab-active button,
.visualWrap .mainQuick .tabs button.on {font-weight:600;}

.visualWrap .mainQuick .list {display:table; table-layout:fixed; width:100%; /*border:1px solid rgba(255,255,255,.4);*/ border-radius:.8rem; background: #00764f;}
.visualWrap .mainQuick .list > * {display:table-cell; vertical-align:middle; text-align:center;}
.visualWrap .mainQuick .list > * + * {border-left:1px solid rgba(255,255,255,.4);}
.visualWrap .mainQuick .list a {display:block; position:relative; color:#fff; padding:2.5rem 0;}
.visualWrap .mainQuick .list a span {display:inline-block; min-height:1.2em; box-sizing:border-box; font-size:1.4rem;font-weight:500}
.visualWrap .mainQuick .list a em {display:block; position:relative; margin-bottom:.6rem;}

.visualWrap .mainQuick .list a:hover {background:rgba(3, 105, 79, .15);}
.visualWrap .mainQuick .list a:hover span {border-bottom:1px solid rgba(255,255,255,.4);}

.visualWrap *[data-content="도시/건축/부동산"] .list {background: #226b6e;}
.visualWrap *[data-content="환경/생활/문화"] .list {background: #385470;}
.visualWrap *[data-content="지도서비스"] .list {background: #7c6841;}


@media all and (max-width:1440px) {
	.visualWrap .mainVisual .txt {margin-left:-68rem;}
}
@media all and (min-width:1025px) {
	.visualWrap .mainQuick {display:block; position:relative; width:55%; float:right; transition:.7s transform; -webkit-transition:.7s -webkit-transform; transform:translateX(100%); -webkit-transform:translateX(100%);}
	.visualWrap .mainQuick:before {left:-7rem;
		-moz-transform: skew(-12deg, 0deg);
		-webkit-transform: skew(-12deg, 0deg);
		-o-transform: skew(-12deg, 0deg);
		-ms-transform: skew(-12deg, 0deg);
		transform: skew(-12deg, 0deg);
	}
	.visualWrap .mainQuick:after {content:""; display:block; position:absolute; top:0; right:0; bottom:0; left:50%; background:#04a378; z-index:-2;}

	.visualWrap .mainQuick .control {display:block; position:absolute; width:12.9rem; top:0; left:0; bottom:0; transform:translateX(-100%); -webkit-transform:translateX(-100%);}
	.visualWrap .mainQuick .control.close {display:none;}
	.visualWrap .mainQuick .control button {display:block; position:absolute; top:50%; left:0; width:10rem; height:10rem; font-size:1.3rem; border-radius:.8rem; background:#06523f; color:#fff; transform:translateY(-50%); -webkit-transform:translateT(-50%);
		-webkit-box-shadow: 14px 14px 30px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 14px 14px 30px 0px rgba(0,0,0,0.3);
		box-shadow: 14px 14px 30px 0px rgba(0,0,0,0.3);
	}
	.visualWrap .mainQuick .control button:before {content:""; display:block; position:relative; margin:.65rem auto 1.65rem; width:3.5rem; height:1.3rem; background:url('../img/main/spr_main.png') no-repeat 0 -2.4rem; background-size:32rem auto;}
	.visualWrap .mainQuick .control.close button:before {background-position:-5rem -2.4rem;}
	.visualWrap .mainQuick.open {transform:translateX(0); -webkit-transform:translateX(0);}
	.visualWrap .mainQuick.open .control {display:none;}
	.visualWrap .mainQuick.open .control.close {display:block;}
}
@media all and (max-width:1024px) {
	.visualWrap .mainVisual {position:relative; top:auto; left:auto; right:auto; bottom:auto;}
	.visualWrap .mainVisual .txt {position:relative; top:auto; padding:5rem 2rem; width:auto; left:auto; margin-left:0; transform:translateY(0); -webkit-transform:translateY(0); max-width:95%;}
	.visualWrap .mainVisual .txt img {max-width:100%; height:auto;}
	.visualWrap .mainVisual .slider {position:absolute; top:0; left:0; right:0; bottom:0;}

	.visualWrap .mainQuick .control {display:none;}
	.visualWrap .mainQuick .in {padding:3rem 2rem; max-width:100%;}
	.visualWrap .mainQuick .in .tit {margin-bottom:2rem; padding-left:0;}
	.visualWrap .mainQuick .in .tit p:before {content:""; display:table-cell; background: url(../img/main/bak_quick_title.png) repeat-x 50% 50%;}
	.visualWrap .mainQuick .in .tit span {text-align:center;}

	.visualWrap .mainQuick .tabs {text-align:center; padding:0;}
	.visualWrap .mainQuick .tabs li {display:inline-block; vertical-align:middle; float:none;}
}
@media all and (max-width:730px) {
	.visualWrap .mainQuick .in .tit span {font-size:2.8rem;}
	.visualWrap .mainQuick .tabs {margin-bottom:1.5rem;}
	.visualWrap .mainQuick .tabs li {padding:0 1rem;}
	.visualWrap .mainQuick .tabs button {font-size:1.6rem;}
	.visualWrap .mainQuick .list a {padding:2rem .5rem;}
	.visualWrap .mainQuick .list a em {width:6.5rem; margin:0 auto;}
	.visualWrap .mainQuick .list a em img {max-width:100%;}
	.visualWrap .mainQuick .list a span {height:2.4em; line-height:1.2;}
}
@media all and (max-width:595px) {
	.visualWrap .mainQuick .list {display:block; overflow:hidden;}
	.visualWrap .mainQuick .list > * {display:block; float:left;}
	.visualWrap .mainQuick .list a {padding:.5rem;}

	.visualWrap *[data-content="생애주기 복지정보"] .list > * {width:25%; border-bottom:1px solid rgba(255,255,255,.4);}
	.visualWrap *[data-content="생애주기 복지정보"] .list > *:nth-child(5) {border-left-width:0;}
	.visualWrap *[data-content="생애주기 복지정보"] .list > *:nth-child(4) ~ li {width:33.33%; border-bottom-width:0;}

	.visualWrap *[data-content="도시/건축/부동산"] .list > * {width:33.33%; border-bottom:1px solid rgba(255,255,255,.4);}
	.visualWrap *[data-content="도시/건축/부동산"] .list > *:nth-child(4) {border-left-width:0;}
	.visualWrap *[data-content="도시/건축/부동산"] .list > *:nth-child(3) ~ li {width:50%; border-bottom-width:0;}

	.visualWrap *[data-content="환경/생활/문화"] .list > * {width:33.33%; border-bottom:1px solid rgba(255,255,255,.4);}
	.visualWrap *[data-content="환경/생활/문화"] .list > *:nth-child(4) {border-left-width:0;}
	.visualWrap *[data-content="환경/생활/문화"] .list > *:nth-child(3) ~ li {width:50%; border-bottom-width:0;}

	.visualWrap *[data-content="지도서비스"] .list > * {width:33.33%; border-bottom:1px solid rgba(255,255,255,.4);}
	.visualWrap *[data-content="지도서비스"] .list > *:nth-child(4) {border-left-width:0;}
	.visualWrap *[data-content="지도서비스"] .list > *:nth-child(3) ~ li {border-bottom-width:0;}
}
@media all and (max-width:550px) {
	.visualWrap .mainQuick .tabs li {width:50%; text-align:center; padding:0; float:left;}
	.visualWrap .mainQuick .tabs button {width:100%; font-size:1.5rem; height:4rem;}
	.visualWrap .mainQuick .tabs li:nth-child(3):before {display:none;}
}




/***********************************************
	Contents Layout
***********************************************/

.conWrap {position:relative; background:url('../img/main/bak_content.png') no-repeat 50% 0; background-size:100% auto; overflow:hidden;}



/***********************************************
	Board Layout
***********************************************/

.boardWrap {position:relative; padding-top:5rem; padding-bottom:5rem;}

.mainBoard {margin-right:62rem;}
.mainBoard .tabs {position:relative; z-index:0;}
.mainBoard .tabs:after {content:""; display:block; clear:both;}
.mainBoard .tabs li {display:block; float:left; position:relative;}
.mainBoard .tabs li + li:before {content:""; display:block; position:absolute; top:50%; left:0; margin:-4px 0 0 -3px; width:6px; height:8px; background:url('../img/main/spr_main.png') no-repeat -55px 0%;}
.mainBoard .tabs button {display:block; position:relative; height:7rem; padding:0 1.7rem; font-size:1.8rem; color:#63667d;}
.mainBoard .tabs button.on {color:#363c5a; font-weight:800;}
.mainBoard .board-list {position:relative; z-index:1; min-height:30rem;}
.mainBoard .control {display:block; position:absolute; top:-5rem; right:.3rem; height:3rem;}
.mainBoard .control .pager {display:inline-block; vertical-align:middle; position:relative; margin:0 0 0 3rem; line-height:3rem; bottom:auto; width:auto; font-family:'Raleway'; color:#454545; font-size:1.8rem; font-weight:400; letter-spacing:.1em;}
.mainBoard .control .pager em {font-size:2.4rem; color:#2ea988; font-weight:700;}
.mainBoard .control button,
.mainBoard .control a {display:inline-block; vertical-align:middle; width:3rem; height:3rem; overflow:hidden; text-indent:-999px; background:url('../img/main/spr_main.png') no-repeat -18rem 1rem; background-size:32rem auto;}
.mainBoard .control button {opacity:.3;}
.mainBoard .control button:hover {opacity:1;}
.mainBoard .control button.prev {position:absolute; top:0; left:0;}
.mainBoard .control button.next {background-position:-21.3rem 1rem;}
.mainBoard .control a.more {background-position:-24.3rem 1rem;}

.board-item {display:block; position:relative; padding:4rem 3rem; height:30rem; box-sizing:border-box; z-index:0; margin-bottom:3rem;}
.board-item:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background:#fff; border-radius:.8rem; background:#fff; border:1px solid #dfe0e8; z-index:-1 !important; transition:.3s all; -webkit-transition:.3s all;}
.board-item:hover:before {border-width:2px;
	-webkit-box-shadow: 10px 10px 30px 0px rgba(74,85,106,0.15);
	-moz-box-shadow: 10px 10px 30px 0px rgba(74,85,106,0.15);
	box-shadow: 10px 10px 30px 0px rgba(74,85,106,0.15);
}
.board-item .subj {display:block; font-size:1.6rem; line-height:1.4; height:2.9em; overflow:hidden; color:#333; font-weight:600; margin-bottom:2.5rem;}
.board-item .subj .new {display:inline-block; vertical-align:middle; width:2.1rem; height:2.1rem; background:url('../img/main/spr_main.png') no-repeat -4.7rem -6.1rem; background-size:32rem auto; overflow:hidden; text-indent:-999px;}
.board-item .txt {display:block; position:relative; line-height:1.5; font-size:1.4rem; color:#888; font-weight:300; height:4.6em; overflow:hidden; margin-bottom:7rem;}
.board-item .date {display:block; position:relative; line-height:2rem; font-size:1.4rem; color:#888; font-weight:300;}
.board-item .date:before {content:""; display:inline-block; position:relative; width:1.9rem; height:1.5rem; vertical-align:middle; margin-right:.8rem;background:url('../img/main/spr_main.png') no-repeat -13.4rem -.1rem; background-size:32rem auto;}


.mainPopup {position:absolute; top:5rem; right:0; width:57rem; padding-top:2rem;}
.mainPopup .tit {display:block; position:relative; float:left; font-size:2rem; color:#363c5a; font-weight:600; padding:0 0 2rem; line-height:3rem;}
.mainPopup .control {display:block; position:relative; float:right;}
.mainPopup .control .pager {display:inline-block; vertical-align:middle; position:relative; margin:0 0 0 3rem; line-height:3rem; bottom:auto; width:auto; font-family:'Raleway'; color:#454545; font-size:1.8rem; font-weight:400; letter-spacing:.1em;}
.mainPopup .control .pager em {font-size:2.4rem; color:#2ea988; font-weight:700;}
.mainPopup .control button,
.mainPopup .control a {display:inline-block; vertical-align:middle; width:3rem; height:3rem; overflow:hidden; text-indent:-999px; background:url('../img/main/spr_main.png') no-repeat -18rem 1rem; background-size:32rem auto;}
.mainPopup .control button {opacity:.3;}
.mainPopup .control button:hover {opacity:1;}
.mainPopup .control button.prev {position:absolute; top:0; left:0;}
.mainPopup .control button.next {background-position:-21.3rem 1rem;}
.mainPopup .control button.stop {background-position:-27.7rem 1rem;}
.mainPopup .control button.play {display:none; background-position:-30.2rem 1rem;}
.mainPopup .slider {position:relative; height:30rem; clear:both;}

.mainPopup .slider .swiper-slide {background:url(/common/img/board/sample_noimage.jpg) no-repeat 50% 50% #edf1fa;}
.mainPopup .slider .swiper-slide img[src*="no_image"] {opacity:0;}

.mainPopup .slider:after {content:""; display:block; position:absolute; top:3rem; left:3rem; border-radius:2rem; width:100%; height:100%; box-sizing:border-box; border:1rem solid #edeff4;}
.mainPopup .slider .swiper-container {height:100%; border-radius:2rem; overflow:hidden;}

@media all and (max-width:1024px) {
	.boardWrap {padding:0;}
	.mainBoard {margin:0 -2rem; padding:1rem 2rem 3rem; background:#f0f4fc;}
	.mainPopup {position:relative; top:auto; right:auto; margin:0 auto 8rem; padding-top:3rem;}

	.mainBoard .tabs {text-align:center; padding:0; margin-bottom:1rem;}
	.mainBoard .tabs li {display:inline-block; vertical-align:middle; float:none;}

	.mainBoard .board-list {min-height:0;}

	.mainBoard .tab-con {text-align:center;}
	.mainBoard .slider {text-align:left;}
	.mainBoard .control {display:inline-block; position:relative; top:auto; right:auto; }
}
@media all and (max-width:730px) {
	.mainBoard .tabs {margin-bottom:1.5rem;}
	.mainBoard .tabs li {padding:0 1rem;}
	.mainBoard .tabs button {font-size:1.6rem; padding:0;}
}
@media all and (max-width:640px) {
	.mainPopup {max-width:100%;}
	.mainPopup .slider {height:auto;}

}
@media all and (max-width:550px) {
	.mainBoard .tabs li {width:50%; text-align:center; padding:0; float:left;}
	.mainBoard .tabs button {width:100%; font-size:1.5rem; height:4rem;}
	.mainBoard .tabs li:nth-child(3):before {display:none;}
}





/***********************************************
	Tour Layout
***********************************************/

.tourWrap {text-align:center;}
.tourWrap .tit {display:inline-block; position:relative; text-align:center; font-family:'yg-jalnan'; font-size:3.5rem; color:#006a4e;}
.tourWrap .tit:before {content:""; display:block; position:absolute; top:-1.4rem; left:-6rem; width:4.6rem; height:5.6rem; background:url('../img/main/spr_main.png') no-repeat 0rem -12rem; background-size:32rem auto;}
.tourWrap .tit em {color:#009f13;}
.tourWrap .tit strong {display:inline-block; position:relative; font-size:1.314em;}
.tourWrap .tit strong:before {content:""; display:block; position:absolute; top:-1.7rem; left:50%; margin-left:-1.4rem; width:2.8rem; height:.9rem; background:url('../img/main/spr_main.png') no-repeat -6.8rem -12rem; background-size:32rem auto;}

.mainMaparea {text-align:left; padding:2.5rem 0 6rem; position:relative;}
.mainMaparea > .tab-group {display:block; position:relative; margin:4rem 0 14.4rem; min-height:58rem;}

.mainMaparea .tabs {position:absolute; right:-8.5rem; width:92rem; height:71.3rem; top:-3.3rem; background:url('../img/main/img_map.png') no-repeat 50% 50%; background-size:contain; z-index:0;}
.mainMaparea .tabs li {display:block; position:absolute; height:3.3rem;}
.mainMaparea .tabs li:before {content:""; display:block; position:absolute; bottom:2rem; left:0; width:2.2rem; height:0; background:url('../img/main/spr_main.png') no-repeat 0 -6.1rem; background-size:32rem auto; transition:.3s all; -webkit-transition:.3s all;}
.mainMaparea .tabs li.tab-active:before {height:3.5rem;}
.mainMaparea .tabs li button {display:block; position:relative; width:100%; height:100%; color:transparent;}
.mainMaparea .tabs li[data-tab="관악산"] {width:7.5rem; left:26.8rem; top:20rem;}
.mainMaparea .tabs li[data-tab="추사박물관"] {width:10.2rem; left:61.2rem; top:15rem;}
.mainMaparea .tabs li[data-tab="과천향교"] {width:9rem; left:31rem; top:32.3rem;}
.mainMaparea .tabs li[data-tab="온온사"] {width:7.4rem; left:36.7rem; top:28.4rem;}
.mainMaparea .tabs li[data-tab="서울랜드"] {width:9rem; left:46.2rem; top:30.2rem;}
.mainMaparea .tabs li[data-tab="국립현대미술관"] {width:13.2rem; left:53.5rem; top:35.9rem;}
.mainMaparea .tabs li[data-tab="서울대공원"] {width:10.5rem; left:48.6rem; top:42.2rem;}
.mainMaparea .tabs li[data-tab="청계산"] {width:7.4rem; left:67.6rem; top:42.6rem;}

.mainMaparea .tour-list {display:block; position:relative; width:56rem; z-index:1;}
.mainMaparea .tour-list .thumb {display:block; position:relative; margin:-13rem 0 0 6rem; width:100%; border-radius:1.8rem; overflow:hidden; z-index:1;}
.mainMaparea .tour-list .descript {display:block; position:relative; width:100%; border-radius:1.8rem; border:.7rem solid #edeff4; background:#fff; padding:5rem 6rem 16rem; z-index:0;}
.mainMaparea .tour-list .descript a {display:block; position:relative;}
.mainMaparea .tour-list .descript a:after {content:""; display:block; position:relative; margin-top:3rem; width:5rem; height:1.6rem; background:url('../img/main/spr_main.png') no-repeat -11.9rem -5.6rem; background-size:32rem auto;}
.mainMaparea .tour-list .descript .subj {display:block; position:relative; font-size:2.4rem; color:#006a4e; font-family:'yg-jalnan'; margin-bottom:2rem;}
.mainMaparea .tour-list .descript .subj:before {content:""; display:inline-block; vertical-align:middle; width:5.2rem; height:4.4rem; background:url('../img/main/spr_main.png') no-repeat 0rem -19.3rem;}

.mainMaparea .tour-list *[data-content="추사박물관"] .descript a:after,
.mainMaparea .tour-list *[data-content="온온사"] .descript a:after,
.mainMaparea .tour-list *[data-content="과천향교"] .descript a:after,
.mainMaparea .tour-list *[data-content="서울랜드"] .descript a:after,
.mainMaparea .tour-list *[data-content="국립현대미술관"] .descript a:after,
.mainMaparea .tour-list *[data-content="서울대공원"] .descript a:after {background-position:-11.9rem -10.2rem;}

.mainMaparea .tour-list *[data-content="추사박물관"] .descript .subj,
.mainMaparea .tour-list *[data-content="온온사"] .descript .subj,
.mainMaparea .tour-list *[data-content="과천향교"] .descript .subj,
.mainMaparea .tour-list *[data-content="서울랜드"] .descript .subj,
.mainMaparea .tour-list *[data-content="국립현대미술관"] .descript .subj,
.mainMaparea .tour-list *[data-content="서울대공원"] .descript .subj {color:#363c5a;}


.mainMaparea .tour-list *[data-content="관악산"] .descript .subj:before {background-position:0rem -19.3rem;}
.mainMaparea .tour-list *[data-content="청계산"] .descript .subj:before {background-position:0rem -19.3rem;}
.mainMaparea .tour-list *[data-content="추사박물관"] .descript .subj:before {background-position:-7.1rem -19.3rem;}
.mainMaparea .tour-list *[data-content="온온사"] .descript .subj:before {background-position:-7.1rem -19.3rem;}
.mainMaparea .tour-list *[data-content="과천향교"] .descript .subj:before {background-position:-7.1rem -19.3rem;}
.mainMaparea .tour-list *[data-content="서울랜드"] .descript .subj:before {background-position:-7.1rem -19.3rem;}
.mainMaparea .tour-list *[data-content="국립현대미술관"] .descript .subj:before {background-position:-7.1rem -19.3rem;}
.mainMaparea .tour-list *[data-content="서울대공원"] .descript .subj:before {background-position:-7.1rem -19.3rem;}

.mainMaparea .tour-list .descript .txt {display:block; font-size:1.4rem; color:#666; line-height:1.6; font-weight:300; height: 4.4em; overflow:hidden;}

.mainMaparea .vis-map {display:none; text-align:center; margin:0 -2rem;}
.mainMaparea .vis-map img {display:block; position:relative; margin:0 auto; max-width:100%;}
.mainMaparea .img-view {display:none; position:absolute; right:0; top:20px; z-index:1; background:rgba(0,0,0,.6); padding:.8em 1em; color:#fff; font-size:.9em;}

@media all and (max-width:1024px) {
	.mainMaparea {padding-bottom:3rem;}
	.mainMaparea > .tab-group {display:none;}
	.mainMaparea .vis-map {display:block;}
	.mainMaparea .img-view {display:block;}
}
@media all and (max-width:560px) {
	.tourWrap .tit {font-size:3rem; margin-bottom:1rem;}
}
@media all and (max-width:440px) {
	.tourWrap .tit {font-size:2.5rem;}
	.tourWrap .tit em {display:block; margin-top:2rem;}
}
@media all and (max-width:380px) {
	.mainMaparea .vis-map {margin:0 -1rem;}
}


.tour-quick {display:table; width:100%; table-layout:fixed; margin-top:4rem;}
.tour-quick > a {display:table-cell; vertical-align:middle; text-align:center; width:25%; background:#f4f5f8; border:1px solid #9799a7; height:7rem; color:#363c5a;}
.tour-quick > a:before {content:""; display:inline-block; vertical-align:middle; width:1.5rem; height:1.7rem; background:url('../img/main/spr_main.png') no-repeat -1.9rem 0rem; background-size:32rem auto; margin-right:1rem;}
.tour-quick > a:hover {background:#fff;}
.tour-quick > a + a {border-left-width:0;}

@media all and (max-width:720px) {
	.tour-quick,
	.tour-quick > a {display:block;}
	.tour-quick {overflow:hidden;}
	.tour-quick > a {width:50%; float:left; height:4.5rem; line-height:4.5rem; text-align:left; padding:0 1.5rem;}
	.tour-quick > a:nth-child(2) ~ a {border-top-width:0;}
	.tour-quick > a:nth-child(3) {border-left-width:1px;}
}
@media all and (max-width:350px) {
	.tour-quick > a {width:auto; float:none;}
	.tour-quick > a + a {border-top-width:0 !important; border-left-width:1px !important;}
}









