@charset "UTF-8";
/* --
post.css
お知らせ・会員情報

 ------------------------------------
-- */
/*-----------------------------------

	$font

-----------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Heebo:wght@200;400;500;700;800&family=Noto+Sans+JP:wght@400;500;700&display=swap");
/*-----------------------------------

	$color

-----------------------------------*/
/*-----------------------------------

	$mixin

-----------------------------------*/
/*-----------------------------------

	$post
	お知らせ・会員情報

-----------------------------------*/
/* --
post.css
お知らせ・会員情報

 ------------------------------------
-- */
/**======================================
	setting
======================================**/
/*-----------------------------------

	$icon
	矢印アイコン（CSS mask + data-URI SVG）

-----------------------------------*/
.post-page {
  padding-bottom: 10rem;
}
@media (max-width: 768px) {
  .post-page {
    padding-bottom: 6rem;
  }
}

.post-hero {
  padding: 5.2rem 0 3rem;
  background: #fff;
}
@media (max-width: 768px) {
  .post-hero {
    padding: 1.5rem 0 2rem;
  }
}
.post-hero__inner {
  max-width: 114rem;
  margin: 0 auto;
  padding-left: 3rem;
  padding-right: 3rem;
}
@media (max-width: 768px) {
  .post-hero__inner {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.post-hero__title {
  margin: 0;
}
@media (max-width: 768px) {
  .post-hero__title {
    text-align: center;
  }
}
.post-hero__title--member .post-hero__label > span:first-child {
  color: #ff9900;
}
.post-hero__label {
  display: block;
  font-family: "Heebo", sans-serif;
  font-size: clamp(4rem, -3.1111111111rem + 9.2592592593vw, 8rem);
  font-weight: 200;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #090909;
}
.post-hero__label > span:first-child {
  color: #006699;
}
.post-hero__caption {
  display: block;
  margin-top: 0.4rem;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  font-weight: 700;
  line-height: 1.6;
  color: #090909;
}

.post-body__inner {
  max-width: 114rem;
  margin: 0 auto;
  padding-left: 3rem;
  padding-right: 3rem;
}
@media (max-width: 768px) {
  .post-body__inner {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

.post-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.post-list__item {
  position: relative;
  display: block;
  border-bottom: 1px solid #cccccc;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.post-list__item:hover {
  opacity: 0.8;
}
.post-list__item::after {
  content: "";
  position: absolute;
  right: 2.6rem;
  top: 50%;
  width: 0.8rem;
  height: 1.4rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  pointer-events: none;
  background-color: #006699;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14' fill='none'%3E%3Cpath d='M1 1L7 7L1 13' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14' fill='none'%3E%3Cpath d='M1 1L7 7L1 13' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
.post-list__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2rem;
  padding: 3rem;
  padding-right: 4rem;
  text-decoration: none;
  color: inherit;
}
@media (max-width: 768px) {
  .post-list__link {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 0.8rem;
    padding: 2rem 3rem 2rem 2rem;
  }
}
.post-list__date {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-family: "Heebo", sans-serif;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  font-weight: 700;
  line-height: normal;
  color: #090909;
  white-space: nowrap;
}
.post-list__title {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  font-weight: 700;
  line-height: normal;
  color: #006699;
  margin: 0;
  min-width: 0;
}
.post-list--member .post-list__item::after {
  right: 0;
}
@media (max-width: 768px) {
  .post-list--member .post-list__link {
    gap: 0.5rem;
  }
}
.post-list--member .post-list__meta {
  display: contents;
}
@media (max-width: 768px) {
  .post-list--member .post-list__meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 1rem;
  }
}
.post-list--member .post-list__badge {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: 0.5rem 2rem;
  border-radius: 6.8rem;
  background: #ff9900;
  font-size: clamp(1.2rem, 0.8444444444rem + 0.462962963vw, 1.4rem);
  font-weight: 700;
  line-height: normal;
  color: #fff;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .post-list--member .post-list__badge {
    padding: 0.2rem 2rem;
  }
}
.post-list--member .post-list__name {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  font-weight: 700;
  line-height: normal;
  color: #090909;
  margin: 0;
  min-width: 0;
}
@media (max-width: 768px) {
  .post-list--member .post-list__name {
    font-size: 1.6rem;
  }
}

.post-pager {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1rem;
  margin-top: 6rem;
}
@media (max-width: 768px) {
  .post-pager {
    margin-top: 4rem;
  }
}
.post-pager__arrow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 1.4rem;
  line-height: 1;
  color: #006699;
  text-decoration: none;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.post-pager__arrow:hover {
  opacity: 0.8;
}
.post-pager__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.post-pager__num {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  background: #006699;
  font-size: 1.4rem;
  line-height: 1;
  color: #fff;
  text-decoration: none;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.post-pager__num:hover {
  opacity: 0.8;
}
.post-pager__num.is-current {
  background: #cccccc;
  pointer-events: none;
}

.post-single {
  padding: 4rem 0 0;
}
@media (max-width: 768px) {
  .post-single {
    padding: 2rem 0 0;
  }
}
.post-single__head {
  margin-bottom: 4rem;
}
@media (max-width: 768px) {
  .post-single__head {
    margin-bottom: 3rem;
  }
}
.post-single__title {
  font-size: clamp(2.4rem, 0.9777777778rem + 1.8518518519vw, 3.2rem);
  font-weight: 700;
  line-height: 1.6;
  color: #006699;
  margin: 0 0 1rem;
}
.post-single__date {
  font-family: "Heebo", sans-serif;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  font-weight: 700;
  line-height: 1.6;
  color: #999;
  margin: 0;
}
.post-single__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4rem;
  color: #090909;
}
@media (max-width: 768px) {
  .post-single__content {
    gap: 3rem;
  }
}
.post-single__content > * {
  margin: 0;
}
.post-single__content h2 {
  font-size: clamp(2rem, 1.2888888889rem + 0.9259259259vw, 2.4rem);
  font-weight: 700;
  line-height: 1.6;
}
.post-single__content h3 {
  font-size: clamp(1.8rem, 1.4444444444rem + 0.462962963vw, 2rem);
  font-weight: 700;
  line-height: 1.6;
}
.post-single__content h4 {
  font-size: clamp(1.6rem, 1.2444444444rem + 0.462962963vw, 1.8rem);
  font-weight: 700;
  line-height: 1.6;
}
.post-single__content p {
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  line-height: 1.6;
}
.post-single__content a {
  color: #006699;
  text-decoration: underline;
}
.post-single__content a:hover {
  opacity: 0.8;
}
.post-single__content strong {
  font-weight: 700;
}
.post-single__content ul,
.post-single__content ol {
  padding-left: 2.4rem;
  font-size: clamp(1.4rem, 1.0444444444rem + 0.462962963vw, 1.6rem);
  line-height: 1.6;
}
.post-single__content ul {
  list-style-type: disc;
}
.post-single__content ol {
  list-style-type: decimal;
}
.post-single__content li {
  display: list-item;
}
.post-single__content li + li {
  margin-top: 0;
}
.post-single__content .post-single__block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2rem;
}
@media (max-width: 768px) {
  .post-single__content .post-single__block {
    gap: 1.5rem;
  }
}
.post-single__content .post-single__block--lg {
  gap: 2.4rem;
}