@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(reset.css);
@import url(common.css);
@import url(../libs/fontawesome/css/all.min.css);
@import url(../libs/aos/aos.css);
/* @import url(../libs/OwlCarousel/assets/owl.carousel.min.css); @import url(../libs/OwlCarousel/assets/owl.theme.default.min.css); */
/* @import url(../libs/lightGallery/css/lightgallery.min.css); */
/* @import url(../libs/Remodal/remodal.css); @import url(../libs/Remodal/remodal-default-theme.css); */


/*
 news
==============================*/


/* mvp ----------*/
#mvp.bg::before, #mvp.bgs::before { background-image: url(../img/news/mv_bg.jpg); }


/* newsList ----------*/
#newsList { padding-bottom: 10rem; }
#newsList .inner { max-width: 123rem; padding: 0 3rem; }
#newsList .news_list { display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap: 3rem; row-gap: 5.6rem; }
@media screen and (max-width:896px) { /* m */
  #newsList .news_list { grid-template-columns: 1fr 1fr;  }
}
@media screen and (max-width:480px) { /* s */ 
  #newsList { padding-bottom: 1rem; }
  #newsList .news_list { grid-template-columns: 1fr; row-gap: 2rem; }
  #newsList .pagination { padding-top: 4rem; }
}


/* newsDetail ----------*/
#newsDetail { padding-top: 1px; padding-bottom: 10rem; }
#newsDetail .inner { max-width: 108rem; padding: 0 3rem; }
#newsDetail .news_header { margin-bottom: 6rem; margin-top: -18rem; }
#newsDetail .news_header .back { display: inline-block; color: #000; text-decoration: none; font-size: 1.8rem; font-weight: bold; margin-bottom: 4rem; }
#newsDetail .news_header .i { margin-bottom: 3rem; display: flex; gap: 3rem; }
#newsDetail .news_header h1 { font-size: 3.9rem; }
#newsDetail .main_photo { margin-bottom: 8rem; }
#newsDetail img.ph { border-radius: 4rem; }
#newsDetail .inner div > h2 { color: #000; font-size: 2rem; }
#newsDetail .inner div > p { line-height: 2.2; }
#newsDetail .txt_wrap { display: flex; flex-direction: column; gap: 5rem; }
#newsDetail .txt_wrap h2 { margin-bottom: -3rem; }
#newsDetail .btw { margin-top: 10rem; text-align: center; }
@media screen and (max-width:480px) { /* s */
  #newsDetail { padding-bottom: 4rem; }
  #newsDetail .news_header { margin-top: -10rem; }
  #newsDetail .news_header h1 { margin-bottom: 6rem; font-size: 3rem; }
  #newsDetail .btw { margin-top: 6rem; }
}