@charset "utf-8";
.slide {}
    .slide .txt { position: absolute; left: 50%; top: 50%; z-index: 10; transform: translate(-50%,-50%); padding: 0 10px; width: 100%; max-width: 1320px; color: #fff;; }
    .slide .txt .p1 { font-size: 60px; font-weight: 700; line-height: 0.9;}
    .slide .txt .p2 { padding: 30px 0 55px; font-size: 28px; line-height: 1.5;}
    .slide .txt .p2 span { display: block;}
    .slide .txt a { display: block; position: relative; padding: 0 40px ;  width: 200px; height: 56px;  font-size: 19px; line-height: 56px; background: #fff; border-radius:28px; transition:all .3s;}
    .slide .txt a:after { content:'\e90b'; display: block; position: absolute; top: 50%; right: 50px; transform: translateY(-50%); font-family : xeicon; color:inherit; animation: move_right 2s linear infinite both;}
    .slide .txt a:hover { background: #0066b3; color: #fff  ;}

    .slide .img-wrap { background: #000;}
    .slide .img-wrap .img-item { overflow:visible ; left:inherit; top: 50%; right: -10%;  transform: translateY(-50%); width: auto; height:auto;  }
    .slide .img-wrap .img-item img {animation:rotate_cirle 50s ease-in-out infinite both; }    
    .slide .scroll-down-box { position: absolute; left: 50%; bottom: 50px; transform: translateX(-50%);}
    .slide .scroll-down-box .scroll-down { display: block; position: relative; padding: 50px 0 0; font-size: 13px; line-height: 0.8; text-align: center; font-weight: 300; color: #fff;}
    .slide .scroll-down-box .scroll-down:before, 
    .slide .scroll-down-box .scroll-down:after { content:''; display: block; position: absolute; left: 50%; transform: translateX(-50%); }
    .slide .scroll-down-box .scroll-down:before { top: 0; width: 25px; height: 40px; border:2px solid #fff; border-radius:13px;}
    .slide .scroll-down-box .scroll-down:after {  top: 12px; width: 4px; height: 4px; background: #fff; border-radius:50%; animation:scroll_down 1.5s  ease-in-out infinite both;}

    .carousel-control-prev-icon
    .carousel-control-next, .carousel-control-prev, .carousel-control-prev-icon { background-position: -10000px -10000px;}
    
    @media (max-width:1199px){
        .slide .img-wrap .img-item a { position: relative; display: block;}  
        .slide .img-wrap .img-item a:after {content:''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:rgba(0,0,0,.1);}             
        .slide .img-wrap .img-item a img { max-width: 1000px;}
        .slide .txt .p1 { font-size: 58px;}
        .slide .txt .p2 { font-size: 26px;}
    }

    @media (max-width:1199px){
        .slide .img-wrap .img-item { right: -40%;}
        .slide .scroll-down-box { display: none;}
    }

    @media (max-width:991px){
        .slide .txt .p1 { font-size: 56px;}
        .slide .txt .p2 { font-size: 24px;}
        .slide .txt a { width: 180px; height: 52px; line-height: 52px;}
        .slide .img-wrap .img-item { right: -50%;}
    }

    @media (max-width:768px){
        .slide .txt .p1 { font-size: 50px;}
        .slide .txt .p2 { padding: 30px 0 45px; font-size: 18px;}
        .slide .img-wrap .img-item { right: -55%;}
        .slide .img-wrap .img-item a img { max-width: 750px;}
    }
    @media (max-width:576px){
        .slide .txt .p1 { font-size: 46px;}
        .slide .txt .p2 { padding: 30px 0 45px; font-size: 15px;}
        .slide .txt a { padding: 0 30px; width: 150px; height: 50px; line-height: 50px; font-size: 17px;}
        .slide .img-wrap .img-item { right: -55%;}
        .slide .img-wrap .img-item a img { max-width: 750px;}
    }
    @media (max-width:480px){
        .slide .txt { text-align: center; }
        .slide .txt .p1 { font-size: 46px;}
        .slide .txt .p2 { padding: 30px 0 45px; font-size: 15px; word-break:keep-all;}
        .slide .txt .p2 span { display: inline;}
        .slide .txt a { padding: 0 40px; margin: 0 auto;; width: 180px; height: 50px; line-height: 50px; font-size: 17px; text-align: left;}
        .slide .img-wrap .img-item { right: -55%;}
        .slide .img-wrap .img-item a img { max-width: 750px;}
    }
    .slide .txt .p1 { animation:fade_right_50 1.5s 1 both;}
    .slide .txt .p2 { animation:fade_right_15 1.5s 1 1s both;}
    .slide .txt a { animation:fade_in 1s 1 2s both;}

    @keyframes fade_right_50 {
        0% { transform: translateX(-50%); opacity:0;}
        100% { transform: translateX(0); opacity:1;}
    }    
    @keyframes fade_right_15 {
        0% { transform: translateX(-15%); opacity:0;}
        100% { transform: translateX(0); opacity:1;}
    }    
    
    @keyframes fade_in {
        0% { opacity:0;}
        100% { opacity:1;}
    }


    
    @keyframes rotate_cirle {
        0%,50%,100% { transform: rotate(0) scale(1);}
        25% { transform: rotate(8deg) scale(1.05);}
        75% { transform: rotate(-8deg) scale(0.95);}
    }
    @keyframes move_right {
        0%,100% { right: 50px;}
        50% { right: 30px;}
    }
    @keyframes scroll_down {
        0% { top: 12px;}
        100% { top: 24px;}
    }