@charset "utf-8";

#main_eventbanner { max-width: 1200px; margin: 0 auto; border-radius:10px; box-shadow:0 4px 4px 0 rgba(0,0,0,0.25); overflow: hidden; position:relative;}
#main_eventbanner .btn_wr { display: none;}
#main_eventbanner .owl_pager { position: absolute; bottom: 10px; left: 50%; transform:translateX(-50%); z-index: 2;}
#main_eventbanner .owl_pager > ul { display: flex;}
#main_eventbanner .owl_pager > ul > li { height: 8px; width: 8px; background: #fff; opacity: 0.5; border-radius:50px; margin: 0 8px; text-indent:-99999999px}
#main_eventbanner .owl_pager > ul > li.active { width: 20px; background: #e51937; box-shadow: none;;}

#main_eventbanner .active{opacity:1}
#main_eventbanner .bn-txt-wr{display:table;height:100%;width:100%;margin:0 auto;max-width:1200px;position:relative;z-index:20;text-align:left}
#main_eventbanner .bn-txt{display:table-cell;vertical-align:middle;padding:0 50% 0 20px;font-size:4em;font-weight:bold;word-break: keep-all;color:#fff;
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
-webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.2);
-moz-text-shadow: 0 1px 2px rgba(0,0,0,0.2);
text-shadow: 0 1px 2px rgba(0,0,0,0.2);}
#main_eventbanner .btn_detail{text-indent:-999px;font-size:0;;overflow:hidden;text-align:center;background:url(img/btn_detail.png) 50% 50%  no-repeat;width:118px;height:44px;margin-top:40px;display:block;border-radius:30px; opacity:0.9;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
box-shadow: 0 1px 2px rgba(0,0,0,0.2); }
#main_eventbanner .btn_detail:hover{opacity:1;
-webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
-moz-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
box-shadow: 0 6px 10px rgba(0,0,0,0.2);}

#main_eventbanner .bx-controls{position:absolute;bottom:30px;left:50%;width:200px;margin-left:-100px;text-align:center;z-index:99}
#main_eventbanner .bx-pager-item{display:inline-block;padding:0 8px}
#main_eventbanner .bx-pager-link {display:block;background:#fff;opacity:0.5;border-radius:5px;width:6px;height:6px;text-indent:-999px;overflow:hidden}
#main_eventbanner .active {opacity:1;
-webkit-box-shadow: 0 0  8px 5px rgba(255,255,255,0.6);
-moz-box-shadow:  0 0  8px 5px rgba(255,255,255,0.6) ;
box-shadow: 0 0  8px 5px rgba(255,255,255,0.6);}
#main_eventbanner .bx-prev{position:absolute;top:50%;left:0;margin-top:-20px;width:40px;height:40px;text-indent:-999pc;overflow:hidden;background:url('./img/btn_prev.png') no-repeat 50% 50%;opacity:0.7}
#main_eventbanner .bx-next{position:absolute;top:50%;right:0;margin-top:-20px;width:40px;height:40px;text-indent:-999pc;overflow:hidden;background:url('./img/btn_next.png') no-repeat 50% 50%;opacity:0.7}
#main_eventbanner .bx-next:hover,#main_eventbanner .bx-prev:hover{opacity:1}

@media (max-width: 969px){
     #main_eventbanner ul li{height:400px}
     #main_eventbanner .bn-txt{font-size:3em;padding:0 30% 0 5%;}
}

@media (max-width: 639px){
     #main_eventbanner ul li{height:300px}
     #main_eventbanner .bn-txt{font-size:2em;}

     #main_eventbanner .btn_detail{height:38px;width:90px;margin-top:20px;background-size:cover}
}

@media(max-width:980px){
    #main_eventbanner_mo { max-width: 1200px; margin: 0 auto; border-radius:10px; box-shadow:0 4px 4px 0 rgba(0,0,0,0.25); overflow: hidden; position:relative;}
    #main_eventbanner_mo .btn_wr { display: none;}
    #main_eventbanner_mo .owl_pager { position: absolute; bottom: 10px; left: 50%; transform:translateX(-50%); z-index: 2;}
    #main_eventbanner_mo .owl_pager > ul { display: flex;}
    #main_eventbanner_mo .owl_pager > ul > li { height: 8px; width: 8px; background: #fff; opacity: 0.5; border-radius:50px; margin: 0 8px;}
    #main_eventbanner_mo .owl_pager > ul > li.active { width: 20px; background: #e51937; box-shadow: none;;}

    #main_eventbanner_mo .active{opacity:1}
    #main_eventbanner_mo .bn-txt-wr{display:table;height:100%;width:100%;margin:0 auto;max-width:1200px;position:relative;z-index:20;text-align:left}
    #main_eventbanner_mo .bn-txt{display:table-cell;vertical-align:middle;padding:0 50% 0 20px;font-size:4em;font-weight:bold;word-break: keep-all;color:#fff;
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    -webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    -moz-text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);}
    #main_eventbanner_mo .btn_detail{text-indent:-999px;font-size:0;;overflow:hidden;text-align:center;background:url(img/btn_detail.png) 50% 50%  no-repeat;width:118px;height:44px;margin-top:40px;display:block;border-radius:30px; opacity:0.9;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    box-shadow: 0 1px 2px rgba(0,0,0,0.2); }
    #main_eventbanner_mo .btn_detail:hover{opacity:1;
    -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    box-shadow: 0 6px 10px rgba(0,0,0,0.2);}

    #main_eventbanner_mo .bx-controls{position:absolute;bottom:30px;left:50%;width:200px;margin-left:-100px;text-align:center;z-index:99}
    #main_eventbanner_mo .bx-pager-item{display:inline-block;padding:0 8px}
    #main_eventbanner_mo .bx-pager-link {display:block;background:#fff;opacity:0.5;border-radius:5px;width:6px;height:6px;text-indent:-999px;overflow:hidden}
    #main_eventbanner_mo .active {opacity:1;
    -webkit-box-shadow: 0 0  8px 5px rgba(255,255,255,0.6);
    -moz-box-shadow:  0 0  8px 5px rgba(255,255,255,0.6) ;
    box-shadow: 0 0  8px 5px rgba(255,255,255,0.6);}
    #main_eventbanner_mo .bx-prev{position:absolute;top:50%;left:0;margin-top:-20px;width:40px;height:40px;text-indent:-999pc;overflow:hidden;background:url('./img/btn_prev.png') no-repeat 50% 50%;opacity:0.7}
    #main_eventbanner_mo .bx-next{position:absolute;top:50%;right:0;margin-top:-20px;width:40px;height:40px;text-indent:-999pc;overflow:hidden;background:url('./img/btn_next.png') no-repeat 50% 50%;opacity:0.7}
    #main_eventbanner_mo .bx-next:hover,#main_eventbanner_mo .bx-prev:hover{opacity:1}

}