
#banner{width:100vw;z-index:3;position:relative;/* overflow:hidden; */}
#banner .list_box{position:absolute;bottom: 50px;right: 0;width: 50%;z-index:99}
#banner .list_box .listList{display:grid;grid-template-columns:repeat(2,1fr);gap: 20px 100px;padding: 0 180px;}
#banner .list_box .listList li .Img img{min-width:auto;margin:0}
#banner .img{overflow:hidden;display:inline-block}
#banner img{position:relative;width: 100%;min-width:100vw;background:no-repeat 50% / cover}
#banner .pos_abs{width:100vw;min-width:100vw;top:0;}
#banner .info{min-width: 100%;height: 100%;display: flex;align-items: center;z-index: 20;}
#banner .info .txt *{color:var(--white);opacity:0;-webkit-transform:translateY(15px);transform:translateY(25px)}
#banner .info .txt .more_btn a{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
#banner .info .txt em{font-family:'Poppins',sans-serif;font-style:initial;margin-bottom:15px;letter-spacing:0.5px;font-weight:300}
#banner .info .txt h3{text-align:left;line-height: 130%;margin-top: 110px;position: relative;}
#banner .info .txt h3:before{content:"";width: 80px;height: 2px;background: #d2cfd3;display:block;position:absolute;top: -80%;left: 50%;transform: translate(-50%, -50%);}

#banner .info .txt h3 b{font-size: 45px;line-height: 130%;font-weight: 500;letter-spacing: 7px;color:#ffffff;position:relative;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;animation:fadeIn 1s both;-webkit-animation:fadeIn 1s both;}
#banner .info .txt h3 b:nth-child(1){color:var(--primary)}
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#banner .info .txt{transition:all 0.7s ease;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content: flex-start;padding:0;z-index:2;width: 650px;height: 61%;margin:auto;position:absolute;top:0px;left:0;right:0;bottom:0;align-items: center;}
#banner .info .txt h3,#banner .info .txt p{color:#4b4a4a;opacity:0;-webkit-transform:translateY(15px);transform:translateY(25px)}
#banner .info .txt article{text-align:center;font-family:'Roboto',sans-serif;font-size:22px;font-weight:600;text-transform:uppercase}
#banner .info .txt p{font-weight:600;font-size:24px;margin-top: 20px;margin-bottom: 40px;text-align:center;letter-spacing: 0px;}
#banner .info .txt p font{font-weight:500;font-size:36px;letter-spacing:5px;margin-bottom:10px;text-align:center}
#banner .info .txt p font b{font-weight:500;font-size:36px;vertical-align:baseline;color:var(--primary)}
#banner .info .txt .bannerBtn{opacity:0;margin-top:40px;display:block;width:220px;height:50px;pointer-events:auto;display:none}
#banner .info .txt .bannerBtn a{position:relative;color:#fff;display:block;width:100vw;min-width:100vw;letter-spacing:0.5px;overflow:hidden}
#banner .info .txt .bannerBtn .btnText:hover{color:#000}
#banner .info .txt .bannerBtn .btnText:hover::before{background-color:#eee}
#banner .info .txt .bannerBtn .btnText:hover span::before{border-color:transparent transparent transparent #000}
#banner .info .txt .bannerBtn .btnText:hover span::after{background-color:#000}
#banner .info .txt .bannerBtn .btnText::before{content:"";position:absolute;top:0;right:0;width:100vw;min-width:100vw;border:1px solid #fff;-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#banner .info .txt .bannerBtn .btnText{position:relative;height:50px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0px 25px;z-index:1;font-family:'Poppins',sans-serif;text-transform:uppercase;text-align:center;justify-content:center;font-size:13px;font-weight:400}
#banner .info .txt .bannerBtn span{position:absolute;top:50%;right:-5px;width:45px;-webkit-animation:btnArrow 1s cubic-bezier(0.4,0,0.6,1) infinite;animation:btnArrow 1s cubic-bezier(0.4,0,0.6,1) infinite}
#banner .info .txt .bannerBtn span::after{content:"";position:absolute;top:30%;left:0;margin-top:-1px;width:calc(100% - 5px);height:1px;background-color:#fff;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#banner a.pos_abs{z-index:2}
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s}
#banner .slick-current .info .txt p{transition-delay:.6s;-webkit-transition-delay:.6s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;animation:fadeIn 1s both;-webkit-animation:fadeIn 1s both}
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;-webkit-transform:translateX(0) scale(1);transform:translateX(0) scale(1);opacity:1;-webkit-transition:-webkit-transform 0.8s linear 0.5s,opacity 0.8s linear 0.5s;transition:transform 0.8s linear 0.5s,opacity 0.8s linear 0.5s}

