@charset "utf-8";
.phonemenu .nav{transition-duration:.5s;-ms-transition-duration:.5s;-moz-transition-duration:.5s; -webkit-transition-duration:.5s;}

.nav__trigger {display: block;position:absolute;width: 25px;height: 25px;right:0;top:28px;z-index: 99997;}
.nav--active .nav__trigger {opacity:1;}
.nav__icon {display: inline-block;position: relative;width: 25px;height: 4px;background-color:#000000;-webkit-transition-property: background-color, -webkit-transform;transition-property: background-color, -webkit-transform;transition-property: background-color, transform;transition-property: background-color, transform, -webkit-transform;-webkit-transition-duration: 300ms;transition-duration: 300ms;top:-3px}
.nav__icon:before,
.nav__icon:after {content: '';display: block;width:25px;height: 4px;position: absolute;background:#000000;-webkit-transition-property: margin, -webkit-transform;transition-property: margin, -webkit-transform;transition-property: margin, transform;transition-property: margin, transform, -webkit-transform;-webkit-transition-duration: 300ms;transition-duration: 300ms;}
.nav__icon:before {margin-top:-8px;}
.nav__icon:after {margin-top:8px;}

.phonemenu .nav { position:fixed; z-index:99996;top:0;width: 50%;height: 100%; background:rgba(0,0,0,0.88);right:-50%; text-align:left;padding:120px 0 0 6%}
.phonemenu .nav--active .nav {right:0}
.phonemenu .nav ul {margin:0}
.phonemenu .nav li {margin:15px 0;line-height:50px;}
.phonemenu .nav li a {color:#fff; font-size:40px; letter-spacing:2px;font-weight:300}
.phonemenu .nav li a:hover,.phonemenu .nav li.check a {color:#42a1af; background:none;}
.phonemenu .nav .down { position:absolute;bottom:0px;color:#999;}
.phonemenu .nav .down .t {font-size:16px;font-weight:700}
.phonemenu .nav .down .c {margin:0px 0 10px 0}
.phonemenu .nav .down .talk .wqw {margin:20px 0 50px 0}
.phonemenu .nav .down .talk .wqw a{ display:inline-block; vertical-align:top;width:35px; height:35px; position:relative;margin:0 10px 0 0;top:0}
.phonemenu .nav .down .talk .wqw a:hover {top:-5px}
.phonemenu .nav .down .talk .wqw a p { position:absolute;width:100px;bottom:40px;left:-32px; display:none;}
.phonemenu .nav .down .talk .wqw a:hover p { display:block}
.phonemenu .nav .down .talk .wqw a.wx {background:url(../images/wx.png) no-repeat center;}
.phonemenu .nav .down .talk .wqw a.qq {background:url(../images/qq.png) no-repeat center;}
.phonemenu .nav .down .talk .wqw a.wb { background:url(../images/wb.png) no-repeat center;}

.phonemenu .nav--active .nav__icon {background: rgba(0, 0, 0, 0);}
.phonemenu .nav--active .nav__icon:before { margin-top: 0;-webkit-transform: rotate(45deg);transform: rotate(45deg);background: #fff; height:3px}
.phonemenu .nav--active .nav__icon:after {margin-top: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);background: #fff;height:3px}