#wide-menu {
  display: none;
  position: absolute;
  background: #f5f5f5;
  top: 90px;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 2px solid #e60012;
  z-index: 3000;
}

#wide-menu.expanded {
  display: block;
}

#wide-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#wide-menu .ns-menu-mb {
  display: none !important;
}

#wide-menu ul.firstClass {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 20vw;
  padding: 20px 0 20px 4vw;
  background: #f5f5f5;
  border-right: 1px solid #dcdcdc;
  box-sizing: content-box;
  z-index: 3100;
}

#wide-menu ul.firstClass > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 20px 5px 10px;
  font-size: 16px;
  color: #000;
}

#wide-menu ul.firstClass > li.ns-no-children:after {
  display: none;
}

#wide-menu ul.firstClass > li:after {
  content: "";
  width: 11px;
  height: 11px;
  background: url(../images/menu-external.png)
  no-repeat;
  background-size: cover;
}

#wide-menu ul.firstClass > li.ns-mb-login.admin-user .ns-user-text {
  display: flex;
}

#wide-menu ul.firstClass > li.ns-mb-login.admin-user a.ns-mb-admin {
  display: none;
}

#wide-menu ul.firstClass > li.ns-mb-login.admin-user a.ns-mb-layout {
  display: flex;
}

#wide-menu ul.firstClass > li.ns-mb-login .ns-user-text {
  display: none;
  align-items: center;
  padding-bottom: 10px;
}

#wide-menu ul.firstClass > li.ns-mb-login .ns-user-text p {
  padding-left: 5px;
  font-size: 14px;
}

#wide-menu ul.firstClass > li.ns-mb-login .ns-user-text p span {
  color: red;
  padding-left: 5px;
}

#wide-menu ul.firstClass > li.ns-mb-login a {
  display: block;
  background: #e60012;
  color: #fff;
  padding: 10px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  margin-bottom: 10px;
}

#wide-menu ul.firstClass > li.ns-mb-login a .icon {
  margin-right: 10px;
}

#wide-menu ul.firstClass > li.ns-mb-login a.ns-mb-layout {
  display: none;
}

#wide-menu ul.firstClass > li.ns-mb-login::after {
  display: none;
}

#wide-menu ul.firstClass > li.ns-mb-language-region {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

#wide-menu ul.firstClass > li.ns-mb-language-region.open-active {
  top: 0;
  right: 0;
  background: #f5f5f5;
  padding-top: 30px;
}

#wide-menu ul.firstClass > li.ns-mb-language-region.open-active h2 {
  position: absolute;
  bottom: 5px;
  right: 15px;
}

#wide-menu ul.firstClass > li.ns-mb-language-region.open-active h2::after {
  transform: translateY(-50%) rotate(0);
}

#wide-menu ul.firstClass > li.ns-mb-language-region.open-active > ul {
  display: block;
}

#wide-menu ul.firstClass > li.ns-mb-language-region > ul {
  display: none;
}

#wide-menu ul.firstClass > li.ns-mb-language-region > ul li {
  padding: 5px 0;
  font-size: 14px;
}

#wide-menu ul.firstClass > li.ns-mb-language-region h2 {
  display: flex;
  justify-content: flex-end;
  font-size: 14px;
  align-items: center;
  padding: 10px 25px 10px 0;
  position: relative;
}

#wide-menu ul.firstClass > li.ns-mb-language-region h2 .icon {
  padding-right: 5px;
}

#wide-menu ul.firstClass > li.ns-mb-language-region h2::after {
  content: "";
  background: url(../images/arrow-second-menu.png) no-repeat;
  background-size: cover;
  width: 13px;
  height: 7px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%) rotate(180deg);
}

#wide-menu ul.firstClass > li.separate {
  padding: 15px 20px 15px 10px;
  position: relative;
}

#wide-menu ul.firstClass > li.separate:before {
  content: "";
  position: absolute;
  left: 10px;
  right: 20px;
  height: 1px;
  font-size: 0;
  background: #e0e0e0;
}

#wide-menu ul.firstClass > li.separate:after {
  display: none;
}

#wide-menu ul.firstClass > li.active ul.secondClass {
  display: block;
}

#wide-menu ul.firstClass > li.hasChild:after {
  content: "";
  width: 6px;
  height: 10px;
  background: url(../images/menu-arrow.png) no-repeat;
  background-size: cover;
}

