@charset='utf-8';

/* body,html{ padding:0; margin:0; font-size:14px; color:#666; font-family: "微軟正黑體","Microsoft Yahei","Hiragino Sans GB","SimHei","STHeiti" !important; box-sizing: border-box; padding-left: 0px;} */

body,
html {
    padding: 0;
    margin: 0;
    font-size: 14px;
    color: #666;
    font-family: "思源黑体", "Microsoft Yahei", "Hiragino Sans GB", "SimHei", "STHeiti" !important;
    box-sizing: border-box;
    padding-left: 160px;
}

ul,
li,
p,
h1,
h2,
h3,
dl,
dt,
dd,
input {
    padding: 0;
    margin: 0;
    list-style: none;
}

a {
    text-decoration: none;
    color: #666;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    transition: all .4s ease;
}

a:hover {
    color: #a8d57a !important;
    text-decoration: none;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    transition: all .4s ease;
}

.demo {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}

.clear {
    clear: both;
}

img {
    vertical-align: top !important;
    border: none;
}

input {
    font-family: "微軟正黑體", "Microsoft Yahei", "Hiragino Sans GB", "SimHei", "STHeiti" !important;
}

input:focus {
    outline: none;
}

textarea:focus {
    outline: none;
}

.center {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}


/* 图标库 */

@font-face {
    font-family: "yyfont";
    src: url('//at.alicdn.com/t/font_845742_64kbd0mqkv6.eot?t=1539337026835');
    /* IE9*/
    src: url('//at.alicdn.com/t/font_845742_64kbd0mqkv6.eot?t=1539337026835#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'), url('//at.alicdn.com/t/font_845742_64kbd0mqkv6.ttf?t=1539337026835') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('//at.alicdn.com/t/font_845742_64kbd0mqkv6.svg?t=1539337026835#yyfont') format('svg');
    /* iOS 4.1- */
}

.yyfont {
    font-family: "yyfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* 隐藏 */

.nav-box {
    display: none;
}

.carousel-box {
    display: none;
}

.villa-home-lft-box {
    display: none;
}

.case-box-web {
    display: none;
}

.abouts-rht-box {
    display: none;
}

.our-box-list {
    display: none;
}

.web-news-box {
    display: none;
}


/* 菜单 */


/* .menu-box{ width: 100%; height: 126px; position: fixed; left: 0; top: 0;  background: #fff;display: flex;z-index: 2000;}
.menu-box .logo{ width: 140px; height: 100%;  overflow: hidden;} */

.menu-box {
    width: 160px;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: #fff;
}

.menu-box .logo {
    width: 100%;
    height: 154px;
    overflow: hidden;
}

.menu-box .logo img {
    width: 80%;
    display: block;
    margin: 30px auto 0 auto;
}

.menu-box nav {
    display: block;
    width: 100%;
    height: 80%;
    overflow-y: auto;
}


/* .menu-box nav ul{ display: flex; padding-top: 20px; } */

.menu-box nav ul {
    display: block;
    padding-top: 20px;
}

.menu-box nav ul li {
    display: block;
    width: 100%;
    height: 80px;
    line-height: 80px;
    text-align: center;
    position: relative;
    overflow: hidden;
    font-size: 18px;
    font-weight: 600;
}

.menu-box nav ul li a {
    display: block;
    width: 100%;
    height: 80px;
    position: relative;
    z-index: 1;
}

.menu-box nav ul li a img {
    margin-top: 30px;
    margin-right: 8px;
    width: 24px;
}

.menu-box nav ul li span {
    display: block;
    width: 30%;
    height: 1px;
    background: #eee;
    position: absolute;
    bottom: 0;
    left: 35%;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}

.menu-box nav ul li.nav span {
    width: 100%;
    height: 80px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #a8d57a;
}

.menu-box nav ul li.nav a {
    color: #fff;
}

.menu-box nav:hover ul li.nav span {
    display: block;
    width: 30%;
    height: 1px;
    background: #eee;
    position: absolute;
    bottom: 0;
    left: 35%;
}

.menu-box nav:hover ul li.nav a {
    color: #666;
}

.menu-box nav:hover ul li.nav:hover span {
    width: 100%;
    height: 80px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #a8d57a;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}

.menu-box nav:hover ul li.nav:hover a {
    color: #fff;
}

@media only screen and (min-width: 1300px) {
    .menu-box {
        width: 160px;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
    }
    .menu-box .logo {
        width: 100%;
        height: 154px;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 30px auto 0 auto;
    }
    .menu-box nav {
        display: block;
        width: 100%;
        height: 80%;
        overflow-y: auto;
    }
    .menu-box nav ul {
        display: block;
        padding-top: 20px;
    }
    .menu-box nav ul li {
        display: block;
        width: 100%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        position: relative;
        overflow: hidden;
        font-size: 18px;
        font-weight: 600;
    }
    .menu-box nav ul li a {
        display: block;
        width: 100%;
        height: 80px;
        position: relative;
        z-index: 1;
    }
    .menu-box nav ul li a img {
        margin-top: 30px;
        margin-right: 8px;
        width: 24px;
    }
    .menu-box nav ul li span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav ul li.nav span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
    }
    .menu-box nav ul li.nav a {
        color: #fff;
    }
    .menu-box nav:hover ul li.nav span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
    }
    .menu-box nav:hover ul li.nav a {
        color: #666;
    }
    .menu-box nav:hover ul li.nav:hover span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav:hover ul li.nav:hover a {
        color: #fff;
    }
}

