@CHARSET "UTF-8";
/*ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â§ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â§ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¯ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¥ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¹ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€šÃ‚Â ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â§ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â³ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â»ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â§ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â»ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¸ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¤ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â»ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¹ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â§ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â»ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â*/




/*new*/
.banner{
    background: url('../images/matting/greenbackground1.png') no-repeat top center;
}

.banner_title {
    margin-top: 179px;
    font-size: 50px;
    font-weight: 100;
    /* font-weight: bold; */
}
.banner_desc {
    margin-top: 31px;
}
.banner_desc p:first-child {
    margin-bottom: 0px;
    font-size: 23px;
    color: #ffffff;
}
.banner_desc p {
    line-height: 28px;
    font-size: 23px;
    height: 50px;
}
p {
    /* height: 60px; */
}

.banner_input p {
    height: 60px;
    line-height: 60px;
    color: #009cff;
    font-size: 24px;
    border-radius: 10px;
}

.banner_input {
    margin-top: 64px;
}

.banner_right {
    background: url(../images/matting/greenbackground3.png);
    width: 592px;
    /* padding-left: 12px; */
    /* padding-top: 50px; */
    /* padding-right: 30px; */
    /* padding-bottom: 12px; */
    height: 482px;
    width: 290px;
    height: 571px;
    position: absolute;
    right: 155px;
    top: 100px;
}
img.banner_right_p {
    position: absolute;
    left: 0;
    bottom: 0;
}

.banner_bg {
    height: 537px;
    width: 270px;
    background: url(../images/greenbg/ccb.png);
    border-radius: 25px;
    z-index: 1;
    position: absolute;
    top: 16px;
    left: 9px;
    overflow: hidden;
}
.banner .slide1 .banner_con {
    position: relative;
}
img.banner_right_b.show {
    /* display: block; */
    visibility: visible;
    opacity: 1;
    /* transition: 1s; */
}

img.banner_right_b {
    position: absolute;
    transition: 1s;
    /* opacity: 0; */
    /* visibility: hidden; */
    /* display: none; */
    bottom: 0px;
    user-select: none;
    -webkit-user-drag: none;
}

.mokuai_c {
    width: 100%;
}

.mokuai {
    width: 1200px;
    margin: 0px auto;
}

img.mokuai_t1_l {
    display: inline-block;
    position: relative;
    top: -27px;
    left: -5px;
}

.mokuai_t1 p {
    font-size: 45px;
    display: inline-block;
    line-height: 74px;
}
.mokuai_t1 {
    text-align: center;
    position: relative;
    width: 1200px;
    height: 74px;
}

img.mokuai_t1_r {
    display: inline-block;
    position: relative;
    bottom: 2px;
    right: -4px;
}
.tese {
    height: 788px;
    background: url(../images/matting/c11.png) no-repeat center 74px;
    margin-top: 87px;
}
.tese_c {margin-left: 710px;margin-top: 120px;}

.tese_c_1 {
    display: flex;
    margin-bottom: 48px;
}

.tese_c_1_1 {
    width: 76px;
    height: 76px;
    margin-right: 20px;
}

p.tese_c_1_2_1 {
    font-size: 23px;
    color: #333333;
}

p.tese_c_1_2_2 {
    font-size: 16px;
    color: #333333;
    margin-top: 15px;
}

.mokuai_t2 {
    text-align: center;
    margin-top: 30px;
}

.mokuai_t2 p {
    line-height: 37px;
    font-size: 20px;
}

