@charset "UTF-8";

* {
    margin                     : 0;
    padding                    : 0;
}

html,
body {
    font-size  : 16px;
    font-family: "宋体", "Microsoft YaHei", Helvetica Neue, Tahoma, Arial, "微软雅黑", "黑体";
}

ul,
li {
    list-style: none;
}

a {
    cursor         : pointer;
    text-decoration: none;
    color          : #000;
}

a:hover,
a:active {
    color          : #913125;
    text-decoration: none;
}

input,
select,
textarea {
    outline           : none;
    -webkit-appearance: none;
    -moz-appearance   : none;
}

img {
    vertical-align: top;
}
figure {
    margin: 0;
}
.wrap {
    width    : 96.75%;
    max-width: 1600px;
    margin   : 0 auto;
}
.more {
    width: 202px;
    height: 70px;
    line-height: 70px;
    font-size: 22px;
    color: #ffffff;
    background: #c3c3c3;
    text-align: center;
}

.more:hover {
    background: #913125;
}

/*header*/
.header {
    position  : fixed;
    left      : 0;
    right     : 0;
    top       : 0;
    z-index   : 99;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.1) 0 1px 5px;
}

.header .logo {
    float     : left;
    margin-top: 23px;
}

.nav {
    float      : right;
    line-height: 110px;
}

.nav ul li {
    float      : left;
    margin-left: 82px;
    color      : #222 !important;
    font-size  : 22px;
}

.nav ul li:hover {
    color: #913125;
}

.nav ul li.active a {
    color: #913125 !important;
}


/*footer*/
.footer {
    width     : 100%;
    height    : 100%;
    background: #913125
}

.footer_type {
    display       : flex;
    flex-direction: row;
    align-items   : center
}

.footer_left {
    flex      : 1;
    margin-top: 60px
}

.footer_left .logo {
    width : 209px;
    height: 49px
}

.footer_left .logo img {
    width : 100%;
    height: 100%
}

.footer_left .qr {
    margin-top : 30px;
    margin-left: 45px
}

.footer_left p {
    margin-top : 20px;
    margin-left: 75px;
    color: #fff;
}

.footer_right {
    margin-top    : 60px;
    height        : 151px;
    display       : flex;
    flex-direction: column
}

.footer_right .title {
    width: 435px
}

.footer_right .title ul {
    width: 100%
}

.loc,
.mail,
.tel {
    width: 23px
}

.footer_right .title ul li {
    float      : left;
    margin-left: 40px
}
.footer_right .title ul li a{
   font-size: 18px;
   color: #fff;
}

.loc_box,
.mail_box,
.tel_box {
    display       : flex;
    flex-direction: row;
    margin-top    : 25px;
    margin-left   : 40px
}

.loc,
.mail,
.tel {
    background: url(../images/home/Wizard.png) repeat-x
}

.tel {
    height             : 20px;
    background-position: -758px -135px
}

.loc {
    height             : 23px;
    background-position: -758px -175px
}

.mail {
    height             : 17px;
    background-position: -758px -210px
}

.loc_box p,
.mail_box p,
.tel_box p {
    margin-left: 15px;
    float      : left;
    font-size  : 16px;
    color      : #fff
}

.br_1 {
    margin-top: 30px;
    width     : 100%;
    height    : 1px;
    background: #fff
}

.footer_ft {
    display        : flex;
    flex-direction : row;
    justify-content: center;
    align-items    : center;
    margin-top     : 20px;
    padding-bottom  : 30px
}

.ft_title {
    flex: 1;
    color: #fff;
    font-size: 16px;
}
.ft_title a{
    font-size: 16px;
    color: #fff
}

.footer_ft .icons {
    width: 490px
}

.footer_ft .icons ul {
    margin-left   : 83px;
    display       : flex;
    flex-direction: row
}

.footer_ft .icons ul li {
    margin-left  : 10px;
    width        : 43px;
    height       : 43px;
    border-radius: 50%;
    background   : #984b42
}

.icon-friend,
.icon-renren,
.icon-weibo,
.icon-weixin {
    background: url(../images/home/Wizard.png) repeat-x;
    margin    : 10px auto
}

