@charset "utf-8";
.banner{ position: relative; z-index: 0; overflow: hidden;max-height: 100vh;}
.banner .gp-img-responsive{ padding-bottom: 100vh;}
.banner .gp-img-responsive img{ min-height: 100vh;}
.banner .gp-img-responsive img{ animation: bannerImg 2.5s linear forwards; }
@keyframes bannerImg {
    0%{ transform: scale(1);}
    100%{ transform: scale(1.1);}
}
.banner .gp-img-responsive img:hover{ opacity: 1;}


/* 院庆新闻 */
.row1{ padding: 70px 0 60px; background: #f7f4e9 url(../images/row1_bg.png) no-repeat center top;}
.modeTil{ display: block; font-size: 58px;font-family: 'Noto Sans SC';line-height: 80px;overflow: hidden;
    padding-top: 88px;position: relative;text-align: center;}
.modeTil::before{ content: '';display: block;width: 100%;height: 80px;/* background: url(../images/modetil_icon.png) no-repeat center top; */
    position: absolute;left: 0%;top: 0;}
.til-line{ position: absolute; left: 50%;top: 0;transform: translateX(-50%); z-index: 1;font-size: 0;max-height: 81px;}
.til-line::before{ content: '';display: block;width: 1000px;height: 1px;background: #efcdac;
    position: absolute;right: calc(100% - 20px); bottom: 0; z-index: -1;}
.til-line::after{ content: '';display: block;width: 1000px;height: 1px;background: #efcdac;
    position: absolute;left: calc(100% - 35px); bottom: 0; z-index: -1;}
.modeTil > a{ display: inline-block; position: relative;z-index: 1;}
.modeTil > a span{
    background-image: -webkit-linear-gradient(90deg, #ba1001, #f59978);
    background-image: linear-gradient(90deg, #ba1001, #f59978);
    background-image: unset\9\0;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    background-image: none\0;
    background-image: none\9;
    color: #ba1001\0;
}
.modeTil > a span{ display: block; line-height: 1;}
.modeTil > a::before{ content: ''; display: block;width: 80px;height: 80px;border: 1px dashed #efcdac; border-radius: 50%;
    position: absolute;left: 50%;top: 50%;transform: translate3d(-50%,-50%,0);z-index: -1;}
.modeTil > a::after{ content: ''; display: block;width: 12px;height: 12px;background: #f26b02; border-radius: 50%;
    position: absolute;left: 50%;top: 50%;transform: translate3d(-50%,-50%,0);z-index: -1;}

/* hack */
@supports (-ms-high-contrast: none){
    .modeTil > a span{ background-image: none; color: #ba1001; background: unset;}
}
.ie10-11 .modeTil > a span{ background-image: none; color: #ba1001; background: unset;}

.row1 .modeCon{ margin-top: 26px;}
.row1 .date{ width: 70px; height: 70px; text-align: center; background: url(../images/new-date-bg.jpg) no-repeat center/cover;}
.row1 .day{ line-height: 1;font-family: 'Noto Serif SC';margin-top: 8px;}
.row1 .year{ line-height: 1; margin-top: 8px;}
.row1 .first{ width: 720px; flex-shrink: 0; position: relative;}
.row1 .first .info{ position: absolute; left: 0;bottom: 30px;z-index: 1; width: 100%;align-items: flex-end;}
.row1 .first .date{ flex-shrink: 0;}
.row1 .first .title{ flex: 1;padding-left: 35px;padding-right: 60px;line-height: 30px;margin-bottom: -5px;}
.row1 .first .gp-img-responsive{ padding-bottom: 62.5%; position: relative;}
.row1 .first:hover .gp-img-responsive img{ opacity: 1; transform: scale(1.03);}
.row1 .first .gp-img-responsive::before{ content: '';display: block;width: 100%;height: 130px;
    background-image: -moz-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    opacity: 0.66;position: absolute;left: 0;bottom: 0;z-index: 1;}
.row1 .second{ flex: 1; padding-left: 40px; margin: 0 -20px;}
.row1 .second a{ display: block;margin: 0 20px; background: #fff;transition: all 0.35s ease;}
.row1 .second a:hover{ transform: translateY(-8px);}
.row1 .second .gp-img-responsive{ padding-bottom: 62.33%;}
.row1 .second .info{position: relative; padding: 43px 30px 43px 20px;}
.row1 .second .date{ width: 60px; height: 60px; padding-top: 7px;position: absolute;left: 20px;top: 0;margin-top: -32px;}
.row1 .second .day{ margin: 0;}
.row1 .second .year{ margin-top: 5px;}
.row1 .second .title{ line-height: 30px;}
.row1 .second .summary{ line-height: 26px; color: #999;margin-top: 15px;}
.row1 .noImgUl{ margin: 0 -20px; padding-top: 40px;}
.row1 .noImgUl li{ padding-left: 20px; position: relative;}
.row1 .noImgUl a{ align-items: center;background: #fff; padding: 20px 0; box-sizing: border-box; margin: 0 20px;transition: all 0.35s ease;}
.row1 .noImgUl a:hover{ transform: translateY(-8px);}
.row1 .noImgUl .date{ margin-left: -20px;flex-shrink: 0;}
.row1 .noImgUl .title{ padding: 0 20px; line-height: 30px;flex: 1;}
.modeMore{ text-align: center;padding-top: 43px;}
.modeMore a{ display: inline-block;line-height: 50px;}
.modeMore a span{ position: relative;z-index: 1;color: #fff !important;margin-right: 5px;padding-right: 4px;line-height: 1;}
.modeMore a span::before{ content: '';display: block;width: 50px;height: 50px;border-radius: 50%;background: #ba1101;
    position: absolute;right: 0;top: 50%;transform: translateY(-50%);z-index: -1;}
.modeMore a span::after{ content: '';display: block;width: 130px;height: 50px;background: url(../images/modeMore-bg.png) no-repeat right center;
    position: absolute;right: 20px;top: 50%;transform: translateY(-50%);z-index: -2;transition: all 0.35s ease;}
.modeMore a:hover span::after{ right: 0; animation: more 0.8s ease forwards;}
@keyframes more {
    0%{ right: 20px;}
    25%{ right: 0px;}
    50%{ right: 8px;}
    70%{ right: 0px;}
    90%{ right: 3px;}
    100%{ right: 0px;}
}

/* 媒体聚焦 */
.row2{ padding: 55px 0 140px; background: url(../images/row2_bg.png) no-repeat; background-position: right 58%;}
.row2 .modeTil{ text-align: left;}
.row2 .til-line{ left: 0;transform: none;}
.row2 .til-line::before{ display: none;}
.row2 .til-line::after{ width: 1400px;}
.row2 .modeMore{ padding-top: 0; position: absolute;top: 43px;right: 0;z-index: 2;background: #fff;}
.row2 .modeMore::before{ content: '';display: block;width: 130px;height: 100%;background: #fff;position: absolute;right: 0;top: 0;z-index: -1;}
.row2 .modeCon{ padding-top: 42px;}
.row2 .modeCon ul{ margin: 0 -0.5px;}
.row2 .modeCon a{ flex-direction: column; margin: 0 0.5px;}
.row2 .modeCon li:nth-of-type(1) a{ align-items: flex-end;}
.row2 .modeCon li:nth-of-type(2) a{ flex-direction: column-reverse;}
.row2 .modeCon .tag{ display: block; width: 120px;height: 120px;flex-shrink: 0;position: relative;z-index: 1;padding: 20px;line-height: 1;}
.row2 .modeCon .tag::before{ content: '';display: block;width: 100%;height: 100%;background: url(../images/media-tag.png) no-repeat center/cover;position: absolute;left: 0;top: 0;z-index: -1;}
.row2 .modeCon li:nth-of-type(1) .tag,
.row2 .modeCon li:nth-of-type(1) .title{ background: #c01303;}
.row2 .modeCon li:nth-of-type(2) .tag,
.row2 .modeCon li:nth-of-type(2) .title{ background: #029aa5;}
.row2 .modeCon li:nth-of-type(2) .title{ margin-left: calc(100% - 240px);}
.row2 .modeCon li:nth-of-type(3) .tag,
.row2 .modeCon li:nth-of-type(3) .title{ background: #6739b6;}
.row2 .modeCon li:nth-of-type(1) .tag{ border-radius: 20px 20px 0 20px;}
.row2 .modeCon li:nth-of-type(2) .tag{ border-radius: 0 20px 20px 20px;}
.row2 .modeCon li:nth-of-type(3) .tag{ border-radius: 20px 20px 20px 0;}
.row2 .modeCon .tag span{ display: block; font-family: 'Arial';margin-bottom: 14px;}
.row2 .modeCon .gp-img-responsive{ padding-bottom: 66.52%;}
.row2 .modeCon .title{ max-width: 240px; min-height: 240px; padding: 24px 37px 30px 30px;line-height: 32px;}

/* 成长印记 */
.row3{position: relative; padding: 48px 0 0;/* background: url(../images/row3_bg.jpg) no-repeat center top/cover; */
    margin: 0 auto; z-index: 1; overflow: hidden;}
.row3::before{ content: '';display: block; width: 100vw; height: 100%;background: url(../images/row3_bg.jpg) no-repeat center top/cover;
    position: absolute; left: 50%;bottom: 0;transform: translateX(-50%); z-index: -1;}
.row3 .modeTil{ overflow: visible;}
.row3 .modeTil > a span{ color: #fff; background-clip: unset;background: none;-webkit-text-fill-color:unset;}
.row3 .til-line::before, .row3 .til-line::after{ width: 1000px;background: rgba(239,205,172,0.3);}
.row3 .modeCon{max-width: 1920px; overflow: hidden; padding-top: 44px; animation-delay: 0.3s;margin: 0 auto;}
.row3 .modeCon > .gp-container{ position: relative;z-index: 1;}
.row3 .modeCon .box{ display: none; max-height: 395px; opacity: 0; visibility: hidden;transform: translateY(100px);}
/* .row3 .modeCon .box .gallery{ opacity: 0; visibility: hidden;transform: translateY(100px);} */
.row3 .modeCon .box.on{ /* transition: all 0.35s ease 0.2s; opacity: 1; visibility: visible;transform: translateY(0); */
    display: block; animation: tab-swiper 1s ease 0.2s forwards;}
@keyframes tab-swiper {
    0%{ opacity: 0; visibility: hidden;transform: translateY(100px);}
    100%{ opacity: 1; visibility: visible;transform: translateY(0);}
}

.gallery a{ position: relative; display: block;}
.gallery .gp-img-responsive{padding-bottom: 56.25%;overflow: hidden;position: relative;}
.gallery .gp-img-responsive::before{ content: '';display: block;width: 100%;height: 267px;pointer-events: none;
    background-image: -moz-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
    opacity: 0.77;position: absolute;left: 0;bottom: 0;z-index: 1;transition: all 0.5s ease-in-out;
}
.gallery a .gp-img-responsive img:hover,
.gallery a:hover .gp-img-responsive::before,
.gallery a:hover .gp-img-responsive img{ transform-origin: center bottom; transform: scale(1);}
.gallery .gp-img-responsive > div{ height: auto !important; width: 100% !important;}
.gallery .gp-img-responsive  canvas{ width: 100% !important; height: 130px !important;}
.gallery .title{ position: absolute; left: 50%;bottom: 30px;z-index: 1;transform: translateX(-50%); width: calc(100% - 60px);line-height: 30px;}
.gallery .swiper-slide{ opacity: 0; visibility: hidden; transition: all 0.2s ease;filter: brightness(0.75);}
.gallery .swiper-slide.swiper-slide-prev,
.gallery .swiper-slide.swiper-slide-active,
.gallery .swiper-slide.swiper-slide-next,
.gallery .swiper-slide.visable{ opacity: 1; visibility: visible;}
.gallery .swiper-slide.swiper-slide-active{ filter: brightness(1);}
.gallery .gp-img-responsive img:hover{ opacity: 1;}
.galleryYears{ font-family: 'Noto Serif SC'; color: #ee9640;position: relative;z-index: 2;padding-top: 20px;/* margin: 0 -130px; */margin: 0 !important;}
.galleryYears > .swiper-wrapper{ align-items: flex-end; }
.galleryYear{ line-height: 1;}
.galleryYear span{ display: block; line-height: 1;text-align: center;cursor: pointer;}
.galleryYear.on{ font-size: 72px;}
.galleryYear .bottom{position: relative;margin: 0px 0 -14px; max-height: 243px; padding-top: 35px; overflow: hidden;}
.galleryYear .bottom::before{content: '';display: block;position: absolute;top: 35px;bottom: 0;width: 1px;left: 50%;
    background: rgba(228, 120, 211, 0.77);transition: all 0.35s ease-in-out;
    /* background-image: -moz-linear-gradient( 90deg, rgba(179,0,0,0) 0%, rgb(179,0,0) 100%);background-image: -webkit-linear-gradient( 90deg, rgba(179,0,0,0) 0%, rgb(179,0,0) 100%);background-image: -ms-linear-gradient( 90deg, rgba(179,0,0,0) 0%, rgb(179,0,0) 100%); */}
.galleryYear.on .bottom::before{ top: 15px;}
.galleryYear .bottom::after{content: '';display: block;clear: both;}

.galleryYear .lf,.galleryYear .rt{width:calc(50% + 1px);float: left;display: flex;justify-content: space-between;padding-top: 20px;
    -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0), rgba(0,0,0,1));mask-image: linear-gradient(to top, rgba(0,0,0,0), rgba(0,0,0,1));}
.galleryYear .rt{width: calc(50% - 1px);}
.galleryYear .bottom i{display: block;width: 1px;height: 200px;background: rgba(228, 120, 211, 0.77);}
.galleryYear .bottom i:first-child{opacity: 0;}
.galleryYear .lf i:last-child{opacity: 0;}
.galleryYear .lf i:nth-child(2),.galleryYear .rt i:nth-last-child(2){margin-top: 10px;}
.galleryYear .lf i:nth-child(3),.galleryYear .rt i:nth-last-child(3){margin-top: 20px;}
.galleryYear .lf i:nth-child(4),.galleryYear .rt i:nth-last-child(4){margin-top: 30px;}
.galleryYear .lf i:nth-child(5),.galleryYear .rt i:nth-last-child(5){margin-top: 40px;}
.galleryYear .lf i:nth-child(6),.galleryYear .rt i:nth-last-child(6){margin-top: 50px;}
.galleryYear .lf i:nth-child(7),.galleryYear .rt i:nth-last-child(7){margin-top: 60px;}
.galleryYear .lf i:nth-child(8),.galleryYear .rt i:nth-last-child(8){margin-top: 70px;}
.galleryYear .lf i:nth-child(9),.galleryYear .rt i:nth-last-child(9){margin-top: 80px;}
.galleryYear .lf i:nth-child(10),.galleryYear .rt i:nth-last-child(10){margin-top: 90px;}
.galleryYear .lf i:nth-child(11),.galleryYear .rt i:nth-last-child(11){margin-top: 100px;}
.galleryYear .lf i:nth-child(12),.galleryYear .rt i:nth-last-child(12){margin-top: 110px;}
.galleryYear .lf i:nth-child(13),.galleryYear .rt i:nth-last-child(13){margin-top: 120px;}
.galleryYear .lf i:nth-child(14),.galleryYear .rt i:nth-last-child(14){margin-top: 130px;}
.galleryYear .lf i:nth-child(15),.galleryYear .rt i:nth-last-child(15){margin-top: 140px;}

/* 祝福希望 */
.row4{ padding: 69px 0 195px; background: url(../images/row4_bg.jpg) no-repeat center top/cover;}
.row4 .modeCon{ margin-top: 28px; position: relative;}
.row4 .conBox{max-width: 1000px;height: 1000px;margin: 0 auto;border-radius: 50%;background: url(../images/row4-con.png) no-repeat center/cover;padding-top: 200px;overflow: hidden;}
.row4 .til-line::before, .row4 .til-line::after{ background: #efcdac;}
.bubble{ width: 340px; height: 340px;border-radius: 50%;border: 5px solid #fff;position: absolute;z-index: 100;}
.bubble:hover{ animation: rotate1 4s linear infinite;}
@keyframes rotate1 {
    0%{ transform: rotate(0deg);}
    100%{ transform: rotate(360deg);}
}
@keyframes rotate2 {
    0%{ transform: rotate(0deg);}
    100%{ transform: rotate(-360deg);}
}
.linkVideo{ background: url(../images/row4-img1.png) no-repeat center/cover; top: 150px; left: 0;}
.linkHistory{ background: url(../images/row4-img2.png) no-repeat center/cover;left: 30px;bottom: 10px;}
.linkEmail{ background: url(../images/row4-img3.png) no-repeat center/cover;right: 0;bottom: 120px;}
.bubble a{ width: 140px; height: 140px; border-radius: 50%;background: #fff;align-items: center;justify-content: center;
    line-height: 38px;font-weight: bold;text-align: center;
    position: absolute;top: calc(50% - 70px);left: calc(50% - 70px);z-index: 1; }
.bubble:hover a{ animation: rotate2 4s linear infinite;}
.linkHistory a{ width: 160px;height: 160px;left: calc(50% - 80px);top: calc(50% - 80px);}
.bubble span{ display: inline-block;max-width: 120px;}
@supports (-webkit-background-clip: text) {
    .textGradient{
    background-image: -webkit-linear-gradient(90deg, #ba1001, #f59978);
    background-image: linear-gradient(90deg, #ba1001, #f59978);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    }
}
.blessing{ padding-top: 125px; text-align: left; color: #fff;}
.blessing .tr:nth-of-type(1){ padding-left: 235px;}
.blessing .tr:nth-of-type(2){ padding-left: 305px;}
.blessing .tr:nth-of-type(3){ padding-left: 190px;}
.blessing .tr:nth-of-type(4){ padding-left: 183px;}
.blessing .tr:nth-of-type(5){ padding-left: 143px;}
.blessing .tr:nth-of-type(6){ padding-left: 83px;}
.blessing .tr:nth-of-type(7){ padding-left: 163px;}
.blessing li{ display: inline-block;position: relative;margin-bottom: 30px;
    height: 50px;line-height: 50px;padding-left: 30px;padding-right: 35px; z-index: 1;}
.blessing .tr:nth-of-type(2) li, .blessing .tr:nth-of-type(6) li{ margin-right: 30px;}
.blessing .tr:nth-of-type(3) li{ margin-right: 40px;}
.blessing .tr:nth-of-type(5) li{ margin-right: 50px;}
.blessing .tr:nth-of-type(n) li:last-child{ margin-right: 0px;}
/* .blessing .tr:nth-of-type(2) li:nth-of-type(2){ top: 20px;}
.blessing .tr:nth-of-type(3) li:nth-of-type(2){ top: 10px;} */
.blessing li::before{ content: '';display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: -1;
    background-image: -moz-linear-gradient( 90deg, rgb(252,199,91) 0%, rgb(255,238,204) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(252,199,91) 0%, rgb(255,238,204) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(252,199,91) 0%, rgb(255,238,204) 100%);
    opacity: 0.2;border-radius: 25px;max-width: 680px;}
.blessing li::after{ content: '';display: block;width: 24px;height: 24px;background: url(../images/blessing-icon.png) no-repeat center/cover;
    position: absolute;left: 0;top: -20px;z-index: 1;}
.blessingBtn{
    border: 4px solid rgba(255, 255, 255, 0.2);
    width: 300px;
    margin: 0 auto;
    border-radius: 16px;
    margin-top: 50px;
    position: absolute;
    bottom: 167px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1111;
    }
.blessingBtn a{ display: block;line-height: 70px;height: 70px;border-radius: 12px;text-align: center;color: #fff;
    background-image: -moz-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);}
.hMove{ animation: hMove 3s linear infinite forwards;}
.vMove{ animation: vMove 3s linear infinite forwards;}
@keyframes hMove {
    0%{ left: 0;}
    25%{ left: -10px;}
    50%{ left: 0px;}
    75%{ left: 10px;}
    100%{ left: 0;}
}
@keyframes vMove {
    0%{ top: 0;}
    25%{ top: -10px;}
    50%{ top: 0px;}
    75%{ top: 10px;}
    100%{ top: 0;}
}
.wodezhufu{ position: fixed; top: 50%;left: 50%;transform: translate3d(-50%,-50%,0);z-index: 11112;
    width: 95%; max-width: 920px;transition: all 0.5s ease-in-out;opacity: 0;visibility: hidden;}
.zhufuBg{ position: fixed;top: 100%;left: 0;right: 0;bottom: 0;width: 100%;height:100%; z-index: 11111;
    background: rgba(0, 0, 0, 0.5);transition: all 0.35s ease;}
.zhufuBg.show{ top: 0;opacity: 1;}
.wodezhufu.show{ animation: blessingShow ease-in-out 0.8s forwards;}
@keyframes blessingShow {
    0%{ transform: translate3d(-50%,-50%,0) scale(0); visibility: hidden; opacity: 0;}
    100%{ transform: translate3d(-50%,-50%,0) scale(1);visibility: visible; opacity: 1;}
}
.wodezhufu .lable{position: relative; background: url(../images/zhufubg.png) no-repeat center/cover; border-radius: 16px; padding: 60px 70px 50px;}
.wodezhufu .close{ position: absolute;top: 26px;right: 25px;width: 20px;height: 19px;background: url(../images/close.png) no-repeat center/cover;z-index: 1;}
.wodezhufu .title{ color: #fff;}
.wodezhufu .text{ color: #fcc559; line-height: 40px; margin-top: 66px;}
.wodezhufu .tip{ color: rgba(255, 255, 255, 0.5);line-height: 1; margin-top: 28px;}
.wodezhufu .right{ width: 480px; flex-shrink: 0;}
.wodezhufu .right .name{ position: relative;}
.wodezhufu .right .name span{ position: absolute;height: 50px;line-height: 50px; width: auto; left: 30px;top: 0;z-index: 1;
    display: block; color: rgba(255, 255, 255, 0.5);font-size: 18px;}
.wodezhufu #name,
.wodezhufu #blessingWord{ width: 100%; outline: none;resize: none;font-size: 18px;
    background: rgba(0, 0, 0, 0.12); border: 1px solid rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.5);font-family: '微软雅黑';}
.wodezhufu #name{ height: 50px;line-height: 50px;padding: 0 30px 0 80px;}
.wodezhufu #blessingWord{ height: 250px;margin-bottom: 49px; padding: 30px;}
.wodezhufu #blessingWord::placeholder{ color: rgba(255, 255, 255, 0.5);font-family: '微软雅黑';}
.wodezhufu .submit{ width: 100%; max-width: 210px;text-align: center; margin: 0 auto;height: 50px;border-radius: 25px;
    box-sizing: border-box;position: relative;z-index: 1;
    background-image: -moz-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(242,107,2) 0%, rgb(252,199,91) 100%);}
.wodezhufu .submit::before{ content: '';display: block;top: -4px;right: -4px;bottom: -4px;left: -4px;position:absolute;z-index: -1;
    background: rgba(255, 255, 255, 0.2); border-radius: 29px;}
.wodezhufu .submit input{ color: #fff; font-size: 20px;height: 50px;}


/* 玩转院庆 */
.row5{ padding: 60px 0 0; background: url(../images/row5_bg.jpg) no-repeat center top/cover;}
.row5 .til-line::before, .row5 .til-line::after{ background: #efcdac;}
.row5 .modeCon{ padding-top: 52px;}
.row5 .modeCon .phone{ width: 644px; flex-shrink: 0;margin-left: -63px;font-size: 0; position: relative;}
.phoneCode{width: 240px;height: 240px; position: absolute;z-index: 1; top: 17%;left: calc(50% - 80px);}
.phoneCode li{ font-size: 0;position: absolute; top: 0;left: 0; display: none;}
.phoneCode li.on{ display: block;}
.row5 .modeCon ul{flex: 1; max-width: 590px;}
.row5 .modeCon li{ margin-bottom: 35px;}
.row5 .modeCon li:last-child{ margin-bottom: 0px;}
.row5 .modeCon li a{ box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.05);background: #fff;
    padding: 26px 55px 0 42px;min-height: 190px;border-radius: 10px; position: relative;}
.row5 .modeCon li.on a{ color: #fff;border-radius: 10px 10px 10px 0;
    background: url(../images/row5-hover.png) no-repeat center/cover;
}
.row5 .modeCon li a::before{ content: '';display: block;width: 36px;height: 42px;background: url(../images/row5-triangle.png) no-repeat right bottom;
    position: absolute;right: 100%;bottom: 0; opacity: 0;}
.row5 .modeCon li.on a::before{ opacity: 1;}
.row5 .modeCon .icon{ width: 120px;height: 120px;flex-shrink: 0;}
.row5 .modeCon li:nth-of-type(1) .icon{ background: url(../images/row5-icon3.png) no-repeat center/cover;}
.row5 .modeCon li:nth-of-type(1).on a .icon{ background: url(../images/row5-icon3-1.png) no-repeat center/cover;}
.row5 .modeCon li:nth-of-type(2) .icon{ background: url(../images/row5-icon1.png) no-repeat center/cover;}
.row5 .modeCon li:nth-of-type(2).on a .icon{ background: url(../images/row5-icon1-1.png) no-repeat center/cover;}
.row5 .modeCon li:nth-of-type(3) .icon{ background: url(../images/row5-icon2.png) no-repeat center/cover;}
.row5 .modeCon li:nth-of-type(3).on a .icon{ background: url(../images/row5-icon2-1.png) no-repeat center/cover;}
.row5 .modeCon .info{ flex: 1;padding-left: 20px;}
.row5 .modeCon .title{ line-height: 1;}
.row5 .modeCon .summary{ line-height: 24px; color: #999;margin-top: 17px;}
.row5 .modeCon .on a .summary{ color: #fff;}

    
/* 响应式样式 */
@media screen and (max-width:1800px){
    .galleryYears{ margin: 0 -100px;}
    .galleryYear.on{ font-size: 62px;}
}

@media screen and (max-width:1700px){
    
}

@media screen and (max-width:1600px){
    .row1 .first{ width: 680px;}
    .row1 .second{ padding-left: 20px;}
    .row1 .second{ margin: 0 -10px;}
    .row1 .second a{ margin: 0 10px;}
    .row1 .second .info{ padding: 35px 30px 35px 20px;}
    .row2{ padding: 40px 0 60px;}
    .row3{ padding: 40px 0 0;}
    .row4{ padding: 40px 0 80px;}
    .galleryYear.on{ font-size: 52px;}
}

@media screen and (max-width:1480px) {
    .row1 .first{ width: 650px;}
    .row1 .second .summary{ margin-top: 10px;}
    .row1 .noImgUl{ margin: 0 -10px; padding-top: 30px;}
    .row1 .noImgUl a{ margin: 0 10px;}
    .row5 .modeCon .phone{ width: 545px;}
    .row5 .modeCon ul{ max-width: 540px;}
    .row5 .modeCon li a{ padding: 20px 20px 0; min-height: 160px;}
}

@media screen and (max-width:1400px) {
    
}

@media screen and (max-width:1380px) {
    
}

@media screen and (max-width:1280px) {
    .modeTil{ font-size: 52px; line-height: 65px;}
    .modeTil > a::before{ width: 65px; height: 65px;}
    .row1 .first{ width: 600px;}
    .row1 .second .info{ padding: 30px 20px 30px 20px;}
    .galleryYears{ margin: 0 -30px;}
    .galleryYear .bottom{ max-height: 200px;padding-top: 15px;}
    .bubble{ width: 280px; height: 280px;}
    .linkVideo{ top: 0;}
    .linkEmail{ bottom: 80px;}
}

@media screen and (max-width:1240px) {
    
}

@media screen and (max-width:1180px) {
    .banner{ max-height: unset;}
    .banner .gp-img-responsive{ padding-bottom: 47.92%;}
    .modeTil{ font-size: 42px; line-height: 45px;}
    .modeTil > a::before{ width: 45px; height: 45px;box-sizing: border-box;}
    .til-line{ height: 70px;}
    .til-line img{ height: 100%;}
    .row1{ padding: 40px 0;}
    .row1 .modeCon > .flex{ flex-direction: column;}
    .row1 .first{ width: 100%;}
    .row1 .second{ padding-left: 0; padding-top: 20px;}
    .row1 .second .title{ font-size: 18px; -webkit-line-clamp: 1;}
    .row1 .second .summary{ -webkit-line-clamp: 2; }
    .row1 .noImgUl{ padding-top: 20px;}
    .row1 .noImgUl .title{ font-size: 18px; padding: 0 10px;}
    .modeMore{ padding-top: 30px;}
    .row2 .modeCon li{ width: 100%; margin-bottom: 20px;}
    .row2 .modeCon li:last-child{ margin-bottom: 0;}
    .row2 .modeCon a{ flex-direction: row !important;align-items: stretch !important;}
    .row2 .modeCon .tag{ border-radius: 20px 0 0 20px !important;}
    .row2 .modeCon .img{ width: 420px; flex-shrink: 0;}
    .row2 .modeCon .title{ max-width: unset;min-height: auto;height: auto; flex: 1;}
    .row2 .modeCon li:nth-of-type(2) .title{ margin-left: 0;}
    .row5 .modeCon{ align-items: flex-end;}
    .row5 .modeCon .phone{ width: 430px;}
    .row5 .modeCon > ul{ max-width: unset; padding-left: 60px;}
    .phoneCode{ width: 180px;height: 180px;left: calc(50% - 70px);}
    .row5 .modeCon li{ margin-bottom: 25px;}
    .row5 .modeCon li a{padding: 20px; min-height: unset;}
}

@media screen and (max-width:1100px) {
    
}
@media screen and (max-width:1024px) {
    
}

@media screen and (max-width:998px) {
    .banner .title{ font-size: 22px;}
    .modeTil{ padding-top: 50px; line-height: 55px;}
    .til-line{ height: 50px;}
    .row1 .noImgUl li{ width: 100%; margin-bottom: 20px;}
    .row1 .noImgUl li:last-child{ margin-bottom: 0;}
    .row4 .conBox{ height: 940px;font-size: 0;text-align: center;}
    .bubble{ display: inline-block; position: relative; top: 0; left: 0; right: 0;
        width: 33.33%; max-width: 220px; height: auto;}
    .bubble::before{ content: '';display: block;width: 100%;height: 0;padding-bottom: 100%;}
    .bubble a{ width: 120px; height: 120px; left: calc(50% - 60px); top: calc(50% - 60px); font-size: 24px; line-height: 28px;}
    .bubble a span{ max-width: 100px;}
    .row4 .conBox{ height: auto; background: url(../images/row4-con2.png) no-repeat center/cover; border-radius: 8px;padding-top: 0; padding: 20px;}
    .blessing{ padding-top: 20px; max-height: 300px; overflow: scroll;}
    .blessing li{ width: 100%; margin-bottom: 15px;line-height: 1; height: auto; padding-left: 20px; padding-right: 20px;}
    .blessing li span{ display: block; line-height: 1.4;padding: 5px 0; text-wrap: wrap;}
    .blessing .tr{ text-align: center;}
    .blessing .tr:nth-of-type(n){ padding-left: 0px;}
    .blessingBtn{ margin: 10px auto; position: relative;left: 0;bottom: 0;transform: none;}
    .row1{ padding: 30px 0;}
    .row2{ padding: 30px 0;}
    .row3{ padding: 30px 0 0;}
    .row4{ padding: 30px 0;}
    .row5{ padding: 30px 0;}
    .row2 .modeCon,
    .row3 .modeCon,
    .row5 .modeCon{ padding-top: 20px;}
    .galleryYears{ padding: 10px 0 20px; margin: 0;}
    .galleryYear .bottom{ display: none;}
    .wodezhufu .lable{ padding: 40px;}
    .wodezhufu #blessingWord{ margin-bottom: 30px;}
    .wodezhufu .lable > .flex{ flex-direction: column;}
    .wodezhufu .right{ width: 100%;}
    .wodezhufu .title{ font-size: 24px;}
    .wodezhufu .text{ margin-top: 10px; line-height: 1.5;}
    .wodezhufu .text br{ display: none;}
    .wodezhufu .tip{ margin-top: 10px;}
    .wodezhufu .right .name{ margin-top: 10px;}
    .wodezhufu #blessingWord{ min-height: 180px; height: auto;}
    .row5 .modeCon > ul{ padding-left: 40px;}
    .row5 .modeCon .icon{ width: 100px;height: 100px;}
    .row5 .modeCon .info{ padding-left: 10px;}
    .row5 .modeCon .title{ font-size: 26px;}
    .row5 .modeCon .summary{ margin-top: 8px; line-height: 22px;}
}

@media screen and (max-width:768px) {
    .modeTil .title{ font-size: 26px;}
    .row2 .modeCon a{ position: relative;}
    .row2 .modeCon .tag{ position: absolute;left: 5px;top: 10px;z-index: 1;
        height: auto;padding: 10px !important; text-align: center;}
    .row2 .modeCon .tag span{ display: inline-block; font-size: 18px; margin: 0;}
    .row2 .modeCon .title{ padding: 20px 15px;}
    .row2 .modeCon .img{ width: 340px;}
    .row3 .box{ max-width: 80%;margin: 0 auto;}
    .galleryYear{ font-size: 30px;}
    .galleryYear.on{ font-size: 42px;}
    .gallery .gp-img-responsive::before{ height: 0; padding-top: 20%;}
    .gallery .title{ bottom: 15px;width: calc(100% - 40px);line-height: 24px;}
    .blessingBtn{ max-width: 240px;}
    .blessingBtn a{ line-height: 50px; height: 50px; font-size: 22px;}
    .row5 .modeCon .phone{ display: none;}
    .row5 .modeCon > ul{ padding-left: 0px;}
    .row5 .modeCon li a::before{ display: none;}
    .row5 .modeCon li.on a{ border-radius: 10px;}
}

@media screen and (max-width:640px) {
    .row1 .second{ flex-wrap: wrap;}
    .row1 .second li{ width: 100%; margin-bottom: 20px;}
    .row1 .second li:last-child{ margin-bottom: 0;}
    .row1 .second .info{ padding: 30px 15px 15px;}
    .row1 .second .summary{ margin-top: 6px;}
}

@media screen and (max-width:540px) {
    .row2 .modeCon a{ flex-wrap: wrap;}
    .row2 .modeCon .img{ width: 100%;}
    .row2 .modeCon .title{ width: 100%;padding: 10px 15px;font-size: 16px; line-height: 24px;}
}

@media screen and (max-width:479px) {
    .modeTil{ font-size: 36px; padding-top: 0;}
    .til-line{ display: none;}
    .row1 .modeCon{ margin-top: 10px;}
    .row1 .first .title{ padding: 0 15px; font-size: 16px;}
    .row1 .second .title,
    .row1 .noImgUl .title{ font-size: 16px;}
    .modeMore{ text-align: right;}
    .modeMore a span::before{ height: 40px;width: 40px;}
    .modeMore a span::after{ height: 40px; background-size: auto 100%;right: 10px;}
    .row2 .modeMore{ top: 0;}
    .gallery .title{ bottom: 10px; line-height: 20px;}
    .row5 .modeCon li a{ padding: 10px 15px;}
    .row5 .modeCon .icon{ width: 100px; height: 100px;}
    .row5 .modeCon .info{ padding-left: 10px;}
    .row5 .modeCon .title{ font-size: 22px;}
    .row5 .modeCon .summary{ line-height: 20px;margin-top: 8px;}
    .wodezhufu .lable{ padding: 30px 20px;}
}

@media screen and (max-width:414px) {
    .modeTil{ font-size: 30px;}
    .row3 .modeCon .box{ max-width: 95%;}
    .galleryYear{ font-size: 22px;}
    .galleryYear.on{ font-size: 26px;}
    .bubble a{ width: 100px; height: 100px;left: calc(50% - 50px);top: calc(50% - 50px);}
    .bubble a span{ font-size: 18px; max-width: 80px;}
}

@media screen and (max-width:390px) {
    .modeTil{ font-size: 26px;}
    .modeMore a{ font-size: 14px;}
    .modeMore a span{ font-size: 16px;}
    .modeMore a span::before{ width: 30px; height: 30px;}
    .modeMore a span::after{ height: 30px;}
}