.pageContent {
  padding: 76px 0 40px;
  font-family: "Zen Old Mincho",serif;
  background: var(--color-bg)
}
.pageContent .newsBox {
  position: relative;
  margin: 0 -25px;
  background: #fff
}
.pageContent .newsBox__inner {
  padding: 60px 25px 55px
}
.pageContent .newsBox::after,
.pageContent .newsBox::before,
.pageContent .newsBox__inner::after,
.pageContent .newsBox__inner::before {
  position: absolute;
  width: 31px;
  height: 31px;
  content: "";
  background: var(--color-baika-pink) no-repeat center/contain;
  -webkit-mask-image: url(/assets/images/pages/common/compornent_corner-frame.svg);
  mask-image: url(/assets/images/pages/common/compornent_corner-frame.svg)
}
.pageContent .newsBox::before {
  top: 5px;
  left: 5px
}
.pageContent .newsBox::after {
  top: 5px;
  right: 5px;
  transform: scaleX(-1)
}
.pageContent .newsBox__inner::before {
  bottom: 5px;
  left: 5px;
  transform: scaleY(-1)
}
.pageContent .newsBox__inner::after {
  right: 5px;
  bottom: 5px;
  transform: scale(-1,-1)
}
.pageContent .newsBox__head {
  padding-bottom: 22px;
  margin-bottom: 16px;
  border-bottom: 1px dotted rgba(0,0,0,.3)
}
.pageContent .newsBox__information {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px
}
.pageContent .newsBox__information .date {
  font-family: Roboto,sans-serif;
  font-size: 11px
}
.pageContent .newsBox__information .category {
  width: -moz-fit-content;
  width: fit-content;
  padding: 4px 6px;
  font-family: "Noto Sans JP",sans-serif;
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  color: #fff;
  letter-spacing: 0;
  background: var(--color-baika-pink);
  border-radius: 2px
}
.pageContent .newsBox__information .category--highSchool {
  background-color: var(--color-high-school)
}
.pageContent .newsBox__information .category--juniorHighSchool {
  background-color: var(--color-junior-high-school)
}
.pageContent .newsBox__title {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.6
}
.pageContent .newsBox__body {
  line-height: 2.15
}
.pageContent .newsBox .image {
  margin: 20px 0
}
.pageContent .newsBox .image img {
  width: 100%;
  height: auto
}
.pageContent .newsBox .image .caption {
  display: block;
  margin-top: .5em;
  font-family: "Noto Sans JP",sans-serif;
  font-size: 12px;
  letter-spacing: 0
}
.pageContent .newsBox .imageList,
.pageContent .newsBox .imageList--col3 {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 20px 10px
}
.pageContent .newsBox .imageList .image,
.pageContent .newsBox .imageList--col3 .image {
  margin: 0
}
.pageContent .newsBox h2,
.pageContent .newsBox h3,
.pageContent .newsBox h4,
.pageContent .newsBox h5,
.pageContent .newsBox h6 {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-baika-pink);
  letter-spacing: 0
}
.pageContent .newsBox h2:not(:first-child),
.pageContent .newsBox h3:not(:first-child),
.pageContent .newsBox h4:not(:first-child),
.pageContent .newsBox h5:not(:first-child),
.pageContent .newsBox h6:not(:first-child) {
  margin-top: 30px
}
.pageContent .newsBox .list {
  display: grid;
  gap: 6px
}
.pageContent .newsBox .list li {
  position: relative;
  padding-left: 21px;
  line-height: 1.8
}
.pageContent .newsBox .list li::before {
  position: absolute;
  top: 4px;
  left: 0;
  display: block;
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  content: "";
  background: url(/assets/images/pages/common/icon_star.svg) center/contain no-repeat
}
.pageContent .newsBox a {
  color: var(--color-baika-pink);
  text-decoration: underline
}
.pageContent .newsBox .link {
  margin: 1em 0
}
.pageContent .newsBox .link a {
  display: inline-flex;
  align-items: center;
  color: inherit;
  text-decoration: none
}
.pageContent .newsBox .link a::before {
  display: block;
  width: 6px;
  height: 10px;
  margin-right: 10px;
  content: "";
  background: url(/assets/images/pages/common/icon_arw.svg) center/contain no-repeat
}
.pageContent .newsBox .box {
  padding: 35px 30px 30px;
  margin: 30px 0;
  background: var(--color-bg)
}
.pageContent .pager {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 20px 10px;
  margin-top: 40px;
  font-size: 13px;
  font-weight: 500
}
.pageContent .pager__back a,
.pageContent .pager__next a,
.pageContent .pager__prev a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  padding: 10px 20px;
  color: #fff;
  background: var(--color-baika-pink);
  border: 1px solid var(--color-baika-pink);
  border-radius: 64px
}
.pageContent .pager__back a::after,
.pageContent .pager__next a::after,
.pageContent .pager__prev a::after {
  display: block;
  width: 6px;
  height: 10px;
  content: "";
  background: url(/assets/images/pages/common/icon_arw.svg) center/contain no-repeat;
  filter: brightness(0) invert(1);
  transition: .4s
}
.pageContent .pager__back a.disabled,
.pageContent .pager__next a.disabled,
.pageContent .pager__prev a.disabled {
  color: #fff;
  pointer-events: none;
  opacity: .4
}
.pageContent .pager__prev a {
  flex-direction: row-reverse
}
.pageContent .pager__prev a::after {
  transform: scaleX(-1)
}
.pageContent .pager__back {
  grid-column: span 2
}
.pageContent .pager__back a {
  justify-content: center;
  padding: 10px 25px
}
.pageContent .pager__back a::after {
  margin-left: auto
}
.pageContent .pager__back span {
  flex: 1 1 auto;
  text-align: center
}
@media (min-width:768px) {
  .pageContent {
    padding: 160px 0 80px
  }
  .pageContent .newsBox {
    margin: 0;
    border-radius: 10px
  }
  .pageContent .newsBox__inner {
    padding: 88px 160px 80px
  }
  .pageContent .newsBox::after,
  .pageContent .newsBox::before,
  .pageContent .newsBox__inner::after,
  .pageContent .newsBox__inner::before {
    width: 44px;
    height: 44px
  }
  .pageContent .newsBox::before {
    top: 18px;
    left: 18px
  }
  .pageContent .newsBox::after {
    top: 18px;
    right: 18px
  }
  .pageContent .newsBox__inner::before {
    bottom: 18px;
    left: 18px
  }
  .pageContent .newsBox__inner::after {
    right: 18px;
    bottom: 18px
  }
  .pageContent .newsBox__head {
    padding-bottom: 35px;
    margin-bottom: 32px
  }
  .pageContent .newsBox__information {
    gap: 22px
  }
  .pageContent .newsBox__information .date {
    font-size: 14px
  }
  .pageContent .newsBox__information .category {
    font-size: 13px
  }
  .pageContent .newsBox__title {
    font-size: 28px
  }
  .pageContent .newsBox__body {
    font-size: 17px;
    line-height: 1.88
  }
  .pageContent .newsBox .image {
    margin: 30px 0
  }
  .pageContent .newsBox .imageList,
  .pageContent .newsBox .imageList--col3 {
    gap: 20px;
    margin: 30px 0
  }
  .pageContent .newsBox .imageList--col3 {
    grid-template-columns: repeat(3,1fr)
  }
  .pageContent .newsBox h2,
  .pageContent .newsBox h3,
  .pageContent .newsBox h4,
  .pageContent .newsBox h5,
  .pageContent .newsBox h6 {
    margin-bottom: 20px;
    font-size: 24px
  }
  .pageContent .newsBox h2:not(:first-child),
  .pageContent .newsBox h3:not(:first-child),
  .pageContent .newsBox h4:not(:first-child),
  .pageContent .newsBox h5:not(:first-child),
  .pageContent .newsBox h6:not(:first-child) {
    margin-top: 40px
  }
  .pageContent .newsBox .list li {
    font-size: 17px
  }
  .pageContent .newsBox .list li::before {
    top: 8px
  }
  .pageContent .newsBox a:hover {
    text-decoration: none
  }
  .pageContent .newsBox .link a:hover {
    color: var(--color-baika-pink);
    text-decoration: underline
  }
  .pageContent .newsBox .box {
    padding: 38px 40px 40px
  }
  .pageContent .pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px
  }
  .pageContent .pager__back a,
  .pageContent .pager__next a,
  .pageContent .pager__prev a {
    padding: 10px 23px;
    transition: .4s
  }
  .pageContent .pager__back a:hover,
  .pageContent .pager__next a:hover,
  .pageContent .pager__prev a:hover {
    color: var(--color-baika-pink);
    background-color: #fff
  }
  .pageContent .pager__back a:hover::after,
  .pageContent .pager__next a:hover::after,
  .pageContent .pager__prev a:hover::after {
    filter: brightness(1) invert(0)
  }
  .pageContent .pager__next,
  .pageContent .pager__prev {
    width: 200px
  }
  .pageContent .pager__prev a {
    padding-left: 27px
  }
  .pageContent .pager__next {
    order: 1
  }
  .pageContent .pager__next a {
    padding-right: 27px
  }
  .pageContent .pager__back {
    width: 550px
  }
}