/*!
global > color
------------------------------
*/
/*!
global > mixin
------------------------------
*/
.p-library .c-mv__img img {
  min-height: 210px;
}
.p-library .c-mv__anchor {
  position: absolute;
  right: 24px;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  max-width: calc(100% - 48px);
  padding: 12px 22px;
  background-color: #567095;
  border-radius: 10px 10px 0 0;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p-library .c-mv__anchor {
    right: 24px;
    padding: 16px 28px;
    transition: all 0.5s;
  }
  .p-library .c-mv__anchor:hover {
    background-color: #222;
  }
}
.p-library .c-mv__anchor::after {
  content: "";
  transform: rotate(90deg);
  width: 15px;
  height: 15px;
  background-color: #fff;
  mask: url(../images/common/icon_arrow_circle.svg) no-repeat center/contain;
}
.p-library #content.c-page {
  padding-bottom: 0;
}
@media screen and (min-width: 768px) {
  .p-library #content.c-page {
    padding-top: 51px;
  }
}
.p-library #content .c-btn {
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .p-library #content .c-btn {
    transition: all 0.5s;
  }
  .p-library #content .c-btn:hover {
    opacity: 0.8;
  }
}
.p-library #content .p-library-info {
  margin-bottom: 60px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info {
    margin-bottom: 70px;
  }
}
.p-library #content .p-library-info h2 {
  margin-bottom: 24px;
}
.p-library #content .p-library-info__list {
  margin-bottom: 40px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__list {
    margin-bottom: 59px;
  }
}
.p-library #content .p-library-info__post {
  margin-bottom: 3px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__post {
    transition: all 0.5s;
  }
  .p-library #content .p-library-info__post:hover {
    opacity: 0.7;
  }
}
.p-library #content .p-library-info__post:last-child {
  margin-bottom: 0;
}
.p-library #content .p-library-info__post-inner {
  display: flex;
  flex-direction: column;
  padding: 18px 15px;
  background-color: #fff;
  border-radius: 4px;
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__post-inner {
    flex-direction: row;
    align-items: flex-start;
    min-height: 52px;
    padding: 15px 17px 13px;
  }
}
.p-library #content .p-library-info__post-date {
  display: block;
  margin-bottom: 3px;
  color: #567095;
  font-family: "Amiri", serif;
  font-size: 0.875rem;
  line-height: 1.2;
  letter-spacing: 0;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__post-date {
    position: relative;
    top: 3px;
    flex-shrink: 0;
    width: 105px;
    margin-bottom: 0;
  }
}
.p-library #content .p-library-info__post-ttl {
  color: #222;
  font-size: 0.875rem;
  line-height: 1.5;
  letter-spacing: 0.03em;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__post-ttl {
    font-size: 1rem;
  }
}
.p-library #content .p-library-info__btn {
  display: flex;
  justify-content: center;
  align-items: center;
}
.p-library #content .p-library-info__btn .c-btn {
  max-width: 400px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-info__btn .c-btn::before {
    right: 37px;
    top: calc(50% + 1px);
    width: 21px;
    height: 21px;
  }
}
.p-library #content .p-library-content > * + * {
  margin-top: 24px;
}
.p-library #content .p-library-ttl {
  position: relative;
  margin-bottom: 19px;
  font-size: 1.25rem;
  border-bottom: none;
  text-align: center;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-ttl {
    font-size: 1.5rem;
  }
}
.p-library #content .p-library-related {
  margin-top: 50px;
  padding: 50px 0;
  border-top: 2px solid #e1e4e5;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-related {
    margin-top: 80px;
    padding: 47px 0 67px;
  }
}
.p-library #content .p-library-related .c-btn-grid {
  gap: 12px 12px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-related .c-btn {
    padding: 10px 50px 12px;
  }
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-related .c-btn::before {
    right: 28px;
    width: 17px;
    height: 17px;
  }
}
.p-library #content .p-library-other {
  position: relative;
  padding: 50px 0;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-other {
    padding: 83px 0 92px;
  }
}
.p-library #content .p-library-other::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 200vw;
  min-width: 1200px;
  height: 100%;
  background-color: #e1e4e5;
  pointer-events: none;
}
.p-library #content .p-library-other .c-btn-grid {
  gap: 12px 12px;
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-other .c-btn {
    padding: 10px 35px 12px 22px;
  }
}
@media screen and (min-width: 768px) {
  .p-library #content .p-library-other .c-btn::before {
    right: 16px;
    width: 17px;
    height: 17px;
  }
}

/*# sourceMappingURL=library.css.map */

/* --- 2026-07-29 MVアンカーが画像下端から浮く問題の修正 --- */
/* .c-mv__img(figure) は vw 指定の固定高だが、内側の img にのみ    */
/* min-height:210px が効いていたため、狭い幅で画像だけがはみ出し、 */
/* bottom:0 のアンカーが枠の下端に取り残されていた。              */
/* ラッパー側にも同じ min-height を与えて高さを一致させる。        */
.p-library .c-mv__img {
  min-height: 210px;
}
/* --- ここまで --- */