.s_menu { border-bottom: 1px solid #eee; } 
.s_menu ul { display: flex; justify-content: center; } 
.s_menu ul > li { flex: 1 1 100%; } 
.s_menu ul > li .t1 { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 85px; height: 100%; padding: 10px 5px; font-size: 20px; color: #999; line-height: 150%; text-align: center;word-break: keep-all;} 
.s_menu ul > li.act .t1 { position: relative; font-weight: bold; color: #fff !important; background: var(--color-point); } 

.br620 { display: none; } 

@media (max-width: 1540px){
 .s_menu ul > li .t1 { min-height: 80px; font-size: 16px; } 
 }
 @media (max-width: 1024px){
 .s_menu ul > li .t1 { min-height: 57px; } 
 }
@media (max-width: 768px) { /* .s_menu .inner.container { width: 100%; } 
 .s_menu ul { justify-content: start; gap: 0 60px; overflow-x: auto; padding: 0 5%; } 
 .s_menu ul > li { flex-shrink: 0; width: auto; } 
 .s_menu ul > li .t1 { padding: 10px 0; } */ } 
@media (max-width: 620px){
 .br620 { display: block; } 

 .s_menu ul { } 
 .s_menu .inner { padding: 0; } 
 .s_menu ul > li .t1 { min-height: 55px; font-size: 12px; } 
 }

.history_wrap { position: relative; padding-bottom: 20rem; } 
.history_wrap .s_menu { z-index: 10; position: sticky; top: var(--header-hei); left: 0; background-color: var(--color-bg); } 
.history_wrap .history_inner { position: relative; display: flex; align-items: start; gap: 0 200px; margin-top: 150px; } 
.history_wrap .history_inner .thum_cont { flex-shrink: 0; position: sticky; top: calc(2rem + var(--header-hei) * 2 ); left: 0; width: calc(50% - 100px); } 
.history_wrap .history_inner .txt_cont { position: relative; width: 100%; } 
.history_wrap .thum_item { opacity: 0; height: 0; text-align: center; } 
.history_wrap .thum_item .year { font-size: 70px; font-weight: bold; color: #000; line-height: 110%; } 
.history_wrap .thum_item .year .count_num { display: inline-block; vertical-align: middle; } 
.history_wrap .thum_item .year .count_num .num { overflow: hidden; display: inline-flex; flex-direction: column; height: 77px; vertical-align: middle; } 
.history_wrap .thum_item .year .count_num .num .n { display: block; font-size: 70px; font-weight: bold; color: #000; line-height: 110%; } 
.history_wrap .thum_item .year .count_num .num:nth-child(2n) { flex-direction: column-reverse; } 
.history_wrap .thum_item .tit { margin-top: 1rem; font-size: var(--font-28); color: var(--color-point) !important; } 
.history_wrap .thum_item .his_img_slide { position: relative; margin-top: 3rem; } 
.history_wrap .thum_item .his_img_slide .his_img_mask { transition: clip-path 1s; overflow: hidden; clip-path: ellipse(50% 0% at 50% 100%); } 
.history_wrap .thum_item .his_img_slide .his_img_mask .item { aspect-ratio: 649/479; } 
.history_wrap .thum_item .his_img_slide .his_img_mask .item .img { overflow: hidden; height: 100%; border-radius: 16px;} 
.history_wrap .thum_item .his_img_slide .his_img_mask .item .img > img { object-fit: cover; width: 100%; height: 100%; } 
.history_wrap .thum_item .his_img_slide .bullet { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 5; display: flex; gap: 10px; justify-content: center; } 
.history_wrap .thum_item .his_img_slide .bullet .swiper-pagination-bullet { opacity: 1; display: block; width: 10px; height: 10px; margin: 0; background-color: rgba(0, 0, 0, 0.3); } 
.history_wrap .thum_item .his_img_slide .bullet .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } 
.history_wrap .thum_item.act { opacity: 1; height: auto; } 
.history_wrap .thum_item.act .year .count_num .num:nth-child(2n-1) .n { animation: count-down 2s forwards; } 
.history_wrap .thum_item.act .year .count_num .num:nth-child(2n) .n { animation: count-up 2s forwards; } 
.history_wrap .thum_item.act .his_img_slide .his_img_mask { clip-path: ellipse(150% 150% at 50% 100%); } 
.history_wrap .bar_bg { position: absolute; top: 0; left: -100px; width: 2px; height: 100%; background-color: #ddd; } 
.history_wrap .bar_bg .ani_bar { position: relative; display: inline-flex; align-items: flex-end; width: 100%; background-color: var(--color-point) !important; } 
.history_wrap .bar_bg .ani_bar .ico { transform: translateX(-50%); flex-shrink: 0; display: block; width: 60px; height: 60px; margin-left: 1px; background: url(/theme/basic/img/sub/sub1/hi-sim.svg)no-repeat center/contain; } 
.history_wrap .history_lst > ul > li + li { margin-top: 150px; } 
.history_wrap .history_item dl { display: flex; gap: 0 10px; } 
.history_wrap .history_item dl dt { flex-shrink: 0; width: 120px; font-size: 20px; font-weight: bold; color: #000; line-height: 150%; } 
.history_wrap .history_item dl dd { width: 100%; } 
.history_wrap .history_item dl dd .t1 { font-size: 20px; line-height: 150%; } 
.history_wrap .history_item dl + dl { margin-top: 40px; } 

 @media screen and (min-width: 1240px) and (max-height: 800px){
 .history_wrap .history_inner .thum_cont { top: 100px; } 
 .history_wrap .thum_item .year { font-size: 48px; } 
 .history_wrap .thum_item .year .count_num .num { height: 52px; } 
 .history_wrap .thum_item .year .count_num .num .n { font-size: 48px; } 
 .history_wrap .thum_item .tit { margin-top: 10px; font-size: 20px; } 
 .history_wrap .thum_item .his_img_slide { margin-top: 30px; } 
 .history_wrap .thum_item .his_img_slide .his_img_mask .item { aspect-ratio: unset; height: 55vh; } 
 }
@media (max-width: 1540px){
 .history_wrap .history_inner { gap: 0 150px; } 
 .history_wrap .history_inner .thum_cont { width: calc(50% - 75px); } 
 .history_wrap .thum_item .year { font-size: 48px; } 
 .history_wrap .thum_item .year .count_num .num { height: 52px; } 
 .history_wrap .thum_item .year .count_num .num .n { font-size: 48px; } 
 .history_wrap .thum_item .tit { margin-top: 10px; font-size: 20px; } 
 .history_wrap .thum_item .his_img_slide { margin-top: 30px; } 
 .history_wrap .bar_bg { left: -75px; } 
 .history_wrap .bar_bg .ani_bar .ico { width: 40px; height: 40px; background-size: cover; } 
 .history_wrap .history_item dl dt { width: 100px; font-size: 16px; } 
 .history_wrap .history_item dl dd .t1 { font-size: 16px; } 
 .history_wrap .history_item dl + dl { margin-top: 30px; } 
 }
 @media (max-width: 1024px){
 .history_wrap .history_inner { gap: 80px; } 
 .history_wrap .history_inner .thum_cont { top: calc(140px + 5vh); width: 40%; } 
 .history_wrap .thum_item .year { font-size: 26px; } 
 .history_wrap .thum_item .year .count_num .num { height: 29px; } 
 .history_wrap .thum_item .year .count_num .num .n { font-size: 26px; } 
 .history_wrap .thum_item .tit { font-size: 14px; } 
 .history_wrap .thum_item .his_img_slide .bullet { bottom: 15px; gap: 7px; } 
 .history_wrap .thum_item .his_img_slide .bullet .swiper-pagination-bullet { width: 7px; height: 7px; } 
 .history_wrap .bar_bg { left: -40px; } 
 }

 @media (max-width: 1024px){
 .history_wrap .history_inner { margin-top:90px; } 
 }

@media (max-width: 767px){
 .history_wrap .history_inner { flex-wrap: wrap; gap: 20px; margin-top: 0; } 
 .history_wrap .history_inner .thum_cont { z-index: 5; top: calc(var(--header-hei) + 20px); width: 100%; padding: 50px 0 10px; background-color: #fff; } 
 .history_wrap .history_inner .txt_cont { width: 100%; padding-left: 40px; } 
 .history_wrap .thum_item .year { font-size: 20px; } 
 .history_wrap .thum_item .year .count_num .num { height: 22px; } 
 .history_wrap .thum_item .year .count_num .num .n { font-size: 20px; } 
 .history_wrap .thum_item .tit { margin-top: 5px; } 
 .history_wrap .thum_item .his_img_slide { margin: 10px auto 0; width: 60%; } 
 .history_wrap .thum_item .his_img_slide .bullet { bottom: 10px; gap: 5px; } 
 .history_wrap .thum_item .his_img_slide .bullet .swiper-pagination-bullet { width: 5px; height: 5px; } 
 .history_wrap .bar_bg { left: 15px; } 
 .history_wrap .bar_bg .ani_bar .ico { width: 30px; height: 30px; } 
 .history_wrap .history_lst > ul > li + li { margin-top: 75px; } 
 .history_wrap .history_item dl { gap: 0 5px; } 
 .history_wrap .history_item dl dt { width: 70px; } 
 .history_wrap .history_item dl dd .t1 { } 
 .history_wrap .history_item dl + dl { margin-top: 20px; } 
 }
@media (max-width: 620px){
 .history_wrap .history_inner { margin-top: 0 } 
 .history_wrap .history_inner .thum_cont {  top: calc(var(--header-hei) + 55px); padding-top: 35px;} 
 }
@media (max-width: 480px){
 .history_wrap { padding-bottom: 10rem; } 
 }

@keyframes count-down { 
 0% { transform: translate3d(0, -900%, 0); } 
 100% { transform: translate3d(0, 0, 0); } 
 }
@keyframes count-up { 
 0% { transform: translate3d(0, 900%, 0); } 
 100% { transform: translate3d(0, 0, 0); } 
 }