@charset "utf-8";
.container { width: 100%; max-width: 1280px; margin: 0px auto; }

header {}
.header .top{display: flex; justify-content: space-between; background: white;width: 100%; align-items: center;margin: 0 auto;  padding: 20px 70px; } 
.header .top .right{display: flex; align-items: center;  }
.header  .date{font-weight: bold; color: #6d6e67;}
.header .top .right >:nth-child(2){margin: 0 15px;}
.header  .date.mo{display: none;}
.header  .date.pc{display: block;}

.bk_num select {border: 1px solid #6d6e67; font-size: 14px; border-radius: 50px; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 4px 0; line-height:14px; font-weight: 600; width: 140px;  background: rgba(0, 0, 0, 0%); color: #6d6e67; position: relative; text-align: center;}
.lang { border: 1px solid #6d6e67;  font-size: 14px; border-radius: 50px; font-weight:600; display: flex;align-items: center; justify-content: center; line-height:14px; width: 4.5em}
.lang a{color: #6d6e67; padding: 4px 15px; display:block; }


.header .menu {background: #6d6e67; position: relative; padding: 0 70px;}
.menu_list { margin: 0 auto;display: flex;justify-content: center;padding: 0;}
.header .menu .swiper-slide { visibility: hidden;  text-align: center;color: white; font-weight: 600; padding: 15px 0; font-size: 20px; display: flex !important; align-items: center !important; justify-content: center;  }
.header .menu .swiper-slide-visible { visibility: visible;}
.header .menu .swiper-button-prev { padding-left: 70px; }
.header .menu .swiper-button-next { padding-right: 70px; }
.header .menu .swiper-button-next, .swiper-button-prev{--swiper-theme-color: white;--swiper-navigation-size: 20px;}
 

.side{position: fixed; right: 20px; top:50%;transform: translate(0%, -50%);z-index: 99; }
.side{background: #6d6e67;  margin: 0 !important; padding: 2.5px 8px;}
.side a{display: block; padding: 10px 2px;  border-bottom: 1.5px solid #ededed; width:40px; height: 40px; align-items: center; display: flex; margin: 0 auto;}
.side a img{margin: 0 auto; width: 100%;}
/* .side .facebook img{  width: 100%;} */
.side>:last-child {border-bottom: #6d6e67 solid 1.5px;}


#footer{background: #6d6e67; margin-top: 120px;}
.footer{max-width: 1280px;margin: 0 auto; display: flex;align-items: center; padding: 60px 0; justify-content: space-between;}
.footer a {color:white}
.footer p { padding-left: 30px;color:#fff;}
.footer_left{display: flex; align-items: center;}
.footer_left a{ margin-left: 20px;}
.footer .footer_right a{border: 1px solid white; font-weight:600; border-radius: 6px; padding: 10px 16px; font-size: 14px; margin-left: 10px;}
.footer .footer_right { min-width: 16.5em;}

.mo-only{display: none}

@media all and (max-width : 1440px) {
.header .top{  padding: 20px 40px; } 
.header .menu { padding:0 20px;}
.header .menu .swiper-slide{font-size: 18px;}
.header .menu .swiper-button-prev { padding-left: 40px; }
.header .menu .swiper-button-next { padding-right: 40px; }

.menu_list{margin: 0 18px !important; }
.swiper-slide {font-size: 18px; }
}


@media all and (max-width : 1280px) {
  .logo img{width: 200px}
  
    .list{ width: 180px;}
    .list div a{ font-size:18px }
    .footer{padding: 60px 20px;}
    .footer img{max-width: 180px;}
    .footer a {font-size: 14px;}
    .footer p { font-size: 14px;}
    .footer .footer_right a { font-size: 13px;}
    .footer_left a{ margin-left: 10px;}
    .footer .footer_right a{padding: 4px;}
}

@media all and (max-width : 1025px){    
  .logo img{width: 180px}
header nav ul li { width: 160px; text-align: center; }
.list{ width: 160px;}

.footer a {font-size: 12px;}
.footer p { font-size: 12px;}

}

@media all and (max-width : 875px){    
header nav ul li { width: 140px; text-align: center; }
header nav ul li a{font-size: 22px;}
.list{ width: 140px;}
.list div a{ font-size:16px }    

    .footer p { padding-left: 20px;}
    .footer .footer_right a { margin-left: 5px;}

}



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

  .mo-only{display: block}
  .pc-only{display: none}

  .header .top{  padding: 20px 20px; } 
  .header .top .logo{width: 100px;}
  .header .top .date{font-size: 12px;}

  
  .header .menu { padding:0 30px; }
  .header .menu .swiper-slide{font-size: 16px; height: 50px !important;}
  .header .menu .swiper-button-prev { padding-left: 20px; }
  .header .menu  .swiper-button-next { padding-right: 20px; }
  .header .menu  .swiper-slide{font-size: 16px;}

  .header .top .right >:nth-child(2){margin: 0 10px;}
  .side{display: none}

  .bk_num select { font-size: 10px; width: 120px; line-height: 10px;}  
  .lang { font-size: 10px;line-height: 10px;}  


  .footer{display: block; margin: 0 auto; padding: 20px;}

  .footer .footer_right { margin: 0 auto 20px auto; text-align: center;}
  .footer .footer_right a {margin: 0 3px;}
  .footer_bottom *{display: block; margin: 0 auto;text-align: center;}
  .footer_bottom img{margin-bottom: 10px;}

  .footer_side {display: flex; justify-content:center; margin-bottom: 20px; align-items: center; border-bottom: 1px solid white; padding-bottom: 20px;}
  .footer_side a{border-right: 1px solid white;text-align: center !important; height: 40px; display: flex; align-items: center; padding: 0 10px; width: 40px;}
  .footer_side a img{margin: 0 auto; width:100%;}
 .footer_side>:last-child{border-right: 1px solid #6d6e67 !important;}
 
}

@media all and (max-width : 480px){
  .header .top{  padding: 20px 12px; align-items: flex-end; } 
  .header .menu { padding:0 20px; }
  .header .menu .swiper-slide{font-size: 14px;}
  .header .menu .swiper-button-prev { padding-left: 12px; }
  .header .menu .swiper-button-next { padding-right: 12px; }
  .header .date.pc{display: none;}
  .header .date.mo{display: block; width: 100%;font-size: 12px; padding-top: 3px;}
  .header .top .logo{width: 150px;}
  
  .logo img { width: 120px;}
  .lang {  width:4em  }
  /* .bk_num select {font-size: 12px; width: 140px;}
  .lang a{ font-size: 12px;} */
 


  .footer_side {padding-bottom: 10px;}
    .footer_side a img{max-width: 40px;}
}




/*sub*/
.recently{display: flex; justify-content: space-between; max-width: 1000px; margin:0 auto 150px}

.recently .none{cursor: default;}

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

 .mt80{margin-top: 80px;}   
  .recently{margin: 0 auto 50px}

}


.wbk{word-break: keep-all;}