@media  (min-width: 1200px) {
 .nav_wrapper {
  position: relative;
  left: 0;
  top: 0px;
  width: 100%;
  height: 44px; 
  z-index: 99999999999999999999;
/*   background:rgba(101, 96, 127, 1);*/
 background:rgba(0, 0, 0, 0.2);
  border-top: 0px solid rgba(242, 242, 242, 1);
}
/***** ÁÂÃø·Î°í********/
.logos{float:left;}
/***** ÁÂÃø·Î°í********/




.search_box input.search_icon:hover { background: #efa666; }

.menu-link { display: none; }

.spinner-master input[type=checkbox] { display: none; }
/***** ÁÂÃø·Î°í*****
.menu {	margin-right:auto;margin-left:auto;   width: 1100px;   height: auto;  float:right;}
**/
/***** ÁÂÃø·Î°í¾Æ´Ô********/
.menu {	margin-right:auto;margin-left:auto;   width: 1200px;   height: auto;}

.menu ul { z-index: 99999999999999999999;
  padding: 0;
	margin: 0 auto;
  list-style: none;
  position: relative;
  display: inline-block;

}
.color1 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1); }
.color1 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color1 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color1:hover {color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color2 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1);}
.color2 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color2 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color2:hover {color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color3 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1);}
.color3 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color3 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color3:hover{color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color4 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1);}
.color4 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color4 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color4:hover{color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color5 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1);}
.color5 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color5 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color5:hover{color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color6 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:1px solid rgba(0, 0, 0, 0.1);}
.color6 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color6 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color6:hover {color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0.1);}