#wide-menu ul.firstClass > li.hasChild.active:after,
#wide-menu ul.firstClass > li.hasChild:hover:after {
  background-position: -6px 0;
}

#wide-menu ul.firstClass > li.hasChild.active > label,
#wide-menu ul.firstClass > li.hasChild:hover > label {
  color: #e60012;
  border-bottom: 2px solid #e60012;
}

#wide-menu ul.firstClass > li.hasChild > label {
  position: relative;
  display: inline-block;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  font-weight: 400;
}

#wide-menu ul.firstClass > li a {
  color: #000 !important;
  text-decoration: none;
}

#wide-menu ul.firstClass > li:hover > a {
  color: #e60012 !important;
  text-decoration: underline !important;
}

#wide-menu ul.firstClass > li:hover:after {
  background-position: -11px 0;
}

#wide-menu ul.secondClass {
  display: none;
  position: absolute;
  left: 25vw;
  top: 0;
  bottom: 0;
  width: 15vw;
  padding: 20px 0 20px 2vw;
  background: #f5f5f5;
  border-right: 1px solid #dcdcdc;
  z-index: 3200;
}

#wide-menu ul.secondClass h3 {
  margin: 1em 0;
}

#wide-menu ul.secondClass > span {
  display: none;
}

#wide-menu ul.secondClass > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 25px 8px 10px;
  font-size: 16px;
  color: #000;
  cursor: pointer;
}

#wide-menu ul.secondClass > li.ns-no-children:after {
  display: none;
}

#wide-menu ul.secondClass > li.ns-no-children label {
  color: #000;
  cursor: auto;
}

#wide-menu ul.secondClass > li.ns-no-children.active > label,
#wide-menu ul.secondClass > li.ns-no-children:hover > label {
  border-color: transparent;
}

#wide-menu ul.secondClass > li label {
  position: relative;
  display: inline-block;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  font-weight: 400;
}

#wide-menu ul.secondClass > li label:after {
  content: "";
  position: absolute;
  right: -10px;
  top: 5px;
  z-index: 1;
}

#wide-menu ul.secondClass > li:after {
  content: "";
  width: 6px;
  height: 10px;
  background: url(../images/menu-arrow.png) no-repeat;
  background-size: cover;
}

#wide-menu ul.secondClass > li.active,
#wide-menu ul.secondClass > li:hover {
  color: #e60012;
}

#wide-menu ul.secondClass > li.active:after,
#wide-menu ul.secondClass > li:hover:after {
  background-position: -6px 0;
}

#wide-menu ul.secondClass > li.active > label,
#wide-menu ul.secondClass > li:hover > label {
  border-bottom: 2px solid #e60012;
}

#wide-menu ul.secondClass > li.viewAll {
  margin-top: 30px;
}

#wide-menu ul.secondClass > li.viewAll:after {
  width: 12px;
  height: 10px;
  background: url(../images/menu-arrow-all.png)
  no-repeat;
  background-size: cover;
}

#wide-menu ul.secondClass > li.viewAll:hover:after {
  background-position: -12px 0;
}

#wide-menu ul.secondClass > li.viewAll:hover a {
  color: #e60012 !important;
}

#wide-menu ul.secondClass > li.viewAll label a:hover {
  text-decoration: none !important;
}

#wide-menu ul.secondClass > li > .wide-menu-item-content {
  display: none;
}

#wide-menu .wide-menu-content {
  position: absolute;
  left: 40vw;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 20px 8vw 20px 50px;
  background: #fff;
  z-index: 3300;
}

#wide-menu .wide-menu-content.wide {
  left: 24.1vw;
}

#wide-menu .wide-menu-content > span {
  display: none;
}

#wide-menu .wide-menu-content h2 {
  display: flex;
  margin-top: 0;
  margin-bottom: 20px;
  padding: 8px 0;
  font-size: 16px;
  font-weight: 700;
}

#wide-menu .wide-menu-content h2 a {
  position: relative;
  display: inline-block;
  padding-right: 24px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  overflow: hidden;
  color: #000;
}

#wide-menu .wide-menu-content h2 a:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 10px;
  right: 5px;
  top: 50%;
  background: url(../images/menu-arrow-all.png) -12px 0
  no-repeat;
  transform: translateY(-50%);
  transition: right 0.3s;
}

