@charset "utf-8";
/********************************** 公用部分 start **********************************/

/* 售后 */

.keeper-title {
    font-size: 24px;
    position: relative;
    text-align: center;
    height: 40px;
}

.keeper-title:before {
    content: "";
    position: absolute;
    width: 50px;
    border-bottom: 2px solid #20b09f;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

.keeper-title:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 5px;
    border-color: #20b09f transparent transparent transparent;
    left: 50%;
    transform: translateX(-50%);
    bottom: -14px;
}

/*banner开始*/

.main-banner {
    height: 314px;
    position: relative;
    background: url(../images/keeper/keeper-banner.png) center no-repeat;
}

.main-banner-cont {
    padding: 60px 0 0;
    color: #fff;
}

.main-banner-title {
    height: 70px;
    line-height: 70px;
    font-size: 44px;
}

.main-banner-descrip {
    font-size: 18px;
    line-height: 30px;
}

.main-banner-btns {
    padding: 20px 0 0;
}

.protal-btn {
    display: inline-block;
    width: 176px;
    height: 46px;
    line-height: 44px;
    border: 1px solid #fff;
    text-align: center;
    font-size: 18px;
    position: relative;
    box-sizing: border-box;
    margin: 0 17px 0 0;
    cursor: pointer;
}

.protal-btn-green {
    background-color: #20b09f;
    border-color: #20b09f;
    color: #fff;
}

/*banner结束*/

.keeper-nav {
    height: 60px;
    background: #fbfbfb;
    border-bottom: 1px solid #e5e5e5;
    box-sizing: border-box;
}

.keep-nav-item {
    width: 400px;
    height: 60px;
    position: relative;
    background: url(../images/keeper/keeper-nav-bg01.png) no-repeat left;
}

.keep-nav-item a {
    height: 60px;
}

.keep-nav-item a:hover .keeper-nav-text {
    color: #20b09f;
}

.keep-nav-item:first-of-type {
    background-image: none;
    border-left: 1px solid #e5e5e5;
}

.keep-nav-item.cur {
    background: url(../images/keeper/keeper-nav-bg02.png) no-repeat left, #20b09f;
    color: #fff;
}

.keeper-nav-num {
    width: 30px;
    height: 30px;
    border-radius: 15px;
    border: 1px solid #9f9f9f;
    text-align: center;
    line-height: 30px;
    font-size: 18px;
    color: #9f9f9f;
}

.keep-nav-item.cur .keeper-nav-num {
    color: #fff;
    border: 1px solid #fff;
}

.keeper-nav-text {
    font-size: 18px;
    margin-left: 20px;
    transition: color .3s ease;
}

.keeper-nav-text span {
    font-size: 20px;
    font-weight: bold;
}

/*  */

.keeper-main-one .main-wrap {
    display: flex;
    justify-content: space-between;
    padding: 60px 0 40px 0;
}

.keeper-one-left {
    width: 800px;
}

.keeper-onel-item {
    border: 1px solid #e5e5e5;
    margin-bottom: 20px;
}

.keeper-onel-item .img-block {
    width: 400px;
}

.keeper-onel-item .keeper-onel-txt {
    width: 400px;
    box-sizing: border-box;
    padding: 0 30px;
}

.keeper-onel-title {
    font-size: 18px;
    color: #666;
    font-weight: bold;
    margin-bottom: 14px;
}

.keeper-onel-intro {
    font-size: 16px;
    color: #999;
    line-height: 28px;
    text-align: justify;
}

.keeper-one-right {
    width: 360px;
    border: 1px solid #e5e5e5;
    height: 763px;
}

.keeper-oner-title {
    color: #fff;
    font-size: 20px;
    background: #20b09f;
    text-align: center;
    line-height: 36px;
    padding: 24px 0;
}

.keeper-one-right ul {
    counter-reset: rank;
}

.keeper-one-right li {
    border-bottom: 1px dashed #e5e5e5;
    height: 63px;
    font-size: 16px;
    color: #999;
    display: flex;
    align-items: center;
    counter-increment: rank;
    position: relative;
}

.keeper-one-right li:last-of-type {
    border-bottom: none;
}

.keeper-oner-li1 {
    width: 185px;
    box-sizing: border-box;
    padding-left: 60px;
}

.keeper-oner-li2 {
    width: 165px;
}

.keeper-one-right li::before {
    content: counter(rank);
    position: absolute;
    z-index: 1;
    width: 32px;
    height: 40px;
    left: 10px;
    top: 12px;
    text-align: center;
    font-size: 28px;
    font-weight: bold;
    font-style: italic;
}

.keeper-one-right ul li:nth-child(1)::before {
    background: url(../images/keeper/keeper-oner-li01.png);
    font-size: 0;
}