#banner .itemlogo .logoImg img{
    width: 100%;
    min-width: 100%;
}
#banner .more_btn a{border-radius: 30px 0 30px 0px;}
#banner .bgs_box *{transition:unset;-webkit-transition:unset}
#banner .bgs_box >div img{min-width: auto;object-fit: contain;margin: 0 auto 0px;}

#banner .bgs_box >div:nth-child(1), #banner .bgs_box >div:nth-child(4){
    z-index: 10;
}
#banner .bgs_box >div:nth-child(2),#banner .bgs_box >div:nth-child(5) {z-index: 0;}
#banner .bgs_box >div:nth-child(5){}
#banner .bgs_box >div:nth-child(1) img {top: 6%;left: 7%;width: 414px;height: 414px;}
#banner .bgs_box >div:nth-child(2) img {top: -5%;left: 14%;width: 358px;height: 358px;}
#banner .bgs_box >div:nth-child(3) img {top: 8%;left: 69%;bottom: 20%;width: 256px;height: 256px;}
#banner .bgs_box >div:nth-child(4) img {top: 19%;left: 76%;width: 399px;height: 399px;}
#banner .bgs_box >div:nth-child(5) img {top: 23%;left: 74%;width: 402px;height: 402px;}
#banner .bgs_box >div:nth-child(6) img {top: 61%;right: -270px;width: 241px;height: 241px;left: auto;}
#banner .bgs_box >div:nth-child(7) img {top: auto;left: 69%;bottom: -68%;width: 171px;height: 171px;}
#banner .bgs_box >div:nth-child(8) img {top: 13%;right: -26%;left: auto;width: 1148px;height: 758px;}


/* arrow_bg */
#banner .arrow_bg{width:450px;height:140px;left:auto;bottom:-140px;transform-origin:100% 100% 0;display:none}
#banner .arrow{width:50px;display:flex;justify-content:space-between;padding:0 30px;position:absolute;z-index:10;flex-direction:column;left:0%;top:65%;-webkit-transform:translateY(-50%);transform:translateY(-50%);display: none;}
#banner .arrow a{width:45px;height:45px;line-height:55px;border:1px solid #fff;border-radius:50%;display:flex;opacity:.65;flex-direction:column;justify-content:center;align-items:center;margin:5px}
#banner .arrow a.prev{-webkit-transform:rotate(180deg)}
#banner .arrow a svg{fill:#ffffff;width:13px}
#banner .arrow a:hover{opacity:1;background-color:var(--primary);border:1px solid var(--primary)}
#banner .arrow a i{color:#fff}

