@charset 'utf-8';

#banner { position: absolute; top: 22%; left: 0; right: 0; z-index: 10; padding: 0 8.33%; color: #fff;}
#banner p { word-break: keep-all;}
#banner .p1 {  line-height: 1.3; font-size: 60px; font-weight: 500;}
#banner .p2 { padding: 20px 0 50px; font-size: 20px; line-height: 1; font-weight: 300; letter-spacing: 0; }
#banner a { display: block; position: relative; z-index: 10; width: 238px; height: 50px; font-size: 18px; font-weight: 300;  line-height: 50px; text-align: center; color: #fff; border:1px solid #fff; border-radius: 25px; transition: .2s; }
#banner a:hover { background: rgba(0,0,0,.5);}

.carousel.div-carousel:hover a.carousel-control { display: flex ;}
.carousel.div-carousel a.carousel-control { display: flex; justify-content: center; align-items: center; z-index: 10; width: 60px; height: 60px; opacity: 1; background: #015a9c;}
.carousel.div-carousel a.carousel-control.left { top: auto; left:auto; right: 60px; bottom: 0; }
.carousel.div-carousel a.carousel-control.right { top: auto; bottom: 0; }
.carousel.div-carousel a.carousel-control i:before { font-family: xeicon; font-size: 30px; transition: .3S; }
.carousel.div-carousel a.carousel-control.left i:before { content:'\e93d';}
.carousel.div-carousel a.carousel-control.right i:before { content:'\e940'}


@media (max-width:991px){
    #banner { top: 25%;}
    #banner .p1 { font-size: 48px; } 
    .carousel.div-carousel a.carousel-control { width: 50px; height: 50px;}
    .carousel.div-carousel a.carousel-control.left { right: 50px;}
}
@media (max-width:768px){
    #banner { top: 50%; padding: 0 10px; text-align: center; transform: translateY(-50%);}
    #banner .p1 { font-size: 42px; line-height: 1.5;} 
    #banner a { margin: 0 auto; background: #015a9c; border: none;}
    
}
@media (max-width:480px){
    #banner { }
    #banner .p1 { font-size: 26px;} 
    #banner .p2 {padding: 15px 0 30px; font-size: 16px;}
    #banner a { width: 200px; height: 40px; font-size: 15px; line-height: 40px;}
    .carousel.div-carousel a.carousel-control { display: none;}
    
}