@charset "utf-8";

#mg_header {border-bottom:1px solid #ebebeb; height:106px;}
.hdWrap {padding-bottom:15px}
.moRoadWrap {display:block}
.mobileBtnBox {display:block}

/*tab css*/
.detailTabnav {all:unset;}
.detailTab{ width:100%;  margin-top:0px; margin-bottom:0px;}
.detailTabnav{ display:flex; width:100% ;border-bottom:1px solid  var(--color-gray-el);margin-left:0px;padding:0}
.detailTabnav li{display: inline-block; width:50%; height:46px; text-align:center; border-right:1px solid  var(--color-gray-el);}
.detailTabnav li a:before{content:""; position:absolute; left:0; top:0px; width:100%; height:3px; }
.detailTabnav li a.active:before{background: var(--color-basic);}
.detailTabnav li a.active{border-bottom:1px solid #fff;}
.detailTabnav li a{ position:relative; display:block; background: #f8f8f8; color: #000; padding:0 0px; line-height:46px; text-decoration:none; font-size:var(--font-size_16); font-weight:var(--font-b); }
.detailTabnav li a:hover,.detailTabnav li a.active{background:#fff; color: var(--color-basic); }

@media (max-width: 1023px) { /* 모바일,테블릿까지 */
#mg_header {height:106px;}
.detailTabnav {display:flex; border-right:none; border-top:0px solid  var(--color-gray-el); border-bottom:1px solid  var(--color-gray-el);}
.detailTabnav li {width:50%;}
.detailTabnav li a {padding:0; width:auto;}
}


/*--- CitySelectForm ---*/

.CitySelectForm {all:unset;}
.CitySelectForm_main {all:unset;}
.CitySelectForm {border-radius:18px; background:#fff; display:flex; gap:11px; justify-content:space-between; }
.CitySelectForm_main {padding:20px 25px 0px 25px; border-radius:18px; background:#fff; display:flex; gap:11px; justify-content:space-between; box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.1); margin-top:-67px; }

.CitySelectFormUl {all:unset;}
.CitySelectFormUl {width:calc(100% - 230px); margin-right:11px;display:flex; gap:11px;padding-bottom:20px }
.CitySelectFormUl > li {width:100%; position:absolute;}
.CitySelectFormUl > li:nth-of-type(2) {margin-right:0;}

.CitySelectList {all:unset;}
.CitySelectList {left:0; width:100%; background:#fff; z-index:20; margin:10px 0px 0px 0px;}
.CitySelectList > li {display:flex; gap:5px; font-size:var(--font-size_16); font-weight:var(--font-r); padding:0px; cursor:pointer; } 
.CitySelectList > li:hover {color:var(--color-basic-b);}

.CitySelectBox {all:unset;}
.CitySelectBox {position:relative; width:100%; cursor:pointer;}
.CitySelectBox i {position:absolute; right:28px; top:50%; transform:translateY(-50%);}
.CitySelectBoxInput {width:100%; border:none; height:100%; background:#f5f5f5; border-radius:5px; padding:20px 89px 20px 20px; text-align:right;  font-weight:var(--font-b);}
.CitySelectBoxInput::placeholder {text-align:left; font-size:var(--font-size_17); color:#a4a4a4; font-weight:var(--font-r);} 

.CitySelectForm_mainMo {margin-top:-30px;}
.CitySelectBoxInputMo {width:100%; border:none; height:100%; border-radius:5px; padding:18px 20px; position:relative; border:1px solid #ebebeb; background:#fff; box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.1); }
.CitySelectBoxInputMo::placeholder {color:#b6b6b6; font-weight:var(--font-m);}

.CitySelectListBox {display:flex;}
.CitySelectListTabs {all:unset;}
.CitySelectListTabs {width:33.33%;  overflow-y: scroll; text-align:center;background:#f5f5f5;padding-bottom:0px; }
.CitySelectListTabs > li.tab-link.current {background:#fff;}
.CitySelectListTabs > li { font-weight:var(--font-m); padding: 12px 25px; background:#f5f5f5; cursor:pointer; transition:0.28s; }
.CitySelectListTabs > li:hover {background:#fff;}

.CitySelectContent {all:unset;}
.CitySelectContent { font-weight:var(--font-m); width:calc(100% - 130px); padding-top:3px;  overflow-y: scroll;}

.CitySelectContent02 { font-weight:var(--font-m); width:100%; padding:22px 25px;}

.CitySelectContentTabUl {all:unset;}
.CitySelectContentTabUl {display:flex; flex-wrap:wrap; row-gap: 25px; padding: 8px 0 0px 0}
.CitySelectContentTabUl > li {width:100%;text-align:center; cursor:pointer;}
.CitySelectContentTabUl > li span {transition:0.28s;}
.CitySelectContentTabUl > li:hover span {color: var(--color-basic);}
.CitySelectContentTabUl.width49 > li {width:49.99%;}
.CitySelectFormUl.s .CitySelectContentTabUl > li {width:100%;}
.CitySelectFormUl.s .CitySelectContentTabUl.width49 > li {width:49.99%;}

.CitySelectContentTab {display:none;}
.CitySelectContentTab.current {display:block;}

.CitySelectFormBtn        {width:230px; height:60px; border-radius:15px; background:var(--color-basic-eb); color:#fff; font-size:var(--font-size_17); font-weight:var(--font-b);}

@media (min-width:1024px) and (max-width:1279px) { /* 노트북 & 테블릿이상까지*/  
	.CitySelectForm {flex-wrap:wrap;}
	.CitySelectForm_main {flex-wrap:wrap;margin-top:17px;padding-bottom:20px;box-shadow: -1px 1px 15px 0 rgba(0, 0, 0, 0.1);}
	.CitySelectFormUl  {flex-wrap:wrap; width:100%; margin-right:0;;padding-bottom:10px}
	.CitySelectFormUl.s {width:100%;}
	.CitySelectFormUl.s .CitySelectContentTabUl > li {width:49.99%;}
	.CitySelectFormBtn {width:100%; height:40px;}
}

@media (max-width: 1023px) { /* 모바일,테블릿까지 */
	.CitySelectForm_main { }
	.CitySelectFormUl  {flex-wrap:wrap; width:100%; margin-right:0;;padding-bottom:10px}
	.CitySelectBoxInputMo {font-size:16px;font-weight:var(--font-m);}
	.CitySelectFormBtn {margin-bottom:20px}
	.CitySelectBoxInput {padding:10px 89px 10px 20px;}
}

@media (min-width: 480px) { /* 480px 이상 */

	.CitySelectContentTabUl > li {width:49.99%;} /* 가로갯수2개로 늘려줌*/

}

@media (max-width: 479px) { /* 479px 까지 */
	.CitySelectFormUl.s .CitySelectContentTabUl.w100 > li {width:100%;}
}

.comPopTermInputWrap2 {margin-top:0px;}
.comPopTermInputBox2 {position:relative; width:300px; max-width: 300px;  margin: 0 auto; }
.comPopTermInputBox2 button {position:absolute; right:10px; top:45%; transform:translateY(-50%);}
.comPopTermInputBox2 button img {width:20px;}
.comPopTermInput2 {border:none; width:100%; border: 1px solid  var(--color-gray-el); border-radius: 50px; height: 40px; line-height: 40px; padding: 0 10px; font-weight:var(--font-b);}
.comPopTermInput2::placeholder {font-weight:var(--font-b); color:#999; font-size:var(--font-size_14);}

@media (max-width: 1023px) { /* 모바일,테블릿까지 */
	.comPopTermInputWrap2 {margin-top:0}
	.comPopTermInputBox2 i img {width:16px;}
	.comPopTermInput2{background:  var(--color-gray-el);border-radius: 5px; height: 45px; line-height: 45px; padding: 0 10px ;}
}

#SelectList_city {display:none;}
#SelectList_city.current {display:block;}

#SelectList_category {display:none;}
#SelectList_category.current {display:block;}
