@charset "utf-8";

/* ------------------------
1st-view
f-view
-------------------------- */
.f-view {
  background-image: url('../img/top/toppage_mainimg03.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative;
  margin-bottom: 10rem;

}
.f-view::after {
  content: '';
  background-color: #0080FF;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: .02;
  z-index: 10;
}

.f-view_text_box {
  position: absolute;
  left: 5%;
  bottom: 10%;
  z-index: 100;
}

.f-view_text {
  background-color: #fff;
  padding: 1rem 2rem;
  font-size: 4rem;
  margin-bottom: 1rem;
  width: fit-content;
}

@media screen and (max-width: 1024px) {
  .f-view_text_box {
    /* top: 55%; */
  }

  .f-view_text {
    font-size: 3rem;
  }

}  /* /max-width: 1024px */

@media screen and (max-width: 767px) {
  .f-view {
    background-size: 386%;
    background-position: center 50%;
  }

  .f-view_text_box {
    width: 90%;
    left: 5%;
    top: 50%;
    bottom: auto;
    transform: translate(0, -50%);
    

    /* left: auto; */
    /* right: 5%; */
    /* bottom: 5%; */
    /* top: 5%; */
    
  }

  .f-view_text {
    /* font-size: 2.4rem; */
    /* margin-bottom: 1rem; */

    padding: 0.5rem 1rem;
    font-size: 2rem;
    /* margin-left: auto; */
  }
  .f-view_text:first-child {
    width: 250px;
  }

}  /* /max-width: 767px */
/* ------------------------
/1st-view
/f-view
-------------------------- */

/* ------------------------
三つボタン
-------------------------- */
.t-pickup {
  width: 90%;
  max-width: 120rem;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10rem;
}

.t-pickup_flex {
  display: flex;
  justify-content: space-between;
}

.t-btn {
  width: 32%;
  text-align: center;
  position: relative;
  background-color: #349F66;
  color: #fff;
  font-weight: bold;
  display: block;
  text-decoration: none;
  padding: 2.5rem 0;
  border: 2px solid #349F66;
  transition: .2s all ease-in-out;
}
.t-btn:hover {
  opacity: .8;
}

.t-btn_text {
  position: relative;
}

.t-btn01 {

}
.t-btn01:hover {

}
.t-btn01::after {
  content: '';
  background-image: url('../img/common/arrow_right_wh.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.7rem;
  height: 1.4rem;
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translate(0, -50%);
}
.t-btn01_text {
  /* position: relative; */
}
.t-btn01_text::before {
  content: '';
  background-image: url('../img/common/icon_doc.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.6rem;
  height: 2.9rem;
  position: absolute;
  left: -4rem;
  top: 50%;
  transform: translate(0, -50%);
}

.t-btn02 {

}
.t-btn02:hover {
 
}
.t-btn02::after {
  content: '';
  background-image: url('../img/common/arrow_right_wh.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.7rem;
  height: 1.4rem;
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translate(0, -50%);
}
.t-btn02_text {
  
}
.t-btn02_text::before {
  content: '';
  background-image: url('../img/common/dl_wh.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.7rem;
  height: 3.4rem;
  position: absolute;
  left: -4.3rem;
  top: 50%;
  transform: translate(0, -50%);
}

.t-btn03 {
  
}
.t-btn03:hover {
  
}
.t-btn03::after {
  content: '';
  background-image: url('../img/common/arrow_right_wh.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.7rem;
  height: 1.4rem;
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translate(0, -50%);
}
.t-btn03_text {
 
}
.t-btn03_text::before {
  content: '';
  background-image: url('../img/common/icon_meca.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
  position: absolute;
  left: -4.9rem;
  top: 50%;
  transform: translate(0, -50%);
}

@media screen and (max-width: 1024px) {
  .t-pickup_flex {
    flex-wrap: wrap;
  }

  .t-btn {
    width: 100%;
  }

  .t-btn:not(:last-child) {
    margin-bottom: 2rem;
  }

}  /* /max-width: 1024px; */

/* ------------------------
/三つボタン
-------------------------- */

/* ------------------------
お知らせ、活動内容
-------------------------- */
.top-cms {
  padding: 5rem 0;
  background-image: url(../img/top/top_img02.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  margin-bottom: 10rem;
}
.top-cms::after {
  content: '';
  background-color: #000;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: .02;
  z-index: 10;
}

.top-cms_container {
  background-color: #fff;
  width: 90%;
  max-width: 120rem;
  margin-left: auto;
  margin-right: auto;
  padding: 2.5rem 4rem 5rem 4rem;
  position: relative;
  z-index: 100;
}

/* お知らせ */
.news_container {

}

.news_container:not(:last-child) {
  margin-bottom: 5rem;
}
/* /お知らせ */
.news_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* width: 100%; */
  margin-bottom: 4rem;
}

.news_title {
  width: 160px;
  text-align: center;
}

.news_title_main {
  font-size: 3.2rem;
}

.news_title_sub {
  font-size: 1.4rem;
  font-weight: bold;
}

.news_list {
  width: calc(100% - 170px);
  list-style: none;
}

.news_list_items {
  border-bottom: 1px solid #d8d8d8;
}

.news_list_items_link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
  color: #333;
  padding: 2rem 5rem 2rem 1rem;
  position: relative;
  transition: all ease-in-out .2s;
}
.news_list_items_link:hover {
  opacity: .7;
}
.news_list_items_link::after {
  content: '';
  background-image: url('../img/common/arrow_right_bk.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 2.6rem;
  height: 1.3rem;
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translate(0, -50%);
}

.news_list_items_link_date {
  width: fit-content;
}

.news_list_items_link_title {
  width: calc(100% - 130px);
}

@media screen and (max-width: 1024px) {
  .top-cms_container {
    padding: 4rem;
  }

  .news_flex {
    flex-wrap: wrap;
  }

  .news_title {
    width: 100%;
  }

  .news_list {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .top-cms_container {
    padding: 3rem 2rem 5rem 2rem;
  }

  .news_list_items_link {
    flex-wrap: wrap;
  }

  .news_list_items_link_date {
    width: 100%;
    margin-bottom: .5rem;
  }

  .news_list_items_link_title {
    width: 100%;
  }
}

/* 活動内容 */

.news_list_items_link_date.report {
  

}

.news_list_items_link_category.report {
  /* width: 100px; */
  width: 60px;
  font-size: .9em;
  /* padding: .5rem 0; */
  padding: .3rem 0;
  text-align: center;
  color: #fff;
  display: block;
  text-decoration: none;
  transition: all ease-in-out .2s;
}
.news_list_items_link_category.report:hover {
  opacity: .5;
}
.news_list_items_link_category.report.hokuriku,
.r_cat0 {
  background-color: #2d2dad;
}
.news_list_items_link_category.report.kanto,
.r_cat1 {
  background-color: #FF0000;
}
.news_list_items_link_category.report.shikoku,
.r_cat2 {
  background-color: #777777;
}
.news_list_items_link_category.report.chugoku,
.r_cat3 {
  background-color: #008C46;
}
.news_list_items_link_category.report.chubu,
.r_cat4 {
  background-color: #CCCC00;
}
.news_list_items_link_category.report.kitakyushu,
.r_cat5 {
  background-color: #BF00FF;
}
.news_list_items_link_category.report.minamikyushu,
.r_cat6 {
  background-color: #FF7F00;
}
.news_list_items_link_category.report.hokkaido,
.r_cat7 {
  background-color: #00A876;
}
.news_list_items_link_category.report.kansai,
.r_cat8 {
  background-color: #8888DD;
}
.news_list_items_link_category.report.honbu,
.r_cat9 {
  background-color: #0D4A10;
}
.news_list_items_link_category.report.tohoku,
.r_cat10 {
  background-color: #002DB2;
}
/* 
カテゴリカラーコード
北陸(緑)：#519427;
関東(赤)：#FF0000;
四国(グレー)：#777777;
中国(濃い緑)：#008C46;
中部(黄色)：#CCCC00;
北九州(紫)：#BF00FF;
南九州(オレンジ)：#FF7F00;
北海道(薄緑)：#00A876;
関西(薄紫)：#8888DD;
本部(濃い緑)：#0D4A10;
東北(ネイビー)：#002DB2;
*/

.news_list_items_link_title.report {
  /* width: calc(100% - 232px); */
  width: calc(100% - 200px);
}

@media screen and (max-width: 767px) {
  .news_list_items_link.report {
    justify-content: flex-start;
  }

  .news_list_items_link_date.report {
    width: fit-content;
    margin-right: 2rem;
  }

  .news_list_items_link_category.report {
    margin-bottom: 1rem;
    /* padding: .5rem 0; */
  }

  .news_list_items_link_title.report {
    width: 100%;
  }
}

/* お知らせiframe */
.news_iframe {
  width: calc(100% - 170px);
  /* height: 200px; */
}
@media screen and (max-width: 1147px) {
  .news_iframe {
    
    /* height: 270px; */
  }
}
@media screen and (max-width: 1024px) {
  .news_iframe {
    width: 100%;
    
  }
}
@media screen and (max-width: 958px) {
  .news_iframe {
    
    
  }
}

/* ------------------------
/お知らせ、活動内容
-------------------------- */


/* ------------------------
協会の目的
-------------------------- */
/* グリーン：#349F66; */
.top-purpose {
  width: 90%;
  max-width: 120rem;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10rem;
  display: flex;
  justify-content: space-between;
}

.top-purpose_tile {
  max-width: 360px;
  width: 29%;
  z-index: 2;
}

.top-purpose_tile_main {
  font-size: 3.2rem;
  margin-bottom: .5rem;
}

.top-purpose_tile_sub {
  font-size: 1.4rem;
  margin-bottom: 5rem;
}

.top-purpose_tile_imgbox {
  
}

.top-purpose_tile_imgbox img {
  width: 100%;
  vertical-align: bottom;
}

.top-purpose_content {
  max-width: 800px;
  width: 69%;
  padding: 4rem;
  position: relative;
  z-index: 1;
}
.top-purpose_content::after {
  content: '';
  background-color: #349F66;
  width: 120%;
  height: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}

.top-purpose_content_desc {
  margin-bottom: 2rem;
  color: #fff;
}

.top-purpose_content_list {
  list-style: none;
}

.top-purpose_content_list_items {
  width: 45rem;
  background-color: #fff;
  color: #349F66;
  font-size: 1.1em;
  padding: 1rem 2rem;
  margin-bottom: 1rem;
}

@media screen and (max-width: 1024px) {
  .top-purpose_content_list_items {
    width: 100%;
  }
} /* max-width: 1024px; */

@media screen and (max-width: 767px) {
  .top-purpose {
    width: 100%;
    flex-wrap: wrap;
  }

  .top-purpose_tile {
    max-width: none;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }

  .top-purpose_content {
    max-width: none;
    width: 100%;
    padding: 4rem 3rem;
  }
  .top-purpose_content::after {
    content: '';
    background-color: #349F66;
    width: 100%;
    height: 110%;
  }
} /* max-width: 767px; */




/* ------------------------
/協会の目的
-------------------------- */