.histWrap .tab{border-top: .1rem solid #cccccc; border-bottom: .1rem solid #cccccc; position: sticky; top: 0; z-index: 3; background-color: white;}
.histWrap .tab .menuUItab{max-width: 150rem; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.histWrap .tab .swiper-button-disabled{display: none;}
.histWrap .tab .prev,
.histWrap .tab .next{width: 3.5rem; height: 3.5rem; background-repeat: no-repeat; background-position: center center; background-size: cover; text-indent: -9999rem;}
.histWrap .tab .prev{background-image: url(../images/btn-prev.png);}
.histWrap .tab .prev:hover{background-image: url(../images/btn-prev-on.png);}
.histWrap .tab .next{background-image: url(../images/btn-next.png);}
.histWrap .tab .next:hover{background-image: url(../images/btn-next-on.png);}

.histWrap .tab .hist-cate{width: calc(100% - 7rem); overflow: hidden;}
.histWrap .tab .hist-cate .centermode{justify-content: center;}
.histWrap .tab .hist-cate .swiper-slide{position: relative; text-align: center;}
.histWrap .tab .hist-cate a{text-align: center; line-height: 8rem; font-size: 2.8rem; font-family: "pb"; color: #979797; display: inline-block; padding: 0 3rem; position: relative;}
.histWrap .tab .hist-cate a::after{content:""; display: block; position: absolute; left:0 ; bottom: 0; width: 0; height: .5rem; background-color: #2d2d2d; transition: width .5s;}
.histWrap .tab .hist-cate .active a,
.histWrap .tab .hist-cate a:hover{color: #2d2d2d}
.histWrap .tab .hist-cate .active a::after,
.histWrap .tab .hist-cate a:hover::after{width: 100%;}

.contWrap{line-height: 1.5; padding-top: 8.5rem; position: relative; padding-bottom: 20rem;}
.contWrap::after{content:""; display: block; position: absolute; right: 0; top: 0; width: 64%; height: 100%; background: #f8f8f8 url(../images/hist_background.png) no-repeat center bottom / 95%}
.contWrap .content-inner{position: relative; z-index: 2; max-width: 150rem; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; min-height: 50rem;}
.contWrap .history-content-box{width: 34.7%;}
.contWrap .history-title-box h1{font-size: 5rem; color: #111111; font-family: pb; display: inline-block; position: relative; padding-right: 2.4rem}
.contWrap .history-title-box h1::after{content:""; display: block; position: absolute; right: 0; top: .2rem; width: 1.7rem; height: 1.6rem; background: url(../images/ic-hist-dots.png) no-repeat center center / cover;}
.contWrap .history-title-box span{font-size: 3.4rem; color: #9a9a9a; font-family: pm; display: block; margin-top: -.7rem}
.contWrap .history-content{position: relative; border-radius: 1rem; overflow: hidden; width: 80.7%; margin-top: 1.9rem}
.contWrap .history-content.hidden{display: none;}
.contWrap .history-content .swiper-slide{padding-bottom: 71.43%; position: relative;}
.contWrap .history-content .swiper-slide img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.contWrap .history-content .history-pagination{position: absolute; left: 0; bottom: 1.2rem; width: 100%; z-index: 2; text-align: center;}
.contWrap .history-content .history-pagination .swiper-pagination-bullet{width: 1rem; height: 1rem; background-color: #cccccc; opacity: 1; margin: 0 .5rem;}
.contWrap .history-content .history-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #02a3da;}
.contWrap .history-content-text{overflow: hidden; width: 80.7%; margin-top: 1rem;}
.contWrap .history-content-text.hidden{display: none;}
.contWrap .history-content-text p{text-align: center; font-size: 1.8rem; color: #444444; font-family: pm; background-color: white;}
.contWrap .wrap-history{width: 65.3%;}
.contWrap .wrap-history li{display: flex; margin-bottom: 2rem; padding-left: 7.2rem; flex-wrap: wrap;}
.contWrap .wrap-history li:last-child{margin-bottom: 0;}
.contWrap .wrap-history li._noData{text-align: center; font-size: 1.8rem; color: #222222; font-family: pm; justify-content: center;}
.contWrap .wrap-history li .date{font-size: 1.8rem; color: #9a9a9a; font-family: psb; display: inline-block; padding-left: 1.3rem; position: relative; font-variant: tabular-nums; padding-right: 1.4rem;}
.contWrap .wrap-history li .date::before{Content:""; display: block; position: absolute; left: 0; top: 1.1rem; width: .5rem; height: .5rem; border-radius: 50%; background-color: #2d2d2d;}
.contWrap .wrap-history li p{font-size: 2rem; color: #2d2d2d; width: calc(100% - 13rem);}
.contWrap .wrap-history li p span{display: block; font-size: 1.6rem; color: #9a9a9a; font-family: pl;}

@media screen and (max-width: 1200px) {
    .contWrap{padding-top: 4rem;}
    .histWrap .tab .hist-cate a{font-size: 2rem; line-height: 6rem; padding: 0 2rem;}
    .contWrap .history-title-box h1{font-size: 4rem; word-break: break-all;}
    .contWrap .history-title-box span{font-size: 2.4rem;}
    .contWrap .history-content-text p{font-size: 1.6rem;}

    .contWrap .wrap-history li{padding-left: 5rem;}
    .contWrap .wrap-history li .date{font-size: 1.6rem; top: .2rem;}
    .contWrap .wrap-history li .date::before{top: .8rem;}
    .contWrap .wrap-history li p{font-size: 1.8rem;}
    .contWrap .wrap-history li p span{font-size: 1.4rem;}
}

@media screen and (max-width: 768px) {
    .contWrap{padding-top: 2rem; padding-bottom: 0;}
    .contWrap::after{display: none;}
    .histWrap .tab .hist-cate a{padding: 0 1rem;}
    .contWrap .content-inner{min-height: auto;}
    .contWrap .history-content-box{width: 100%;}
    .contWrap .history-title-box {text-align: center;}
    .contWrap .history-title-box h1{font-size: 3.5rem;}
    .contWrap .wrap-history{width: 100%; margin-top: 2.5rem; padding-top: 2.5rem; background: #f8f8f8 url(../images/hist_background.png) no-repeat center bottom / 95%; padding-bottom: 5rem;}
    .contWrap .wrap-history li{padding-left: 2rem; flex-direction: column;}
    .contWrap .wrap-history li p{margin-top: .5rem; width: 100%;}
    .contWrap .history-content{margin: 0 auto; margin-top: 1.5rem}
    .contWrap .history-content-text{margin: 0 auto; margin-top: 1rem;}
}

@media screen and (max-width: 600px) {
    .contWrap .history-content,
    .contWrap .history-content-text{width: 100%;}
}