@font-face {
    font-family: 'Poppins';
    src: url(Poppins.ttf);
    font-weight: 100;
}


body {
    font-family: Poppins;
    width: 100%;
    font-size: 20px;
    color: #221815;
    background-color: #fcfdfd;
}

* {
    margin: 0;
    padding: 0;
}

img,
input,
button {
    border: 0;
}

a {
    text-decoration: none;
}

ul,
li {
    list-style: none;
}

.width {
    width: 95%;
    max-width: 1400px;
    margin: 0 auto;
}

.left {
    float: left;
}

.right {
    float: right;
}

#top {
    width: 100%;
    height: 60px;
    background-color: #e6be67;
    line-height: 60px;
    font-size: 20px;
}

#top font {
    font-size: 16px;
    text-transform: uppercase;
}

#top a {
    color: #221815;
}

#top a:hover {
    color: #e70012;
}

#head {
    width: 100%;

}

#head .logo {
    height: 68px;
    margin: 25px 0;
}

#head .search {
    display: inline-block;
    height: 34px;
    margin: 40px 0;
    border: 1px solid #e6be67;
    width: 22%;
    float: right;
    position: relative;
}

#head .search .sel {width: 1070px; position: absolute; top: -5px; background: #ccc; right: -5px; padding: 10px; z-index: 9; display: none}

#head .search .sel button {width: auto; float: none}

#head .search input {
    width: 72%;
    height: 32px;
    line-height: 100%;
    padding-left: 8px;
    display: inline;
    outline: none;
}

#head .search .sel input{width: 100%}

#head .search button {
    width: 62px;
    height: 34px;
    background-color: #e6be67;
    float: right;
    cursor: pointer;
}

#head .menu {
    float: right;
    width: 58%;
    height: 32px;
    line-height: 32px;
    margin-top: 42px;
    display: inline-block;
}

#head .menu li {
    position: relative;
    margin-right: 9%;
    text-transform: uppercase;
    float: left;
    font-size: 22px;
    font-weight: bold;
    display: inline;
    float: right;
}

#head .menu li a {
    color: #3e3a39;
}

#head .menu .act {
    position: absolute;
    width: 44px;
    height: 6px;
    left: 50%;
    margin-left: -22px;
    background-color: #E70012;
    bottom: -15px;
    display: none;
}

#show {
    width: 100%; overflow: hidden
}

#show .title {
    width: 100%;
    text-align: center;
    padding-top: 16px;
}

#contact {
    width: 100%;
    text-align: center;
    overflow: hidden;
    padding-top: 50px;
    padding-bottom: 5px;

}


#contact h1 {
    font-size: 2vw;
    position: relative;
    text-transform: uppercase;
    font-weight: bold;
}

#contact .hr {
    position: absolute;
    width: 130px;
    height: 4px;
    background-color: #e6bd65;
    left: 50%;
    margin-left: -65px;
    bottom: -15px;
}

#contact .contact {
    width: 100%;
    margin-top: 70px;

}

#contact .contact .part1 {
    float: left;
    width: 49%;
    background-color: #fff;
    text-align: left;
    overflow: hidden;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
    padding: 50px 0;
    margin-right: 1%;
}

#contact .contact .part2 {
    float:right;
    width: 49%;
    background-color: #fff;
    text-align: left;
    overflow: hidden;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
    padding: 50px 0;

}

#contact .contact .part2 li {
    width: 90%;
    margin: 0 auto;
    position: relative;
}

#contact .contact .part2 li input {
    width: 100%;
    height: 35px;
    line-height: 35px;
    border-bottom: 1px solid #595757;
    outline: none;
    margin-bottom: 35px;
    z-index: 3;
    background: none;
    font-size: 1vw;

}

#contact .contact .part2 li textarea {
    border: 0;
    border-bottom: 1px solid #595757;
    height: 60px;
    width: 100%;
    outline: none;
    font-size: 1vw;
}

#contact .contact .part2 li span {

    color: #e6bd65;
    left: 0;
    font-size: 1.5vw;
    z-index: 2;
}

#contact .contact .part1 li {
    padding: 13px 0;
    padding-left: 5%;
    padding-right: 10%;
}

#contact .contact .part1 li span {
    color: #e6bd65;
    font-size: 1.5vw;
}

#contact .contact .part1 li p {
    color: #595757;
    font-size: 16px;
    line-height: 28px;
    margin-top: 10px;
}

#contact .contact .part3 {
    float: right;
    width: 12%;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
    background-color: #fff;
    padding: 50px 0;
    text-align: center;
    display: none;
}

#contact .contact .part3 img {
    width: 60%;
}



#foot {
    width: 100%;
    background-color: #e6bd65;
    color: #fff;
    overflow: hidden;
    margin-top: 70px;
    padding: 30px 0;
}

#foot h1 {
    font-size: 20px;
    text-transform: uppercase;
}

