#form1{display: flex; flex-direction: column; min-height: 100vh}
/* #form1 footer{display: flex; flex-direction: column; min-height: 100vh} */

.navbar-brand.inner{display: none;}

main{margin-top: 0}
.btn-circle{display: flex; width: 2.5rem; height: 2.5rem; padding: 0;justify-content: center; align-items: center; border-radius: 50%; transition: .3s all;}
.btn-white{background-color: #fff;}
.home-main-slider .slide-inner::before{content:''; position: absolute; inset: 0; background-image: linear-gradient(to bottom, rgba(0,0,0,.87), rgba(0,0,0,0)60%); z-index: 3;}
.home-main-slider .slide-inner img{width: 100%; height: 100vh; min-height: 700px; object-fit: cover; object-position: top;}
.home-main-slider .slide-inner .slide-caption{position: absolute; inset: 0; padding-bottom: 15rem; z-index: 4;}
.home-main-slider .slide-inner .slide-caption .container{height: 100%; display: flex; align-items: center; flex-direction: column; justify-content: flex-end;}
.home-main-slider .slide-inner .slide-caption .content{max-width: 445px; color: #fff; font-size: 2rem; text-align: center; background-image: radial-gradient(circle, rgba(0,0,0,0.5) 0%, rgba(0,212,255,0) 86%); padding-block: 3rem;}
.home-main-slider .slide-inner .slide-caption span{font-weight: 300; font-size: 1.4rem; display: block;}
.home-main-slider .slide-inner .slide-caption span:first-child{font-size: 1.8rem; margin-bottom: 1.9rem;}
.home-main-slider .slide-inner .slide-caption span:last-child{font-weight: 400; margin-top: 1rem}
.home-main-slider .carousel-indicators{right: 0; left: 0; z-index: 3; margin-inline: 0; bottom: 7rem}
.home-main-slider .carousel-indicators .container{display: flex; justify-content: flex-end; column-gap: .7rem;}
.home-main-slider .carousel-indicators :is(button, img){position: relative;}
.home-main-slider .carousel-indicators button{width: 100px; height: 52px; border: none; overflow: hidden; text-indent: 0;}
.home-main-slider .carousel-indicators img{width: 100px; height: 52px; object-fit: cover; max-width: 100%;}


.announcement{background-color: #1D1D1D; padding-block: 1.5rem; position: relative; z-index: 7; text-align: center; padding-bottom: 3rem;}
.announcement .carousel{position: relative;}
.announcement .carousel::before{content: ''; position: absolute; right: -1px; top: 0; height: 100%; width: 8rem; background-color: #1D1D1D; z-index: 1; display: none;}
.announcement .slide-inner{padding-bottom: 3rem;}


.announcement h3{color: #FCCF14; font-weight: 400; font-size: 1.8rem; margin-bottom: 2rem;}
.announcement h1{color: #FCCF14; font-weight: 400; font-size: 1.8rem; margin-bottom: 2rem;}
.announcement a{display: block; color: #fff; font-size: 1.4rem; font-weight: 300; line-height: 1.3; height: calc(1.4rem * 1.3 * 2)}
.announcement :is(.carousel-control-next, .carousel-control-prev) {width: auto; top: 100%; left: 50%; right: auto;}
.announcement :is(.carousel-control-next, .carousel-control-prev) img {width: 10px}
.announcement .carousel-control-prev{transform: translateX(-200%);}
.announcement .carousel-control-next{transform: translateX(200%);}
.announcement .carousel::after{content: ''; position: absolute;right: calc(50% - .5rem); height: 40%; width: 1px; top: calc(90% - .7rem); background-color: rgba(255,255,255,.35); z-index: 1;}

footer{position: relative; z-index: 7; padding-block: 1.5rem; background: #1D1D1Dee}
.follows, .follows ul{display: flex; align-items: center; }
.follows{column-gap: 1.2rem;}
.follows h6{font-size: 1.6rem; font-weight: 500; color: #fff}
.follows a {width: 2.7rem;height: 2.7rem; margin: .2rem .4rem;background: #fff;border-radius: 100%;display: flex;align-items: center;justify-content: center;}
.follows a:hover {background-color: #FCCF14;}
/* footer{padding-block: 0;} */
footer :is(p,p a) {color: #fff; font-size: 1.4rem;}
footer p a:hover{color: #FCCF14}


#boxes #dialog {width: 580px;height: auto;padding: 1.5rem;background-color: #ffffff;box-shadow: 0 0 1rem #ddd;position: fixed;text-align: center;align-items: center;justify-content: center;}
.close.agree {float: right;cursor: pointer;}
#imgpopup {padding-top: .5rem;}
#mask {position: absolute;left: 0;top: 0;z-index: 9000;background-color: #26262cbd;display: none;width: 100% !important;}
#boxes .window{z-index: 9999;border-radius: 5px;}



@media (min-width: 992px){
    /* .announcement{margin-top: -12.6rem} */
    .announcement :is(.carousel-control-next, .carousel-control-prev) {top: 50%; left: auto;}
    .announcement .carousel-control-prev{right: 4rem;}
    .announcement .carousel-control-next{ right: 2rem}
    .announcement h3{margin-bottom: 0;}
    .announcement h1{margin-bottom: 0;}
    .announcement .row{--bs-gutter-x: 6rem;align-items: center;}
    .announcement .col-xxl-3{width: max-content}
    .announcement .col-xxl-9{flex-grow: 1;}
    .footer{background: rgba(49,49,49,.87)}
    .home-main-slider .carousel-indicators{bottom: 17rem; display: none;}
    .home-main-slider .slide-inner .slide-caption{ padding-bottom: 280px;}
    .home-main-slider .slide-inner .slide-caption .content {text-align: right;background-image: none; padding-bottom: 0; font-size: 3rem;  }
    .home-main-slider .slide-inner .slide-caption .container{align-items: flex-end}
    .announcement .carousel::before{display: block;}
    
    .announcement .carousel::after{content: ''; position: absolute; right: 3.5rem; height: 3rem; top:10%; background-color: rgba(255,255,255,.35); z-index: 1;}
    .announcement a{height: auto; font-size: 1.8rem; text-align: left;}
    .announcement .slide-inner{padding-bottom: 0;}
    .announcement{margin-top: -13.1rem; padding-bottom: 1.5rem;}
    .announcement :is(.carousel-control-next, .carousel-control-prev){translate: 0 -50%}
    .announcement .carousel::after{top: -10%}
    
}

@media (min-width: 1200px){
    .home-main-slider .slide-inner .slide-caption span:first-child{font-size: 2.1rem; }
}
@media (min-width: 1400px){
    .announcement{margin-top: -11.4rem}
    .announcement h1 {
        font-size: 3rem;
    }
}
@media (min-width: 1600px){
    .announcement{margin-top: -11.8rem}
    .home-main-slider .slide-inner .slide-caption{padding-bottom: 330px;  background: #0000002e;}
    .home-main-slider .slide-inner .slide-caption span{font-size: 1.6rem;}
    .home-main-slider .slide-inner .slide-caption span:first-child{font-size: 2.4rem; }
    .home-main-slider .carousel-indicators{bottom: 20rem; display: none;}
    .announcement :is(h3, a){font-size: 2.1rem;}
    .announcement :is(h1, a){font-size: 2.1rem;}
    .announcement :is(.carousel-control-next, .carousel-control-prev) img {width: 12px}
}