@charset "utf-8";

/*******************************************
	Common Style
*******************************************/

button,
input {-webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; border:none;}

#wrap {position:fixed; top:0; left:0; right:0; bottom:0; overflow:hidden;}
#wrap, .map-infoWdw {font-size:20px; font-weight:500;} 
#m_conts *{line-height:1.4;}
#openMymenu{display:none;}

@media all and (max-width:1024px) {
	#wrap, .map-infoWdw {font-size:19px;}
	#m_menu .depth1 > li > .mnu-tit a {padding: .5em;z-index:0;}
}
@media all and (max-width:640px) {#wrap, .map-infoWdw {font-size:18px;}}
@media all and (max-width:480px) {#wrap, .map-infoWdw {font-size:17px;}}

#lnbWrap .li_depth01.active > a::before {content:''; position:absolute; height:15px; bottom:25px; left:-10%; right:-10%;  background:#d0efff; z-index:-1;}


/*******************************************
	Layout Style
*******************************************/

.point {color: #2998E3;font-weight: 500;}
#map_search {position:fixed;top:7em;left:0;bottom:0;z-index:10;}
#map_area {position:fixed;top:7em;right:0;bottom:0;background:#eee;z-index:0;transition:.3s all;-webkit-transition:.3s all; width:100%!important; margin-left: 18em;}
#map_search.close-pannel + #map_area {margin-left:0;}

#map_search,
#map_search * {transition:.3s all; -webkit-transition:.3s all;}
#map_search button,
#map_search button * {transition:none; -webkit-transition:none;}
#map_search .control {display:block;position:absolute;top:50%;left:100%;width:2em;height:3.5em;margin-top:-1.75em;border-radius:0 .25em .25em 0;background:url(../img/btn_pannel_close.svg) no-repeat 50% .5em #fff;border:1px solid #ddd;text-indent:-999px;overflow:hidden;border-left-width:0;transition:.3s all;-webkit-transition:.3s all;}
#map_search .control span {display:block; position:absolute; text-indent:0; top:2.857142em; left:0; right:0; text-align:center; font-size:.7em; }

#map_search .area {position:absolute; top:0; left:0; bottom:0; width:6em; background:#fff; overflow:hidden; box-sizing:border-box;}
#map_search .searchWrap {position:absolute; top:0; bottom:0; left:6em; width:16em; background:#fff; border:1px solid #DDDDDD; border-top-width:0; border-bottom-width:0;}

#map_search {width:22em;}
#map_search.close-pannel {width: 6em !important;}
#map_search.close-pannel .control {margin-left:1px; background-image:url(../img/btn_pannel_open.svg);}
#map_search.close-pannel .control .close,
#map_search:not(.close-pannel) .control .open {display:none;}

#map_area {left:22em; overflow:hidden;}
#map_search.open-sublist ~ #map_area {left:6em;}

#map_search.close-pannel {border-right:1px solid #ddd;}
/*#map_search.close-pannel ~ #map_area {left:6em !important;}*/
#map_search.close-pannel .area {width: 6em;}

#map_search.typeArea {width: 24em;}
#map_search.typeArea .searchWrap {width: 18em;}
#map_search.typeArea ~ #map_area {left:6em;}

@media all and (max-width:1024px) {
	#map_search, #map_area {top:6.6em;}
}
@media all and (max-width:540px) {
	#map_search, #map_area {top:6.8em;}
	#map_area {margin-left:16em;}
	#map_search .area,
	#map_search.close-pannel{width:5em!important;}
	#map_search.typeArea .searchWrap{width:17em;}
	#map_search .searchWrap,
	#map_search.close-pannel ~ #map_area{left: 5em!important;}
	#map_search.typeArea{width: 22em;}
	/* #map_search.typeArea ~ #map_area{left:22em;} */
	#map_search:not(.close-pannel) .control{right:0;left:auto;z-index: 99;border-radius: 0.25em 0 0 0.25em;border-left-width: 1px;}
}

/*******************************************
	Search Box
*******************************************/

.pannel {display:block;position: absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;}

.area {overflow:auto;}
.area > ul > li > button {display:block;position:relative;width:100%;height: 6em;border-bottom: 1px solid #ddd;background: #f9f9f9;}
.area > ul > li > button span {display:block;text-align: center;font-size: .85em;color:#555555;padding-top: 3em;font-weight: 400;}
.area > ul > li > button::before{content:"";display: block;background: url('/giftcard/img/ico_shop.svg') no-repeat center / contain;width: 1.8em;height: 1.8em;position: absolute;transform: translate(-50%);left: 50%;top: 1em;}
.area > ul > li > button.on {background: #f64776;}
.area > ul > li > button.on span {color:#fff;font-weight: 600;}
.area > ul > li > button.on::before{background: url('/giftcard/img/ico_shop_on.svg') no-repeat center / contain;}

.tab-cont .searchWrap { display: none;}
.tab-cont .searchWrap.on { display: block;}

.frmSearch {display:block;position: absolute;top:0;left:0;right:0;padding: 1.75em 1.2em;box-sizing:border-box;background: #0066c2;}
.frmSearch > * + * {margin-top:.5em;}
.frmSearch select,
.frmSearch input[type="text"],
.frmSearch input[type="search"] {display:block;position:relative;width:100%;box-sizing:border-box;font-size:.8em;border-radius:.3125em;border:none;height:3.125em; padding: 0 1.5em;}

.frmSearch select {padding:0 .9em 0 .9em; background:url(../img/ico_select.svg) no-repeat 100% 50% #fff; background-size:1.875em auto; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none;}
.frmSearch select {height:2.5em;}
.frmSearch select::-ms-expand {display:none;}
.frmSearch .input {display:block;position:relative;clear:both;background: #ffffff;border-radius: 5em;overflow:hidden;padding-right:2.5em;box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);}
.frmSearch .input input[type="submit"] {display:block;position:absolute;top:.5em;right: 1em;width: 1.3em;height: 1.3em;background: url(/common/img/common/btn_search.svg) no-repeat 70% 50%;background-size:contain;text-indent:-999px;overflow:hidden;}
.frmSearch .btn{border-radius:0.3em; width:100%; font-size:.8em; padding:.4em; margin-top:.6em; background:#333333; font-weight:500; color:#ffffff;}

.frmSearch .detail{position: relative;} 
.frmSearch .detail .ctrl {position: absolute;left: 0;right: 0;background: #333;padding: 0.4em 1.4em;font-size: 0.8em;margin: 0 -1.5em;z-index: 99;}
.frmSearch .detail .ctrl-flip {color: #fff; width: 100%; text-align: left;}
.frmSearch .detail .ctrl-flip:after{content:'';width: 1em;height: 1em;position:absolute;top:50%;margin-top: -0.5em;right: 1.5em;background: url(/giftcard/img/ico_open.svg) no-repeat center;background-size: contain;}

.frmSearch .detail .multi dl {display:table;table-layout:fixed;width:100%;clear:both;padding-top: 0.5em;}
.frmSearch .detail .multi dl:first-child{border-width: 0;}
.frmSearch .detail .multi dl > * {display:table-cell; vertical-align:middle;}
.frmSearch .detail .multi dl dt{width: 3em;color: #fff;font-size: 0.85em;}
.frmSearch .detail .multi dl dd{font-size: 0.9em;}
.frmSearch .detail .multi dl dd > *{width:48%; display:inline-block;}

.frmSearch .toggle {display:none;padding-top: 2em;}
.open .ctrl-flip:after{transform: rotate(180deg);}
.open .toggle {display: block;position:relative;}
.searchWrap.open .resultSearch{top: 15.5em;} 

.resultSearch {position:absolute; top:0; left:0; right:0; bottom:0;}
.frmSearch ~ .resultSearch {top: 6em;}
.resultSearch .tit{font-weight:bold;font-size: 0.9em;color: #005cb9;position:relative;margin: 1.2em;}
.resultSearch .tit .right{color: #555;font-weight: 500;font-size: 0.9em;position:absolute;right: 0;top: 0;}

.resultSearch .bod_page {position:absolute; left:1em; right:1em; bottom:0; height:4em; box-sizing:border-box; padding:1.2em 0; text-align:center; border-top:1px solid #ddd;}
.resultSearch .bod_page > * {display:inline-block;vertical-align:middle;font-size:.8em;text-align:center;width:1.875em;height:1.875em;line-height: 1.875em!important;border-radius: 0.5em;background:#F8F8F8;}
.resultSearch .bod_page > * +  * {margin-left:.2em;}
.resultSearch .bod_page *[class*="btn_"] {text-indent:-999px; overflow:hidden; background:no-repeat 50% 50%; background-size:contain;}
.resultSearch .bod_page .btn_first,
.resultSearch .bod_page .btn_end {display:none;}
.resultSearch .bod_page .btn_10prev {background-image:url(../img/btn_prev.svg);}
.resultSearch .bod_page .btn_10next {background-image:url(../img/btn_next.svg);}
.resultSearch .bod_page span {background: #f64776;color:#fff;}

.resultSearch .list {position:absolute;left:0;top: 3em;bottom:4em;margin-bottom:-1px;right:0;overflow:auto;margin: 0 1.2em;border-top: 1px solid #333;}
.resultSearch .list > li + li {border-top:1px solid #ddd;}
.resultSearch .list a {display:block;position:relative;padding: 0.7em 0.5em;}
.resultSearch .list a .subj {display:block;position:relative;font-size: 0.9em;color:#000;font-weight:600;line-height:1.4em;margin-bottom: .4em;}
.resultSearch .list .desc li{display:block;position:relative;text-align:left;padding: 0.1em 0 0.1em .5em;font-size: 0.8em;color: #444;font-weight: 400;}
.resultSearch .list .desc li:before{content:"";display:block;position:absolute;width:.25em;height:.25em;left:0;top: 0.6em;background:#333333;}


/*******************************************
	Map Area
*******************************************/

div:has(img[src="/giftcard/img/marker.png"]){z-index:1!important;}
div:has(> .map-infoWdw) {white-space:unset!important;}
.map-infoWdw {position:absolute;top:-30px;left:50%;transform:translate(-50%, -100%);-webkit-transform:translate(-50%, -100%);z-index:999;}
.map-infoWdw .close {display:block;position:absolute;top: -1em;right: -1em;width:2em;height:2em;background:url('../img/btn_map_pop_close.svg') no-repeat 50% 50%;background-size:contain;z-index:5;}
.map-infoWdw .info {position:relative;z-index:1;background:#fff;width: 16em;border-radius:1em;-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.25);-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.25);box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.25);overflow: hidden;text-align: center;}
.map-infoWdw .info .tit{padding: 0.7em 1em;position:relative;background: #0072e5;font-size: 0.9em;}
.map-infoWdw .info .tit .name{color:#fff;font-weight: 500;padding-right: 0.4em;}
.map-infoWdw .info .tit .num{font-size:0.8em;font-weight:400;color:#fff;opacity: 0.8;}
.map-infoWdw .info .tit .btn-box{position:absolute; right:1em; top: 50%; transform: translateY(-50%);}
.map-infoWdw .info .con{padding: 1em;font-size: 0.85em;font-weight: 400;}


@media screen and (max-width:768px) {
	.map-infoWdw .info {font-size:15px;}
}