#foot p {
    font-size: 16px;
    font-weight: normal;
}

#foot img {
    height: 87px;
    margin-top: 40px;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
}

#slide {
    width: 100%;
    background-color: #fff;
    overflow: hidden;
}


#pro {
    wdith: 100%;
    text-align: center;
    overflow: hidden;
    padding-top: 40px;
    padding-bottom: 5px;
}


#pro h1 {
    font-size: 2vw;
    position: relative;
    text-transform: uppercase;
    font-weight: bold;
}

#pro .hr {
    position: absolute;
    width: 130px;
    height: 4px;
    background-color: #e6bd65;
    left: 50%;
    margin-left: -65px;
    bottom: -15px;
}

#pro .list {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 80px;
}

#pro .list li {
    float: left;
    width: 33.33%;
    margin-bottom: 40px;
}

#pro .list li a {
    display: block;
}

#pro .list .div {
    width: 90%;
    margin: 0 auto;
}

#pro .list .div .img {
    width: 100%;
    height: 485px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

#pro .list .div .img img {
    width: 80%;
    margin: 0 auto;
}

#pro .list .div .title {
    wdith: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #f2f2f3;
    margin-top: 10px;
    overflow: hidden;
}

#pro .list .div .thover {
    background-color: #e6bd65;
}

#pro .list .div .ihover {
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
}


#pro .about {
    width: 100%;

    margin-top: 80px;
    position: relative;
}

#pro .about .info {
    float: right;
    width: 60%;
    background-color: #fff;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
    text-align: left;
    padding: 40px 0;
}

#pro .about .info span {
    padding-left: 20%;
    font-size: 20px;
    color: #e6bd65;
}

#pro .about .info p {
    padding-left: 20%;
    padding-right: 5%;
    margin-top: 10px;
    font-size: 16px;
}

#pro .about .img {
    position: absolute;
    width: 50%;
    left: 0%;
    top: 80px;
}

#pro .about .video {
    position: absolute;
    width: 10%;
    left: 15%;
    top: 185px;
    z-index: 333;
}

#pro .about .video img {
    width: 100%;
}

#pro .about .img img {
    width: 100%;
}

#banner {
    width: 100%;
}

#banner img {
    width: 100%;
}

#aimg {
    width: 100%;
    overflow: hidden;
    padding-top: 40px;
}

#aimg .list {
    width: 100%;

    overflow: hidden;
}

#aimg .list li {
    width: calc(31.34%);
    margin-right: 2%;
    height: 320px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
}

#aimg .list li img {
    width: 100%;
}

#map {
    width: 100%;
    text-align: center;
    padding-top: 60px;
}

#map img {
    max-width: 1200px;
}

#way {
    width: 100%;
    overflow: hidden;
    padding-top: 50px;
    padding-bottom: 30px;
}

#way .way {
    width: 90%;
    margin: 0 auto;
}

#way .way .title {
    width: 100%;
    height: 57px;
    background-color: #e6bd65;
    line-height: 57px;
    font-size: 1.5vw;
    color: #fff;
    font-weight: bold;
}

#way .way .title img {
    height: 27px;
    margin-top: 15px;
    float: left;
    padding-left: 25px;
    padding-right: 20px;
}

#way .way .title span {
    float: left;
}

#way .way .text {
    width: 100%;
    height: 50px;
    background-color: #f7f8f8;
    line-height: 50px;
    font-size: 1.4vw;
    color: #4c4948;
    font-weight: bold;
}

#way .way .text span {
    padding-left: 15px;
}

#pclass {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
}

#pclass .class {
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 20px;
    background-color: #e6be67;
    color: #000;
    text-transform: uppercase;
}

#pclass .class span {
    padding-left: 35px;
}

#pclass .type {
    width: 100%;
    height: 76px;
    line-height: 76px;
    font-size: 1.8vw;
    background-color: #dcdcdc;
    color: #000;
    text-transform: uppercase;
}

#pclass .type span {
    padding-left: 35px;
}

#pclass .class i {
    font-size: 1.8vw;
    padding-left: 10px;
}

#pclass .zclass {
    position: absolute;
    width: 100%;
    display: none;
    background-color: #f2f2f3;
    z-index: 9;
    top: 76px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
}

#pclass .clist {
    width: 100%;
    color: #2f2725;
}

#pclass .clist li {
    width: 100%;
    height: 60px;
    line-height: 60px;
    font-size: 1.4vw;
}

#pclass .clist li:hover {
    background-color: #e6be67;
}

#pclass .clist li a {
    padding-left: 30px;
    color: #2f2725;
}

#plist {
    width: 100%;
    margin-top: 50px;
    overflow: hidden;
}

#plist a {
    display: block;
}

#plist .div {
    width: 100%;
    margin: 0 auto;
}

#plist .div .img {
    width: 100%;
    height: 318px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

