@property --width {
    syntax: "<length>";
    initial-value: 35px;
    inherits: false;
}

a:link,a:active,a:visited,a:hover {
    /* background: none; */
    tap-highlight-color: rgba(0,0,0,0);
    tap-highlight-color: transparent;
}

*{ tap-highlight-color: rgba(0,0,0,0);
    tap-highlight-color: transparent;}

body{padding-top: 40px !important;min-width: 1200px;background-color:#ffc000;}
.warp{width: 100%;min-width: 1200px;position: relative;overflow: hidden;}
.bg{position: absolute;width: 1920px;height: 3507px;left: calc(50% - 1920px/2);z-index: 10;}
.bgbox{width: 1920px;height:3507px;}
.bg_01{background: url("../images/bg.jpg") no-repeat 50% 0;}

.slogan{
    position: absolute;background: url(../images/slogan.png);width: 984px;height:484px ;left: calc(50% - 492px);top: 125px; z-index: 10;
}
/* .slogan .btn-play {width:108px;height:94px;background: url(../images/btn-play.png) no-repeat 0 0;left:530px;top:125px;filter: drop-shadow(0 0 var(--width) #fff) drop-shadow(0 0 var(--width) #fff);animation: breath 1.5s linear infinite;}
.slogan .btn-play:hover {transform: scale(1.1);}
@keyframes breath {
    0%,100% { --width: 0px; }
    50% { --width: 15px; }
} */
.item{
    position: absolute;background: url(../images/item.png);width: 576px;height:241px ;left: calc(50% - 288px);top: 660px; z-index: 10;
}
.con1{
    position: absolute;
    background: url(../images/con1.png) no-repeat 50% 0;
    width: 1074px;
    height: 516px;
    margin-left: calc(50% - 1074px / 2);
    top: 1050px;
    z-index: 20;
}
.act-title{
    position: absolute;
    background: url(../images/event-title.png) no-repeat 50% 0;
    width: 515px;
    height: 69px;
    margin-left: calc(50% - 515px / 2);
    top: 1655px;
    z-index: 20;
}
.acts {position: relative;display: flex;flex-wrap: wrap;justify-content: space-around;padding-bottom: 25px;width: 1124px;left: calc(50% - 1124px/2);padding-top: 1750px;z-index: 20;}
.slide {width: 1124px;margin-bottom:0px;transition:all .5s !important;position: relative;background-repeat: no-repeat !important;overflow: hidden;margin-bottom: 20px;z-index:10}
.slide.mutil {cursor: pointer;}
.slide1{background: url("../images/1.png") no-repeat 50% 0;height:205px;}
.slide2{background: url("../images/2.png") no-repeat 50% 0;height:205px;}
.slide3{background: url("../images/3.png") no-repeat 50% 0;height:205px;}
.slide4{background: url("../images/4.png") no-repeat 50% 0;height:205px;}
.slide5{background: url("../images/5.png") no-repeat 50% 0;height:385px}
.slide6{background: url("../images/6.png") no-repeat 50% 0;height:385px}

.sidebar{position: fixed;z-index: 100;left: 0;bottom: 0;top: 43px;}
.topM{z-index: 9998;}
.side_list{position: relative;width: 139px;background: rgba(69,158,213,.8); height: 1153px;transition: margin-left 0.5s;margin-left: 0;}
.side_list .logo{width: 119px;height:105px;display: flex;position: relative;left: calc(50% - 119px/2); justify-content: center;align-items: center; background: url(../images/logo.png);top: 30px;}
#sideBtn{position: absolute;left:calc(100%);top: 45px;width: 40px;height: 40px;cursor: pointer;outline: none;z-index: 9;background:rgba(69,158,213,.8) ;}
#sideBtn::after {content: " ";height: 40px;width: 40px;display:block;visibility: visible;background: url(../images/nav-btn.png) no-repeat; background-position:0px  0px;}
#sideBtn.on::after{background-position:-40px 0px;}
#sideBtn.on + .side_list{margin-left: -215px;}

.act_list{width: 100%;}
.act_list ul{width: 100%;}
.act_list li{width: 100%;height: 140px;position: relative;}
.act_list .on a,.act_list a:hover{filter: grayscale(0);}

.act_list a{filter: grayscale(1);display: block;font-size: 0;width:116px;}

.act_list ul li:nth-child(1) a{background: url(../images/nav1.png)no-repeat;width:116px;height:120px ;margin-top:80px;margin-left: calc(50% - 116px/2);}
.act_list ul li:nth-child(2) a{background: url(../images/nav2.png)no-repeat;width:136px;height:115px ;margin-top:50px;margin-left: calc(50% - 136px/2);}
.act_list ul li:nth-child(3) a{background: url(../images/nav3.png)no-repeat;width:116px;height:137px;margin-top: 15px;margin-left: calc(50% - 116px/2);}

.jqqd{
    background: url(https://img1.tiancitycdn.com/project2/krmgt/2023/03/kr230316act/images/pop.png);
    width:574px ;height:310px;
}
.jqqd p{
    position: absolute;
    width:574px ;
    font-size: 65px;
    color: white;
    font-weight: bold;
    text-align: center;
    height: 100px;
    top: 65px;
}
.jqqd span{
    white-space: nowrap;
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    line-height: 40px;
    font-size: 70px;
    font-weight: 600;
    color: white;
}
.jqqd p{
    white-space: nowrap;
    position: absolute;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    line-height: 40px;
    font-size: 35px;
    font-weight: 600;
    color: white;
}
.close1{
    position: absolute;
    width: 100px;height:50px ;
    right: -10px;
    top: 5px;
    cursor: pointer;
}

.close{
    position: absolute;
    width: 53px;height:53px ;
    right: 70px;
    top: 100px;
    cursor: pointer;
    background: url(https://img5.tiancitycdn.com/kr/event/2024/11/kr241128act/images/close.png);
}


#loading{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;z-index:20;font-size:18px;color:#cfd1cc;z-index:101}#loading .box{width:100%;height:1px;background:#414141;margin:0 auto;position:relative;top:50%;transform:translateY(-50%);left:0}#loading .box span{height:1px;background:#c4c4c4;position:relative;top:0;left:0;display:block}#loading .box p{font-size:16px;line-height:30px;color:silver;text-align:center}


.pop-video {width:850px;height:480px;display: none}
.pop-video video {width:100%;height:100%;}
.pop-video .btn_close{width: 32px;height:32px;background: url('../images/close.png') no-repeat 0 0;right:-32px;top:0;position: absolute}