@charset "utf-8";






#section2{ margin-top:50px;  }
#section2>.in{position:relative; max-width:1400px; width:100%;  margin:0 auto; vertical-align:middle; padding:30px 15px; box-sizing:border-box;}
/* #section2 .tabArea{margin-bottom:30px;}
#section2 .tabArea ul{}
#section2 .tabArea ul li{position:relative; color:#999; line-height:24px; border-top:2px solid transparent; margin-right:20px; vertical-align:middle; cursor:pointer;}
#section2 .tabArea ul li:after{}
#section2 .tabArea ul li.on{border-color:#333; color:#333;}
#section2 .tabArea ul span{display:block; vertical-align:middle;} */
#section2 .boardArea{width:100%;}
#section2 .boardArea h2{position:relative; font-size:17px; border-bottom:1px solid #000; padding-bottom:5px; }
#section2 .boardArea h2 a{font-size:14px; position:absolute; top:50%; right:0; transform:translateY(-50%);}
#section2 .boardArea .board{height:0; position:relative; top:-9999px; left:-9999px; visibility:hidden; opacity:0; transition:opacity 0s;}
#section2 .boardArea .board.on{top:0; left:0; visibility:visible; height:auto; opacity:1; transition:opacity 0.5s;}
#section2 .boardArea .box{background:#fff; text-align:left; border-bottom:1px solid #ddd;}
#section2 .boardArea .box a{position:relative; display:block; padding:15px 100px 15px 0;}
#section2 .boardArea .box a:hover{color:#999;}
#section2 .boardArea .box a p{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#section2 .boardArea .box a p b{margin-right:10px; display:inline-block;}
#section2 .boardArea .box a span{position:absolute; top:50%; right:0; transform:translateY(-50%); font-size:13px;}
#section2 .boardArea .empty_li{padding:30px 0; color:#999; width:100% !important;}

#section2 .csArea{position:relative; width:100%; padding:50px 20px; box-sizing:border-box; margin-top:20px; overflow:hidden; border-radius:10px; background:#fbf8f4; background-size:cover; background-position:center; background-repeat:no-repeat;}
#section2 .csArea .img{position:absolute; bottom:0; right:0; width:200px; max-width:402px; z-index:10;}
#section2 .csArea>.in{position:relative; z-index:11;}
#section2 .csArea h3{font-weight:normal; margin-bottom:10px;}
#section2 .csArea .num{display:inline-block; font-size:25px; font-weight:900; margin-bottom:5px; letter-spacing:0;}
#section2 .csArea p{margin-bottom:20px;}



@media all and (min-width:768px){
  #section2{margin-top:150px;}
  #section2>.in{padding:50px 20px 100px 20px; display:flex; }
  /* #section2 .tabArea{margin-bottom:15px;}
  #section2 .tabArea ul li{font-size:16px;}
  #section2 .tabArea ul span{display:inline-block; width:1px; height:10px; margin:0 30px 0 10px; background:#ccc;} */
  #section2 .boardArea{width:45%;  }
  #section2 .boardArea h2{font-size:30px;}
  #section2 .boardArea h2 a{font-size:20px;}
  #section2 .boardArea .box{ }
  #section2 .boardArea .box a{font-size:17px; padding:19px 150px 19px 0;  transition:0.2s;}
  #section2 .boardArea .empty_li{min-height:200px; padding:80px 0;}


  #section2 .csArea{width:50%; margin-left:5%; padding:80px 70px 100px 70px; background-size:auto; background-position:top; border-radius:0; border-top-left-radius:60px;}
  #section2 .csArea .img{width:100%;}
  #section2 .csArea br{display:none;}
  #section2 .csArea h3{font-size:30px;}
  #section2 .csArea .num{font-size:40px; margin-bottom:10px;}
  #section2 .csArea p{font-size:17px; margin-bottom:50px;}

}



#bottom-banner{position:relative; margin-top:50px; background-image:url('/imgs/bottom-banner2.jpg'); background-position:center; background-size:cover;}
#bottom-banner:after{position:absolute; top:0; left:0; width:100%; height:100%; background:var(--c1); content:""; opacity:0.9; z-index:11;}
#bottom-banner>.in{height:300px; box-sizing:border-box; padding:20px; }
#bottom-banner .box{position:relative; width:100%; height:100%; z-index:12;}
#bottom-banner .box>.in{max-width:700px; margin-left:auto;}
#bottom-banner .box.right{display:none;}
#bottom-banner .txt{position:absolute; top:50%; transform:translateY(-50%); max-width:700px; margin-left:auto; }
#bottom-banner .txt h2{font-size:18px; color:#fff;  line-height:1.2; margin-bottom:40px; font-weight:500; }
#bottom-banner .txt p{}
#bottom-banner .txt p a{font-size:13px; position:relative; height:30px; display:block; color:#fff; border-bottom:1px solid #fff; overflow:hidden;}
#bottom-banner .txt p a + a{margin-top:10px; }
#bottom-banner .txt p a span{position:absolute; top:50%; left:0; transform:translateY(-50%); transition:0.3s;}
#bottom-banner .txt p a b{position:absolute; top:0; left:0; transform:translateY(-100%); font-weight:500; transition:0.3s;}
#bottom-banner .txt p a i{position:absolute; top:50%; right:0; transform:translateY(-50%); font-size:12px; }
#bottom-banner .txt p a:hover span{top:0; transform:translateY(-100%);}
#bottom-banner .txt p a:hover b{top:50%; transform:translateY(-50%);}

@media all and (min-width:768px){
  #bottom-banner{margin-top:150px; }
  #bottom-banner:after{position:absolute; top:0; left:0; width:50%; height:100%;}
  #bottom-banner>.in{height:500px;}
  #bottom-banner .box{width:50%;}
  #bottom-banner .box.right{display:inline-block;;}
  #bottom-banner .txt h2{margin-bottom:60px; font-size:25px; }
  #bottom-banner .txt p a{font-size:17px; height:35px; }
  #bottom-banner .txt p a + a{margin-top:15px; }
  #bottom-banner .txt p a b{font-size:20px;}
}

#footer{padding:50px 20px; box-sizing:border-box; background:#333;;}
#footer>.in{position:relative; max-width:1400px; margin:0 auto; }
#footer .util{margin-bottom:30px; border-bottom:1px solid #444; padding-bottom:30px; }
#footer .util li{margin-right:20px;  }
#footer .util li + li:after{top:40%; transform:rotate(15deg); left:-10px;}
#footer .util li a{color:#aaa;}
#footer .box{  margin-bottom:20px;  line-height:2;}
#footer .box p{color:#aaa;}
#footer .box p b{color:#fff;}
#footer .box p span{margin-right:15px;}
#footer .box strong{ font-weight:normal; color:#aaa;}
#footer .box strong .designed{color:#999; display:inline-block;;}
#footer .box strong .designed a{color:#999;}
#footer .box strong .designed a:hover{text-decoration:underline;}
#footer select{padding:0 20px; height:40px; border:1px solid #aaa; border-radius:0; background:transparent; color:#fff;background:#333; opacity:0.6;}

@media all and (min-width:768px){
  #footer .box{margin:0; font-size:16px;}
  #footer .box h2{font-size:25px;}
  #footer .box p{}
  #footer .box p span{margin-right:25px;}
  #footer .box .designed{display:inline-block; position:absolute; bottom:0; right:0;}
}























/**/