.keeper-one-right ul li:nth-child(2)::before {
    background-image: url(../images/keeper/keeper-oner-li02.png);
    font-size: 0;
}

.keeper-one-right ul li:nth-child(3)::before {
    background-image: url(../images/keeper/keeper-oner-li03.png);
    font-size: 0;
}

/*  */

.keeper-main-nr {
    background: #f5f5f5;
    padding: 60px 0 50px;
}

.keeper-nr-ul {
    display: flex;
    justify-content: space-around;
    margin-top: 50px;
}

.keeper-nr-ul li {
    width: 305px;
    height: 170px;
    margin: 0 -1px;
}

.keeper-nr-ul li .keeper-nr-li01 {
    border: 1px solid #e5e5e5;
    height: 100%;
    padding-top: 30px;
    box-sizing: border-box;
    background: #fff;
}

.keeper-nr-ul li:hover .keeper-nr-li01 {
    display: none;
}

.keeper-nr01-title {
    font-size: 18px;
    margin-top: 18px;
    text-align: center;
}

.keeper-nr-ul li .keeper-nr-li02 {
    background: #20b09f;
    height: 100%;
    color: #fff;
    display: none;
}

.keeper-nr-ul li:hover .keeper-nr-li02 {
    display: block;
}

.keeper-nr02-title {
    font-size: 18px;
    text-align: center;
    line-height: 50px;
    padding-top: 10px;
}

.keeper-nr02-intro {
    font-size: 14px;
    line-height: 24px;
    padding: 0 18px;
    text-align: justify;
}

/*  */

.keeper-main-lc {
    padding: 60px 0 70px;
}

.keeper-lc-box {
    height: 313px;
    background: url(../images/keeper/keeper-lc-bg.png) no-repeat center;
    margin-top: 30px;
}

.keeper-lc-box {
    position: relative;
}

.keeper-lc-box li {
    width: 170px;
    position: absolute;
    color: #fff;
}

.keeper-lc-box li span {
    width: 20px;
    height: 2px;
    background: #fff;
    display: block;
    margin: 10px auto;
}

.keeper-lc-title {
    font-size: 16px;
    text-align: center;
}

.keeper-lc-intro {
    font-size: 14px;
    line-height: 24px;
    padding: 0 20px;
    text-align: justify;
}

.keeper-lc-box li.keeper-lc-li01 {
    top: 146px;
}

.keeper-lc-box li.keeper-lc-li02 {
    top: 66px;
    left: 258px;
}

.keeper-lc-box li.keeper-lc-li03 {
    top: 146px;
    left: 516px;
}

.keeper-lc-box li.keeper-lc-li04 {
    top: 62px;
    left: 770px;
}

.keeper-lc-box li.keeper-lc-li05 {
    top: 146px;
    left: 1028px;
}

/*  */

.keeper-main-contact {
    padding: 60px 0;
    background: #f5f5f5;
}

.keeper-contact-form {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 50px;
    border-top: 2px solid #1fb09f;
    padding: 60px;
}

.keeper-contact-form .img-block {
    width: 500px;
}

.keeper-contact-form form {
    width: 580px;
    box-sizing: border-box;
    padding-left: 80px;
}

.keeper-contact-form .form-item {
    display: flex;
    margin-bottom: 40px;
}

.keeper-contact-form .form-item label {
    font-size: 16px;
    color: #666;
    width: 72px;
    text-align: right;
    line-height: 40px;
}

.keeper-contact-form .form-item .form-input {
    width: 260px;
    height: 40px;
    border: 1px solid #e5e5e5;
}

.keeper-contact-form .form-item .form-input.form-verify {
    width: 180px;
}

.keeper-contact-form .form-item .verify-pic {
    width: 70px;
    height: 40px;
    border: 1px solid #e5e5e5;
    margin-left: 8px;
}

.keeper-contact-form .form-item .verify-pic img {
    width: 100%;
    height: 100%;
}

.keeper-form-btn {
    width: 180px;
    height: 40px;
    background: #1fb09f;
    color: #fff;
    font-size: 18px;
    text-align: center;
    line-height: 40px;
    margin-left: 72px;
}

/* 售前 */

.shouqian .main-banner {
    background: url(../images/keeper/shouqian_banner.png) center no-repeat;
}

.shouqian .keep-nav-item.cur {
    background: url(../images/keeper/shouqian_keeper-nav-bg02.png) no-repeat center;
    color: #fff;
    padding-right: 7px;
    z-index: 1;
    margin: 0 -8px 0 0;
}

.shouqian .keeper-one-left {
    padding-top: 31px;
}

.shouqian .keeper-one-left ul {
    width: 800px;
    margin-top: 45px;
}

.shouqian .keeper-one-left ul li {
    width: 800px;
    height: 146px;
    border: 1px solid #e5e5e5;
    margin-top: 19px;
}