/* scrollBtn */
@keyframes web_menu002{0%{transform:translate(0px,0px)}
50%{transform:translate(0px,15px)}
100%{transform:translate(0px,0px)}
}.page-scroll{bottom: 70px;margin-left:0;z-index:888;text-align:center;position:absolute;left: 2%;transform:translate(-50%,-50%)}
.page-scroll a{color:#fff;letter-spacing:.1em;text-decoration:none;-webkit-transition:opacity .3s;transition:opacity .3s;text-transform:uppercase;display:flex;flex-direction:column;animation:web_menu002 ease-in-out 2s infinite;animation-direction:alternate}
.page-scroll.style01 a b{color: #ffffff;font-weight: 500;font-size:13px;letter-spacing: 3.5px;writing-mode: vertical-rl;font-family: Tenor Sans, sans-serif;}
.page-scroll.style01 a span::after{content:"";position:absolute;top:-10px;right:0;z-index:1;width:1px;height:40px;background: #ffffff;background-size:cover;background-repeat:no-repeat;animation:scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite;-webkit-animation:scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite}
@keyframes scrollarrow1{0%{transform:translateY(-150%)}
50%{transform:translateY(0%)}
to{transform:translateY(500%)}
}
@-webkit-keyframes scrollarrow1{0%{-webkit-transform:translateY(-150%)}
50%{-webkit-transform:translateY(0%)}
to{-webkit-transform:translateY(500%)}
}
.page-scroll.style01 a span{position:absolute;right:0;background: linear-gradient(to top, #ffffff00 0%, #ffffff 160%);background-size:cover;background-repeat:no-repeat;width:1px;height: 90px;top: 130%;left:50%;transform:translate(-50%,0%);overflow:hidden}
#menubg[data-type="1"]#banner:after{position:absolute;bottom: -60px;content:"";width: 340px;height: 60px;background: #902a96;z-index: 0;-webkit-transition:all 0.5s;transition:all 0.5s;left: 0;clip-path: polygon(100% 0%, 85% 100%, 0% 0%);}


#banner .slick-dots{bottom:0;width: 70px;display: flex !important;flex-direction: column;align-items: center;height: 100%;justify-content: center;position: absolute;gap: 30px 20px;}
#banner .slick-dots li{width: auto;height: auto;}
#banner .slick-dots li:before{content:'◆';font-size: 18px;color: var(--black);opacity: .15;border: none;}
#banner .slick-dots li.slick-active:before{color: var(--primary);opacity: 1;border: none;}
#banner:before{position:absolute;bottom: -60px;content:"";width: 288px;height: 340px;background: linear-gradient(to top, #5b1260 0%,  #b995bb  160%);z-index:2;-webkit-transition:all 0.5s;transition:all 0.5s;left: 0;opacity: 1;clip-path: polygon(100% 100%, 0 100%, 0 0%);}
#banner:after{position:absolute;bottom: -60px;content:"";width: 340px;height: 60px;background: #902a96;z-index: 0;-webkit-transition:all 0.5s;transition:all 0.5s;left: 0;clip-path: polygon(100% 0%, 85% 100%, 0% 0%);}



@media screen and (max-width: 1560px) {
    #banner .info .txt h3{font-size:42px;margin-top: 70px;}
   #banner .info .txt h3 b{
    font-size: 32px;
}
    #banner .info .txt h3:before{
    top: -15%;
}
    #banner .slick-current .info .txt p{margin-top: 10px;margin-bottom: 30px;}
    #banner img{width:100%;height: 100vh;background:no-repeat 50% / cover}
	#banner .itemlogo .logoImg img{
    height: auto;
    width: 74%;
    min-width: 70%;
    margin: auto;
}
    #banner .list_box .listList li .Img img{height:auto}
	#banner .list_box .listList{
    gap: 20px 60px;
    padding: 0 90px;
}
 	#banner .info .txt{height: 55%;width: 560px;}

#banner .bgs_box >div:nth-child(1) img {top: 6%;left: 3%;width: 284px;height: 284px;}
#banner .bgs_box >div:nth-child(2) img {top: -5%;left: 9%;width: 268px;height: 268px;}
#banner .bgs_box >div:nth-child(3) img {top: 5%;left: 73%;bottom: 20%;width: 166px;height: 166px;}
#banner .bgs_box >div:nth-child(4) img {top: 12%;left: 79%;width: 249px;height: 249px;}
#banner .bgs_box >div:nth-child(5) img {top: 14%;left: 77%;width: 272px;height: 272px;}
#banner .bgs_box >div:nth-child(6) img {top: 61%;right: -150px;width: 171px;height: 171px;left: auto;}
#banner .bgs_box >div:nth-child(7) img {top: auto;left: 73%;bottom: -63%;width: 141px;height: 141px;}
#banner .bgs_box >div:nth-child(8) img {top: 0;right: -22%;left: auto;width: 1148px;height: 758px;}
#banner .bgs_box >div:nth-child(8){
    z-index: -1;
}
}

@media screen and (max-width: 1280px) {
    #banner img{margin:60px auto 0px;width:100%;height:80vh}
    #scrollBtn,#banner:before,#banner:after{display:none}
    #banner .info .txt h3 b{font-size: 29px;}
    #banner .info .txt p{font-size: 18px;}
    #banner .info .txt{height: 45%;width: 480px;}
    #banner .info .txt .bannerBtn{width:180px;margin-top:20px}
    #banner .info .txt .bannerBtn span::after{width:calc(100% - 25px)}
    #banner .info .txt .bannerBtn span{right:-25px;width:40px}
}

@media (max-width: 1180px) {
    #banner .info .txt .bannerBtn{margin-top:20px}
#banner .bgs_box >div:nth-child(1) img {top: 6%;left: 3%;width: 204px;height: 204px;}
#banner .bgs_box >div:nth-child(2) img {top: -2%;left: 8%;width: 184px;height: 184px;}
#banner .bgs_box >div:nth-child(3) img {top: 5%;left: 73%;bottom: 20%;width: 166px;height: 166px;}
#banner .bgs_box >div:nth-child(4) img {top: 12%;left: 82%;width: 209px;height: 209px;}
#banner .bgs_box >div:nth-child(5) img {top: 14%;left: 79%;width: 212px;height: 212px;}
#banner .bgs_box >div:nth-child(6) img {top: 61%;right: -90px;width: 171px;height: 171px;left: auto;}
#banner .bgs_box >div:nth-child(7) img {top: auto;left: 79%;bottom: -68%;width: 141px;height: 141px;}
#banner .bgs_box >div:nth-child(8) img {top: 0;right: -22%;left: auto;width: 1148px;height: 758px;}

}