.icon-weixin {
    width              : 27px;
    height             : 22px;
    background-position: -490px -35px
}

.icon-weibo {
    width              : 27px;
    height             : 23px;
    background-position: -556px -33px
}

.icon-renren {
    width              : 25px;
    height             : 26px;
    background-position: -623px -36px
}

.icon-friend {
    width              : 26px;
    height             : 24px;
    background-position: -718px -38px
}

.weixin{
    position:relative;
  }
 .weixin::after{
   content: url(../images/home/qr.png);
   position: absolute;
   left: -41px;
   top: -176px;
   z-index: 99;
   width: 127px;
   height: 127px;
   border-radius: 4px;
   transform-origin: top right;
   transform: scale(0);
   opacity: 0;
   -webkit-transition: all .4s ease-in-out;
   -o-transition: all .4s ease-in-out;
   transition: all .4s ease-in-out;
 }
 .weixin:hover::after{
   transform:scale(1);
   opacity: 1;
 }
.gotop {
    position      : fixed;
    right         : 135px;
    bottom        : 11px;
    text-transform: uppercase;
    cursor        : pointer;
    z-index       : 99;
}

.gotop p {
    float     : left;
    margin-top: 31px;
    font-size : 16px;
    color     : #fff;
    display   : none;
}

.gotop .icon {
    float : right;
    width : 78px;
    height: 63px;
}


.m-banner {
    margin-top: 110px;
    width     : 100%;
    height    : 405px;
    position  : relative;
}

.m-banner p {
    font-size: 58px;
    color    : #fff;
    position : absolute;
    top      : 40%;
    left     : 45%;
}

@media (max-width:639px) {
    a,a:hover{
        text-decoration: none;
    }
    a{
        color: #000;
    }
    .wrap {
        width       : auto;
        margin-left : 4.8%;
        margin-right: 4.8%;
    }

    .gh {
        display: block;
    }

    .gh {
        position          : absolute;
        height            : 80px;
        width             : 80px;
        top               : 0;
        z-index           : 100;
        transition        : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        cursor            : pointer;
        right             : 0;
        z-index           : 9;
        background        : #913125;
    }

    .gh.selected {

        background: transparent;
    }

    .gh a {
        display           : block;
        height            : 2px;
        margin-top        : -1px;
        position          : relative;
        top               : 50%;
        left              : 50%;
        margin-left       : -15px;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 30px;
        background        : #fff;

    }

    .gh a:after,
    .gh a:before {
        content           : "";
        display           : block;
        height            : 2px;
        left              : 0;
        position          : absolute;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 100%;
        background        : #fff;
    }

    .gh a:after {
        top: 4px;
    }

    .gh a:before {
        top: -4px;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        top: 0;
    }

    .gh.selected a:before {
        transform        : translateY(0px) rotate(-45deg);
        -webkit-transform: translateY(0px) rotate(-45deg);
        -ms-transform    : translateY(0px) rotate(-45deg);
    }

    .gh.selected a:after {
        transform        : translateY(0px) rotate(45deg);
        -webkit-transform: translateY(0px) rotate(45deg);
        -ms-transform    : translateY(0px) rotate(45deg);
    }

    .gh.selected a {
        background-color: transparent !important;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        background: #000;
    }

    .header {
        height  : 80px !important;
        position: fixed;
    }

    .header .nav {
        display    : none;
        position   : fixed;
        left       : 0;
        right      : 0;
        top        : 0;
        bottom     : 0;
        background : rgba(255, 255, 255, 0.9);
        z-index    : 9;
        float      : none;
        line-height: 50px;
        padding-top: 70px;
    }

    .header .nav li {
        float      : none;
        margin-left: 0;
        text-align : center;
        font-size  : 24px;
    }
    .header .nav li a{
        text-decoration: none;
        color: #000;
    }

    .header .logo {
        margin-top: 22px;
    }

    .header .logo img {
        width: 250px;
    }

    .gotop {
        width    : 60px;
        height   : 60px;
        font-size: 16px;
    }

    .gotop i {
        padding-top: 3px;
    }

    .gotop img {
        width: 15px;
    }


    .show-pc {
        display: none !important;
    }

    .show-h5 {
        display: block !important;
    }

    .header .logo img {
        width: 150px !important;
    }

    .footer {
        height: 100%;
    }

    .footer_right {
        height: 115px;
        margin-top: 30px;
    }

    .footer_right .title,
    .footer_left {
        display: none;
    }

    .tel_box,
    .mail_box,
    .loc_box {
        display       : flex;
        flex-direction: row;
        margin-left   : 2px;
        margin-top    : 10px;
    }

    .tel_box p,
    .loc_box p,
    .mail_box p {
        font-size: 14px;
    }

    .br_1 {
        display: none;
    }

    .footer_ft {
        height        : 110px;
        flex-direction: column;
        position      : relative;
        margin-bottom: 0;
    }

    .ft_title {
        position: absolute;
        bottom  : 25%;
    }

    .footer_ft .icons {
        width   : 100%;
        position: absolute;
        top     : -20%;
    }

    .footer_ft .icons ul .active {
        margin-left: 0;
    }

    .ft_title,
    .ft_title a {
        font-size  : 14px;
        line-height: 22px;
    }

    .gotop {
        position: fixed;
        right   : 1px;
        bottom  : 123px;
    }

    .gotop p {
        display: none;
    }

    .gotop img {
        width: 41px;
    }

}

