@charset "utf-8";
body {
    margin: 0;
    padding: 0;
    background-color: #fff;
}
div,ul,li,dt,dd,dl,td,tr,table,p,span,h1,h2,h3,h4,h5,h6,hr{margin:0px;padding:0px;list-style:none;}
body,td,th {font-size: 18px;line-height:36px;color:#222222;text-indent: 0;}
a:link,a:visited{color:#222222;text-decoration:none;}
a:hover{color:#c00;}
img { border:0;}
.clear { clear:both;}
.header {
    width: 100%;

    float: left;
    background-image: url(../images/topbg.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
.header .wrapper {
    width: 100%;
    max-width: 1720px;
    min-width: 1400px;

    margin: 0 auto;
}
.header .wrapper .top {
    width: 100%;
    height: 150px;
    float: left;
}

.header .wrapper .top .logo {
    width: 26%;
    max-width: 420px;
    min-width: 364px;
    margin-top: 10px;
    float: left;
}
.header .wrapper .top .logo img {
    width: 100%;
    height: 100%;
    float: left;
}

.header .wrapper .top .nav {
    width: 400px;
    height: 50px;
    padding-top: 10px;
    float: right;
}
.header .wrapper .top .nav li {
    width: 100px;
    height: 50px;
    float: left;
}
.header .wrapper .top .nav li a {
    color: #fff;
    font-size: 16px;
    line-height: 50px;
    text-align: left;


}
.header .wrapper .top .nav li a:hover {
    color: #ff0;
}

.header .wrapper .top .nav .search {
    width: 21px;
    height: 21px;
    padding: 5px 20px 10px 0;
    float: left;


}
.header .wrapper .top .menu {
    width: 70%;
    max-width: 1200px;
    min-width: 1000px;
    height: 60px;
    float: right;
    margin-top: 30px;
  }
  .header .wrapper .top .menu ul {
    width: 100%;
    max-width: 1200px;
    min-width: 1000px;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 3px; /* 菜单项之间间距 */
    flex-wrap: wrap; /* 文字多的时候自动换行，小屏幕不会挤爆 */
    justify-content: flex-end;
  }
  .header .wrapper .top .menu li {
    position: relative;
    flex-shrink: 0;
    line-height: 60px;
  }
  .header .wrapper .top .menu li a {
    padding: 0 1rem;
    display: block;
    color: #fff;
    font-size: 18px;
    line-height: 60px;
    text-align: center;
  }
  .header .wrapper .top .menu li a:hover {
    color: #ff0;
    background: #f87d85;
  }
  .header .wrapper .top .menu li a.active {
    color: #ff0;
    background: #f87d85;
  }
  /* 二级下拉 */
  .header .wrapper .top .menu li > ul {
    position: absolute;
    top: 100%;
    left: 0;
    background: #f87d85;
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 160px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15);
    display: none;
    z-index: 999;
  }
  .header .wrapper .top .menu li > ul > li {
    line-height: 46px;
  }
  .header .wrapper .top .menu li > ul > li a {
    color: #000;
    font-size: 16px;
    line-height: 46px;
    padding: 0 18px;
    text-align: left;
  }
  .header .wrapper .top .menu li > ul > li a:hover {
    color: #ff0;
    background-color: #c00;
  }
  .header .wrapper .top .menu li:hover > ul {
    display: block;
  }
  
.banner {
    position: relative;
    width: 100%;
    height: 700px;
    overflow: hidden;
  }
  .banner-item {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /* 默认隐藏，JS控制active显示 */
    opacity: 0;
    transition: opacity 0.6s ease;
  }
  .banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* 左右箭头 */
  .banner-left,
  .banner-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 50px;
    background: rgba(0,0,0,0.35);
    border-radius: 10px;
    z-index: 10;
    cursor: pointer;
  }
  .banner-left,
.banner-right {
  font-size: 22px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
  .banner-left {
    left: 20px;
  }
  .banner-right {
    right: 20px;
  }
  .banner-left:hover,
  .banner-right:hover {
    background: rgba(0,0,0,0.6);
  }
  /* 底部圆点导航 */
  .banner-nav {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
  }
  .banner-nav a {
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border:#fff solid 2px;

  }
  .banner-nav a.active {
    background: #fff;
    width: 12px;
    height: 12px;
  }





.news {
    width: 100%;
    height: 785px;
    float: left;
    background-image: url(../images/newsbg.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
.news .wrapper {
    width: 1400px;
    margin: 0 auto;
}
.news .wrapper .title {
    width: 1400px;
    height: 60px;
    float: left;
    background-image: url(../images/titlebg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 20px;
}
.news .wrapper .title h2 {
	padding: 5px 10px 0px 0px;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
	color: #000;
	margin-left: 600px;
	vertical-align: bottom;
	float: left;
	font-weight: normal;
}
.news .wrapper .title h4 {
    margin: 20px 0px 0px 0px;
    padding-left: 10px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #f00;
    float: left;
    border-left: 2px solid #ddd;
    vertical-align: bottom;
}
.news .wrapper .title .more {
    width:150px;
    height: 30px;
    line-height: 30px;
    text-align: right;
    margin-top:20px;
    float: right;
}
.news .wrapper .title .more a {
    color: #333;
}
.news .wrapper .title .more a:hover {
    color: #f00;
}
.news .wrapper .detail {
    width:1400px;
    margin-top: 20px;
    float: left;
}
.news .wrapper .detail ul {
    list-style: none;
    padding: 0;
    margin: 0;
    /* 核心：2行3列，均分 */
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
    gap: 30px; /* 卡片之间间距，按需调大小 */
}
.news .wrapper .detail ul li a {
    display: block;
    text-decoration: none;
    text-indent: 0;
    color: #333;
    background: #fff;
    border: 1px solid #eee;
    transition: all 0.3s;
    height: 100%; /* 让同一行卡片高度自动对齐 */
}
.news .wrapper .detail ul li a:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.news .wrapper .detail ul li img {
	width: 100%;
	margin: 0;
	padding: 0;
	height: 300px;
}
.news .wrapper .detail ul li .news-info {
	width: 96%;
	padding: 10px;
	float: left;

}

.news .wrapper .detail ul h3 {
    width: 100%;
    font-size: 18px;
    line-height: 40px;
}
.news .wrapper .detail ul a:hover h3 {
    color: #f00;
}
.news .wrapper .detail ul p {
    width: 98%;
    font-size: 16px;
    line-height: 32px;
    text-indent: 2rem;
}
.news .wrapper .detail ul .date {
    width: 100px;
    height: 30px;
    float: right;
    line-height: 30px;
    text-align: left;
    padding-left: 30px;
    background: url(../images/datebg.png) no-repeat;
    background-position: left;
    font-size: 16px;
    color: #000;
}








.party {
    width: 100%;
    height: 785px;
    float: left;
    background-image: url(../images/partybg.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
.party .wrapper {
    width: 1400px;
    margin: 0 auto;
}
.party .wrapper .title {
    width: 1400px;
    height: 60px;
    float: left;
    background-image: url(../images/titlebg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 20px;
}
.party .wrapper .title h2 {
	padding: 5px 10px 0px 0px;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
	color: #000;
	margin-left: 600px;
	vertical-align: bottom;
	float: left;
	font-weight: normal;
}
.party .wrapper .title h4 {
    margin: 20px 0px 0px 0px;
    padding-left: 10px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #f00;
    float: left;
    border-left: 2px solid #ddd;
    vertical-align: bottom;
}
.party .wrapper .title .more {
    width:150px;
    height: 30px;
    line-height: 30px;
    text-align: right;
    margin-top:20px;
    float: right;
}
.party .wrapper .title .more a {
    color: #333;
}
.party .wrapper .title .more a:hover {
    color: #f00;
}
.party .wrapper .detail {
    width:1400px;
    margin-top: 20px;
    float: left;
    background: url(../images/partyulbg.jpg) no-repeat;
    background-position: center;

}
.party .wrapper .detail {
    width:1400px;
    margin-top: 20px;
    float: left;
}
.party .wrapper .detail ul {
    list-style: none;
    padding: 80px 60px;
    margin: 0;
    /* 核心：2行3列，均分 */
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
    gap: 50px; /* 卡片之间间距，按需调大小 */
}
.party .wrapper .detail ul li a {
    display: block;
    text-decoration: none;
    color: #333;
    background: #fff;
    border: 1px solid #eee;
    transition: all 0.3s;
    height: 110px; /* 让同一行卡片高度自动对齐 */
}
.party .wrapper .detail ul li a:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.party .wrapper .detail ul li .party-info {
    width: 594px;
    padding: 10px;
    float: left;
    border-top: #ccc solid 3px;
    position: relative;
}
.party .wrapper .detail ul li .party-info .line{
    width: 125px;
    border-top: #c00 solid 3px;
    position: absolute;
    top: -3px;
    left: 0px;
}
.party .wrapper .detail ul li a:hover .party-info .line{
    width: 614px;
    transition: all 0.3s;
}
.party .wrapper .detail ul li .party-info .date {
    width: 90px;
    height: 85px;
    position: absolute;
    top: 0px;
    left: 18px;
    background-color: #c00;
    border-radius: 0px 0px 30px 30px;

}
.party .wrapper .detail ul li .party-info .date .day{
    width: 90px;
    height: 30px;
    margin-top: 10px;
    float: left;
    line-height: 30px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
}
.party .wrapper .detail ul li .party-info .date .month{
    width: 90px;
    height: 25px;
    float: left;
    line-height: 25px;
    text-align: center;
    font-size: 16px;
    color: #fff;
}
.party .wrapper .detail ul li .party-info h3{
    width: 450px;
    line-height: 40px;
    font-size: 18px;
    font-weight: normal;
    position: absolute;
    top: 10px;
    right: 20px;
}
.party .wrapper .detail ul li .party-info .jiao{
	width: 30px;
	height: 30px;
	position: absolute;
	top: 60px;
	right: 20px;
	background: url(../images/jiao1.png) no-repeat;
	background-position: center center;
}
.party .wrapper .detail ul li a:hover .party-info .jiao{
	background: url(../images/jiao2.png) no-repeat;
	transition: all 0.3s;
}





.teaching {
    width: 100%;
    height: 712px;
    float: left;
    background-image: url(../images/teachingbg.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
.teaching .wrapper {
    width: 1400px;
    margin: 0 auto;
}
.teaching .wrapper .title {
    width: 1400px;
    height: 60px;
    float: left;
    background-image: url(../images/titlebg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 20px;
}
.teaching .wrapper .title h2 {
	padding: 5px 10px 0px 0px;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
	color: #000;
	margin-left: 600px;
	vertical-align: bottom;
	float: left;
	font-weight: normal;
}
.teaching .wrapper .title h4 {
    margin: 20px 0px 0px 0px;
    padding-left: 10px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #f00;
    float: left;
    border-left: 2px solid #ddd;
    vertical-align: bottom;
}
.teaching .wrapper .title .more {
    width:150px;
    height: 30px;
    line-height: 30px;
    text-align: right;
    margin-top:20px;
    float: right;
}
.teaching .wrapper .title .more a {
    color: #333;
}
.teaching .wrapper .title .more a:hover {
    color: #f00;
}
.teaching .wrapper .detail {
    width:1400px;
    margin-top: 20px;
    float: left;
}
.teaching .wrapper .detail ul {
    list-style: none;
    padding: 0;
    margin-top: 50px;
    width: 650px;
    height: 500px;    
    float: right;
}
.teaching .wrapper .detail ul li {
    width: 270px;
    height: 420px;
    margin-right: 50px;
    float: left;
    
}
.teaching .wrapper .detail ul li a {
    width: 270px;
    height: 420px;
    display: block;
    float: left;
}
.teaching .wrapper .detail ul li a:hover{
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}





.footer {
    width: 100%;
    height: 140px;
    padding-top: 20px;
    float: left;
    background-color: #c00;
}
.footer .wrapper {
    width: 1400px;
    margin: 0 auto;
}
.footer .wrapper .word {
    width: 600px;
    float: left;
}
.footer .wrapper .word p {
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    color: #fff;
    float: left;
}
.footer .wrapper .ewm {
    width: 300px;
    float: right;
    
}





.header .wrapper .bannerny {
    width: 100%;
    height: 428px;
    float: left;
}
.header .wrapper .bannerny img {
    width: 100%;
    height: 100%;
    float: left;
}




.content {
    width: 100%;

    float: left;
}
.content .wrapper {
	width: 1400px;
	min-height: 500px;
	background-image: url(../images/teachingbg.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: 70%;
	height: auto;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
.content .wrapper .path {
    width: 1350px;
    height: 40px;
    padding-left: 50px;
    margin-bottom: 20px;
    float: left;
    background-image: url(../images/pathbg.png);
    background-repeat: no-repeat;
    background-position: 15px 8px;
    margin-top: 20px;
    border-bottom: 1px solid #ccc;
}
.content .wrapper .left {
    width: 250px;
    float: left;
}
.content .wrapper .left .lanmu {
    width: 250px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    float: left;
    background-color: #c00;
}

.content .wrapper .left ul {
    width: 248px;
    float: left;
    list-style: none;
    padding: 0;
    

    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.content .wrapper .left ul li {
    width: 250px;
    height: 60px;
    float: left;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.content .wrapper .left ul li .line {
    width: 10px;
    height: 60px;
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #c00;
}
.content .wrapper .left ul li:hover .line {
    width: 248px;
    transition: all 0.3s;
}
.content .wrapper .left ul li a {
    width: 248px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 18px;
    color: #333;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;

}
.content .wrapper .left ul li:hover a {
    color: #fff;
}



.content .wrapper .right {
    width: 1150px;
    float: right;
}
.content .wrapper .right .neirong {
    width: 1110px;
    padding: 20px;
    float: left;

}