@charset "utf-8";
/* CSS Document */
*{margin:0;padding:0;}
li{list-style:none;}
a,u{text-decoration: none;}
h1,h2,h3,h4,h5{font-weight: normal;}
body{font-family:"微软雅黑";}

.clearfix:after{
    display: block;
    clear: both;
    visibility: hidden;
    height: 0;
    overflow: hidden;
    content: "."
}
.banner{width:100%;
    overflow: hidden;}
.banner img{display: block; width: 100%;}
.container{width:1200px;margin:0 auto;}
.intro{margin-top: 100px;}
.intro .container{overflow: hidden}
.intro .left{float:left;width:550px;margin-right: 50px;}
.intro .left h2{font-size:40px;color:#1c4e68;font-weight: bolder;margin-top: 40px;}
.intro .left p{color:#8fa19e;font-size:20px;line-height:30px;margin-top:20px;width:530px;}
.intro .left span{width:160px;height:46px;background:linear-gradient(to right,#94d79a,#6fb691) ;display: block;box-shadow:-3px 5px 24px rgba(161,226,157,.3);border-radius:50px;margin-top:36px;margin-top: 30px;line-height: 46px;text-align: center;color:#fff;font-size:18px;margin-left: 5px;}
.intro .right{float:left;width:570px;height:380px;border-radius: 10px;}
.intro .right img{width:100%;}
.title{font-size:40px;color:#1c4e68;font-weight: bolder;margin-top: 70px;margin-bottom: 70px;}
.people ul{overflow: hidden;width:1200px;margin-top:-20px;margin-left:-20px;}
.people ul li{width:575px;height:250px;background:#fff;box-shadow:0px 3px 30px rgba(0,0,0,.1);float:left;margin-left:20px;position: relative;margin-bottom: 20px;}
.people ul li.cu{margin-top:20px;}
.people ul li .left{width:72px;height:72px;float:left;margin-top: 40px;margin-left: 40px; border-radius:72px; overflow: hidden;}
.people ul li .left img{ width:100%;}
.people ul li .right{float:left;width: 450px;}
.people ul li .right h1{font-size:20px;font-weight:bold;color:#262626;margin-top: 45px;margin-left: 20px;}
.people ul li .right h5{font-size:14px;color:#b3b3b3;margin-left:20px;}
.people ul li .right .line{width:418px;height:1px;background: #e6e6e6;margin-top: 15px;margin-left: 20px;}
.people ul li .right p{font-size:14px;color:#b3b3b3;width:410px;line-height: 25px;margin-top: 20px;margin-left: 20px;}
.people ul li section{width:50px;height:20px;background:#ff243e;position: absolute;left:500px;top:55px;color:#fff;border-radius:10px;line-height: 20px;text-align: center;font-size:14px;}
.travel ul{overflow:hidden;display: none;}
.travel ul li{float:left;background: #fcfcfc;margin-bottom:30px;width:370px;height:400px;margin-right: 30px;transition: 0.5s;}
.travel ul li .img{width:370px;height:230px;}
.travel ul li h2{font-size:20px;color:#262626;font-weight:bold;margin-top: 20px;margin-bottom: 20px;text-align: center;}
.travel ul li p{font-size:14px;color:#b3b3b3;line-height:24px;width:310px;margin-left:30px;overflow: hidden;height: 54px;}
.travel ul li:hover{box-shadow:-3px 5px 30px rgba(0,0,0,.2);cursor: pointer;background:#fff;}
dl{width:230px;height:40px;overflow: hidden;margin: 0 540px;margin-top:40px;margin-bottom: 60px;}
dl li{width:20px;height:20px;background:#e5e5e5;border-radius: 50%;float: left;margin-right: 20px;}
dl li.cur{background:linear-gradient(to right,#94d79a,#6fb691) ;box-shadow:-3px 5px 24px rgba(161,226,157,.3);}
.city ul{display: none;}
.city ul li{float:left;background:#fcfcfc;width:575px;height:290px;transition:0.5s;margin-right:20px;margin-bottom: 20px;}
.city ul li .left{width:290px;height:290px;float:left;margin-right: 34px;}
.city ul li .left img{width:100%;}
.city ul li .right{float:left; width:240px;	}
.city ul li.cu{margin-bottom: 70px;}
.city ul li .right h2{font-size:20px;color:#262626;font-weight:bold;padding: 15px 0 10px;height: 85px;overflow: hidden;}
.city ul li .right p{width:220px;font-size:14px;color:#b3b3b3;line-height:24px; height:95px;overflow: hidden;}
.city ul li .right section{width:80px;height:26px;background:#545454;color:#fff;line-height:26px;border-radius:12px;font-size:12px;text-align: center;margin-top: 30px;}
.city ul li:hover{box-shadow:-3px 5px 30px rgba(0,0,0,.2);cursor: pointer;background:#fff;}
.city ul li:hover section{background:linear-gradient(to right,#94d79a,#6fb691) ;}
dl.city{margin: 0 520px;margin-top: 20px;}
footer{width:100%;height:100px;background:#f5f5f5;overflow: hidden;margin-top: 50px;}
footer p{font-size:14px;color:#666666;text-align: center;line-height: 26px;}
footer p:nth-of-type(1){margin-top: 30px;}

@media screen and (min-width: 1200px) {
    body {
        min-width:1200px
    }
}
@media (max-width: 960px) {
    body {
        min-width:350px
    }
    .container{
        width: auto;
    }
    .banner img{
        width: 150%;
        transform: translateX(-17%)
    }
    .intro {
        margin-top: 0
    }
    .intro .container{
        padding: 15px;
    }
    .intro .left{
        float: none;
        width: auto;
        margin: 0;
    }
    .intro .left h2{
        margin-top: 0;
        font-size: 22px;
    }
    .intro .left p{
        font-size: 14px;
        width: auto;
        line-height: 1.5;
        text-align: justify;
    }
    .intro .left span {
        width: 120px;
        height: 32px;
        line-height: 32px;
        font-size: 14px;
        margin: 15px 0 15px 0;
    }
    .intro .right{
        float: none;
        width: 100%;
        height: 100px;
    }
    .title{
        font-size: 24px;
        padding: 15px;
        margin: 5px 0;
    }

    .people ul{
        width: auto;
        padding:15px;
        margin: 0;
    }
    .people ul li{
        margin: 0;
        width: auto;
        height: auto;
        float:none;
    }
    .people ul li a{
        position: relative;
        display: block;
    }
    .people ul li .left{
        width: 32px;
        height: 32px;
        margin: 0;
        position: absolute;
        left: 15px;
        top: 18px;
    }
    .people ul li .right{
        width: auto;
        flex: 1;
        float:none;
    }
    .people ul li .right h1{
        font-size: 16px;
        margin: 0;
        padding: 15px 15px 15px 60px;
    }
    .people ul li .right .line{
        width: auto;
        margin: 0 15px;
    }
    .people ul li .right p{
        width: auto;
        margin: 0;
        padding: 15px;
        line-height: 1.5;
        color: #626262;
    }
    .people ul li:first-child{
        margin-top: 0;
    }
    .travel{
        padding: 15px;
    }
    .travel ul li{
        width: auto;
        float: none;
        margin: 0 0 15px;
        height: auto;
    }
    .travel ul li h2{
        text-align: left;
        margin: 0;
        padding: 15px 15px 0;
        font-size: 16px;
    }
    .travel ul li .img{
        width: auto;
        height: 120px;
        overflow: hidden;
    }
    .travel ul li .img img{
        transform: translateY(-15%);
    }
    .travel ul li p{
        margin: 0;
        padding: 15px;
        height: auto;
    }

    .city{
        padding: 15px;
    }
    .city ul li{
        float: none;
        width: auto;
        height: auto;
        margin: 0 0 20px;
    }
    .city ul li .left{
        float: none;
        margin: 0;
        width: auto;
        height: 120px;
        overflow: hidden;
    }
    .city ul li .left img{
        transform: translateY(-15%);
    }
    .city ul li .right{
        float: none;
        width: auto;
        padding-bottom: 15px;
    }
    .city ul li .right h2{
        height: auto;
        font-size: 16px;
        padding: 10px 15px;
    }
    .city ul li .right p{
        width: auto;
        line-height: 1.5;
        padding: 0 15px 15px;
        height: auto;
    }
    .city ul li .right section{
        margin: 0 15px 15px;
    }
    dl.city{
        margin: 0;
        text-align: center;
        width: 100%;
        padding: 0;
    }
    dl li{
        display: inline-block;
        float: none;
        width: 10px;
        height: 10px;
        margin-right: 10px;
    }
    footer{
        margin: 0;
        padding: 15px;
        box-sizing: border-box;
        height: auto;
    }
}