@font-face {
    font-family: '7led';
    src: url('/70th/fonts/7led.eot') format('embedded-opentype'),
    url('/70th/fonts/7led.woff') format('woff'),
    url('/70th/fonts/7led.woff2') format('woff2'),
    url('/70th/fonts/7led.ttf') format('truetype'),
    url('/70th/fonts/7led.svg') format('svg');
}

@font-face {
    font-family: 'hyc1gj';
    src: url('/70th/fonts/hyc1gj.eot') format('embedded-opentype'),
    url('/70th/fonts/hyc1gj.woff') format('woff'),
    url('/70th/fonts/hyc1gj.woff2') format('woff2'),
    url('/70th/fonts/hyc1gj.ttf') format('truetype'),
    url('/70th/fonts/hyc1gj.svg') format('svg');
}

/* html{font-size: calc(100vw / 19.2);} */

.sizer1{width: 3.24rem;}
.sizer2{width: 6.62rem;}
.sizer3{width: calc(100% - 3.66rem );/* max-width: 1550px; */}

.content{background: url(/70th/images/bg.png) center no-repeat;background-size: cover;width: 100%;height: 100vh;position: relative;overflow: hidden;}
.video_bg{position: absolute;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;width: 100%;height: 100%;object-fit: cover;}
.logo{display: block;position: absolute;left: .54rem;top: .35rem;z-index: 11;width: 2.51rem;font-size: 0;}

#fireworks{position: absolute;width: 100%;height: 100%;z-index: 1;}

#canvas{position: absolute;width: 100%;height: 100%;z-index: 4;}

.bg_cover{background: url(/70th/images/cover1.png) center no-repeat;position: absolute;width: 100%;height: 100%;z-index: 2;opacity: 1;background-size: 9.77rem auto;
    transition: all ease-in-out .5s;-ms-transition: all ease-in-out .5s;-moz-transition: all ease-in-out .5s;-webkit-transition: all ease-in-out .5s;-o-transition: all ease-in-out .5s;}
.stage3 .bg_cover{opacity: 0;}

.scroll_box{position: absolute;left: 50%;top: 50%;transform:translateX(-50%) translateY(-50%);z-index: 10;margin-top: .60rem;}
.scroll_box .cover{z-index: 10;cursor: pointer;position: relative;float: left;width: 2.99rem;height: 7.74rem;}
.scroll_box .cover img{width: 100%;display: block;}

.stage2_logo{z-index: 1; display: block;position: absolute;left: 50%;top: 50%;transform:translateX(-50%) translateY(-50%);width: 4.90rem;height: 4.90rem;background: url(/70th/images/cover2.png) center no-repeat;margin: 1.00rem 0 0 1.20rem;opacity: 0;transition: all ease-in-out .7s;-ms-transition: all ease-in-out .7s;-moz-transition: all ease-in-out .7s;-webkit-transition: all ease-in-out .7s;-o-transition: all ease-in-out .7s;background-size: cover;}
.stage2_logo img{position: absolute;left: 50%;top: 50%;transform:translateX(-50%) translateY(-50%);width: calc(252% / 4.9);}
.stage2 .stage2_logo{opacity: 1;margin-top: 0;}

