/* 서브 상단레이아웃 */

#header {background:#188657; border-bottom:none; position:relative;}
#header .go_fullmenu{border-right:1px solid #55a784;}
#header .go_search{border-left:1px solid #55a784;}

/* path */

#container_wrap .path_box .depth1{height:110px;color:#fffefe; position:relative;}
#container_wrap .path_box .m_spot_community{background:url("/images/biz_mobile/sub/m_spot_community.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_education{background:url("/images/biz_mobile/sub/m_spot_education.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_etc{background:url("/images/biz_mobile/sub/m_spot_etc.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_food{background:url("/images/biz_mobile/sub/m_spot_food.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_lodge{background:url("/images/biz_mobile/sub/m_spot_lodge.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_medical{background:url("/images/biz_mobile/sub/m_spot_medical.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_service{background:url("/images/biz_mobile/sub/m_spot_service.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_all{background:url("/images/biz_mobile/sub/m_spot_all.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_support{background:url("/images/biz_mobile/sub/m_spot_support.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_traditional_market{background:url("/images/biz_mobile/sub/m_spot_traditional_market.jpg") no-repeat center; background-size:cover}
#container_wrap .path_box .m_spot_marine_products{background:url("/images/biz_mobile/sub/m_spot_marine_products.jpg") no-repeat center; background-size:cover}

/*depth1추가*/
#container_wrap .path_box .depth1{height:100px;color:#fffefe; position:relative;}
#container_wrap .path_box > .depth1 h2 {font-size:19px;display: block; padding: 28px 0 4px 17px; font-weight: 400;}

#path_txt {height:30px; line-height:30px; color:#fff; font-size:14px;width: 85%; margin-top:-3px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
#path_txt a{font-size:14px; color:#fff; margin:0 3px}
#path_txt a:first-child{display:inline-block; width:15px; margin-left: 17px; text-indent:-9999px; background:url("/images/car_mobile/common/sub_home.png") no-repeat center; background-size:15px 14px}
.depth1 a.open_snb {background:url("/images/mayor_mobile/common/ico_snb_down.png") no-repeat 0 0 / 34px 34px; width:34px; height:34px; text-indent:-5000px; display:block; position:absolute; right:5%; top:35px;}
#container_wrap .depth2 {display:none; position:absolute; width:100%; background:#fff; border-bottom:1px solid #1a4589; z-index:100;}
#container_wrap .depth2 > ul > li {border-bottom:1px solid #d2d2d2; }

#container_wrap .depth2 > ul > li > a { height:42px; line-height:42px; padding:0 0 0 22px}
#container_wrap .depth2 > ul > li.accordion > a {background:url('/images/common_mobile/depth2_arrow_down_gray.png') no-repeat 92% 19px; background-size:13px 8px}
#container_wrap .depth2 > ul > li.on > a.accordionExpanded{background:#1a4589 url('/images/common_mobile/depth2_arrow_down_white.png') no-repeat 92% 19px; background-size:13px 8px }

/*
#container_wrap .depth2 > ul > li.on > a.accordionExpanded{background:#1a4589 url('/images/common_mobile/depth2_arrow_up_white.png') no-repeat 92% 19px; background-size:13px 8px}
*/
#container_wrap .depth2 > ul > li.on > a {color:#fff;background:#1a4589 }
#container_wrap .depth2 > ul > li.open > a {color:#fff;background:#1a4589 }

/*
#container_wrap .depth2 > ul > li.on > a {color:#fff;background:#1a4589 url('/images/common_mobile/depth2_arrow_down_white.png') no-repeat 92% 19px; background-size:13px 8px}
*/

