@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:fixed;width: 20px;height: 15px;right:1.2%;margin-right:0;top:24px;z-index: 99997;}
.nav__trigger:before {content:''; position: absolute;right:0;top:0;width:30px;height:30px;border:1px solid #fff;}
.nav--active .nav__trigger:before {border-color:#000}
.nav--active .nav__trigger {opacity:1;}

.nav__icon {display: inline-block;position: relative;width: 20px;height: 1px;background-color:#ffffff;-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:-7px;right:6px}
.nav__icon:before,.nav__icon:after {content: '';display: block;width: 20px;height: 1px;position: absolute;background:#ffffff;-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:-7px;}
.nav__icon:after {margin-top:7px;}

.phonemenu .nav { position:fixed; z-index:99996;right:-320px;top:0;width:320px;height: 100%; background:rgba(255,255,255,1);opacity:0;box-shadow:0 0 5px rgba(0,0,0,0.15);padding:0 0 0 60px}
.phonemenu .nav--active .nav {right:0;opacity:1;}
.phonemenu .nav ul {margin:55px 0 0 0;}
.phonemenu .nav li {text-align:left;line-height:30px;border-bottom:1px solid #ccc;}
.phonemenu .nav li a {font-size:25px;color:#666;padding:28px 0 31px; display: block}
.phonemenu .nav li:nth-child(6) {border:0;}
.phonemenu .nav li:last-child {border:0;padding-top:30px}
.phonemenu .nav li:last-child a {border:1px solid #ccc;font-size:14px;width:30px; height: 30px; line-height: 29px;border-radius:50%;padding:0;text-align: center; letter-spacing: 0.5px}
.phonemenu .nav li:last-child a:hover {background:#ccc;color:#fff;}

.accordionmenu {padding:0px 0 0 0; }
.accordionmenu li { position:relative;}
.accordionmenu li .link {cursor: pointer;display: block;position: relative;-webkit-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease;line-height:30px;font-size:25px;color:#666;padding:28px 0 31px 0}
.accordionmenu li .link i:before {content:''; position: absolute;right:14%;top:38px; background: url("../images/26.png");width:13px; height: 13px; background-size:100%}
.accordionmenu li.open .link i:before { background-position: bottom;background-size:100%}
.accordionmenu li.open .link { background:#ffffff;color:#000000}
.accordionmenu .submenu {display:none;padding:0px 0 20px 0}
.accordionmenu .submenu p { display:block; vertical-align:top;margin:0 0 10px 0;}
.accordionmenu .submenu p a,.accordionmenu li.check .submenu p a { display:block;font-size:14px;height:auto; line-height:24px;padding:0}
.accordionmenu .submenu p a:hover {color:#000}

.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: #000000}
.phonemenu .nav--active .nav__icon:after {margin-top: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);background: #000000;}


.fixtop.active .nav__trigger:before {border-color:#333}
.fixtop.active .nav__icon {background-color:#333}
.fixtop.active .nav__icon:before,.fixtop.active .nav__icon:after {background:#333}

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

.fixtop3.active .nav--active .nav__trigger:before {border-color:#fff}
.fixtop3.active .nav__trigger:before {border-color:#ffffff}
.fixtop3.active .nav__icon {background-color:#ffffff}
.fixtop3.active .nav__icon:before,.fixtop3.active .nav__icon:after {background:#ffffff}

.fixtop2 .nav__trigger:before {border-color:#333}
.fixtop2 .nav__icon {background-color:#333}
.fixtop2 .nav__icon:before,.fixtop2 .nav__icon:after {background:#333}
