@charset "utf-8";

@media all and (max-width:1450px){
    #section1 > div ul  li {  float: left; margin:0 60px;  }
    #section1 > div ul  li  > div a .image { position: relative; overflow: hidden; width:200px; }
    #section1 > div ul  li  > div a span { position: absolute;  bottom:80px; right:-83px; width:100%; text-align: center; font-size: 50px; }
    #section2 > div .section2_content > div ul li h2 { font-size: 60px; color:#c9ff7b; position: absolute; top:-50px; left:18px; }
}
@media all and (max-width:1205px){
    #section1 > div ul  li {  float: left; margin:0 40px;  }
    #section1 > div ul  li  > div a .image { position: relative; overflow: hidden; width:170px; }
    #section1 > div ul  li  > div a span { position: absolute;  bottom:70px; right:-60px; width:100%; text-align: center; font-size: 30px; }
    
    #section1 > div ul  li  > div a  i { transition: all .3s; position: absolute; z-index: 1; top:-10px; left:-10px;}

}
@media all and (max-width:1300px){
    #section3 > div .contentUi > div .row1 ul li > div a h2 { font-size: 30px; color:#c9ff7b; padding-bottom: 15px;  }
    #section3 > div .contentUi > div .row2 > div h2 {  font-size: 30px; color:#c9ff7b; padding-bottom: 15px; }
}
@media all and (max-width:1007px){
    #section1 > div ul  li {  float: left; margin:0 30px;  }
    #section1 > div ul  li  > div a .image { position: relative; overflow: hidden; width:150px; }
    #section1 > div ul  li  > div a span { position: absolute;  bottom:80px; right:-40px; width:100%; text-align: center; font-size: 30px; }
    #section1 > div ul  li  > div a  i {display: none;}

    .section1_PopUp > div .popupContent { width:60%; margin: 0 auto; }
    .section1_PopUp01 > div .popupContent {width:70%; margin: 0 auto; }
    .section1_PopUp02 > div .popupContent {width:70%; margin: 0 auto; }
    .section2_content{ display: none; }
    /* .section2_content2 {display: block;} */
}