.shouqian .keeper-one-left ul li .middle {
    width: 100%;
    height: 72px;
    margin-top: 38px;
}

.shouqian .keeper-one-left ul li .middle .l {
    width: 301px;
    height: 72px;
    border-right: 1px dashed #e5e5e5;
    float: left;
    position: relative;
}

.shouqian .keeper-one-left ul li .middle .r {
    width: 498px;
    height: 72px;
    float: left;
}

.shouqian .keeper-one-left ul li .middle .r p {
    font-size: 14px;
    color: #666;
    margin: 8px 40px 0 40px;
    line-height: 26px;
}

.shouqian .keeper-one-left ul li .middle .l img {
    margin-left: 40px;
    float: left;
}

.shouqian .keeper-one-left ul li .middle .l p {
    font-size: 20px;
    color: #20b09f;
    line-height: 72px;
    font-weight: bold;
    float: left;
    margin-left: 20px;
}

.shouqian .keeper-main-nr img {
    display: block;
    margin: 32px auto 0;
}

.shouqian .keeper-main-nr {
    background: #fff;
}

.shouqian .keeper-main-lc {
    background: #f9f9f9;
}

.shouqian .keeper-main-lc .shouqin_liucheng {
    width: 100%;
    height: 242px;
    margin-top: 28px;
    background: url(../images/keeper/shouqian_liucheng_beijing.png) no-repeat center;
}

.shouqian .keeper-main-ys {
    padding: 60px 0 70px;
    background: #fff;
}

.shouqian .keeper-main-ys .shouqin_youshi {
    width: 100%;
    display: flex;
    margin-top: 40px;
}

.shouqian .keeper-main-ys .shouqin_youshi li {
    flex: 1;
    margin-right: 20px;
    border: 1px solid #e7e7e7;
    height: 338px;
    position: relative;
}

.shouqian .keeper-main-ys .shouqin_youshi li:last-child {
    margin-right: 0;
}

.shouqian .keeper-main-ys .shouqin_youshi li img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 97px;
    right: 0;
    margin: auto;
}

.shouqian .keeper-main-ys .shouqin_youshi li p {
    font-size: 14px;
    color: #666;
    text-align: center;
    margin: 230px 48px 0 48px;
}

.shouqian .keeper-one-left ul li .middle .l .ico {
    margin-left: 40px;
    float: left;
    box-sizing: border-box;
    width: 73px;
    height: 73px;
    border: 2px solid #20B09F;
    border-radius: 50%;
    text-align: center;
    line-height: 69px;
    font-size: 34px;
    color: #20B09F;
    font-family: Arial;
}

/* 售中 */

.shouzhong .main-banner {
    height: 314px;
    position: relative;
    background: url(../images/keeper/sz_banner.png) center no-repeat;
}

.shouzhong .keep-nav-item.cur {
    background: url(../images/keeper/sz_beijing_img.png) no-repeat center;
    color: #fff;
    padding-right: 7px;
    z-index: 1;
    margin: 0 -8px 0 0;
}

.shouzhong .keeper-one-left {
    width: 800px;
    border: 1px solid #e5e5e5;
    padding-top: 59px;
}

.shouzhong .keeper-one-left img {
    display: block;
    margin: 72px auto 0;
}

.shouzhong .keeper-one-left .character {
    padding-top: 20px;
}

.shouzhong .keeper-one-left .character p {
    font-size: 16px;
    color: #666666;
    line-height: 28px;
    margin: 0 49px 0 49px;
    text-indent: 35px;
    margin-top: 12px;
}

.shouzhong .metals_two_ul {
    width: 1132px;
    height: 305px;
    margin-left: 26px;
    margin-top: 40px;
    display: flex;
}

.shouzhong .metals_two_ul li {
    flex: 1;
    height: 305px;
    margin-right: 18px;
}

.shouzhong .metals_two_ul li:last-child {
    margin-right: 0;
}

.shouzhong .boxF, .boxS, .boxT {
    width: 100%;
    height: 305px;
}

.shouzhong .boxF, .boxS {
    visibility: hidden;
}

.shouzhong .boxF {
    transform: rotate(120deg);
    float: left;
    margin-left: 10px;
}

.shouzhong .boxS {
    transform: rotate(-60deg);
}

.shouzhong .boxT {
    transform: rotate(-60deg);
    background: no-repeat 50% center;
    background-size: 125% auto;
    visibility: visible;
}

