body {
    /* background: #dce4ea; */

    padding: 0;
    margin: 0;
}

html {
    background: #dce4ea;
}

.background {
    height: 100%;
    width: 100%;
}

.main {}

/* 头部 */
.banner {
    display: flex;
    width: 100%;
    height: auto;
}

.title_wen {
    /* display: flex; */

    /* justify-content: center;
    align-items: center; */
    position: absolute;
    z-index: 10;
    margin-top: 8%;
    width: 80%;
}

/* 链接圆圈1 */
.connect1 {
    height: 20%;
    /* width: 50%; */
    margin-left: 10%;
    margin-top: -20%;
}

/* 圆2 */
.connect2 {
    height: 20%;
    /* width: 100%; */
    margin-left: 5%;
    /* margin-top: -20%; */
}

.back {
    width: 100%;
    margin-top: 46%;
}

.contain {
    background-image: url("../img/ce/back.png");
    background-size: cover;
    display: flex;
    /* width: 100%;
    height: 30%; */
}

.contain .left {
    margin-top: -5%;
    margin-left: 10%;
    /* height: 3rem; */
    /* display: flex; */
    width: 10%;
}

.wrap {
    display: flex;
    margin-top: 3%;
    width: 80%;
    /* margin-left: 40%; */
}

.phopo {
    /* width: 4rem; */
    width: 30%;
    /* height: 40%; */
    /* height: 100%; */
    margin-left: 4%;
    margin-right: 2%;
    margin-bottom: 10%;
}

.textrwrap {
    width: 50%;
    height: 71%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.text {
    flex: 1;
    /* margin-left: 20px; */
    height: 30%;
    margin-bottom: 3%;
}

.learn {
    width: 30%;
    height: 17%;
    margin-top: 0;
    margin-bottom: 10%;
    margin-left: 3%;
    display: flex;
    flex-direction: column;
}

/* 轮播图 */
.swriper {
    display: flex;
    flex-direction: column;
    height: 70%;
    background-color: #49657e;
}

.shops {
    /* height: 50%; */
    margin: 0 auto;
    width: 70%;
    background-color: #49657e;
}

/* ::v-deep .swiper-slide{
   width: 80%;
} */
/* 底色 */
.blue {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 40%;
}

/* 文字 */
.head {
    /* flex-direction: row; */
    /* flex-direction: column; */
    display: flex;
    background-color: #49657e;
}

.head .text2 {
    display: flex;
    width: 30%;
    /* margin-left: 50%; */
    justify-content: center;
    align-items: center;
    margin: 2% 0% 2% 35%;
}


.swiper-container {
    position: relative;
    width:100%;
    height: 100%;
    margin-bottom: 10%;
}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    /* background: #6d7378; */
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 300ms;
    transform: scale(0.9);
}

.swiper-slide img{
    height: 100%;
}

.swiper-slide-active,.swiper-slide-duplicate-active{
    transform: scale(1);
}

.sj-title {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 5%;
    background: #536c8c;
    display: flex;
    align-items: center;
    padding: 0 3%;
    box-sizing: border-box;
}

/*.sj-text {*/
/*    width: 100%;*/
/*    line-height: 0.9%;*/
/*    color: #fff;*/
/*    font-size: 0.5rem;*/
/*    display: -webkit-box;*/
/*    -webkit-box-orient: vertical;*/
/*    -webkit-line-clamp: 2;*/
/*    overflow: hidden;*/
/*    text-align: center;*/
/*}*/

/*.sj-box {*/
/*    width: 14%;*/
/*    margin: 1% auto;*/
/*    display: flex;*/
/*    justify-content: space-around;*/
/*    align-items: center;*/
/*}*/

/* 线路推荐 */

.sell {
    width: 100%;
    display: flex;
    height: 20%;
    flex-direction: column;
    margin-bottom: 10%;
}

/* 文字 */

.tit .push {
    display: flex;
    width: 30%;
    justify-content: center;

    align-items: center;

    margin: 5% 30% 5% 30%;
}

/* 图片12 */

.ph {
    /* box-sizing: border-box; */

    /* width: 60%; */

    display: flex;

    padding: 0 15%;
    justify-content: center;
    align-items: center;
}

.picture1 {
    width: 65%;
}

.picture2 {
    width: 33%;
}

.picture3 {
    margin-top: 1%;

    width: 98%;
}

/* .ms-list {
   
    width: 100%;
    height: 64%;
    position: absolute;
    margin-top: 2%;
    background-image: url(../img/g/bg.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
  
} */
.ms-list {
    width: 100%;
    position: relative;
}

.ms-list img {
    width: 100%;
}

.list-all {
    /* width: 67%; */
    /*height: 50%;*/
    display: flex;
    position: absolute;
    top: 34%;
    left: 20%;
    /*float: left;*/
}

.ms-item {
    display: flex;
    width: 595px;
    margin-left: 2%;
}

.ms-item img {
    /* display: flex; */
    width: 100%;
    /* height: 80%; */
    /* position: absolute; */
}



/*.ms-title2 {*/
/*    margin-left: 50%;*/
/*}*/

.ms-more1 {
    margin: 0 auto;
}

.ms-title {
    width: 100%;
    color: white;
    font-size: 16px;
    height: 35px;
    line-height: 35px;
    padding-left: 2%;
    background-color: #3b557b;
    box-sizing: border-box;
    /*position: absolute;*/
    /*top: 93%;*/
    /*left: 2%;*/
}

.answer {
    margin-top: 0;
}

/*.ms-title2 {*/
/*    margin-left: 50%;*/
/*}*/

.ms-more1 {
    margin: 0 auto;
}

.ms-item-all {
    font-size: 20px;
    display: flex;
    padding: 0 15%;
    justify-content: space-around;
    margin-top: 3%;
}

.ms-itemsing {
    margin-left: 7%;
    width: 510px;
    height: 300px;
}

/* .ms-itemsing .img2 {

    height: 100%;

    width: 100%;



} */

.m4-all {
    /*margin-left: 12%;*/
    width: 622px;
    height: 340px;
}



.problem.close {
    background: url("../img/open.png") no-repeat right center;
    background-size: auto 65%;
    font-size: 20px;
    color: #445579;
}

.m4-item {
    margin-left: 2%;
    height: 15%;
    flex-shrink: 1;
    border-bottom: 1px solid #445579;
    margin-top: 6%;
}

.problem.open {
    background: url("../img/close.png") no-repeat right center;
    background-size: 3% auto;
    font-size: 20px;
    color: #445579;
}

.answer {
    text-align: left;
    padding-left: 10%;
    height: 3%;
    margin: 1% 0;
    font-size: 20px;
    color: #445579;
}

.p_t1 {
    width: 80%;
    margin-bottom: 2%;
}

.bottom {
    color: #476278;
    display: flex;
    /* margin-top: 10%; */
    flex: 1;

    width: 100%;
    height: 10%;
}