.side_phone b { font-family: 'sanregular'; }

.side_phone a { font-family: 'helvetica_cyrbold'; }

.side_open { width: 40px; height: 30px; position: absolute; right: 40px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; z-index: 1201; background: rgba(255, 255, 255, 0); transition: .2s .1s; -webkit-transition: .2s .1s; transition: 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -moz-transition: 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -ms-transition: 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -o-transition: 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transition: 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.side_open span { height: 4px; background: #166ca3; display: block; margin: 0; padding: 0; border: none; position: absolute; transition: .5s .3s; -moz-transition: .5s .3s; -ms-transition: .5s .3s; -o-transition: .5s .3s; -webkit-transition: .5s .3s; }

.side_open span:nth-child(1) { width: 100%; top: 0; right: 0; }

.side_open span:nth-child(2) { width: 40%; top: 50%; left: 0; margin-top: -2px; opacity: 1; }

.side_open span:nth-child(3) { width: 40%; top: 50%; right: 0; margin-top: -2px; opacity: 1; }

.side_open span:nth-child(4) { width: 100%; bottom: 0; right: 0; }


body.open .side_open span:nth-child(1) { width: 100%; top: 50%; margin-top: -2px; transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform-origin: center; -moz-transform-origin: center; -ms-transform-origin: center; -o-transform-origin: center; -webkit-transform-origin: center; }

body.open .side_open span:nth-child(2) { opacity: 0; left: -50%; }

body.open .side_open span:nth-child(3) { opacity: 0; right: -50%; }

body.open .side_open span:nth-child(4) { width: 100%; bottom: 50%; margin-bottom: -2px; transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform-origin: center; -moz-transform-origin: center; -ms-transform-origin: center; -o-transform-origin: center; -webkit-transform-origin: center; }

.side_box { position: fixed; top: 0px; width: 300px; right: -300px; height: 100%; overflow-x: hidden; overflow-y: auto; z-index: 1200; color: black; transition: right 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -moz-transition: right 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -ms-transition: right 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -o-transition: right 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transition: right 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.side_box::-webkit-scrollbar { width: 0 !important; } 
body.open .side_box { width: 200%; right: 0; }

.side_cut { position: relative; width: 284px; float: right; background: #fff; }

.side_shadow { width: 3999px; height: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; z-index: 1; top: 0; right: 100%; opacity: 0; visibility: hidden; transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; -webkit-transition: .3s; }

body.open .side_shadow { opacity: 1; visibility: visible; }

.side_bin { width: 100%; background: rgba(255, 255, 255, 0.975); z-index: 2; position: relative; transition: .3s .1s; -moz-transition: .3s .1s; -ms-transition: .3s .1s; -o-transition: .3s .1s; -webkit-transition: .3s .1s; }

.side_search { overflow: hidden; padding-top: 10px; opacity: 0; transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: .6s .3s; -moz-transition: .6s .3s; -ms-transition: .6s .3s; -o-transition: .6s .3s; -webkit-transition: .6s .3s; -webkit-transition-property: opacity, -webkit-transform !important; transition-property: opacity, -webkit-transform !important; transition-property: opacity, transform !important; transition-property: opacity, transform, -webkit-transform !important; -moz-transition-property: opacity, transform !important; -ms-transition-property: opacity, transform !important; -o-transition-property: opacity, transform !important; -webkit-transition-property: opacity, transform !important; }

body.open .side_search { margin: 0 30px; opacity: 1; transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); -webkit-transform: translateY(0); }

.side_search .text::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.8); }

.side_search .text:-moz-placeholder { color: rgba(0, 0, 0, 0.8); }

.side_search .text::-moz-placeholder { color: rgba(0, 0, 0, 0.8); }

.side_search .text:-ms-input-placeholder { color: rgba(0, 0, 0, 0.8); }

.side_search form { height: 40px; border-bottom: 1px solid #b2b2b2; }

.side_search .text { float: left; width: 80%; height: 20px; padding: 10px 0; }

.side_search .btn { float: left; width: 20%; height: 40px; background: url(../images/search_icon.png) no-repeat center; }

.side_nav { margin-top: 25px; }

.side_nav > ul > li > a { display: block; padding: 15px 30px; line-height: 30px; height: 30px; font-size: 16px; color: #191919; }

.side_nav dl { background: #f7f7f7; }

.side_nav dl dd a { display: block; line-height: 30px; height: 30px; padding: 0px 30px; font-size: 14px; color: #313131; }

.side_nav > ul > li.has > a { position: relative; }

.side_nav > ul > li.has { position: relative; }

.side_nav > ul > li.active > a { color: #fff; }

.side_nav > ul > li.active > a:before { width: 100%; }

.side_nav > ul > li.has > a:after { position: absolute; content: ''; height: 12px; width: 2px; margin: -6px 0 0 -1px; transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; -webkit-transition: .3s; background: #166ca3; right: 40px; top: 50%; border-radius: 2px; z-index: 6; }

.side_nav > ul > li.has > a:before { position: absolute; content: ''; width: 12px; height: 2px; margin: -1px 0 0 -6px; transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; -webkit-transition: .3s; background: #166ca3; top: 50%; right: 35px; border-radius: 2px; z-index: 6; }

.side_foot { padding: 30px 30px 25px 30px; text-align: left; overflow: hidden; }

.side_phone { border-bottom: 1px solid rgba(0, 0, 0, 0.15); line-height: 1; margin-bottom: 20px; padding-bottom: 20px; opacity: 0; transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: .6s .4s; -moz-transition: .6s .4s; -ms-transition: .6s .4s; -o-transition: .6s .4s; -webkit-transition: .6s .4s; -webkit-transition-property: opacity, -webkit-transform !important; transition-property: opacity, -webkit-transform !important; transition-property: opacity, transform !important; transition-property: opacity, transform, -webkit-transform !important; -moz-transition-property: opacity, transform !important; -ms-transition-property: opacity, transform !important; -o-transition-property: opacity, transform !important; -webkit-transition-property: opacity, transform !important; }

.side_phone:after { display: block; clear: both; content: ''; }

body.open .side_phone { transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); opacity: 1; -o-transform: translateY(0); -webkit-transform: translateY(0); }

.side_phone b { display: block; font-size: 16px; font-weight: normal; color: rgba(0, 0, 0, 0.6); margin-bottom: 5px; }
.side_phone a { display: block; font-size: 18px; color: black; font-size: 22px; letter-spacing: -1px; }

.side_text { white-space: pre-wrap; padding-top: 10px; color: black; opacity: 0; font-size: 14px; font-family: 'Addfont',Microsoft Yahei; transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); -webkit-transform: translateY(30px); transition: .6s .4s; -moz-transition: .6s .4s; -ms-transition: .6s .4s; -o-transition: .6s .4s; -webkit-transition: .6s .4s; -webkit-transition-property: opacity, -webkit-transform !important; transition-property: opacity, -webkit-transform !important; transition-property: opacity, transform !important; transition-property: opacity, transform, -webkit-transform !important; -moz-transition-property: opacity, transform !important; -ms-transition-property: opacity, transform !important; -o-transition-property: opacity, transform !important; -webkit-transition-property: opacity, transform !important; }

body.open .side_text { transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); opacity: 1; -o-transform: translateY(0); -webkit-transform: translateY(0); }

body.open, body.modal-open { overflow: hidden; padding-right: 0 !important; }

.nav_first { display: block; position: relative; margin: 0 0 1px 0; list-style: none; cursor: pointer; opacity: 0; transform: translateY(50%); -moz-transform: translateY(50%); -ms-transform: translateY(50%); -o-transform: translateY(50%); -webkit-transform: translateY(50%); -webkit-transition-property: opacity, -webkit-transform !important; transition-property: opacity, -webkit-transform !important; transition-property: opacity, transform !important; transition-property: opacity, transform, -webkit-transform !important; -moz-transition-property: opacity, transform !important; -ms-transition-property: opacity, transform !important; -o-transition-property: opacity, transform !important; -webkit-transition-property: opacity, transform !important; transition: .6s .95s; -moz-transition: .6s .95s; -ms-transition: .6s .95s; -o-transition: .6s .95s; -webkit-transition: .6s .95s; }

.nav_first:nth-child(1) { transition: .6s .4s; -moz-transition: .6s .4s; -ms-transition: .6s .4s; -o-transition: .6s .4s; -webkit-transition: .6s .4s; }

.nav_first:nth-child(2) { transition: .6s .5s; -moz-transition: .6s .5s; -ms-transition: .6s .5s; -o-transition: .6s .5s; -webkit-transition: .6s .5s; }

.nav_first:nth-child(3) { transition: .6s .59s; -moz-transition: .6s .59s; -ms-transition: .6s .59s; -o-transition: .6s .59s; -webkit-transition: .6s .59s; }

.nav_first:nth-child(4) { transition: .6s .67s; -moz-transition: .6s .67s; -ms-transition: .6s .67s; -o-transition: .6s .67s; -webkit-transition: .6s .67s; }

.nav_first:nth-child(5) { transition: .6s .74s; -moz-transition: .6s .74s; -ms-transition: .6s .74s; -o-transition: .6s .74s; -webkit-transition: .6s .74s; }

.nav_first:nth-child(6) { transition: .6s .8s; -moz-transition: .6s .8s; -ms-transition: .6s .8s; -o-transition: .6s .8s; -webkit-transition: .6s .8s; }

.nav_first:nth-child(7) { transition: .6s .85s; -moz-transition: .6s .85s; -ms-transition: .6s .85s; -o-transition: .6s .85s; -webkit-transition: .6s .85s; }

.nav_first:nth-child(8) { transition: .6s .89s; -moz-transition: .6s .89s; -ms-transition: .6s .89s; -o-transition: .6s .89s; -webkit-transition: .6s .89s; }

.nav_first:nth-child(9) { transition: .6s .92s; -moz-transition: .6s .92s; -ms-transition: .6s .92s; -o-transition: .6s .92s; -webkit-transition: .6s .92s; }

.nav_first:nth-child(10) { transition: .6s .94s; -moz-transition: .6s .94s; -ms-transition: .6s .94s; -o-transition: .6s .94s; -webkit-transition: .6s .94s; }

body.open .nav_first { opacity: 1; transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); -webkit-transform: translateY(0); }

.nav_first:before { content: ''; position: absolute; right: 0; top: 0; width: 0%; height: 60px; background: #166ca3; z-index: 2; -webkit-transition: width .3s ease; transition: width .3s ease; }

body.open .nav_first.active:before { width: 100%; transition: width .3s 1s; -moz-transition: width .3s 1s; -ms-transition: width .3s 1s; -o-transition: width .3s 1s; -webkit-transition: width .3s 1s; }

.nav_first:hover:before { width: 100%; }

.side_nav > ul:hover > .nav_first.active:before { width: 3px; transition: width .3s ease-in-out; -moz-transition: width .3s ease-in-out; -ms-transition: width .3s ease-in-out; -o-transition: width .3s ease-in-out; -webkit-transition: width .3s ease-in-out; }

.side_nav > ul > li > a { -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }

.side_nav > ul > li > a > b { position: relative; display: block; z-index: 5; }

.side_nav > ul > li:hover > a { color: #fff; }

.side_nav > ul > li:hover > a:before { background: #fff; }

.side_nav > ul > li:hover > a:after { background: #fff; }

.side_nav > ul > li.active > a { background: #166ca3; color: #fff; }

.side_open { display: none; }




@media only screen and (max-width: 1230px) { .side_open { display: block; } }
@media (max-width: 1199px) { .side_open { right: 30px; } }
@media (max-width: 767px) { .side_open { width: 33px; height: 23px; right: 15px; }
  .side_open span { height: 3px; } }
body.open .side_open { right: 324px; }

@media (max-width: 320px) { body.open .side_open { left: 2px; } }

/*# sourceMappingURL=nav.css.map */