@charset "UTF-8";
.product-main{position: relative; height: 560px ;}
.product-main .responsive-menu{display: block !important;width: 100%;position: relative;float: left;right: 0;background: url(../images/menu-bg.jpg ) no-repeat;overflow: hidden;background-size: 100% 100%;}
.product-main .responsive-menu ul li{background: url(../images/menu-bg.jpg ) no-repeat;background-size: 100% 100%;}
.product-main .responsive-menu ul li.active ul.sub-menu {position: absolute;width: 100%;height: 100%;background: #99d4fe;right: -100%;top: 0;z-index: 99999;}


.responsive-menu {position: fixed;right: 0;height: 100%;width: 80%;background: #383838;z-index: 9999;right: -80%;display: none;}
.responsive-menu .res-button {}
.responsive-menu .res-button i {}

.responsive-menu ul,
.responsive-menu ul li {list-style-type: none;margin: 0;padding: 0;}

.responsive-menu ul li {width: 100%;background: #484646;border-bottom: solid 1px #545252;border-top: solid 1px #545252;margin-bottom: 8px;}
.responsive-menu ul li a {display: block;color: #fff;position: relative;padding: 10px;font-size: 14px;}
.responsive-menu ul li a span.menu-open {padding: 9px 16px;background: white;position: absolute;right: 0;top: 0;display: none;}
.responsive-menu ul li.menu-item-has-children > a span.menu-open {display: block;}
.responsive-menu ul li a span.menu-open i {display: block;line-height: 1;font-size: 23px;color: #383838;}
.responsive-menu ul ul.sub-menu {display: none;}
.responsive-menu ul ul.sub-menu.active {position: absolute;}
.responsive-menu ul li.active ul.sub-menu {position: absolute;width: 100%;height: 100%;background: #383838;right: -100%;top: 0;z-index: 99999;}

.responsive-menu ul li.sub-menu-head {overflow: hidden;margin-bottom: 15px;text-align: center;background: white;border: 0;}
.responsive-menu ul li.sub-menu-head span.res-back,
.responsive-menu ul li.sub-menu-head span.res-close {padding: 4px 20px;float: left;background: #e2dfdf;cursor: pointer;font-size: 23px;color: #383838;}
.responsive-menu ul li.sub-menu-head span.res-back i {}
.responsive-menu ul li.sub-menu-head strong {padding: 10px 0px;display: inline-block;color: #383838;}


@media screen and (max-width: 768px) {
    .responsive-menu {display: block;}
}