@media (min-width: 640px) and (max-width: 1023px) {
    .wrap {
        width    : 96.75%;
        max-width: 1600px;
        margin   : 0 auto;
    }
    .navBox ul li:hover {
        border-bottom: none;
    }

    .wrap {
        width       : auto;
        margin-left : 4.8%;
        margin-right: 4.8%;
    }

    .gh {
        display: block;
    }

    .gh {
        position          : absolute;
        height            : 80px;
        width             : 80px;
        top               : 0;
        z-index           : 100;
        transition        : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        cursor            : pointer;
        right             : 0;
        z-index           : 9;
        background        : #913125;
    }

    .gh.selected {

        background: transparent;
    }

    .gh a {
        display           : block;
        height            : 2px;
        margin-top        : -1px;
        position          : relative;
        top               : 50%;
        left              : 50%;
        margin-left       : -15px;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 30px;
        background        : #fff;

    }

    .gh a:after,
    .gh a:before {
        content           : "";
        display           : block;
        height            : 2px;
        left              : 0;
        position          : absolute;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 100%;
        background        : #fff;
    }

    .gh a:after {
        top: 4px;
    }

    .gh a:before {
        top: -4px;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        top: 0;
    }

    .gh.selected a:before {
        transform        : translateY(0px) rotate(-45deg);
        -webkit-transform: translateY(0px) rotate(-45deg);
        -ms-transform    : translateY(0px) rotate(-45deg);
    }

    .gh.selected a:after {
        transform        : translateY(0px) rotate(45deg);
        -webkit-transform: translateY(0px) rotate(45deg);
        -ms-transform    : translateY(0px) rotate(45deg);
    }

    .gh.selected a {
        background-color: transparent !important;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        background: #000;
    }

    .header {
        height  : 80px !important;
        position: fixed;
    }

    .header .nav {
        width      : 100%;
        display    : none;
        position   : fixed;
        left       : 0;
        right      : 0;
        top        : 0;
        bottom     : 0;
        background : rgba(255, 255, 255, 0.9);
        z-index    : 9;
        float      : none;
        line-height: 50px;
        padding-top: 70px;
    }

    .header .nav li {
        float      : none;
        margin-left: 0;
        text-align : center;
        font-size  : 30px;
    }

    .header .logo {
        float     : left;
        margin-top: 23px;
    }

    .gotop {
        width    : 60px;
        height   : 60px;
        font-size: 16px;
    }

    .gotop i {
        padding-top: 3px;
    }

    .gotop img {
        width: 15px;
    }


    .show-pc {
        display: none !important;
    }

    .show-h5 {
        display: block !important;
    }

    .header .logo img {
        width: 150px !important;
    }

    .footer {
        height: 100%;
    }

    .footer_type {
        margin-top: 35px;
    }

    .footer_right {
        height: 100%;
    }

    .footer_right .title,
    .footer_left {
        display: none;
    }

    .tel_box,
    .mail_box,
    .loc_box {
        display       : flex;
        flex-direction: row;
        margin-left   : 2px;
        margin-top    : 10px;
    }

    .tel_box p,
    .loc_box p,
    .mail_box p {
        font-size: 18px;
    }

    .br_1 {
        display: none;
    }

    .footer_ft {
        height        : 110px;
        flex-direction: column;
        margin-top    : 22px;
        position      : relative;
    }

    .ft_title {
        position: absolute;
        bottom  : 0;
    }

    .footer_ft .icons {
        width   : 100%;
        position: absolute;
        top     : 0;
        left    : 20%;
    }

    .footer_ft .icons ul .active {
        margin-left: 0;
    }

    .ft_title,
    .ft_title a {
        font-size  : 18px;
        line-height: 30px;
    }

    .gotop {
        position: fixed;
        right   : 1px;
        bottom  : 123px;
    }

    .gotop p {
        display: none;
    }

    .gotop img {
        width: 60px;
    }

    .m-banner {
        margin-top: 80px;
        width     : 100%;
        height    : 200px;
        position  : relative;
    }

    .m-banner img {
        height: 200px;
    }

    .m-banner p {
        font-size: 30px;
        position : absolute;
        top      : 40%;
        left     : 45%;
    }


}