@media all and (max-width:900px){
    #section2 > div { width:100%; right:0; top:0; margin-left: 0px;  position: relative; height: 100%;  }
    #section3 > div .contentUi > div { position: relative; top:100px;width:100%; text-align: center; }
    #section3 > div .contentUi > div .row1 ul li {  display: block; margin: 10px 0;  width:100%;}
    #section3 > div .contentUi > div .row2 > div ul li {float: none; margin: 10px 0; width:100%;}

    .otherMenu { position: fixed; left:0px; top:0%; }
    .otherMenu ul { display: block; height: auto; }
    .otherMenu ul li { padding: 0px 15px; float: left; }
    .otherMenu ul li a   { transition: all .3s; position: relative; font-size:22px; line-height: 120%; color:#c9ff7b; opacity: .4; }
    .otherMenu ul li a i { transition: all .3s; position: relative; top:-6px; left:5px; width:10px; height: 2px; background: #c9ff7b; display: inline-block; opacity: 0;}
    .otherMenu ul li a:hover i { position: relative; top:-6px; left:5px; width:10px; height: 2px; background: #c9ff7b; display: inline-block; opacity: 1;}
    .otherMenu ul li a.addOtherMenu i { position: relative; top:-6px; left:5px; width:10px; height: 2px; background: #c9ff7b; display: inline-block;  opacity: 1;}
    
    #section1 > div { position: relative; top:0; left: 0px; height: 100%; }
    #section1 > div ul  li {  float: none; margin:50px 10px;  }
    

    #section1 > div ul  li  > div a .image {  width:90%; margin: 0 auto; }
    #section1 > div ul  li  > div a span { position: absolute;  bottom:100px; right:-83px; width:100%; text-align: center; font-size: 50px; }

    .section1_PopUp02 > div .PagePopUpBnt.addevent {padding-bottom: 5px;}
    .section1_PopUp02 > div .PagePopUpBnt.addevent ul { display: inline-block; padding: 5px 0; }
    .section1_PopUp02 > div .PagePopUpBnt ul li { margin: 0 15px; display: block; }
    .section1_PopUp02 > div .PagePopUpBnt ul li a { width:20px; height: 20px; border:1px solid #c9ff7b; }
    .section1_PopUp02 > div .PagePopUpBnt ul li a i { margin-top: 2.5px; margin-left:2.5px; width:15px; height: 15px;  }
    .section1_PopUp02 > div .PagePopUpBnt ul li a.addevent i { margin-top: 2.5px; margin-left:2.5px; width:15px; height: 15px;   }
    .section1_PopUp > div .closewrap { top:15px; right:15px;  }
    .section1_PopUp > div .closewrap a strong { margin-left:-80px ; display: block; font-size:14px; color:#c9ff7b; letter-spacing: 2px; }
    .section1_PopUp > div h2 { cursor: default; font-size: 40px; color:#c9ff7b; padding-bottom:60px; padding-top:30px; }
    
    .section3_popup > div { position: relative; width:100%;text-align: center; } 
    .section3_popup > div .closewrap {  top:15px; right:15px;  } 
    .section3_popup > div .closewrap .closeBtn01 strong {  margin-left:-80px ; display: block; font-size:14px; color:#c9ff7b; letter-spacing: 2px; } 
    /* .section3_popup > div .closewrap .closeBtn01 i {  margin-top: 2.5px; margin-left:2.5px; width:15px; height: 15px;}  */
    .section3_popup > div h2 { cursor: default; font-size: 40px; color:#c9ff7b; padding-bottom:60px; padding-top:30px;   } 

}
@media all and (max-width:600px){

    .otherMenu { position: fixed; left:0px; top:0%; }
    .otherMenu ul { display: block; height: auto; }
    .otherMenu ul li { padding: 0px 10px; float: left; }
    .otherMenu ul li a   { transition: all .3s; position: relative; font-size:18px; line-height: 120%; color:#c9ff7b; opacity: .4; }
    .otherMenu ul li a i { transition: all .3s; position: relative; top:-6px; left:5px; width:5px; height: 2px; background: #c9ff7b; display: inline-block; opacity: 0;}
    .otherMenu ul li a:hover i { position: relative; top:-6px; left:5px; width:5px; height: 2px; background: #c9ff7b; display: inline-block; opacity: 1;}
    .otherMenu ul li a.addOtherMenu i { position: relative; top:-6px; left:5px; width:5px; height: 2px; background: #c9ff7b; display: inline-block;  opacity: 1;}
    

    #section1 > div ul  li {  float: none; margin:30px auto;  }
    #section1 > div ul  li  > div a { position: relative; width:auto;  }
    #section1 > div ul  li  > div a span { position: absolute;  bottom:155px; right:0px; text-align: center; width:100%; text-align: center; font-size: 50px; }
    #section1 > div ul  li  > div a span.front  {  color:#c9ff7b; text-shadow: 2px 2px 0 rgba(0,0,0,.8);}
    #section1 > div ul  li  > div a span.back  {  display: none;}


    .section1_PopUp > div .popupContent { width:95%; margin: 0 auto; }
    .section1_PopUp01 > div .popupContent {width:95%; margin: 0 auto; }
    .section1_PopUp02 > div .popupContent {width:95%; margin: 0 auto; }

    .section1_PopUp > div h2 { cursor: default; font-size: 30px; color:#c9ff7b; padding-bottom:60px; padding-top:30px; }

   
    .section3_popup > div h2 { cursor: default; font-size: 30px; color:#c9ff7b; padding-bottom:60px; padding-top:30px;   } 
    .section3_popup > div .popupContent { width:90%; margin: 0 auto;}
}