#plist .div .img img {
    width: 100%;
    margin: 0 auto;
}

#plist .div .title {
    wdith: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #f2f2f3;
    margin-top: 10px;
    overflow: hidden;
}

#plist .div .thover {
    background-color: #e6bd65;
}

#plist .div .ihover {
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
}

#w_head {width: 100%; height: 60px; background: #e6be67; display: none}

#pro .pinfo {width: 100%; display: none}
#pro .vv {width: 100%; display: none}
#contact .contact .part2 li button {font-size: 1.5vw;}
#way2 {display: none}

#plist table {width: 100% !important;}
#plist tr,td {border: 1px solid #ccc !important; min-width: 80px !important;}

.mg25 {margin-top: 25px;}

#show .title img {transform:scale(0.6);}

#w_foot {display: none}

#w_fdiv {display: none}
#slide2 {display: none}

#banner_wap {display: none}

#size_wap {display: none;}

@media (max-width: 1200px) {

    #size {display: none}
    #size_wap {display: block}
    #size_wap img {width:100% !important;}
    #top {
        display: none;
    }
    #slide2 {display: block; margin-top: 60px;}

    #head {
        display: none;
    }

    #banner_wap {display: block; margin-top: 60px;}
    #banner_wap img {margin-bottom: 8px;}

    #w_head {display: block; position: fixed; top: 0; left: 0; z-index: 99999}
    #w_head .logo {float: left;}
    #w_head .logo img {height: 40px; margin-top: 5px; padding: 5px; background: #fff; border-radius: 5px;}
    #w_head i {float: right; color: #fff; font-size: 30px; margin-top: 13px;}
    #slide {display: none}

    #w_head .menu {width: 150px; right: -150px; position: absolute; top: 60px; background: #e6cf9f; border-top: 3px solid #fff; z-index: 9999;}
    #w_head .menu li {width: 100%; text-align: center; color: #fff; height: 40px; line-height: 40px; font-size: 16px; border-bottom: 1px solid #fff; text-transform: uppercase}
    #w_head .menu li a {color: #fff}
    #e {display: none}
    #f {display: none}

    #pro h1 {font-size: 20px;}
    #pro .pinfo {display: block; margin-top: 60px;}
    #pro .list {padding-top: 20px}
    #pro .list li {width: 100%}
    #pro .list .div .img {height: auto}
    #pro .about .info {width: 100%; padding: 40px 0;}
    #pro .about .info span {font-size: 20px; padding-left: 3%}
    #pro .about .img {display: none}
    #pro .about .info p {font-size: 14px; padding-left: 3%; line-height: 20px;}
    #pro .about .video {display: none}
    #pro .vv {display: block}

    #contact h1 {font-size: 20px;}
    #contact .contact .part1 {width: 100%; padding: 0}
    #contact .contact .part2 {width: 100%}
    #contact .contact .part3 {width: 30%; display: none}
    #contact .contact .part1 li span {font-size: 16px;}
    #contact .contact .part1 li p {font-size: 14px; line-height: 25px;}

    #contact .contact .part2 li span {font-size: 16px;}
    #contact .contact .part2 li button {font-size: 16px;}

    #foot img {display: none}
    #foot h1 {font-size: 20px;}
    #foot p {font-size: 14px;}

    #banner {display: none}
    #aimg {padding-top: 10px;}
    #map img {width: 100%}

    #way .way .title {font-size: 16px;}
    #way .way .text {font-size: 14px;}
    #way1 {display: none}
    #way2 {display: block}

    .sw1 {display: none}
    .sw2 {display: none}

    #pro {padding-top: 40px;}

    #pclass .class {margin-top: 40px;}

    .layui-btn {font-size: 14px !important; padding:0 10px !important; margin-bottom: 8px;}
    .layui-btn+.layui-btn {margin-left: 5px !important;}
    .layui-col-md12 {margin-bottom: 10px !important;}

    .mg25 {margin-top: 10px;}

    #show .title img {width: 95%; margin: 0 auto}
    .gallery-top {width: 100% !important;}
    .gallery-thumbs {width: 100% !important; height: 120px !important;}

    .gallery-top2 {width: 100% !important;}
    .gallery-thumbs2 {width: 100% !important; height: 120px !important;}

    .gallery-top3 {width: 100% !important;}
    .gallery-thumbs3 {width: 100% !important; height: 120px !important;}

    #plist .div .img {height: auto;}
    #tv {display: none}

    #w_foot {width: 100%; height: 60px; position: fixed; bottom: 0; left: 0; background: #e6be67; display: block; z-index: 99999; border-top: 1px solid #fff;}
    #w_foot li {width: 25%; text-align: center; float: left; line-height: 26px; font-size: 16px;}
    #w_foot i {color: #fff; font-size: 25px; display: block; margin-top: 5px;}
    #w_foot a {color: #fff;}
    #w_fdiv {display: block}

}