@media (min-width: 1024px) and (max-width: 1219px) {
    .wrap {
        width    : 95%;
        margin   : 0 auto;
    }
    .gh {
        display: block;
    }

    .gh {
        position          : absolute;
        height            : 80px;
        width             : 80px;
        top               : 0;
        z-index           : 100;
        transition        : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        cursor            : pointer;
        right             : 0;
        z-index           : 9;
        background        : #913125;
    }

    .gh.selected {

        background: transparent;
    }

    .gh a {
        display           : block;
        height            : 2px;
        margin-top        : -1px;
        position          : relative;
        top               : 50%;
        left              : 50%;
        margin-left       : -15px;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 30px;
        background        : #fff;

    }

    .gh a:after,
    .gh a:before {
        content           : "";
        display           : block;
        height            : 2px;
        left              : 0;
        position          : absolute;
        transition        : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        -ms-transition    : all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
        width             : 100%;
        background        : #fff;
    }

    .gh a:after {
        top: 4px;
    }

    .gh a:before {
        top: -4px;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        top: 0;
    }

    .gh.selected a:before {
        transform        : translateY(0px) rotate(-45deg);
        -webkit-transform: translateY(0px) rotate(-45deg);
        -ms-transform    : translateY(0px) rotate(-45deg);
    }

    .gh.selected a:after {
        transform        : translateY(0px) rotate(45deg);
        -webkit-transform: translateY(0px) rotate(45deg);
        -ms-transform    : translateY(0px) rotate(45deg);
    }

    .gh.selected a {
        background-color: transparent !important;
    }

    .gh.selected a:after,
    .gh.selected a:before {
        background: #000;
    }

    .header {
        height  : 80px !important;
        position: fixed;
    }

    .header .nav {
        display    : none;
        position   : fixed;
        left       : 0;
        right      : 0;
        top        : 0;
        bottom     : 0;
        background : rgba(255, 255, 255, 0.9);
        z-index    : 9;
        float      : none;
        line-height: 50px;
        padding-top: 70px;
    }

    .header .nav li {
        float      : none;
        margin-left: 0;
        text-align : center;
        font-size  : 24px;
    }

    .header .logo {
        margin-top: 18px;
    }

    .header .logo img {
        width: 200px;
    }

}
@media (min-width: 1220px) and (max-width: 1500px){
    .wrap {
        width    : 95%;
        margin   : 0 auto;
    }
    .nav ul li {
        float      : left;
        margin-left: 45px;
        color      : #222;
        font-size  : 18px;
    }

}
@media (min-width: 1501px) and (max-width: 1800px){
    .wrap {
        width    : 95%;
        margin   : 0 auto;
    }
    .nav ul li {
        float      : left;
        margin-left: 45px;
        color      : #222;
        font-size  : 20px;
    }

}