@charset "UTF-8";
#news article {
  padding-top: clamp(50px, 10.42vw, 78px);
}
/* ==== ボタン 共通 ==== */
#news .btnbk {
  padding-top: clamp(30px, 10.42vw, 80px);
}
#news .btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90%;
  max-width: 550px;
  margin: 0 auto;
  padding: 18px min(6.25vw, 40px) 18px min(5.47vw, 35px);
  background: #003461;
  border: 2px solid #003461;
  border-radius: 30px;
  position: relative;
  z-index: 2;
  transition: 0.3s;
  cursor: pointer;
}
#news .btn .txt {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
#news .btn .txt .trago {
  font-size: clamp(20px, 4.17vw, 24px);
  font-weight: 600;
  letter-spacing: 0.1em;
  position: relative;
  top: 0.2em;
}
#news .btn .txt .fgo {
  font-size: clamp(14px, 2.08vw, 16px);
  font-weight: 600;
  padding-left: 1em;
}
#news .btn:hover {
  color: #003461;
  background: #fff;
}
/* -------------------------------------
archive
------------------------------------- */
#news.archive .int_list {
  padding-bottom: 78px;
}
#news.archive .inner-1217 {
  max-width: 1217px;
  margin: 0 auto;
}
#news.archive .cont__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 10px 0 5px;
  margin-bottom: 44px;
}
#news.archive .cont__head-lead {
  width: 100%;
  max-width: 393px;
  padding-bottom: 28px;
}
#news.archive .news_list {
  border-top: 2px solid #7483a4;
}

#news.archive .news_list li {
  width: 100%;
  border-bottom: 2px solid #7483a4;
}
#news.archive .news_list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px 1.5em;
  padding: clamp(20px, 6.25vw, 48px) min(2.5%, 20px);
}
#news.archive .news_list li a::after {
  content: "";
  flex-shrink: 0;
  width: 7.81vw;
  max-width: 60px;
  min-width: 30px;
  height: 7.81vw;
  max-height: 60px;
  min-height: 30px;
  background: url(../imgs/common/arrow_gr.png) no-repeat center / contain;
  border-radius: 50%;
  position: relative;
  transition: 0.3s;
}
#news.archive .news_list li a:hover::after {
  background: url(../imgs/common/arrow_nv.png) no-repeat center / contain;
}
body:not(.safari) #news.archive .news_list li a:hover::after {
  animation: scaleOnce 0.4s ease-out;
}
#news.archive .news_list li a .newsttl {
  font-size: clamp(14px, 2.08vw, 16px);
  font-weight: 400;
  line-height: 1.25;
  width: calc(100% - (2em + 7.81vw));
}

#news.archive .news_list li a p.date {
  font-size: clamp(12px, 1.82vw, 14px);
  color: #1db6be;
  flex-shrink: 0;
  width: 5em;
}
#news.archive .no_contents {
  text-align: center;
}
/* ==== vew more ==== */
#news .list-btn.is-btn-hidden {
  display: none;
}
#news .list-btn .tgl_btn {
  width: 7.81vw;
  max-width: 60px;
  min-width: 30px;
  height: 7.81vw;
  max-height: 60px;
  min-height: 30px;
  background: #c8c8c8;
  border-radius: 50%;
  position: relative;
  transition: 0.3s;
}
#news .list-btn .tgl_btn::before,
#news .list-btn .tgl_btn::after {
  content: "";
  width: 30%;
  height: 2px;
  border-radius: 4px;
  background: #011955;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.3s;
}
#news .list-btn .tgl_btn::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: transform 0.3s;
}
#news .list-btn:hover .tgl_btn {
  background: #011955;
}
body:not(.safari) #news .list-btn:hover .tgl_btn {
  animation: scaleSmall 0.4s ease-out;
}
#news .list-btn:hover .tgl_btn::before,
#news .list-btn:hover .tgl_btn::after {
  background: #fff;
}

#news .list-btn .tgl_btn.is-open::before {
  opacity: 0;
}
#news .list-btn .tgl_btn.is-open::after {
  transform: translate(-50%, -50%) rotate(180deg);
}

/* -------------------------------------
single
------------------------------------- */

#news.single #news_sec {
  padding: min(14.42vw, 173px) 0 152px;
}
#news.single .ttlblk {
  padding: 0 15px 40px;
  margin-bottom: 40px;
  border-bottom: 2px solid #7483a4;
}
#news.single .newsttl {
  font-size: clamp(23px, 3.78vw, 29px);
}
#news.single .newsttl .date {
  font-size: clamp(16px, 2.6vw, 20px);
  font-weight: 400;
  color: #1db6be;
  letter-spacing: 0;
  margin-bottom: 5px;
  display: block;
}
#news.single .newscont {
  line-height: 2;
  padding: 0 3% 55px;
  border-bottom: 2px solid #7483a4;
  margin-bottom: clamp(30px, 10.94vw, 84px);
}
#news.single .newscont p {
  margin-bottom: 2em;
}
#news.single .newscont img {
  max-width: 478px;
  border-radius: 20px;
}
/* ==== back ==== */
#news .back {
  justify-content: space-between;
}
#news .back::after {
  content: "";
  flex-shrink: 0;
  width: 7.81vw;
  max-width: 60px;
  min-width: 30px;
  height: 7.81vw;
  max-height: 60px;
  min-height: 30px;
  background: url(../imgs/common/arrow_gr.png) no-repeat center / contain;
  border-radius: 50%;
  position: relative;
  transition: 0.3s;
}
#news .back:hover::after {
  background: url(../imgs/common/arrow_nv.png) no-repeat center / contain;
}
body:not(.safari) #news .back:hover::after {
  animation: scaleSmall 0.4s ease-out;
}
@media screen and (max-width: 980px) {
  #news.archive .cont__head {
    flex-direction: column;
    align-items: flex-end;
    gap: 30px;
  }
  #news.archive .cont__head-txt {
    width: 100%;
  }
  #news.archive .cont__head-lead {
    padding-bottom: 0;
  }
}

@media screen and (max-width: 768px) {
  /* -------------------------------------
single
------------------------------------- */
  #news.single #news_sec {
    padding: 83px 0 19.79vw;
  }
}

@media screen and (max-width: 640px) {
  /* -------------------------------------
	archive
	------------------------------------- */
  img[src*="_pc"] {
    display: none;
  }
  img[src*="_sp"] {
    display: block;
  }
  #news.archive .cont__head {
    align-items: center;
  }
  #news.archive .cont__head-lead {
    width: 100%;
    max-width: 240px;
    padding: 0;
  }
  #news.archive .news_list li a {
    flex-wrap: wrap;
  }
  #news.archive .news_list li a p.date {
    width: 100%;
  }
}

@media screen and (max-width: 360px) {
  /* -------------------------------------
	archive
	------------------------------------- */
  #news .btn .txt .trago {
    font-size: clamp(18px, 5.56vw, 20px);
  }
  #news .btn .txt .fgo {
    font-size: clamp(12px, 3.89vw, 14px);
  }
}

@media screen and (max-width: 320px) {
}

@media screen and (min-width: 769px) {
}