
#nav,
#nav h2.logo_menu {display:none; height:0; }


#nav a span,#nav .inside,#nav li,#navbutton a,#navbutton2 a,#navbutton span,#navbutton2 span {
	transition:all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	-webkit-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-moz-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-o-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-ms-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}
#navbutton {display: none;}
#navbutton a {cursor:pointer;position:fixed;right:25px ;top:5px;z-index:95; outline:none;}





#navbutton .on {cursor:pointer;height:50px;position:fixed;right:16px; text-indent:-999em;top:0px;width:28px;z-index:96; }




/* nav */
#nav{position:relative; left:0; top:0; width:100%; z-index:92;visibility:visible;  } 
#nav .back {position:absolute;left:-100%;top:0;width:100%;height:100%;background:#000;opacity:0;}

#nav .inside {width:100%; max-width:280px;  }
#nav .inside nav {width:100%; }
#nav nav a{ box-sizing: border-box; width:100%;  text-align: right; display:block;  color:#fff;  font-weight:700; }
#nav nav a:hover {font-weight:700;}
#nav .inside,#nav .inside nav, #nav .inside .munu,
#nav .inside nav > ul  {width:100%;  *zoom:1; display:inline-block; *display:inline; text-align:right; font-size:0;}
#nav .inside nav > ul:after {content:""; display:block; clear:both;} 
#nav .inside nav > ul > li { width:100%;   display:inline-block; color:#fff;  font-size:0; padding:0; margin:0;}
#nav .inside nav > ul > li > a {width:100%; color:#fff;line-height:60px; height:60px; font-size:25px; font-weight:600; display: inline-block; padding:0;text-decoration:none; outline:none;}
#nav .inside nav > ul > li > a:after {content:''; display: block; clear: both;}
#nav .inside nav > ul > li > a em{outline:none;   font-family: "Nunito", sans-serif;}
#nav .inside nav > ul > li.on > a{color:#b3c317;}
 


#nav #selArray{transition-delay:0.34s;-webkit-transition-delay:0.34s;-moz-transition-delay:0.34s;-o-transition-delay:0.34s;-ms-transition-delay:0.34s;}
#nav .contact li{transition-delay:0.375s;-webkit-transition-delay:0.375s;-moz-transition-delay:0.375s;-o-transition-delay:0.375s;-ms-transition-delay:0.375s; }

#nav.show {visibility:visible;  }
#nav.show .back{opacity:0.7;}
#nav.show .inside {margin-left:0; }
#nav.show .inside,
#nav.show li{transform:translate3d(0, 0, 0);-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);outline:none;}

#nav .contact{ padding:20px 0; }
#nav .contact a{line-height:1.6; font-size:12px; cursor:default;}


#nav .smenu {display:none; overflow:hidden;  }
#nav .smenu li a{line-height:35px; color:#222 ;  text-align:left; font-weight:400; font-size:15px;}
 
#nav nav li {outline:none;}
#nav nav li:hover a,
#nav nav li:hover a:hover,
#nav nav li:hover a:active  { text-decoration:none; border:0; outline:none; color:#ccc;}
#nav nav li:hover a span  { outline:none;}
 
 
/* swiper : animation */
.swiper-pagination-bullet-active em{opacity:1 !important; visibility:visible !important; }
.swiper-wrap-container{margin-left:auto;margin-right:auto;}
.swiper-wrap-container,.gangnam-swiper-container{width:100%;height:100%;}

/* Center slide text vertically */
.swiper-slide {text-align:center;font-size:18px;background:#fff;	display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;
	-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;overflow:hidden;}

.header,.header h1,#nav a span,
.swiper-slide .section_index .list,
.section_index .list dd a,
.section_index .list dd a:before,
.section_index .list dd span,
.btn-detail,.btn-detail em,
#nav .inside,#nav li,
.section_index .list dd,#gotop,
.swiper-slide-active .section .bg,
.section_no8 .map,.section_no8 .info,
.section_index .list dt,
.swiper-pagination-bullet-ready .swiper-pagination-bullet,
.swiper-pagination-bullet em,
#navbutton a,
#navbutton span {
	transition:all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	-webkit-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-moz-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-o-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-ms-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}

 
#nav .inside nav > ul > li  {padding:10px 0px; border-top:1px solid rgba(255,255,255,0.2)}

