.xib { display: inline-block; vertical-align: top; position: relative; }

/*菜单线*/
.lines { display: inline-block; width: 100%; height: 1px; background: #ecf0f1; transition: 1s; position: relative; }
.lines:before,.lines:after { display: inline-block; width: 100%; height: 1px; background: #ecf0f1; transition: 0.2s; position: absolute; left: 0; content: ''; -webkit-transform-origin: 0.28571rem center; transform-origin: 0.28571rem center; }
.lines:before { top: 7px; }
.lines:after { top: -7px; }

#logo_wrapper:hover .lines:before { top: 10px; }
#logo_wrapper:hover .lines:after { top: -10px; }

#logo_wrapper.open .lines { background: transparent; }
#logo_wrapper.open .lines:before,#logo_wrapper.open .lines:after { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; top: 0; width: 90%; }
#logo_wrapper.open .lines:before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); }
#logo_wrapper.open .lines:after { -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }


.menu_search{ width: 145px; margin-top: 20px; border:1px solid #ccc; display: inline-block; overflow: hidden; position: relative; background:#fff; text-align: center;}
/*.menu_search .form-control{ width:100%; height:30px; border:1px solid #fff; padding:5px; border-radius: 5px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }*/

/*.menu_search{ display: inline-block; position: absolute;top:50%; margin-top:-15px; right:0px; } */
.menu_search select{ width:55px; height:26px; color:#555; border:none; }
.menu_search input{ width:120px;height:26px; margin-left:-4px; padding:0 25px 0 24px; border:none; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; } 
.menu_search a{ position: absolute; top:0; right:0; display: inline-block; width:25px; height:25px; background-image:url(../images/common/Search1.png); background-repeat: no-repeat; background-size: 100%; background-position: center; background-size:60%; }
.menu_search input[type="text"]{ height:26px; font-size:12px; }



.search{ display: none; } 
@media screen and (max-width: 720px) {
  #logo_wrapper{ overflow: hidden; }
  .search{ min-width: 140px; width:45%; height:60px; display: inline-block; float:right; overflow: hidden; position: relative; }
  .search a{ position: absolute; top:17px; right:10px; display: inline-block; width:25px; height:25px; background-image:url(../images/common/Search.png); background-repeat: no-repeat; background-size: 100%; background-position: center;  -moz-transition: all .4s; -webkit-transition: all .4s; transition: all .4s; }
  .search input{ width:0; height:0px; border:none;  -moz-transition: all .4s; -webkit-transition: all .4s; transition: all .4s;  }

  .search_active input{ display: inline-block !important; width:80%; height:20px; padding:5px; margin-top: 15px; margin-right: 10px; float: right; overflow: hidden; border:1px solid #e60012; border-radius: 10px; background-position: 115px center; }  
  .search_active a{ background-size:60%; top:19px; right:10px; }
}



/* MENU -------------------------------------------------------------------------------------- */
#slider_menu{ position: relative; min-width: 320px; }
#menu_side { position: fixed; left: 0; top:0; z-index: 8801; width:15%; height: 100%; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; background-color: #70c8d0;}
.ml_menu{ margin-left:15%; width:85% !important; }

@media screen and (min-width: 1200px) {
  #menu_side { width:11%; }
  .ml_menu{ margin-left:11%; width:89% !important; }
}
/*logo*/
.logo{position: absolute;top: 50%; left:50%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
#logo_wrapper .menu_button { position: relative; background-color: #004894; width: 100%; height: 90px; z-index: 9999; cursor: pointer !important; }
#logo_wrapper .menu_button p{ position: absolute; width: 100%; text-align: center; top: 60%; left: 0; color: #fff; font-size: 1.4rem;   }
#logo_wrapper .menu_button .menu_button_inner { width: 34px; height: 50px; margin: 0 auto; text-align: center; padding-top: 35px; z-index: 9999; line-height: 17px; }
#logo_wrapper .logo_contain { min-width: 90px; width: 100%; height:130px; background-color:#004894; display: block; position:relative;}
#logo_wrapper .logo_contain .logo {width: 100%; height:60px; background-image: url('../images/common/samitegai-logo.png'); background-repeat: no-repeat; background-size:100%;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/common/w_logo.png',sizingMethod='scale');/*兼容ie8以下*/ background-position: center; position: relative; }
@media screen and (max-width: 1980px) {
	#logo_wrapper .logo_contain .logo{
		width: 80%;
	}
}
@media screen and (max-width: 1740px) {
	#logo_wrapper .logo_contain .logo{
		width: 70%;
	}
	#logo_wrapper .logo_contain{
		height: 100px;
	}
}
@media screen and (min-width: 721px) {
	.menu_button{
		display: none;
	}
}
/*@media screen and (max-width: 720px) {
  #logo_wrapper .logo_contain { height: 60px; }
  #logo_wrapper .logo_contain .logo { width: 85px; height: 40px; }
  #menu_side{ height:auto; z-index:9999; }
  .ml_menu{ margin-left:0px; width:100% !important; }
  #logo_wrapper .menu_button_inner { padding-top: 25px !important; }
  #logo_wrapper .menu_button { height: 70px; }
}*/
.mobile_show{ display: none; }
.mobileyqx{display:none;}
@media screen and (max-width: 720px) {
  .mobile_show{ display: block; }
    #logo_wrapper .menu_button p{display:none;}
   #logo_wrapper .logo_contain .logo { width: 70% !important; height: 100%; background-size: 85%; }
  #logo_wrapper .menu_button .menu_button_inner{ width:35px; }
  #logo_wrapper .menu_button .menu_button_inner { height:14%; padding-top: 0px !important; line-height: 50px !important; }

  #slider_menu{ position: relative; width:100%; height:60px; }
  #menu_side{ position: relative; width:100%; }
  .ml_menu{ margin-left:0px; width:100% !important; }
  #logo_wrapper .menu_button{ width:70px !important; height:60px; float:left; }
  #logo_wrapper .logo_contain{ width:30% !important; height:60px; float:left; }
  .mobileyqx{display:block;}
  /*.lines:before { top: 10px; }
  .lines:after { top: -10px; }*/
} 

/*左侧菜单*/
#favourites { width: 100%; padding:0; position: relative; opacity: 1; }
#favourites li{ width:100%; line-height: 35px; border-bottom:1px solid #65bbcd; }
#favourites a{ display: block; text-align: center; font-size: 14px;  letter-spacing: 1px; color: #0d4e9f; }
#favourites a:hover{ color:#fff }
#favourites .m_link{ height:0; overflow: hidden; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; transition: all .4s ease;  }
/*#favourites li:hover .m_link{ opacity: 1; }*/
#favourites .m_link a{ display: block; background:#f6f6f6; border-bottom:1px solid #e5e5e5; font-size: 1.2rem; font-weight: 400; }
#favourites .m_link a:hover{ background:#45b7c2; color:#fff; }
@media screen and (max-width: 720px){
  #favourites{ display: none !important; }
}


/*客服*/
.asider_bottom{ position: fixed; bottom:0; left:0; width:15%; z-index:20; background-color:#fff; }
.hover_shop a{ width:100%; height:35px; line-height: 35px; display: block; text-align: center; background: #eee; }
.hover_kf a{background-color: #fff; width:60%; height:35px; padding-left:40%; line-height: 35px; display: block; background:url(../images/common/kefu.png) no-repeat 30% center; background-size:20%; }
.asider_bottom a.shop{ position: absolute; bottom:35px; z-index:99; width:100%; padding:0; text-align: center; font-size:1.4rem; color:#fff; background: #004894; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; transition: all .2s ease;}
.asider_bottom .shop:hover{ color:#DEC3C5; }
.asider_bottom a.kefu{ position: absolute; bottom:0; z-index:99; width:63%; height:35px; padding-left:37%; line-height: 35px; font-size:1.4rem;  display: block; background:url(../images/common/kefu.png) no-repeat 22% center; background-size:20%; }

.hover_shop ul{ width:100%; position: absolute; left:0; bottom:70px; z-index:88; height:0px; overflow: hidden; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; transition: all .4s ease; }
.hover_kf ul{background-color: #fff; width:100%; position: absolute; left:0; bottom:35px; z-index:88; height:0px; overflow: hidden; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; transition: all .4s ease; }
.asider_bottom ul li{ height:35px; }
.hover_kf li a:hover{ background-color:#45B7C2;color:#fff; } 
.hover_shop li a:hover{ background-color:#45B7C2; color:#fff; }

#menu { width:220px; height: 100%; position: fixed; top:0; left:-220px; z-index: 8801; background:#f3f3f3; overflow: hidden; }
.menu_inner_wrapper{ width:185px; padding:20px; height:100%; float:left; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; }
#menu ul.menu_list { position: relative; left:-220px; }
#menu .open .menu_list { left:0; -moz-transition: all 0.6s ease 0.8s; -webkit-transition: all 0.6s ease 0.8s; transition: all 0.6s ease 0.8s; }

#menu ul.menu_list li{ position: relative; }
#menu ul.menu_list li a { padding:0 5px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box;
                           font-family: "Microsoft yahei"; letter-spacing:2px; color: #333; line-height: 23px; display: block; }
#menu ul li a.item1{ font-size: 1.4rem; color:#333; }
#menu ul li a.item2{ font-size: 1.2rem; color:#666; line-height: 20px; padding: 0 15px; }
.menu2{ width:100%; overflow: hidden; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; transition: all .4s ease; z-index:99; }
#menu ul.menu_list li a:hover{ background:#007286; color:#fff; }

/*#menu ul li:hover .menu2{ max-height: 500px; }*/
@media screen and (min-width: 720px) {
  .menu_list li a:hover{
    background-position: 170px center;
    background-repeat: no-repeat;
  }
  
}


.menu_links{ position: absolute; bottom:30px; left:-1000px; overflow: hidden; }
.menu_links p{ color:#fff; }
.menu_links a{ color:#fff; }
.menu_links a:hover{ text-decoration:underline; }
@media screen and (min-width: 1200px) {
  .menu_links{ left:30px; }
}
@media screen and (max-width: 1199px) and (min-width:721px){
  .menu_links{ left:42px; }
}

/*20160122*/
.menu_links{ display: none; }

@media screen and (max-width: 720px) {
  #menu{ width:100%; overflow-y: scroll; }
  /*#menu ul.menu_list{ left:; }*/
  #menu ul.menu_list{ width:80%; }
  .asider_bottom{ display: none; }
  .menu_inner_wrapper{ width:100%; margin-left: 0; padding-top: 25px; }
  /*ul.menu_list { width:50%; }*/
  /*ul.menu_list li{ padding:0 20px; }*/
  .menu_links{ width:90%; left:5%; bottom:10rem; overflow: hidden; } 
  .menu_side_720{ width:100% !important; position: fixed !important; }
}



.mobile-extra{ position: absolute; display: block; width: 0px; height: 100%; left: 150px; top: 0; z-index: 10000; opacity:0; background: #FFF;  }
.menu_inner_wrapper.open .mobile-extra{ opacity:1; width:35px; left:185px; -moz-transition: all .4s ease 0.6s; -webkit-transition: all .4s ease 0.6s; transition: all .4s ease 0.6s;  /*-webkit-transition: all 800ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -moz-transition: all 800ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -o-transition: all 800ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    transition: all 800ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -webkit-transition-timing-function: cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -moz-transition-timing-function: cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -o-transition-timing-function: cubic-bezier(0.305, 0.75, 0.72, 0.985);
    transition-timing-function: cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -webkit-transform: rotate(0) !important;
    -moz-transform: rotate(0) !important;
    -o-transform: rotate(0) !important;
    -ms-transform: rotate(0) !important;
    transform: rotate(0) !important; */ }
.menu_inner_wrapper.close .mobile-extra{ opacity:0; width:0px; left:150px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; transition: all .4s ease; }
#mobile-nav-close{ width:30px; height:30px; position:relative; top:50%; margin:-15px auto 0; background-image:url(../images/common/mobile-close.png); background-repeat: no-repeat; background-position: center; cursor:pointer; }

#mobile-nav-close:hover{     
    -webkit-transform: rotate(270deg) !important;
    -moz-transform: rotate(270deg) !important;
    -o-transform: rotate(270deg) !important;
    -ms-transform: rotate(270deg) !important;
    transform: rotate(270deg) !important;
    -webkit-transition: all 300ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -moz-transition: all 300ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    -o-transition: all 300ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
    transition: all 300ms cubic-bezier(0.305, 0.75, 0.72, 0.985);
}


@media screen and (max-width: 720px) {
  .menu_inner_wrapper.open .mobile-extra{ left:auto; right:0; }
}