@media screen and (max-width: 1140px) {
    #banner:before,#banner .arrow,#banner .slick-dots{display:none}
    #banner .arrow{right:0}
    #banner img{}
    #banner:after{height:237px;width:609px}
    #banner .info .txt p font b,#banner .info .txt p font{font-size:25px}
    	#banner .list_box .listList{
    gap: 20px 50px;
    padding: 0 50px;
}
}

@media screen and (max-width: 960px) {
    #banner .info .txt h3{font-size:30px;}
    #banner .info .txt p{font-size:15px}
    #banner .info .txt .bannerBtn a{width:200px}
    #scrollBtn{display:none}
	#banner .slick-current .info .txt p{font-size: 18px;margin-top:10px;margin-bottom:30px}
    #banner .info .txt h3 b{font-size: 30px;}
    #banner .info .txt{height: 38%;width: 500px;}
    #banner .list_box{bottom: 20px;width: 70%;margin: auto;}
#CalendarBox .newsinfo li .innewsitem{
    gap: 20px 20px;
}
    #CalendarBox .newsinfo li .dateBox .year, #CalendarBox .newsinfo li .dateBox .date{
    font-size: 14px;
}
    #CalendarBox .newsinfo li .dateBox .date{
    font-size: 21px;
}
    #CalendarBox .newsinfo li .dateBox::after{
    right: -15px;
}
    #CalendarBox{
    padding: 14px 80px;
    bottom: -90px;
    width: 80%;
}
    #CalendarBox .newsinfo li .textBox h3{
    font-size: 15px;
}
        #CalendarBox .arrow{
    width: 88%;
}
    #banner .bgs_box >div:nth-child(1) img {top: 6%;left: 1%;width: 164px;height: 164px;}
#banner .bgs_box >div:nth-child(2) img {top: 0%;left: 5%;width: 164px;height: 164px;}
#banner .bgs_box >div:nth-child(3) img {top: 5%;left: 70%;bottom: 20%;width: 166px;height: 166px;}
#banner .bgs_box >div:nth-child(4) img {top: 14%;left: 85%;width: 169px;height: 169px;}
#banner .bgs_box >div:nth-child(5) img {top: 19%;left: 83%;width: 172px;height: 172px;}
#banner .bgs_box >div:nth-child(6) img {top: 71%;right: 20px;width: 141px;height: 141px;left: auto;}
#banner .bgs_box >div:nth-child(7) img {top: auto;left: 87%;bottom: -73%;width: 131px;height: 131px;}
#banner .bgs_box >div:nth-child(8) img {top: 0;right: -22%;left: auto;width: 1148px;height: 758px;}

}

@media screen and (max-width: 560px) {
    #banner .more_btn{}
    #banner .info .txt{width: 78%;height: 37%;display: flex;justify-content: flex-start;}
    #banner .info .txt article{font-size:18px;font-weight:300}
    #banner .info .txt p font,#banner .info .txt p font b{font-size:20px}
    #banner:after{height:237px;width:380px}
    #banner .slick-current .info .txt p{letter-spacing: 0.2px;margin-top: 5px;font-size: 16px;margin-bottom: 12px;}
    #banner img{margin: 60px auto 0  0;height: 60vh;}
    #banner .info .txt .bannerBtn{width:120px}
    #banner .info .txt .bannerBtn .btnText{padding:0px 5px;height:40px}
    #banner .list_box{width:80%;right:0;left:50%;transform:translate(-50%,0%);bottom:20px}
    #banner .bgs_box >div:nth-child(1) img {top: 7%;left: -4%;width: 114px;height: 114px;}
#banner .bgs_box >div:nth-child(2) img {top: 0%;left: 5%;width: 104px;height: 104px;}
#banner .bgs_box >div:nth-child(3) img {top: 5%;left: 70%;bottom: 19%;width: 106px;height: 106px;}
#banner .bgs_box >div:nth-child(4) img {top: 14%;left: 82%;width: 119px;height: 119px;}
#banner .bgs_box >div:nth-child(5) img {top: 16%;left: 81%;width: 132px;height: 132px;}
#banner .bgs_box >div:nth-child(6) img {top: 87%;right: 20px;width: 101px;height: 101px;left: auto;}
#banner .bgs_box >div:nth-child(7) img {top: auto;left: 80%;bottom: -83%;width: 111px;height: 111px;}
#banner .bgs_box >div:nth-child(8) img {top: 0;right: 0;left: auto;width: 100%;height: 100%;}
#banner .info .txt h3{
    margin-top: 50px;
}
    #banner .info .txt h3:before{
    display: none;
}
    #banner .info .txt h3 b{
    font-size: 19px;
    letter-spacing: 4px;
}
}
@media screen and (max-width: 480px) {
    #banner .list_box{width: 80%;}
    #banner .list_box .listList{padding: 0;}
}