.rt_top{color: #8c0000;display: none;}
.rt_top .home{display: block;padding: 0 0 0 .26rem;background: url(/70th/images/home.png) left center no-repeat;color: #8c0000;background-size: .22rem;}
.rt_top .count span{font-family: '7led';}

.nav_more{position: absolute;right: 0;top: -.88rem;width: .48rem;height: .48rem;border-radius: 50%;background: #f8a691;border: 10px solid #fcd8b8;opacity: 0;}
.nav_more span{display: block;width: .03rem;height: .25rem;position: absolute;left: 50%;top: 50%;transform:translateX(-50%) translateY(-50%);background: #a20101;border-radius: 2px;}
.nav_more span:first-child{margin-left: -.10rem;}
.nav_more span:last-child{margin-left: .10rem;}

.index_01{margin: 0 0 0 3.20rem;position: relative;z-index: 10;display: none;}
.index_01 .swiper{margin: 1.94rem -5.00rem 0 0;white-space: nowrap;}
.index_01 li{width: 2.10rem;position: relative;}
.index_01 .item{margin: 0 .26rem 0 0;white-space: normal;position: relative;overflow: hidden;box-shadow: 5px 8px 6px rgba(0, 0, 0, .2);}
.index_01 .img{padding-bottom: 213%;transition: all ease-in 0.2s;-ms-transition: all ease-in 0.2s;-moz-transition: all ease-in 0.2s;-webkit-transition: all ease-in 0.2s;-o-transition: all ease-in 0.2s;}
.index_01 .img:hover{transform: scale(1.05);-ms-transform: scale(1.05);-moz-transform: scale(1.05);-webkit-transform: scale(1.05);-o-transform: scale(1.05);}
.index_01 .title{margin: 0 0 0;position: absolute;left: .13rem;top: .25rem;color: #fff;width: .5em;line-height: 1.1;font-family: 'hyc1gj';word-break: break-all;text-align: center;padding: 0 0.5em 0 0;}
.index_01 .more{position: absolute;bottom: 0;right: .12rem;color: #fff;width: 1em;line-height: 1.1;}
.index_01 .more::after{content: '';display: block;width: 1px;height: .25rem;background: #fff;margin: .10rem auto 0;}

.index_01 .subject{position: absolute;top: 110%;left: 50%;transform: translateX(-50%);max-width: 85%;}

/* .stage3 .index_01::before{content: '';display: block;background: url(/70th/images/);} */
/* .stage3 .index_01 li{}
.stage3 .index_01 li:nth-child(2){animation-delay: 1.5s;}
.stage3 .index_01 li:nth-child(3){animation-delay: 1.6s;}
.stage3 .index_01 li:nth-child(4){animation-delay: 1.7s;}
.stage3 .index_01 li:nth-child(5){animation-delay: 1.8s;}
.stage3 .index_01 li:nth-child(6){animation-delay: 1.9s;} */
.stage3 .index_01{display: block;animation: index_01 .8s linear both 1.4s;}
@keyframes index_01 {
    0% { left: 8.00rem; opacity: 0;}
    100% { left: 0; opacity: 1; }
}

.stage3 .rt_top{display: block;animation: rt_top .5s linear both 1s;margin-top: .40rem;}
@keyframes rt_top {
    0% { top: 1.00rem; opacity: 0;}
    100% { top: 0; opacity: 1; }
}

.stage3 .nav_more{display: block;animation: nav_more 1.4s linear both 2.4s;}
@keyframes nav_more {
    0% { opacity: 0;}
    100% { opacity: 1; }
}


/* @media screen  and (max-width:1740px){
    .index_01 li{width: 180px;}
    .index_01 .subject{top: 110%;}
}
@media screen  and (max-width:1640px){
    .index_01 .swiper{max-width: 100%;}
}
@media screen  and (max-width:1480px){
    .sizer1{width: 260px;}
    .sizer2{width: 560px;}
    .sizer3{width: calc(100% - 20px);}
    .scroll_box .cover{width: 220px;}
    
    .logo{width: 30vw;}

    .index_01 .swiper{padding: 20px;width: 900px;}

    .stage2_logo{width: 300px;height: 300px;margin: 80px 0 0 80px;}

    .stage3 .rt_top{margin-top: 0;}
    .rt_top .home{line-height: 18px;background-size: auto 100%;padding: 0 0 0 22px;}
    .rt_top .home .title{font-size: 18px;}
    .rt_top .count{font-size: 22px;}

    .index_01{margin: 0 0 0 230px;}
    .index_01 .swiper{margin-top: 100px;}
    .index_01 .subject{top: 105%;}

} */
@media screen  and (max-width:992px){
    .logo{width: 50vw;left: 20px;top: 20px;}

    /* .scroll_box .cover{width: auto;height: 80vh;} */
    /* .scroll_box .cover img{height: 100%;display: block;} */
    .stage3 .scroll_box .cover{margin-left: -100%;transition: all ease-in-out .8s;-ms-transition: all ease-in-out .8s;-moz-transition: all ease-in-out .8s;-webkit-transition: all ease-in-out .8s;-o-transition: all ease-in-out .8s;}
    .bg_cover{background-size: 80% auto;}
    .scroll_box{margin-top: 0;}
    .sizer3{width: 100%;}

    .stage3 .index_01{margin: 0 20px;}
}

@media screen  and (max-width:767px){
    .logo{width: calc(100vw - 114px);max-width: 300px;}

    #canvas,.scroll_box .cover{display: none;}
    .scroll_box{left: 0;right: 0;top: 46px;bottom: 0;transform: none;width: auto !important;position: absolute;margin: 20px 0 ;padding: 20px;}

    .rt_top{display: block;left: 20px;right: 20px;}
    .rt_top .home{color: #fff;background-image: url(/70th/images/home_w.png);float: right;margin: 0 0 30px;}
    .rt_top .home .title{font-size: 0;}
    .rt_top .count{font-size: 16px;color: #fff;clear: both;}

    .index_01{display: block;margin: 80px 0 0;clear: both;max-height: calc(100vh - 180px);overflow: auto;}
    .index_01 .swiper{margin: 0;max-width: initial;width: auto;white-space: normal;padding: 0;}
    .index_01 li{width: 50%;}
    .index_01 .item{margin: 0 15px 30px;}
    .index_01 .subject{position: relative;left: 0;right: 0;top: 0;bottom: 0;transform: none;display: block;margin: 0 auto;filter: brightness(100);}
}