@media only screen and (min-width: 1200px)and (max-width: 1299px) {
    .menu-box {
        width: 160px;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
    }
    .menu-box .logo {
        width: 100%;
        height: 154px;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 30px auto 0 auto;
    }
    .menu-box nav {
        display: block;
        width: 100%;
        height: 80%;
        overflow-y: auto;
    }
    .menu-box nav ul {
        display: block;
        padding-top: 20px;
    }
    .menu-box nav ul li {
        display: block;
        width: 100%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        position: relative;
        overflow: hidden;
        font-size: 18px;
        font-weight: 600;
    }
    .menu-box nav ul li a {
        display: block;
        width: 100%;
        height: 80px;
        position: relative;
        z-index: 1;
    }
    .menu-box nav ul li a img {
        margin-top: 30px;
        margin-right: 8px;
        width: 24px;
    }
    .menu-box nav ul li span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav ul li.nav span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
    }
    .menu-box nav ul li.nav a {
        color: #fff;
    }
    .menu-box nav:hover ul li.nav span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
    }
    .menu-box nav:hover ul li.nav a {
        color: #666;
    }
    .menu-box nav:hover ul li.nav:hover span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav:hover ul li.nav:hover a {
        color: #fff;
    }
}

@media screen and (min-width: 1080px)and (max-width: 1199px) {
    .menu-box {
        width: 160px;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
    }
    .menu-box .logo {
        width: 100%;
        height: 154px;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 30px auto 0 auto;
    }
    .menu-box nav {
        display: block;
        width: 100%;
        height: 80%;
        overflow-y: auto;
    }
    .menu-box nav ul {
        display: block;
        padding-top: 20px;
    }
    .menu-box nav ul li {
        display: block;
        width: 100%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        position: relative;
        overflow: hidden;
        font-size: 18px;
        font-weight: 600;
    }
    .menu-box nav ul li a {
        display: block;
        width: 100%;
        height: 80px;
        position: relative;
        z-index: 1;
    }
    .menu-box nav ul li a img {
        margin-top: 30px;
        margin-right: 8px;
        width: 24px;
    }
    .menu-box nav ul li span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav ul li.nav span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
    }
    .menu-box nav ul li.nav a {
        color: #fff;
    }
    .menu-box nav:hover ul li.nav span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
    }
    .menu-box nav:hover ul li.nav a {
        color: #666;
    }
    .menu-box nav:hover ul li.nav:hover span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav:hover ul li.nav:hover a {
        color: #fff;
    }
}

@media screen and (min-width: 1000px)and (max-width: 1079px) {
    .menu-box {
        width: 160px;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
    }
    .menu-box .logo {
        width: 100%;
        height: 154px;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 30px auto 0 auto;
    }
    .menu-box nav {
        display: block;
        width: 100%;
        height: 80%;
        overflow-y: auto;
    }
    .menu-box nav ul {
        display: block;
        padding-top: 20px;
    }
    .menu-box nav ul li {
        display: block;
        width: 100%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        position: relative;
        overflow: hidden;
        font-size: 18px;
        font-weight: 600;
    }
    .menu-box nav ul li a {
        display: block;
        width: 100%;
        height: 80px;
        position: relative;
        z-index: 1;
    }
    .menu-box nav ul li a img {
        margin-top: 30px;
        margin-right: 8px;
        width: 24px;
    }
    .menu-box nav ul li span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav ul li.nav span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
    }
    .menu-box nav ul li.nav a {
        color: #fff;
    }
    .menu-box nav:hover ul li.nav span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
    }
    .menu-box nav:hover ul li.nav a {
        color: #666;
    }
    .menu-box nav:hover ul li.nav:hover span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav:hover ul li.nav:hover a {
        color: #fff;
    }
}

@media screen and (min-width: 766px)and (max-width: 1000px) {
    .menu-box {
        width: 160px;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
    }
    .menu-box .logo {
        width: 100%;
        height: 154px;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 30px auto 0 auto;
    }
    .menu-box nav {
        display: block;
        width: 100%;
        height: 80%;
        overflow-y: auto;
    }
    .menu-box nav ul {
        display: block;
        padding-top: 20px;
    }
    .menu-box nav ul li {
        display: block;
        width: 100%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        position: relative;
        overflow: hidden;
        font-size: 18px;
        font-weight: 600;
    }
    .menu-box nav ul li a {
        display: block;
        width: 100%;
        height: 80px;
        position: relative;
        z-index: 1;
    }
    .menu-box nav ul li a img {
        margin-top: 30px;
        margin-right: 8px;
        width: 24px;
    }
    .menu-box nav ul li span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav ul li.nav span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
    }
    .menu-box nav ul li.nav a {
        color: #fff;
    }
    .menu-box nav:hover ul li.nav span {
        display: block;
        width: 30%;
        height: 1px;
        background: #eee;
        position: absolute;
        bottom: 0;
        left: 35%;
    }
    .menu-box nav:hover ul li.nav a {
        color: #666;
    }
    .menu-box nav:hover ul li.nav:hover span {
        width: 100%;
        height: 80px;
        position: absolute;
        left: 0;
        bottom: 0;
        background: #a8d57a;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
    }
    .menu-box nav:hover ul li.nav:hover a {
        color: #fff;
    }
}

@media screen and (max-width: 415px) {
    .menu-box {
        width: 100%;
        height: 110px;
        position: fixed;
        left: 0;
        top: 0;
        background: #fff;
        display: flex;
        z-index: 2000;
    }
    .menu-box .logo {
        width: 140px;
        height: 100%;
        overflow: hidden;
    }
    .menu-box .logo img {
        width: 80%;
        display: block;
        margin: 10px auto 0 auto;
    }
    .menu-box nav ul {
        display: flex;
        padding-top: 6px;
    }
    .menu-box nav ul li a img {
        margin-top: 32px;
        margin-right: 8px;
        width: 24px;
    }
    body,
    html {
        padding-left: 0px;
    }
}