#wide-menu .wide-menu-content h2 a:hover {
  color: #e60012;
}

#wide-menu .wide-menu-content h2 a:hover:after {
  right: 0;
}

#wide-menu .wide-menu-content h3 {
  margin-top: 0;
  margin-bottom: 16px;
  font-size: 14px;
  font-weight: 700;
}

#wide-menu .wide-menu-content h4 {
  color: #727171;
  padding-bottom: 10px;
  font-weight: 700;
}

#wide-menu .wide-menu-content .wide-menu-expend {
  display: flex;
  justify-content: space-between;
}

#wide-menu .wide-menu-content .wide-menu-expend > div {
  width: 24vw;
  padding-right: 40px;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-left ul {
  margin-right: 50px;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-left ul li ul {
  display: flex;
  flex-wrap: wrap;
  margin-right: -240px;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-left ul li ul li {
  width: 25%;
  padding-right: 5px;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-right {
  padding: 0 40px;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-cross {
  width: auto;
}

#wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-cross dl {
  margin-top: 0;
}

#wide-menu
.wide-menu-content
.wide-menu-expend
.wide-menu-content-cross
.wide-menu-content-cross-items {
  display: flex;
  margin: 0 -15px;
}

#wide-menu
.wide-menu-content
.wide-menu-expend
.wide-menu-content-cross
.wide-menu-content-cross-items
> dl {
  padding: 0 15px;
}

#wide-menu .wide-menu-content .wide-menu-expend hr {
  margin: 23px 50px 23px 0;
  border: 0;
  height: 1px;
  background: #e5e5e5;
}

#wide-menu .wide-menu-content .wide-menu-expend ul + h4 {
  margin-top: 30px;
}

#wide-menu .wide-menu-content .wide-menu-expend ul li {
  margin-bottom: 10px;
}

#wide-menu .wide-menu-content .wide-menu-expend ul li a {
  font-size: 14px;
  color: #727171;
  text-decoration: none;
}

#wide-menu .wide-menu-content .wide-menu-expend ul li a:hover {
  color: #e60012 !important;
  text-decoration: underline !important;
}

#wide-menu .wide-menu-content .wide-menu-expend ul li.special {
  margin-bottom: 30px;
}

#wide-menu .wide-menu-content .wide-menu-expend ul li.special a {
  font-weight: bold;
}

#wide-menu .wide-menu-content .wide-menu-expend ul.hot li {
  position: relative;
  margin-bottom: 5px;
  padding-left: 15px;
}

#wide-menu .wide-menu-content .wide-menu-expend ul.hot li:before {
  position: absolute;
  content: "";
  left: 0;
  top: 6px;
  width: 6px;
  height: 10px;
  background: url(../images/menu-arrow.png) 0 0
  no-repeat;
  background-size: cover;
}

#wide-menu .wide-menu-content .wide-menu-expend ul.two-column {
  display: flex;
  flex-wrap: wrap;
}

#wide-menu .wide-menu-content .wide-menu-expend ul.two-column li {
  width: 50%;
}

#wide-menu .wide-menu-content .wide-menu-expend dl {
  margin-top: 15px;
}

#wide-menu .wide-menu-content .wide-menu-expend dl:first-child {
  margin-top: 0;
}

#wide-menu .wide-menu-content .wide-menu-expend dl dt {
  position: relative;
  overflow: hidden;
}

#wide-menu .wide-menu-content .wide-menu-expend dl dt img {
  width: 100%;
  max-width: 100%;
  transition: all 0.3s;
}

#wide-menu .wide-menu-content .wide-menu-expend dl dt label {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(62, 58, 57, 0.4);
  padding: 10px 15px;
  margin: 0;
  font-size: 14px;
  color: #fff;
  transition: all 0.3s;
}

#wide-menu .wide-menu-content .wide-menu-expend dl dt:hover img {
  transform: scale(1.1);
}

#wide-menu .wide-menu-content .wide-menu-expend dl dt:hover label {
  padding-left: 20px;
  background: #3e3a39;
}

#wide-menu .wide-menu-content .wide-menu-expend dl dd {
  padding: 18px 0;
  font-size: 14px;
  color: #000;
  line-height: 1.5;
}

