body{min-width: 1200px;background-color:#fff;}
.wraper{width: 100%;min-width: 1200px;position: relative;overflow: hidden;}
.bg{width: 100%; height: 5000px; margin: 0 auto; background:url(../images/bg.jpg) no-repeat 50% 1080px;}



.wraper .header{position: absolute;display: flex;flex-wrap: wrap;justify-content: space-around;width:1920px; height: 1080px; left: calc(50% - 1920px/2); top: 0; z-index: 3; overflow: hidden;}
.wraper .bgimg{ position: absolute; background: url(../images/bg-header.jpg) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 1;}
.wraper .slogan{ position: absolute; background: url(../images/bg-slogan.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 7;}
.wraper .npc1{ position: absolute; background: url(../images/bg-npc1.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 8;}
.wraper .npc2{ position: absolute; background: url(../images/bg-npc2.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 8;}
.wraper .shadow{ position: absolute; background: url(../images/bg-shadow.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 5;}
.wraper .list{ position: absolute; background: url(../images/bg-list.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 11;}
.wraper .mask{ position: absolute; background: url(../images/bg-mask.png) no-repeat 0 0; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 10;}
.wraper #light{ position: absolute; width: 1920px; height: 1080px; left: calc(50% - 1920px / 2); top: 0; z-index: 2;}



.acts {position: absolute;display: flex;flex-wrap: wrap;justify-content: space-around;width:1200px; left: calc(50% - 1200px/2); top: 1080px; z-index: 2; padding-top: 40px;}
.slide {width:1200px;margin-bottom:0px;transition:all .5s !important;position: relative;background-repeat: no-repeat !important;overflow: hidden;margin-bottom: 28px;z-index:10;}

.slide1-1{background: url("../images/con-1.png") no-repeat 50% 0;height: 412px; margin-bottom: 228px;}
.slide2-1{background: url("../images/con-2-1.png") no-repeat 50% 0;height: 323px;}
.slide2-2{background: url("../images/con-2-2.png") no-repeat 50% 0;height: 195px;}
.slide2-3{background: url("../images/con-2-3.png") no-repeat 50% 0;height: 195px;}
.slide2-4{background: url("../images/con-2-4.png") no-repeat 50% 0;height: 382px;}
.slide2-5{background: url("../images/con-2-5.png") no-repeat 50% 0;height: 195px;}
.slide2-6{background: url("../images/con-2-6.png") no-repeat 50% 0;height: 1727px; }



.sidebar{position: fixed;z-index: 100;left: 0;bottom: 0;top: 43px;}
.topM{z-index: 50!important;}
.side_list{position: relative;width: 140px;background: rgba(92,16,11,.8); height: 100%;transition: margin-left 0.5s;margin-left: 0;}
.side_list .logo{width: 116px;height:97px;display: flex;position: relative;left: 10px; justify-content: center;align-items: center; background: url(../images/logo.png) no-repeat 50% 0 / contain;top: 30px;}
#sideBtn{position: absolute;left:calc(100%);top: 45px;width: 40px;height: 40px;cursor: pointer;outline: none;z-index: 9;background:rgba(92,16,11, 0.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 50% 0;width:140px;height:135px ;margin-top:120px;cursor: default;}
.act_list ul li:nth-child(2) a{background: url(../images/nav2.png) no-repeat 50% 0;width:140px;height:135px ;margin-top:50px;}
.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}