/**********************************************************
                           sub_nav
***********************************************************/
.nav_sub0101 {
   border-bottom: 4px solid #000;
}
.nav_sub0102 {
   border-bottom: 4px solid #f1892f;
}
.nav_sub0103 {
   border-bottom: 4px solid #673a1b;
}
.nav_sub0104 {
   border-bottom: 4px solid #ec6e78;
}
.nav_sub0105 {
   border-bottom: 4px solid #612c89;
}
.nav_sub0106 {
   border-bottom: 4px solid #e84018;
}
.nav_sub0107 {
   border-bottom: 4px solid #02368e;
}
.nav_sub0108 {
   border-bottom: 4px solid #0a8e54;
}
.nav_sub0109 {
   border-bottom: 4px solid #fbc200;
}
.nav_sub0111 {
   border-bottom: 4px solid #0c308f;
}
.navsub_container {
   display: flex;
   justify-content: space-between;
   align-items: center;
}
.nav_sub{
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   background-color: #fff;
   z-index: 99;
}
.navsub_wrap,
.navsub_login {
   display: flex;
   align-items: center;
}
.navsub_list {
   width: 77px;
   flex-shrink: 0;
   height: 60px;
   text-align: center;
}
.navsub_list > a {
   display: inline-block;
   overflow: hidden;
   position: relative;
   width: 100%;
   height: 60px;

}
.navsub_list > a > img {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 40px;
   transform: translate(-50%, -50%);
   transition: all 0.2s ease-in-out;
}

.navsub_list:nth-of-type(2) > a > img {
   width: auto;
   height: 31px;
}

.navsub_list.unmotion > a > img {
   transition: none;
}
.navsub_list > a > p {
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   top: 100%;
   left: 50%;
   width: 100%;
   transform: translateX(-50%);
   height: 60px;
   font-size: 14px;
   transition: all 0.2s ease-in-out;
   text-align: left;
   color: #fff;
   padding:5px;
}
.navsub_list:nth-child(2) > a > p {
   background: #515845;
}
.navsub_list:nth-child(3) > a > p {
   background: #0c308f;
}
.navsub_list:nth-child(4) > a > p {
   background: #000;
}
.navsub_list:nth-child(5) > a > p {
   background: #f1892f;
}
.navsub_list:nth-child(6) > a > p {
   background: #612c89;
}
.navsub_list:nth-child(7) > a > p {
   background: #ff2842;
}
.navsub_list:nth-child(8) > a > p {
   background: #00aeef;
}

.navsub_list:nth-child(9) > a > p {
   background: url(../images/header_bg_mindcolor.png) top;
}
.navsub_list:nth-child(10) > a > p {
   background: #ec6e78;
}
.navsub_list:nth-child(11) > a > p {
   background: #a67c52;
}
.navsub_list:nth-child(12) > a > p {
   background: #fbc200;
}
.navsub_list:nth-child(13) > a > p {
   background: #0a8e54;
}


.navsub_list > a:hover img,
.navsub_list.active > a img {
   top: -50%;
}
.navsub_list.unmotion > a:hover img {
   top: 50%;
}
.navsub_list > a:hover p,
.navsub_list.active > a p{
   top: 0;
}
.navsub_loginlist {
   padding: 0 3px;
}
.navsub_loginlist > a {
   display: inline-block;
   position: relative;
   font-size: 14px;
   line-height: 60px;
}

.navsub_list:nth-of-type(1) > a > img{
   width: 35px;
}

.navsub_list:nth-of-type(4) > a > img{
   width: 38px;
}

.navsub_list:nth-of-type(5) > a > img{
   width: 35px;
}

.navsub_list:nth-of-type(6) > a > img{
   width: 40px;
}

.navsub_list:nth-of-type(7) > a > img{
   width: 44px;
}
.navsub_list:nth-of-type(8) > a > img{
   width: 40px;
}
.navsub_list:nth-of-type(9) > a > img{
   width: 40px;
}
.navsub_list:nth-of-type(10) > a > img{
   width: 33px;
}

@media(max-width:1043px){

   .navsub_wrap{
      width: 100%;
      flex-wrap: wrap;
   }
   .navsub_list{
      width: 16.666%
   }
   .navsub_login{
      position: absolute;
      bottom: -52px;
      right: 40px;
   }
   .navsub_loginlist > a{
      font-size: 18px;
   }
   .shead_navlist > a{font-size: 16px !important;}
}

@media(max-width:500px){
   .navsub_loginlist{
      padding: 0 2px;
   }
   .navsub_login{
      right: 20px;
   }
   .navsub_loginlist > a{
      font-size: 14px;
   }
}