.ns-search-layer {
  position: fixed;
  top: 70px;
  left: 0;
  width: 100%;
  box-shadow: 0 0 10px #ccc;
  background: #fff;
  border-top: 2px solid #69cbff;
  padding: 40px 0;
  z-index: 3000;
  display: none;
}

.ns-search-layer .ns-search-box {
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
  padding-right: 160px;
  font-size: 16px;
}

.ns-search-layer .ns-search-box .ns-search-keyword {
  margin-right: 160px;
  width: 100%;
}

.ns-search-layer .ns-search-box .ns-search-keyword::before {
  content: "";
  background: url(../images/icon-search-layer.png) no-repeat;
  background-size: 29px 29px;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 29px;
  height: 29px;
}

.ns-search-layer .ns-search-box .ns-search-keyword input {
  width: 100%;
  border-right: transparent;
  border: 0;
  outline: 0;
  height: 60px;
  line-height: 60px;
  padding: 0 20px 0 70px;
  border: 1px solid #000;
  border-right: 0;
}

.ns-search-layer .ns-search-box .ns-search-submit {
  border: 0;
  outline: 0;
  width: 160px;
  color: #fff;
background-image: linear-gradient(to right, #0081CA, #69cbff);
  height: 60px;
  line-height: 60px;
  position: absolute;
  top: 0;
  right: 0;
}

@media (max-width:1200px) {
  .ns-search-layer {
    padding: 30px 0;
  }

  .ns-search-layer .ns-search-box {
    max-width: none;
    margin: 0 30px;
    padding-right: 140px;
    font-size: 14px;
  }

  .ns-search-layer .ns-search-box .ns-search-keyword input {
    height: 50px;
    line-height: 50px;
  }

  .ns-search-layer .ns-search-box .ns-search-submit {
    width: 140px;
    height: 50px;
    line-height: 50px;
  }

}

@media (max-width:992px) {
  #wide-menu {
    top: 44px;
    overflow: hidden;
  }

  #wide-menu .ns-menu-mb {
    display: block !important;
  }

  #wide-menu ul.firstClass {
    width: auto;
    right: 0;
    left: 0;
    padding-left: 0;
  }

  #wide-menu ul.firstClass > li {
    padding-left: 20px;
  }

  #wide-menu ul.firstClass > li.active {
    background: #999;
  }

  #wide-menu ul.firstClass > li.active ul.secondClass {
    left: 0;
  }

  #wide-menu ul.secondClass {
    display: block;
    left: 100%;
    width: 100%;
    transition: 0.3s;
    z-index: 99;
  }

  #wide-menu ul.secondClass > li.active {
    background: 0 0;
    color: #000;
  }

  #wide-menu ul.secondClass > li.active > label:after {
    background-position: 0 0;
  }

  #wide-menu ul.secondClass > span {
    display: block;
    padding: 10px;
  }

  #wide-menu .wide-menu-content {
    display: block;
    position: absolute;
    left: 100%;
    width: 100%;
    padding: 20px;
    background: #eee;
    overflow-y: scroll;
    transition: 0.3s;
  }

  #wide-menu .wide-menu-content.wide {
    left: 0;
  }

  #wide-menu .wide-menu-content.active {
    left: 0;
  }

  #wide-menu .wide-menu-content > span {
    display: block;
    padding: 10px;
  }

  #wide-menu .wide-menu-content .wide-menu-expend {
    flex-direction: column;
  }

  #wide-menu .wide-menu-content .wide-menu-expend > div {
    width: auto;
  }

  #wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-left ul li ul {
    margin-right: -90px;
  }

  #wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-right {
    padding: 20px;
  }

  #wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-cross {
    width: auto;
  }

  #wide-menu .wide-menu-content .wide-menu-expend .wide-menu-content-cross dl {
    margin-top: 0;
  }

  #wide-menu
  .wide-menu-content
  .wide-menu-expend
  .wide-menu-content-cross
  .wide-menu-content-cross-items {
    display: flex;
    flex-direction: column;
    margin: 0 -15px;
  }

  #wide-menu
  .wide-menu-content
  .wide-menu-expend
  .wide-menu-content-cross
  .wide-menu-content-cross-items
  > dl {
    margin-top: 15px;
    padding: 0 15px;
  }

  #wide-menu
  .wide-menu-content
  .wide-menu-expend
  .wide-menu-content-cross
  .wide-menu-content-cross-items
  > dl:first-child {
    margin-top: 0;
  }

}