.aik2 {
    height: 868px;
    background: linear-gradient(to bottom,#ffffff,#eefef9);
}

.aik2 .mokuai {
    overflow: hidden;
    height: 868px;
    background: url(../images/matting/c2b.png) no-repeat center bottom;
    position: relative;
}
.aik2_1 {
    position: absolute;
    width: 169px;
    height: 169px;
    /* overflow: hidden; */
    /* border-radius: 165px; */
    /* border: 3px solid #009cff; */
}

.aik2_1 p {
    position: absolute;
    width: 165px;
    height: 45px;
    line-height: 31px;
    bottom: 0;
    text-align: center;
    color: #fff;
    background: #009cff;
    font-size: 17px;
}

.aik2_1.ak1 {
    left: 42px;
    top: 117px;
}

.aik2_1_1 {
    width: 165px;
    height: 165px;
    overflow: hidden;
    border-radius: 165px;
    border: 2px solid #009cff;
    position: absolute;
}

.kline {}

.kline {
    position: absolute;
    background: #009cff;
    /* height: 600px; */
    width: 2px;
    left: 85px;
    top: 165px;
}

.kball {
    width: 8px;
    height: 8px;
    background: #009cff;
    border-radius: 8px;
    position: absolute;
    /* top: 200px; */
    left: 82px;
}

.aik2_1.ak2 {
    left: 364px;
    top: 31px;
}

.aik2_1.ak3 {
    left: 660px;
    top: 93px;
}

.aik2_1.ak4 {
    left: 990px;
    top: 73px;
}

.ak1 .kline {
    height: 84px;
}

.ak1 .kball {
    top: 244px;
}
.ak2 .kline {
    height: 145px;
}

.ak2 .kball {
    top: 305px;
}
.ak3 .kline {
    height: 237px;
}

.ak3 .kball {
    top: 402px;
}
.ak4 .kline {
    height: 219px;
}

.ak4 .kball {
    top: 379px;
}






.aik3.mokuai_c {
    width: 100%;
    height: 790px;
    overflow: hidden;
    background: #f3fafe;
}

.mokuai {
    width: 1200px;
    margin: 0px auto;
}

img.mokuai_t1_l {
    display: inline-block;
    position: relative;
    top: -27px;
    left: -5px;
}

.mokuai_t1 p {
    font-size: 45px;
    display: inline-block;
    line-height: 74px;
}
.mokuai_t1 {
    text-align: center;
    position: relative;
    width: 1200px;
    height: 74px;
}

img.mokuai_t1_r {
    display: inline-block;
    position: relative;
    bottom: 2px;
    right: -4px;
}
.tese {
    height: 788px;
    background: url(../images/matting/c11.png) no-repeat center 74px;
    margin-top: 87px;
}
.tese_c {margin-left: 710px;margin-top: 120px;}

.tese_c_1 {
    display: flex;
    margin-bottom: 48px;
}

.tese_c_1_1 {
    width: 76px;
    height: 76px;
    margin-right: 20px;
}

p.tese_c_1_2_1 {
    font-size: 23px;
    color: #333333;
}

p.tese_c_1_2_2 {
    font-size: 16px;
    color: #333333;
    margin-top: 15px;
}

.mokuai_t2 {
    text-align: center;
    margin-top: 30px;
}

.mokuai_t2 p {
    line-height: 37px;
    font-size: 20px;
}

.aik2 {
    height: 868px;
    background: linear-gradient(to bottom,#ffffff,#eefef9);
}

.aik2 .mokuai {
    overflow: hidden;
    height: 868px;
    background: url(../images/matting/c2b.png) no-repeat center bottom;
    position: relative;
}
.aik2_1 {
    position: absolute;
    width: 169px;
    height: 169px;
    /* overflow: hidden; */
    /* border-radius: 165px; */
    /* border: 3px solid #009cff; */
}

.aik2_1 p {
    position: absolute;
    width: 165px;
    height: 45px;
    line-height: 31px;
    bottom: 0;
    text-align: center;
    color: #fff;
    background: #009cff;
    font-size: 17px;
    transition: 1s;
}

.aik2_1.ak1 {
    left: 42px;
    top: 117px;
}

.aik2_1_1 {
    width: 165px;
    height: 165px;
    overflow: hidden;
    border-radius: 165px;
    border: 2px solid #009cff;
    position: absolute;
    transition: 1s;
}

.kline {}

.kline {
    position: absolute;
    background: #009cff;
    /* height: 600px; */
    width: 2px;
    left: 85px;
    top: 165px;
    transition: 1s;
}

.kball {
    width: 8px;
    height: 8px;
    background: #009cff;
    border-radius: 8px;
    position: absolute;
    /* top: 200px; */
    left: 82px;
    transition: 1s;
}

.aik2_1.ak2 {
    left: 364px;
    top: 31px;
}

.aik2_1.ak3 {
    left: 660px;
    top: 93px;
}

.aik2_1.ak4 {
    left: 990px;
    top: 73px;
}



 .aik3 .mokuai {
    display: flex;
    justify-content: space-between;
}

.ca1 {
    width: 590px;
    padding-top: 185px;
}

.ca2 {
    /* width: 500px; */
    margin-left: 12px;
    margin-right: 12px;
    /* height: 568px; */
    background: url(../images/matting/ccb.png);
    /* background: none; */
    /* position: relative; */
    border-radius: 123px;
    /* overflow: hidden; */
    margin-top: 193px;
}

p.ca1_1 {
    font-size: 40px;
}

.ca1_1 span {
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    background-image: linear-gradient(to top right, white, #ffd563);
    font-size: 95px;
    color: #009cff;
    font-family: fantasy;
}

p.ca1_2 {
    font-size: 22px;
    line-height: 40px;
    margin-top: 40px;
}

.ca1_1_3 {
    display: flex;
    justify-content: space-between;
    padding-top: 110px;
}

.ca1_1_3_c p {
    font-size: 22px;
    text-align: center;
    padding-top: 11px;
}

.ca1_1_3_c div {
    width: 170px;
    height: 205px;
    border-radius: 10px;
    /* background: #888; */
}

.ca1_1_3_1 div {
    background: url(../images/matting/c311.png);
    background-size: 100% 100%;
}

.ca1_1_3_2 div {
    background: url(../images/matting/c312.png);
    background-size: 100% 100%;
}

.ca1_1_3_3 div {
    background: url(../images/matting/c313.png);
    background-size: 100% 100%;
}
.ca2_bg {
    width: 268px;
    height: 595px;
    position: absolute;
    transition: background 1s;
    background: url(../images/matting/c311.png);
}

img.ca2_p {
    position: absolute;
    z-index: 1;
    /* left: 0; */
    bottom: 0;
    right: 0;
}
.ca2_bg_line {
    height: 595px;
    background: #fff;
    width: 2px;
    z-index: 200;
    right: 0px;
    position: absolute;
}

.ca2_bg_line img {
    position: absolute;
    left: -11px;
    top: 272px;
    width: 24px;
    user-select: none;
    -webkit-user-drag: none;
}
.aik3 .ca2 {
    box-shadow: 142px -165px 0px -108px #daf0fe;
}

.aik4 .ca2 {
    box-shadow: -142px -165px 0px -108px #daf0fe;
}

.aik4 .mokuai {
    display: flex;
    justify-content: space-between;
}

.ca2-rad {
    position: relative;
    background: #000;
    width: 500px;
    z-index: 1;
    height: 595px;
    background: url(../images/greenbg/ccb.png);
    border-radius: 15px;
    overflow: hidden;
    /* margin-top: 219px; */
}

.aik4 .ca2_bg {
    width: 500px;
    background: url(../images/matting/c321.png);
    background-size: 100% 100%
}

.aik4 .ca1_1_3_1 div {
    background: url(../images/matting/c321.png);
    background-size: 100% 100%;
}
.aik4 .ca1_1_3_2 div {
    background: url(../images/matting/c322.png);
    background-size: 100% 100%
}
.aik4 .ca1_1_3_3 div {
    background: url(../images/matting/c323.png);
    background-size: 100% 100%
}
.mokuai_c.cjing {
    margin-top: 145px;
    padding-top: 115px;
    background: linear-gradient(to top,#ffffff,#f1fefa);
}

.cjing_slide-m {display: flex;justify-content: space-around;height: 550px;overflow: hidden;}

.cjing_slide {
    margin-top: 60px;
}

.cjing_slide-left {
    line-height: 550px;
}

.cjing_slide-right {
    line-height: 550px;
    transform: rotate(180deg);
}
.cjing_slide-icon {
    display: flex;
    justify-content: center;
    text-align: center;
    margin-top: 33px;
    padding-bottom: 160px;
}

.cjing_slide-icon p {
    font-size: 20px;
    /* margin-top: 20px; */
    width: 170px;
    position: absolute;
    bottom: 0;
}

.cjing_slide-icon div {
    width: 170px;
    height: 160px;
    overflow: hidden;
    position: relative;
}



.cjing_slide-img {
    position: relative;
    width: 910px;
    height: 550px;
    overflow: hidden;
}
.cjing_slide-img p.cjing_slide-show{
    display: block!important;
    visibility: visible;
    opacity: 1;
}
.cjing_slide-img p {
    position: absolute;
    visibility: hidden;
    /* display: none; */
    transition: 1s;
    opacity: 0;
    width: 910px;
    height: 550px;
    overflow: hidden;
    border-radius: 20px;
    background: url(../images/matting/ccb.png);
}

.change_green{
    
}
.cjing_slide-icon div img {
    position: absolute;
    left: 30px;
    top: 0;
    transition: 1s;
}
.cjing_slide-icon div img:nth-child(1) {visibility: visible;opacity: 1;}

.cjing_slide-icon div img:nth-child(2) {
    visibility: hidden;
    opacity: 0;
}

.cjing_slide-icon .cjing_slideicon-show img:nth-child(1) {
    visibility: hidden;
    opacity: 0;
}

.cjing_slide-icon .cjing_slideicon-show img:nth-child(2) {
    visibility: visible;
    opacity: 1;
}

.cjing_slide-img p img {
    /* opacity: 0.6; */
    /* transition-delay: 0.5s; */
}

.cjing_slide-img p.cjing_slide-show img {
    /* opacity: 1; */
}
span.cjing_slide-img-1-bg {
    display: block;
    width: 552px;
    height: 550px;
    background: url(../images/matting/c41.png);
    /* border-right: 3px solid #fff; */
    position: relative;
}
button#cli_mov1 {
    background: none;
    border: none;
    position: absolute;
    right: -14px;
    top: 260px;
    z-index: 300;
}

img.cjing_slide-img-1-bg-btnimg {
    user-select: none;
    -webkit-user-drag: none;
}
img.cjing_slide-img-1-c {
    position: absolute;
    top: 22px;
    left: 328.5px;
    z-index: 2;
}
span.cjing_slide-img-1-bgline {
    position: absolute;
    right: 0;
    display: block;
    height: 550px;
    background: #fff;
    width: 2px;
    z-index: 29;
}
img.banner_right_b1 {
    position: absolute;
    bottom: 10px;
    left: 14px;
    user-select: none;
    -webkit-user-drag: none;
}

div#banner_ca2_bg {
    position: absolute;
    width: 180px;
    height: 537px;
    background: url(../images/matting/greenbackground3c1.png);
}

.banner_ca2_bg_line {
    position: absolute;
    width: 1px;
    height: 537px;
    right: 0px;
    background: #fff;
    z-index: 999;
}

button#banner_cli_mov {
    position: absolute;
    left: -8px;
    top: 265.5px;
    background: none;
    border: none;
}

.youshi_main {
    width: 1180px;
    display: flex;
    justify-content: space-between;
    padding-top: 105px;
    padding-bottom: 150px;
}

.youshi_main_div {
    width: 270px;
    height: 310px;
    border: 1px solid #009cff;
    border-radius: 15px;
    transition: 1s;
}

img.youshi_main_img {
    margin-top: 30px;
    margin-left: 20px;
}

p.youshi_main_p1 {
    padding-left: 20px;
    font-size: 23px;
    padding-top: 13px;
}

p.youshi_main_p2 {
    padding-left: 20px;
    padding-right: 20px;
    font-size: 14px;
    line-height: 27px;
    padding-top: 16px;
}

.youshi_main_div:nth-child(2n+1) {
    margin-top: 75px;
}

.youshi_main {}

.mokuai_c.youshi {
    padding-top: 118px;
}

.mokuai_c.aik1 {
    padding-top: 90px;
}

.mokuai_c.aik4 {
    background: #f3fafe;
    padding-bottom: 145px;
}
button#banner_cli_mov img {
    user-select: none;
    -webkit-user-drag: none;
}
.youshi_main_div:hover {
    box-shadow: 0px 0px 20px 0px #009cff5e;
}

.aik2_1:hover .aik2_1_1 {
    border-color: #ffba00;
}

.aik2_1:hover.aik2_1 p {
    background: #ffba00;
}

.aik2_1:hover .kline{
    background: #ffba00;
}
.aik2_1:hover .kball{
    background: #ffba00;
}
.aik2_1.ak1 {}