@charset "utf-8";
h1,h2,h3,h4{ font-weight: normal;}
@font-face {
    font-family: 'JDFXS-Regular';
    src: url('../fonts2022/Regular.eot');
    src: url('../fonts2022/Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts2022/Regular.woff2') format('woff2'),
         url('../fonts2022/Regular.woff') format('woff'),
         url('../fonts2022/Regular.svg#Regular') format('svg'),
         url('../fonts2022/Regular.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
.header{ no-repeat; background-size: cover; background-position: center;}
.headerBg{  background: url(../images2022/header_bg.png)}
.logo{float: left;margin: 45px 35px 35px;width: 38%;}
.motto{ float: right; margin-top: 72px; margin-right: 87px;}

.search{ width: 323px; height: 36px; border-radius: 16px; float: right; margin-top: 88px; margin-right: 8px; position: relative; background-image: url(../images2022/search.png); background-repeat: no-repeat; background-position: center;}
.notxt{ width: 323px; height: 36px; border-radius: 16px; box-sizing: border-box; padding-left: 16px; outline: none; border: none; background-color: #d3d1d1; color: #927274;}
.notxt1{ position: absolute; right: 22px; top: 0px; border: none; outline: none; width: 22px; height: 100%; background: url(../images2022/search_icon.png) no-repeat center;}
input:-internal-autofill-previewed,
input:-internal-autofill-selected {
    -webkit-text-fill-color: #807c7c;
    transition: background-color 5000s ease-out 0.5s;
}

.nav{ width: 100%; background-color: #4d0407; max-height: 66px; /* overflow: hidden; */}
.nav ul{ text-align: justify; font-size: 0;}
.nav ul::after{ content: ''; width: 100%; display: inline-block;}
.nav li{ display: inline-block; position: relative; font-size: 1.6rem;}
.nav li:hover{ background-color: #60060a;}
.nav a{ display: block; padding: 24px 18px; color: #fff; line-height: 16px; transition: transform .05s ease;}
.nav a:hover{ transform: scale(1.05);}
.subNav{ display: none; position: absolute; top: 64px; left: 0; z-index: 9999; width: 100%;}
.nav .on .subNav{ display: block;}
.subNav a{ background-color: rgba(206, 187, 187, 0.75); padding: 15px 0; text-align: center; color: #333232;}
.subNav a:hover{ transform: scale(1); color: #661115;}

/*手机端导航默认*/
.mobile_bg{width: 100%;height: 100%;z-index: 90;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.6);display: none;}
.gp-menu{ width: 10%;z-index: 98;height: 100%;position: relative;}
.open .gp-menu{ width: 100%;}
.gp-menu-header{ display: none; position: absolute;top: 0;right: 0;z-index: 996;width: 100%;height: 40px;background: rgba(0,0,0,0.2);}
.gp-menu-link{float: left;line-height: 40px;height: 40px;padding-left: 15px;}
.gp-menu-link a{color:#fff;}
.gp-menu-header-icon{color: #c7000a; height: 40px;font-size:25px;text-align: center; float:right;width: 40px;position: relative;  -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s;margin-right: 10px;cursor: pointer;}
.gp-menu-header-icon span{  position: absolute; left: calc((100% - 25px) / 2);  top: calc((100% - 2px) / 3);  width: 27px;  height: 3px;  background-color: #c7000a;}
.gp-menu-header-icon-out span{width: 27px;height: 4px;background-color:#fff;display: block;border-radius: 4px;}
.gp-menu-header-icon-out span:nth-child(1){animation-duration: 0.5s;animation-fill-mode: both;animation-name: outfirst;}       
.gp-menu-header-icon-out span:nth-child(2){animation-duration: 0.5s;animation-fill-mode: both;animation-name: outsecond;}
.gp-menu-header-icon-out span:nth-child(3){animation-duration: 0.5s;animation-fill-mode: both;animation-name: outthird;}
.gp-menu-header-icon span:nth-child(1){transform: translateY(4px) rotate(0deg);}
.gp-menu-header-icon span:nth-child(2){transform: translateY(-4px) rotate(0deg);}
.gp-menu-header-icon span:nth-child(3){transform: translateY(-4px) rotate(0deg);}
@keyframes outfirst {
  0% {transform: translateY(0) rotate(-45deg);}
  100% {transform: translateY(-4px) rotate(0deg);}
}   
@keyframes outsecond {
  0% { transform: translateY(0) rotate(45deg);}
  100% {transform: translateY(4px) rotate(0deg);}
}
@keyframes outthird {
  0% {transform: translateY(0) rotate(90deg);}
  100% {transform: translateY(12px) rotate(0deg); }
}
.gp-menu-header-icon-click span{background-color:#fff ;top: calc((100% - 2px) / 2.1);}
.gp-menu-header-icon-click span:nth-child(1){animation-duration: 0.5s; animation-fill-mode: both;animation-name: clickfirst;}     
.gp-menu-header-icon-click span:nth-child(2){animation-duration: 0.5s; animation-fill-mode: both;animation-name: clicksecond;}
.gp-menu-header-icon-click span:nth-child(3){animation-duration: 0.5s; animation-fill-mode: both;animation-name: clickthird;}
@keyframes clickfirst {
  0% {transform: translateY(4px) rotate(0deg);}
  100% {transform: translateY(0) rotate(45deg);}
}   
@keyframes clicksecond {
  0% {transform: translateY(-4px) rotate(0deg);}
  100% {transform: translateY(0) rotate(-45deg);}
} 
@keyframes clickthird {
    0% {  opacity: 0}
  100% {opacity: 0}
}   
.gp-menu-nav{  width: 100%; position: fixed;top: 0;right: 0px;padding-top: 40px;background:#641216; display: none;}
/*导航*/
.gp-menu-nav a{}
.gp-menu-nav > ul {}
.gp-menu-nav > ul li{-webkit-animation-duration: 0.5s;animation-duration: 0.5s;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-name: returnToNormal;animation-name: returnToNormal;}
.gp-menu-nav > ul > li{position: relative;border-bottom: 1px solid rgba(255,255,255,0.3);}
.gp-menu-nav > ul > li > a{display: inline-block;padding:14px 0 14px 25px;font-size: 1.6rem;}
.gp-menu-nav > ul > li > ul {background: rgba(0,0,0,0.1);padding:0 25px}
.gp-menu-nav > ul > li > ul a{display: inline-block;padding:10px 0;}
.gp-menu-arrow {cursor: pointer;width: 30px;height: 50px;line-height: 50px;color:#fff;text-align: center;position: absolute;right: 0;top: 0;font-size: 2rem;margin-right: 10px;transition: all 0.3s ease-in-out;}
.gp-menu-nav > ul > li.on .gp-menu-arrow{transform: rotate(90deg);}
.gp-menu-nav li ul {display: none;}
/*导航内标签效果*/
.gp-menu-nav a{color:#fff;}
.open .gp-menu-link{display: none;}
.open .gp-menu-header{background: none;}
@-webkit-keyframes returnToNormal {
  from {
    opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;-webkit-transform: none;transform: none;
  }
}

@keyframes returnToNormal {
  from {
    opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;-webkit-transform: none;transform: none;
  }
}
/*
侧滑左侧
*/
.gp-menu-nav.gp-menu-offcanvas1{position: fixed;display: block;transform: translate(-150%,0);transition: all 1s ease-in-out;width: 85%;right: auto;left:0; display: none;}
.open .gp-menu-offcanvas1{transform: translate(0,0);position:absolute;}



footer{ margin-top: 40px; padding-top: 85px; padding-bottom: 80px; background: url(../images2022/footer_bg.png) no-repeat; background-position: center; background-size: cover;}
.footer ul{ display: inline-block;}
.footer li{ float: left;}
.footer .up li{ position: relative;}
.footer a,.footer span,.footer dd,.footer li{ color: #fff;}
.footer .up dl{ position: absolute; position: absolute; right: -187px; top: 0; width: 183px; background-color: #d3d1d1; border: 1px solid #530e11;}
.footer .up dl a,.footer dt{ color: #232020;}
.footer dt{ padding-left: 8px; text-align: left; position: relative;}
.footer dt::after{ content: ''; transition: all 0.2s ease; display: block; width: 13px; height: 8px; background: url(../images2022/down_icon.png) no-repeat; background-position: center; position: absolute; right: 10px; top: 10px;}
.up{ text-align: center;}
.down{ margin-top: 56px; text-align: center;}
.footer .up .lf{ padding-left: 49px; position: relative;}
.footer .up .lf::before{ content: ''; display: block; width: 29px; height: 29px; background: url(../images2022/links_icon.png) no-repeat; background-position: center; position: absolute; left: 0; top: 0;}
.footer a,.footer li{ line-height: 29px;}
.up .lf li{ margin-right: 38px;}
.up .rt li{ margin-right: 240px;}
.up .rt li:last-child{ margin-right: 188px;}
.up .lf li:first-child{ margin-right: 40px;}
.down span{ margin-right: 92px; position: relative;}
.down span:last-child{ margin-right: 0px; margin-left: 132px;}
.down span::before{ content: ''; display: block; width: 20px; height: 21px; position: absolute; left: -24px; top: 0;}
.down span:nth-of-type(1):before{ display: none;}
.down span:nth-of-type(2):before{ background: url(../images2022/teacher_icon.png) no-repeat; background-size: cover;}
.down span:nth-of-type(3):before{ width: 17px; height: 17px; background: url(../images2022/phone_icon.png) no-repeat; background-size: cover;}
.down span:nth-of-type(4):before{ background: url(../images2022/book_icon.png) no-repeat; background-size: cover;}
.footer .up dd{ display: none; position: absolute; bottom: 30px; left: 0; border-radius: 10px 10px 0 0;}
.footer .up dd span{ display: block; width: 181px; padding: 5px; }
.footer .up dl.on dd{ display: block; z-index: 999; background-color: #d3d1d1; opacity: 0.97;}
.footer dl.on dt::after{ transform: rotate(180deg);}



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

@media screen and (max-width:1480px) {
    .logo{
    width: 40%;
    margin: 35px 0px;
}
  .search{
    margin-top: 50px;
    width: 300px;
  }
  .motto{
  margin-top: 50px;
  }
}

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

@media screen and (max-width:1280px) {
  .motto{ margin-right: 20px;}
}

@media screen and (max-width:1200px) {
  .motto{ display: none;}
  .logo{ margin: 35px 0; width: auto;}
    
}

@media screen and (max-width:1100px) {
    .down{ margin-top: 30px;}
    .footer .up .rt{ margin-top: 30px;}
    footer{ padding-top: 50px; padding-bottom: 50px;}
    .down span:last-child{ margin-left: 0;}
  .logo{width: 60%;}
}
@media screen and (max-width:1024px) {
}

@media screen and (max-width:997px) {
    .gp-menu-header{ display: block;}
    .nav,.search,.gp-menu-link{ display: none;}
    .header{ position: relative;}
    .gp-menu{position: absolute;top: 20px;right: 0px;}
    .open .gp-menu{ top: 0px;}
    .gp-menu-header{ background: none;}
    .gp-menu-header-icon{margin-right: 50px;margin-top: 30px;}
    .down span{ display: inline-block; margin-right: 0px; margin-bottom: 20px; width: 40%;}
    .down span:nth-of-type(odd){ text-align: right; padding-right: 25px;}
    .down span:nth-of-type(even){ text-align: left; padding-left: 25px;}
    .down span::before{ left: 0; top: -2px;}
    .down span:nth-of-type(3):before{ left: auto; right: 196px; top: 1px;}
    .logo{ margin: 15px 0;}
}

@media screen and (max-width:768px) {
    .down span:nth-of-type(3):before{ right: 175px;}
    .gp-menu-header-icon{ margin-top: 8%;}
    .logo{ width: 80%;}
}

@media screen and (max-width:680px) {
    .up .rt li{ display: block; margin-right: 0; /* text-align: right; */ padding-right: 25px; margin-top: 20px; width: 38%;}
    .down span{ width: 50%; text-align: left !important;}
    .down span:nth-of-type(odd),.down span:nth-of-type(even){ text-align: center; padding: 0;}
    .down span::before,.down span:nth-of-type(3):before{ left: -30px; top: 0;}
    .down span:nth-of-type(1){margin-left: -30px; width: 56%;}
    /* .down span:nth-of-type(4):before{ left: 210px;} */
    .logo{margin: 15px 0 15px;}
    .gp-menu-header-icon{ margin-right: 20px;}
}

@media screen and (max-width:540px) {
    .gp-container{ padding: 0;}
    .down span:nth-of-type(1){margin-left: -25px;}
    .gp-container{ margin-left: 15px; margin-right: 15px;}
}

@media screen and (max-width:414px) {
    .down span:nth-of-type(1){ width: 71%;}
    .down span{ width: 58%;}
    .gp-menu-header-icon{ margin-top: 10%;}
}

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

}