.color7 {color: #ffffff;  background: rgba(0, 0, 0, 0); border-right:0px solid rgba(0, 0, 0, 0.1);}
.color7 a {color: #ffffff;  border-right:0px solid #3D3D3D;}
.color7 a:hover {color: #fff; font-weight:600; background: rgba(0, 0, 0, 0); border-right:0px solid rgba(255, 255, 255, 1);}
.color7:hover {color: #fff; background: rgba(0, 0, 0, 0.5); border-right:1px solid rgba(0, 0, 0, 0);}

.menu ul li { float:left; width: 171px; text-align:center; z-index: 99999999999999999999; }
.menu ul li a {  display: block;  text-decoration: none;    font-size: 16px;   font-weight:200;  padding:10px; border-right:0px solid #2E2E2E;}

.menu ul ul {  display: none;  position: absolute;  width: 171px;}

.menu ul li:hover > ul { display: block; }
.menu ul ul > li { display: block; position: relative; border-bottom:1px solid rgba(0, 0, 0, 0.3);}
.menu ul ul > li:last-child { position: relative; border-bottom:0px solid #E1E1E1;}
.menu ul ul > li a { border-right:0px solid rgba(255, 255, 255, 0.4); padding: 5px 0 5px 0;  height: auto;  background:rgba(0, 0, 0, 0.2);   color:#fff; font-size: 13px; font-weight:200; font-family: 'Nanum Gothic';}
.menu ul ul > li a:hover { border-right:0px solid rgba(255, 255, 255, 0.5); background:rgba(0, 0, 0, 0.5);  color:#FFD800; font-size: 13px; font-weight:200;}


}
 @media  (max-width: 768px) {
.example-header .container { width: 100%; z-index:99999999999999999999;}
.search_box input.search_icon:hover { background: #ffffff; }
.menu-link { display: none; }
.spinner-master input[type=checkbox] { display: none; }
.spinner-master * {  transition: all 0.3s;  box-sizing: border-box;}
.spinner-master {  position: absolute;  margin: 20px;  height: 30px;  width: 30px;  float:right; -webkit-margin-before:0px;}
.spinner-master label {  cursor: pointer;  position: relative;  z-index: 99;  height: 100%;  width: 100%;  top: 20px;  left: 0;}
.spinner-master .spinner {  position: absolute;  height: 4px;  width: 100%;  padding: 0;  background-color: #ffffff;}
.spinner-master .diagonal.part-1 {  position: relative;  float: left;}
.spinner-master .horizontal {  position: relative;  float: left;  margin-top: 4px;}
.spinner-master .diagonal.part-2 {  position: relative;  float: left;  margin-top: 4px;}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .horizontal { opacity: 0; }
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-1 {  transform: rotate(135deg);  -webkit-transform: rotate(135deg);  margin-top: 5px;}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-2 {  transform: rotate(-135deg);  -webkit-transform: rotate(-135deg);  margin-top: -12px;}
a.menu-link {  display: block;  color: #fff;  float: left;  text-decoration: none;  padding: 0px 6px;  font-size: 13px;}
a.menu-link:hover { color: #ffffff; }
a.menu-link:after {  content: "\2630";  font-weight: normal;}
a.menu-link.active:after { content: "\2715"; }
.menu {z-index:99999999999999999999;	width: 100%;  clear: both;  padding-top:60px;  min-width: inherit;  float: none;}
.menu,
.menu > ul ul {  overflow: hidden;  max-height: 0;  background:rgba(243, 90, 90, 1);   border-top: 1px solid rgba(198, 74, 74, 1); border-bottom: 1px solid rgba(198, 74, 74, 1);}
.menu > li > ul.sub-menu {  padding: 0px;  border: none;}
.menu.active,
.menu > ul ul.active { max-height: 55em; }
.menu ul { display: inline; width:100%;}
.menu li,
.menu > ul > li { display: block; width:100%; }
.menu > ul > li:last-of-type a { border: none; }
.menu li a {  color: #000000;  display: block;  padding: 0.8em;  position: relative; }
.menu li.has-submenu > a:after {  content: '+';  position: absolute;  top: 0;  right: 0;  display: block;  font-size: 16px; font-weight:200; padding: 0.55em 0.5em;}
.menu li.has-submenu > a.active:after { content: "-";  color:#A3A3A3; }
.menu ul ul > li  {  background-color: #F6F6F6;  width:100%;  color:#000000;  padding-left: 20px; font-size: 13px; font-weight:200;}
.menu ul ul > li a {  background-color: #F6F6F6;	color:#000000; padding: 10px 0 10px 0;}
.menu ul ul > li a:hover {background-color: #F6F6F6;	color:#000000; padding: 10px 0 10px 0;}

.menu ul li {  background-color: #FFF;     width:100%;  text-align:left; color: #000000; border-top: 1px solid rgba(231, 231, 231, 1);}
.menu ul li a:hover {  background-color: #FFF;   width:100%;  color: #FFF;}
.menu ul li.hover > a {  background-color: #FFF;  color: #000000; ;}
/*.menu ul li.hover > a {  background: #1154A8;  color: #D3D0E4;}*/
.menu ul ul,
.menu ul ul ul {  display: inherit;  position: relative;  left: auto;  top: auto;  border: none;}
}

 @media  (min-width: 768px) and (max-width:1198px){ 
.example-header .container { width: 100%; }
.search_box input.search_icon:hover { background: #ffffff; }
.menu-link { display: none; }
.spinner-master input[type=checkbox] { display: none; }
.spinner-master * {  transition: all 0.3s;  box-sizing: border-box;}
.spinner-master {  position: absolute;  margin: 20px;  height: 30px;  width: 30px;  float:right;}
.spinner-master label {  cursor: pointer;  position: relative;  z-index: 99;  height: 100%;  width: 100%;  top: 5px;  left: 0;}
.spinner-master .spinner {  position: absolute;  height: 4px;  width: 100%;  padding: 0;  background-color: #ffffff;}
.spinner-master .diagonal.part-1 {  position: relative;  float: left;}
.spinner-master .horizontal {  position: relative;  float: left;  margin-top: 4px;}
.spinner-master .diagonal.part-2 {  position: relative;  float: left;  margin-top: 4px;}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .horizontal { opacity: 0; }
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-1 {  transform: rotate(135deg);  -webkit-transform: rotate(135deg);  margin-top: 5px;}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-2 {  transform: rotate(-135deg);  -webkit-transform: rotate(-135deg);  margin-top: -12px;}
a.menu-link {  display: block;  color: #000;  float: left;  text-decoration: none;  padding: 0px 6px;  font-size: 13px;}
a.menu-link:hover { color: #000000; }
a.menu-link:after {  content: "\2630";  font-weight: normal;}
a.menu-link.active:after { content: "\2715"; }
.menu {z-index:99999999999999999999;	width: 100%;  clear: both;  padding-top:60px;  min-width: inherit;  float: none;}
.menu,
.menu > ul ul {  overflow: hidden;  max-height: 0;  background:rgba(243, 90, 90, 1);   border-top: 1px solid rgba(198, 74, 74, 1); border-bottom: 1px solid rgba(198, 74, 74, 1);}
.menu > li > ul.sub-menu {  padding: 0px;  border: none;}
.menu.active,
.menu > ul ul.active { max-height: 55em; }
.menu ul { display: inline; width:100%;}
.menu li,
.menu > ul > li { display: block; width:100%; }
.menu > ul > li:last-of-type a { border: none; }
.menu li a {  color: #000000;  display: block;  padding: 0.8em;  position: relative; }
.menu li.has-submenu > a:after {  content: '+';  position: absolute;  top: 0;  right: 0;  display: block;  font-size: 16px; font-weight:200; padding: 0.55em 0.5em;}
.menu li.has-submenu > a.active:after { content: "-";  color:#A3A3A3; }
.menu ul ul > li  {  background-color: #F6F6F6;  width:100%;  color:#000000;  padding-left: 20px; font-size: 13px; font-weight:200;}
.menu ul ul > li a {  background-color: #F6F6F6;	color:#000000; padding: 10px 0 10px 0;}
.menu ul ul > li a:hover {background-color: #F6F6F6;	color:#000000; padding: 10px 0 10px 0;}

.menu ul li {  background-color: #FFF;     width:100%;  text-align:left; color: #000000; border-top: 1px solid rgba(231, 231, 231, 1);}
.menu ul li a:hover {  background-color: #FFF;   width:100%;  color: #FFF;}
.menu ul li.hover > a {  background-color: #FFF;  color: #000000; ;}
.menu ul ul,
.menu ul ul ul {  display: inherit;  position: relative;  left: auto;  top: auto;  border: none;}
}