#container_wrap .depth2 > ul { display:inline-block; width:100%;} 
#container_wrap .depth2 a { display:block;}
#container_wrap .depth2 > ul > li ul {display:none; padding:15px 0 ;width: 100%; overflow:hidden}
#container_wrap .depth2 > ul > li li { float:left; width:50%;height: 24px;background:url("/images/mayor_mobile/common/3depth_li_bar.gif") no-repeat 22px 9px / 6px 2px;margin: 2px 0; overflow:hidden} 
#container_wrap .depth2 > ul > li li a { padding-left:34px;}
#container_wrap .depth2 > ul > li li.on a {color:#1a4589; text-decoration:underline; font-weight:400}

#container_wrap .depth3, #container_wrap .depth4{float:left;width:100%;}
#container_wrap .depth3 > a{display:block;height:45px;line-height:45px;font-size:15px;color:#525252;padding-left:20px;border-bottom:1px solid #e0e0e0;/*border-right:1px solid #e0e0e0;*/background:url("/images/mayor_mobile/common/path_arrow.png") no-repeat 92% center;background-size:13px 8px}
#container_wrap .depth4 > a{display:block;height:45px;line-height:45px;font-size:15px;color:#fff;padding:0 24px;border-bottom:1px solid #e0e0e0;border-right:1px solid #e0e0e0;background:#1a4589 url("/images/mayor_mobile/common/path_arrow2.png") no-repeat 92% center;background-size:13px 8px;}
#container_wrap .depth4 > a.open {background:#1a4589 url("/images/mayor_mobile/common/path_arrow.png") no-repeat 92% center;background-size:13px 8px;}
#container_wrap .depth3 > ul > li{display:block;height:45px;line-height:45px;font-size:13px;color:#525252;border-bottom:1px solid #fff;background:#f0f0f0}
#container_wrap .depth3 > ul > li > a{display:block;padding-left:20px}
#container_wrap .depth3 > ul > li.on{background:#0060a6}
#container_wrap .depth3 > ul > li.on > a{color:#fff}


#container_wrap .depth4 > ul > li{display:block;line-height:26px;font-size:14px;color:#525252; width:50%; float:left;}
#container_wrap .depth4 > ul > li > a{display:block;padding-left:13px; background:url("/images/mayor_mobile/common/depth4_bar.png") no-repeat 0 12px / 6px 2px;margin-left: 15px;}
#container_wrap .depth4 > ul > li.on > a{color:#1a4589; text-decoration:underline;}


#container_wrap .depth5{position:relative;top:20px;clear:both;margin:20px;z-index: 100;}
#container_wrap .depth5 > a{display:block;font-size:15px;color:#fff;padding-left:20px;height:35px;line-height:35px;background:#1fbfcb url("/images/festival_mobile/sub/icon_plus.png") no-repeat 95% center;background-size:13px 13px;border-bottom:1px solid #fff}
#container_wrap .depth5 > ul{display:none}
#container_wrap .depth5 > ul > li > a{display:block;font-size:15px;color:#444343;padding-left:20px;height:35px;line-height:35px;background:#e0eeef;border-bottom:1px solid #fff}