@media all and (max-width:1000px) {
	.sitemap {display:none;} 
	#navbutton  {display: block; }
 	#navbutton a {display: block; position:absolute; z-index:999;  right:30px;}



#navbutton svg{ color:#fff; padding-top:40px;width:40px; height:40px;}

#navbutton svg.menu {}
#navbutton svg.close2 {display:none}

#navbutton .on svg.menu {display:none}

	#navbutton .on  { right:300px;}

#navbutton a.on svg.close2 {display:block}


	.mwrap div { display:none;}	


	/* nav */
	#nav{display:none; position:fixed;left:auto;top:0;right:-100%; width:100%;height:100%;z-index:92;visibility:hidden; color:#fff;text-align:center; margin:0; } 
	#nav .back{display:none;position:absolute;left:-100%;top:0;width:100%;height:100%;background:#000; opacity:0; }
	#nav .back:before{position:absolute;left:0;top:0;width:100%;height:100%;content:'';background:#000;display:block;opacity:0.4;z-index:91;}
	#nav .inside{position:absolute;right:100%;top:0;width:100%;
	height:100%;margin-left:0;background:var(--maincolor);z-index:93;overflow:hidden; -webkit-overflow-scrolling:touch;
		transform:translate3d(100%, 0px, 0px);
		-webkit-transform:translate3d(100%, 0px, 0px);
		-moz-transform:translate3d(100%, 0px, 0px);
		-o-transform:translate3d(100%, 0px, 0px);
		-ms-transform:translate3d(100%, 0px, 0px);}
	#nav nav{margin:0; position:relative; height:100%;  }
	#nav nav a{ box-sizing: border-box; width:100%;  

  text-align: right; display:block;  line-height:50px; height:50px; outline:none; }
	#nav nav a:hover {color:#1e1e1e;}
	#nav nav li{ width:100%; float:left;
		transform:translate3d(250px, 0px, 0px);
		-webkit-transform:translate3d(250px, 0px, 0px);
		-moz-transform:translate3d(250px, 0px, 0px);
		-o-transform:translate3d(250px, 0px, 0px);
		-ms-transform:translate3d(250px, 0px, 0px);
	}
	#nav h2.logo_menu {display:block; height:54px;  float:left;  width:60% ; max-width:155px;margin:2px 0 0 15px;  }
	#nav h2.logo_menu a { background:url(/img/com/logo_m.png) no-repeat center 50%; background-size:100%;  width:100%;line-height:54px; height:54px; display: inline-block;  }
	#nav h2.logo_menu a span { width:100%; display: inline-block; font-size:0; }
	#nav .inside nav  {width:100%; }
	#nav .inside nav > ul {width:100%; height:100%;}


	#nav .inside nav > ul.list {overflow-x:scroll; }



	#nav .inside nav > ul > li { width:100%;   text-align:left;}
	#nav .inside nav > ul > li > a {width:100%; line-height:40px; height:40px; text-align:left; padding-left:20px;
	font-size:22px; ;  font-weight:700;}


	#nav .inside nav > ul > li > a.active em {color:#b3c317;  font-family: "Nunito", sans-serif;} 
	#nav .inside nav > ul > li.on > a em {border:none;  }
	#nav .smenu {  background:none; padding: 0 0 5px ; min-width:100%; }
	#nav .inside nav > ul > li .smenu li a {color:#fff;  padding-left:20px; 
	line-height:40px; height:40px; height:auto;  font-size:16px; font-weight:500; }

	#nav.show {display:block; visibility:visible;  }
	#nav.show .back {display:block;opacity:0.4; }
	#nav.show .inside nav > ul > li.on > a em,
	#nav.show .inside nav > ul > li.on > a:active em,
	#nav.show .inside nav > ul > li.on > a:focus em {color:#b3c317;}
	 
	#nav .inside nav > ul > li.sbottom {width:100%; padding:30px 0 0 0px; line-height:1.2; height:auto; 
	 bottom:30px; left:0; z-index:99; background:#212121; }
	#nav .inside nav > ul > li.sbottom span {display:inline-block;  text-align:center; padding:0px 5px; }
	#nav .inside nav > ul > li.sbottom span a {display:inline-block; text-align:center; color:#ddd; font-size:13px; line-height:40px; height:40px;}
	#nav .inside nav > ul > li.sbottom span.name {display:inline-block; width:100%; text-align:center; color:#ddd; font-size:13px; line-height:40px; height:40px;}
	#nav .inside nav > ul > li.sbottom span.name em { padding:0 0 0 23px; width:auto !important;  display:inline-block; font-weight:700; background:url(../img/admin/icon_sid.png) no-repeat 0 50%;} 
	#nav .inside nav > ul > li.sbottom span.logout a { color:#9ccb61; }
	 
	#nav.show {display:block; visibility:visible;  }
	#nav.show .back {display:block;opacity:0.4; }

	#nav.show .inside nav > ul > li.on {background:rgba(0,0,0,0.2)}
	#nav.show .inside nav > ul > li.on > a em,
	#nav.show .inside nav > ul > li.on > a:active em,
	#nav.show .inside nav > ul > li.on > a:focus em {color:#7ad3ff;}
	 
	#nav .inside nav > ul > li .smenu li.on > a:focus {color:#7ad3ff;}

}
@media all and (max-width:768px){
		.swiper-pagination{display:none !important;}
}

@media all and (max-width:600px){ 
	#nav .inside nav > ul > li > a { font-size:20px; line-height:38px; }
	#nav .inside nav > ul > li .smenu li a { height:34px; box-sizing:border-box; font-size:14px; line-height:24px;}
	#nav .inside nav > ul > li .smenu li:hover em {}




}
 
@media all and (max-width:350px){
	#nav .inside nav > ul > li .smenu li a {  line-height:36px; height:36px;  font-size:15px;  }
}
 
@media all and (min-width:1000px){
	#navbutton,#nav .back {display:none; }
	#nav .smenu {display:none; } 
}


 
#nav .top_link {overflow:hidden; background:rgba(0,0,0,0.4); padding:13px 10px; }
#nav .top_link > ul > li { display:inline-block; padding:0px 10px; }
#nav .top_link > ul > li a{  color:#fff;  font-weight:700; }
#nav .top_link > ul > li a:hover {font-weight:700;}
