body{min-width: 1903px}
nav {width: 90%; min-width: 1200px; height: 70px;position: absolute;left: 50%;top: 0;z-index: 10;transform: translate(-50%,0);}
nav .logo {width: 150px;height: 40px;float: left;margin-top: 15px;cursor: pointer;}
nav .cont {float: right;margin-top: 22px;}
nav .cont .list {float: left;margin-left: 50px;font-size: 18px;color: #FFFFFF;padding-bottom: 3px;}
nav .cont a {text-decoration: none;}
nav .cont .active {border-bottom: 3px solid #fff;}
nav .cont .list:hover {border-bottom: 3px solid #fff;}
.cpDet{ background: rgba(255,255,255,.70); position: absolute; top: 31px; left: 86px; width: 138px; height: 220px; text-align: center; padding: 13px 0 22px; border-radius: 4px; }
.cpDet a { margin-top: 12px; font-size: 16px; color: #333; }
.banner { }
.banner .swiper-container {width: 100%;}
.banner .swiper-container img {width: 100%;height: auto;display: block;}

.indexCont {width: 100%;padding-top: 1px;}
.indexCont .title {position: relative;text-align: center;width: 100%;font-size: 36px;color: #384439;margin: 40px 0 30px 0;}
.indexCont .title img {position: absolute;width: auto;height: auto;left: 50%;margin-left: -50px;bottom: 10px;z-index: -1;}
.indexCont h1 {font-size: 16px;color: #6A6A70;letter-spacing: 0.12px;text-align: center;}
.product {width: 1585px;margin: 70px auto 125px;}
.product li {width: 370px;height: 305px;float: left;margin-right:35px;text-align: center;background: #fff;box-shadow: 0 4px 18px 0 rgba(0,0,0,0.06);position: relative;}
.product li:hover .box {opacity: 0;transition: .5s;}
.product li:hover .boxSelect {opacity: 1;transition: .5s;}
.product li:nth-child(4) {margin-right:0;}
.product li .img {width: 100%;height: 190px;position: relative;}
.product li .img .bg {width: 100%;height: 100%;}
.product li .img .icon {width: 100%;height: 100%;background: rgba(0,0,0,.7);position: absolute;left: 0;top: 0;}
.product li .img .icon img {width: 58px;height: 58px;margin: 70px auto 0;}
.product h6 {font-size: 26px;color: #5D5D64;padding-top: 5px;}
.product h5 {font-size: 18px;color: #9C9C9C;}
.product .hr {border: 2px solid #19AC6D;width: 27px;margin: 6px auto 12px;}
.product h4 {font-size: 26px;color: #5D5D64;padding-top: 40px;padding-bottom: 10px;}
.product h3 {font-size: 18px;color: #9C9C9C;text-align: left;}
.product .boxSelect {padding: 0 48px;opacity: 0;position: absolute;left: 0;top: 0;}
.product .boxSelect .hr {margin: 18px auto 18px 2px;}

.course {width: 1674px;margin: 75px auto 110px;height: 470px;padding: 10px 6px;overflow: hidden;}
.course li {width: 350px;float: left;height: 450px;border-right: 3px solid #E4E4E4;border-top: 3px solid #E4E4E4;border-bottom: 3px solid #E4E4E4;text-align: center;position: relative;}
.course li:nth-child(1) {border-left: 3px solid #E4E4E4;}
.course li .boxSelect {text-align: left;padding: 75px 50px 0;opacity:0;position: absolute;left: 0;top: 0;}
.course li .box {opacity:1;}
.course li h1 {font-size: 24px;color: #72727A;padding-top: 160px;}
.course li .hr {border: 1px solid #979797;width: 57px;margin: 19px auto 35px;}
.course li h2 {font-size: 20px;color: #B2B2BA;}

.course .active {width: 620px;height: 470px;border: 3px solid #19AC6D;box-shadow: 0 2px 17px 0 rgba(45,85,68,0.53);background: #fff;margin: -10px -5px 0;z-index: 1;}
.course .active:first-child {border-left: 3px solid #19AC6D;}
.course .active .box {opacity:0;}
.course .active .boxSelect {opacity: 1;transition: all .6s linear;}
.course .active h6 {font-size: 36px;color: #5D5D64;}
.course .active h6 img {width: 58px;height: 58px;vertical-align: middle;display: inline-block;margin: -6px 20px 0 0;}
.course .active h5 {font-size: 24px;color: #6A6A70;letter-spacing: 0.18px;text-align: justify;line-height: 39px;}
.course .active .hr {border: 1px solid #979797;width: 100%;margin: 35px 0 45px;}

.trendsBox {width: 100%;position: relative;}
.trendsBox .img {width: 100%;position: relative;z-index: -2;}
.trendsCont .title {position: absolute;left: 0;top: 0;color: #fff;font-size: 36px;margin-top: 80px;}

.trends {width: 1200px;margin: -180px auto 15px;}
.trends li {background: #FFFFFF;box-shadow: 0 4px 13px 0 rgba(0,0,0,0.20);width: 360px;height: 465px;margin-right: 60px;float: left;}
.trends li:nth-child(3) {margin-right: 0;}
.trends li img {height: 290px;}
.trends li h6 {width: 100%;font-size: 20px;color: #2B3E51;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;padding: 15px 10px 10px 10px;}
.trends li h5 {width: 100%;font-size: 16px;color: #666666;letter-spacing: 0.12px;line-height: 26px;padding: 0 10px;}

.companion {width: 1660px;padding: 80px 0 40px;margin: 0 auto;}
.companion li {width: 320px;height: 135px;float: left;margin-right: 15px;margin-bottom: 60px;}
.companion li img {width: 100%;height: 100%;}
.companion li:nth-child(5n) {margin-right: 0;}

footer {width: 100%;padding: 30px 0 10px;background: #222;}
footer ul {width: 1200px;margin: 0 auto;position: relative;}
footer ul li {font-size: 16px;color: #FFFFFF;line-height: 28px;margin-bottom: 16px;}
footer .ypwk {width: 88px;height: 55px;background: url("../image/pc/ypwklogo.png");background-size: 100% 100%;position: absolute;top: 0;right: 0;}
footer .zbj {width: 88px;height: 45px;background: url("../image/pc/zbjlogo.png");background-size: 100% 100%;position: absolute;bottom: 0;right: 0;}
.tail {font-size: 16px;color: #7A7D83;text-align: center;width: 100%;line-height: 70px;background: #161616;}

.solidArrow{width:0;height:0;border-top:17px solid transparent;border-left:24px solid #19AC6D;border-bottom:17px solid transparent;position: absolute;right: -19px;top: 50%;
transform: translateY(-50%);}
.contact {position: fixed;right: 90px;bottom: 150px;z-index: 100;}
.contact a {width: 70px;height: 70px;background: rgba(34,34,34,.8);border-radius: 50%;margin-bottom: 20px;position: relative;padding-top: 15px;}
.contact a:hover {background: #19AC6D;}
.contact a:hover div {display: block;}
.contact a .icon {width: 40px;height: 40px;display: block;margin: 0 auto;}
.contact a div {background: #19AC6D;border-radius: 4px;position: absolute;right: 105px;top: 50%;transform: translateY(-50%);font-size: 18px;color: #FFFFFF;letter-spacing: 0;
display: none;}
.contact a .phone {padding: 20px 35px;white-space: nowrap;text-align: right;line-height: 35px;}
.contact a .qq {padding: 15px 45px;white-space: nowrap;}
.contact a .wx {padding: 13px;}
.contact a .wx .ewm {width: 240px;height: auto;}

.plan {width: 1200px;margin: 40px auto 0;}
.plan li {width: 380px;float: left;margin-right: 30px;}
.plan li:nth-child(3) {margin-right: 0;}
.plan li .img {width: 100%;height: 270px;overflow: hidden;margin-bottom: 60px;}
.plan .cont {width: 100%;height: 225px;}
.plan .cont h6 {font-size: 20px;color: #384439;font-weight: 600;}
.plan .cont .hr {width: 100%;background: #CCCCCC;height: 1px;margin: 9px 0 30px;}
.plan .cont h5 {font-size: 16px;color: #666666;letter-spacing: 0.12px;}

.guide_bg {width: 100%;position: relative;height: 600px;}
.guide_bg img {height: 600px;}
.guide {width: 1200px;position: absolute;left: 50%;margin-left: -600px;top: 0;padding-top: 100px;height: 100%;}
.guide h6 {font-size: 20px;color: #FFFFFF;padding-bottom: 12px;}
.guide h5 {font-size: 16px;color: #FFFFFF;letter-spacing: 0.12px;padding-bottom: 40px;}

.client {width: 1435px;margin: 60px auto 80px;}
.client li {width: 270px;float: left;height: 90px;margin-right: 20px;margin-bottom: 40px;}
.client li:nth-child(4n) {margin-right: 0;}
.client li img {width: 100%;height: 100%;}

.about {width: 100%;position: relative;height: 580px;margin: 120px 0 80px;}
.about_bg {width: 950px;height: 580px;float: right;position: relative;}
.about_bg img {width: 100%;height: 100%;}
.about .cont {position: absolute;left: 50%;top: 120px;margin-left:-600px;width: 480px;}
.about .cont h1 {font-size: 36px;color: #384439;}
.about .cont .hr {width: 100px;height: 2px;background: #19AC6D;margin: 10px 0 30px;}
.about .cont h2 {font-size: 16px;color: #666666;letter-spacing: 0.12px;line-height: 30px;}
.video {width: 590px;height: 390px;position: absolute;left: 0;top: 100px;}

.join {width: 1200px;margin: 40px auto 60px;}
.join li {width: 580px;height: 700px;float: left;background: #fff;padding: 0 25px;position: relative;margin-right: 40px;}
.join h6 {font-size: 22px;color: #19AC6D;letter-spacing: 0.17px;text-align: center;padding-top: 30px;}
.join h5 {font-size: 22px;color: #6C6C6C;letter-spacing: 0.17px;text-align: center;}
.join h4 {font-size: 16px;color: #666666;letter-spacing: 0.12px;line-height: 30px;padding-right: 30px;padding-top: 40px;}
.join h3 {width: 530px;font-size: 16px;color: #6C6C6C;letter-spacing: 0.12px;position: absolute;left: 25px;bottom: 0;height: 115px;padding-top: 30px;border-top: 1px solid #e4e4e4;}
.join h3 span {color: #19AC6D;}

.inspiration {width: 100%;margin: 40px 0 60px;}
.inspiration li {width: 25%;float: left;}
.inspiration .active {width: 50%;}
.inspiration li .swiper-container {width: 100%;height: 100%;}
.inspiration li img {width: 100%;height: 100%;}

.dynamic {width: 100%;padding: 65px 0 70px;background: #f9f9f9;}
.dynamic .cont {width: 1200px;margin: 0 auto;padding: 65px 50px 35px;background: #fff;}
.dynamic .cont h1 {font-size: 24px;color: #384439;letter-spacing: 0.18px;text-align: center;padding-bottom: 15px;}
.dynamic .cont p {font-size: 16px;color: #666666;letter-spacing: 0.12px;padding-bottom: 25px;}
.dynamic .cont img {width: 640px;display: block;margin: 0 auto 50px;}