.depth3 > ul{display:none;position:absolute;width:50%;z-index:900}
.depth4 > ul{display:none;position:absolute; background:#fff; width:100%;z-index:900; padding:15px 0;}

/* path  끝*/




#footer .sns{height:45px;line-height:45px;background:#484848}
#footer .sns ul,#footer .sns .sns_inner > span{float:left}
#footer .sns .sns_inner > span{float:left; margin-left:20px; background:url("/images/festival_mobile/sub/icon_share.png") no-repeat 0 center;background-size:20px;padding-left:27px;color:#fff; font-size:13px}
#footer .sns ul{float:right; padding-right:20px}
#footer .sns ul li{float:left;padding-left:8px}
#footer .sns ul li a{display:block;width:23px;height:45px;text-indent:-9999px;}
#footer .sns ul li:nth-child(1) a{background:url("/images/festival_mobile/sub/facebook.png") no-repeat 0 center;background-size:23px}
/*#footer .sns ul li:nth-child(2) a{background:url("/images/festival_mobile/sub/kakaotalk.png") no-repeat 0 center;background-size:23px}*/
#footer .sns ul li:nth-child(2) a{background:url("/images/festival_mobile/sub/twitter.png") no-repeat 0 center;background-size:23px}
#footer .sns ul li:nth-child(3) a{background:url("/images/festival_mobile/sub/band.png") no-repeat 0 center;background-size:23px}

#login_box .btn{top:116px !important}


/** 대관절차 및 규정 **/
ul.step { width:100%; margin-top:25px;}
ul.step li {display:inline-block;width: 100%;box-sizing:border-box;height:65px;margin:0 10px 10px 0;/* background:url("/contents/13767/rarr.jpg") no-repeat right; */}
ul.step li:last-child { background:0 !important;}
ul.step li > span { width:20%; float:left; font-size:18px; border:2px solid #188657; border-right:0 !important; line-height:60px; height:100%; text-align:center; color:#188657; background:#f9f9f9; border-radius:10px 0px 0px 10px; font-weight:500; box-sizing:border-box;}
ul.step li > p {float:left;border:2px solid #ddd;border-left:0 !important;height:100%;box-sizing:border-box;border-radius:0px 10px 10px 0px;width: 80%;padding:18px 0 0 10px;}

/*퀵메뉴 및 내주변상가찾기*/
.path_box .quick_list{display: inline-block; margin-bottom: -6px; width: 100%;}
.path_box .quick_list > li{float: left; width: 50%;}
.path_box .quick_list > li > a{display: block; height: 40px; line-height: 40px; text-align: center;}
.path_box .quick_list > li.apply > a{background-color: #f3c204; color: #333;}
.path_box .quick_list > li.around > a{background-color: #dd4224; color: #fff;}
.path_box .quick_list > li > a span.icon{position: relative; display: inline-block; margin-right: 5px; background: url("/images/biz_mobile/common/around_sp.png") no-repeat 0 0; background-size: 210px;}
.path_box .quick_list > li.apply > a > span.icon{width: 20px; height: 20px; background-position: -160px 0; top: 6px;}
.path_box .quick_list > li.around > a > span.icon{width: 17px; height: 23px; background-position: -189px 0; top: 8px;}
.path_box .quick_list > li.around .around_inner{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background-color: #fff; display: none;}
.path_box .quick_list > li.around .around_inner .title_box{position: absolute; top: 0; left: 0; width: 100%; border: 0; z-index: 2;}
.path_box .quick_list > li.around .around_inner .title_box h2.title{background-color: #fff; color: #4a4a4a; font-size: 16px; padding: 15px 18px; font-weight: 300; height: 30px; line-height: 30px;}
.path_box .quick_list > li.around .around_inner .title_box h2.title span.icon{float: left; width: 30px; height: 30px; background: url("/images/biz_mobile/common/around_sp.png") no-repeat 0 0; background-size: 210px; margin-right: 9px;}
.path_box .quick_list > li.around .around_inner .title_box h2.title span.c_blue{color: #3d629b; margin-right: 4px;}
.path_box .quick_list > li.around .around_inner .title_box .classify{background-color: #188657; position: relative; padding: 15px;}
.path_box .quick_list > li.around .around_inner .title_box .classify > a{position: relative; display: block; border: 2px solid #fff; border-radius: 50px; color: #fff; height: 39px; line-height: 39px; padding: 0 26px;}
.path_box .quick_list > li.around .around_inner .title_box .classify > a span.icon{position: absolute; top: 50%; right: 15px; width: 12px; height: 9px; text-indent: -99999px; background: url("/images/biz_mobile/common/around_sp.png") no-repeat -112px 0; background-size: 210px; margin-top: -5px;}
.path_box .quick_list > li.around .around_inner .title_box .classify > .classify_inner{position: absolute; top: 60px; left: 0; width: 100%; padding: 0 15px; box-sizing: border-box; display: none;}
.path_box .quick_list > li.around .around_inner .title_box .classify > .classify_inner ul{border: 1px solid #d2d2d2; border-radius: 10px; overflow: hidden;}
.path_box .quick_list > li.around .around_inner .title_box .classify > .classify_inner ul li{}
.path_box .quick_list > li.around .around_inner .title_box .classify > .classify_inner ul li a{display: block; border-top: 1px solid #d2d2d2; background-color: #403a3a; color: #fff; padding: 7px 26px;}
.path_box .quick_list > li.around .around_inner .title_box .classify > .classify_inner ul li:first-child a{border-top: 0;}
.path_box .quick_list > li.around .around_inner .distance{position: absolute; bottom: 0; left: 0; width: 100%; z-index: 2;}
.path_box .quick_list > li.around .around_inner .distance ul{}
.path_box .quick_list > li.around .around_inner .distance ul li{float: left; width: 25%;}
.path_box .quick_list > li.around .around_inner .distance ul li a{display: block; background-color: #34393f; color: #fff; text-align: center; border-left: 1px solid #272B2F; padding: 20px 0 17px; font-size: 13px; line-height: 13px;}
.path_box .quick_list > li.around .around_inner .distance ul li:first-child a{border-left: 0;}
.path_box .quick_list > li.around .around_inner .distance ul li.on a{background-color: #eeb704; color: #272b2f;}
.path_box .quick_list > li.around .around_inner .close{z-index: 99; position: absolute; top: 22px; right: 15px; width: 16px; height: 16px; background: url("/images/biz_mobile/common/around_sp.png") no-repeat -134px 0; background-size: 210px; text-indent: -99999px;}
.path_box .quick_list > li.around .around_inner .distance ul li a span.icon{display: block; margin: 0 auto 10px; width: 16px; height: 23px; background: url("/images/biz_mobile/common/around_sp.png") no-repeat -40px 0; background-size: 210px;}
.path_box .quick_list > li.around .around_inner .distance ul li.on a span.icon{width: 36px; background-position: -66px 0;}
.path_box .quick_list > li.around .around_inner .map_wrap{width: 100%; height: 87%; z-index: 1;}

/*로딩중*/
.loding_wrap{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.85); z-index: 9999; pointer-events: all;}
.loding_wrap .loding{
  position:absolute;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 75px;
	margin: -34px 0 0 -40px;
}

.loding_wrap .loding .mask{
  position:absolute;
  border-radius:2px;
  overflow:hidden;
   perspective: 1000;
  backface-visibility: hidden;
}

.loding_wrap .loding .plane{
  background:#ffffff;
  width:400%;
  height:100%;
  position:absolute;
  transform : translate3d(0px,0,0);
  /*transition: all 0.8s ease; */
  z-index:100;
  perspective: 1000;
  backface-visibility: hidden;
  
}
 
.animation{
  transition: all 0.3s ease;
}


 
.loding_wrap .loding .loding_top .plane{
  z-index:2000;
  animation : trans1 1.3s ease-in infinite  0s backwards;
}
.loding_wrap .loding .loding_middle .plane{
  transform : translate3d(0px,0,0);  
  background : #188657;
  animation : trans2 1.3s linear infinite  0.3s  backwards;

}
.loding_wrap .loding .loding_bottom .plane{
  z-index:2000;
  animation : trans3 1.3s ease-out infinite  0.7s backwards;
}



.loding_wrap .loding .loding_top{
  width:53px;
  height:20px;
  left:20px;
  transform: skew(-15deg, 0);
  z-index:100;
}

.loding_wrap .loding .loding_middle{
  width:33px;
  height:20px;
  left:20px;
  top:15px;
  
  transform: skew(-15deg, 40deg)
}
.loding_wrap .loding .loding_bottom{
  width:53px;
  height:20px;
  top:30px;  
  transform: skew(-15deg, 0)
}