.shouzhong .metals_two_ul li:nth-child(1) .boxT {
    background: url(../../home/images/keeper/sz_two_1.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(2) .boxT {
    background: url(../../home/images/keeper/sz_two_2.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(3) .boxT {
    background: url(../../home/images/keeper/sz_two_3.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(4) .boxT {
    background: url(../../home/images/keeper/sz_two_4.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(5) .boxT {
    background: url(../../home/images/keeper/sz_two_5.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(1) .boxT_one {
    height: 305px;
    position: relative;
    overflow: hidden;
    background: url(../../home/images/keeper/sz_one_1.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(2) .boxT_one {
    height: 305px;
    position: relative;
    overflow: hidden;
    background: url(../../home/images/keeper/sz_one_2.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(3) .boxT_one {
    height: 305px;
    position: relative;
    overflow: hidden;
    background: url(../../home/images/keeper/sz_one_3.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(4) .boxT_one {
    height: 305px;
    position: relative;
    overflow: hidden;
    background: url(../../home/images/keeper/sz_one_4.png) no-repeat center;
}

.shouzhong .metals_two_ul li:nth-child(5) .boxT_one {
    height: 305px;
    position: relative;
    overflow: hidden;
    background: url(../../home/images/keeper/sz_one_5.png) no-repeat center;
}

.shouzhong .boxT_one img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 74px;
    margin: auto;
}

.shouzhong .thick {
    width: 22px;
    height: 2px;
    background: #fff;
    margin: 148px auto 0;
}

.shouzhong .boxT_one p {
    font-size: 18px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    margin-top: 18px;
}

.shouzhong .boxT_two {
    height: 305px;
    overflow: hidden;
    /* background-color:rgba(33, 220, 199, 0.4); */
    transition: background-color .3s ease-in;
    display: none;
}

.shouzhong .boxT_two_title {
    font-size: 18px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    margin-top: 79px;
}

.shouzhong .boxT_two_text {
    font-size: 12px;
    color: #fff;
    margin: 18px 28px 0 28px;
    line-height: 25px;
}

/* .boxT_one:hover{
    display: none;
} */

.shouzhong .metals_two_ul li:hover .boxT_one {
    display: none;
}

.shouzhong .metals_two_ul li:hover .boxT_two {
    display: block;
    /* transition: background-color .3s ease-in; */
}

.shouzhong .keeper-main-lc .beijing_box {
    width: 100%;
    height: 372px;
    margin-top: 78px;
    background: url(../images/keeper/sz_beijing_1.png) no-repeat center;
}

.shouzhong .keeper-main-lc .beijing_box ul.one {
    width: 1180px;
    margin: auto;
    display: flex;
}

.shouzhong .keeper-main-lc .beijing_box ul.one li {
    flex: 1;
    margin-top: 49px;
    margin-right: 95px;
}

.shouzhong .keeper-main-lc .beijing_box ul.one li:last-child {
    margin-right: 0;
}

.shouzhong .keeper-main-lc .beijing_box ul.one li .title {
    text-align: center;
    color: #fff;
    font-size: 16px;
}

.shouzhong .keeper-main-lc .beijing_box ul.one li .txt {
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    margin: 10px 24px 0 24px;
}

.shouzhong .keeper-main-lc .beijing_box ul.two {
    width: 925px;
    margin: 46px auto 0;
    display: flex;
}

.shouzhong .keeper-main-lc .beijing_box ul.two li {
    flex: 1;
    margin-top: 49px;
    margin-right: 95px;
}

.shouzhong .keeper-main-lc .beijing_box ul.two li:last-child {
    margin-right: 0;
}

.shouzhong .keeper-main-lc .beijing_box ul.two li .title {
    text-align: center;
    color: #fff;
    font-size: 16px;
}

.shouzhong .keeper-main-lc .beijing_box ul.two li .txt {
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    margin: 10px 24px 0 24px;
}

.keeper-main-ds {
    padding: 60px 0 70px;
}

.keeper-main-ds .flex-row {
    margin-top: 44px;
    justify-content: space-between;
}

.keeper-main-ds .item {
    height: 224px;
    margin: 0;
    flex: 1;
    margin-left: -1px;
    position: relative;
    border: 1px solid #eee;
    transition: all .3s ease;
}

.keeper-main-ds .item:hover {
    z-index: 1;
    border-color: #20B09F;
}

.keeper-main-ds .section_d:hover .img-a {
    display: none;
}

.keeper-main-ds .section_d:hover .img-b {
    display: block;
}

.keeper-main-ds .section_d img {
    transition: all .3s ease;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.keeper-main-ds .section_d .img-b {
    display: none;
}

.keeper-main-ds .img-block_p {
    text-align: center;
    font-size: 15px;
    color: #666;
    margin-top: 147px;
    margin: 147px 45px 0 45px;
    line-height: 26px;
}

.keeper-main-ds .section_div {
    width: 22px;
    height: 2px;
    margin: 10px auto 0;
    background: #999;
}

.keeper-main-ds .section_text {
    color: #999;
    font-size: 14px;
    margin: 14px 22px 0 22px;
    line-height: 23px;
}