@charset "UTF-8";
.site-main, .sec_fv_page {
  background-color: #DCE2F1;
}

.entry-content {
  position: relative;
}

.ttl_20 {
  font-size: 1.875rem;
  font-size: clamp(1.875rem, 1.625rem + 1vw, 2.5rem);
  font-weight: 500;
  color: #025593;
}

.ly_850 {
  max-width: 850px;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
}

/* カテゴリーリスト（アンカーリンク付き）作成
--------------------------------------------- */
.nav_cat_works {
  padding-top: 80px;
  padding-bottom: 50px;
}

.works-cat-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
}

.works-cat-list li {
  max-width: 284px;
  width: 23%;
  border-bottom: 1px solid #025593;
  margin: 0 1% 20px 1%;
  text-align: left;
}

.works-cat_txt {
  width: calc(100% - 50px);
}

.works-cat-list li a {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: space-between;
  align-items: center;
  color: #025593;
  padding: 12px 15px 10px 8%;
  font-size: 1rem;
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.25rem);
}

.works-cat-list li .ico_arrow {
  transform: rotate(90deg);
}

.cat_on {
  background-color: #025593;
  border-top-right-radius: 38px;
  border-top-left-radius: 14px;
}

.works-cat-list .cat_on a {
  color: #fff;
}

.cat_on .ico_arrow {
  background: #fff;
}

.cat_on .ico_arrow:before,
.cat_on .ico_arrow::after {
  background-color: #025593;
}

/* 投稿一覧
--------------------------------------------- */
.sec_postlist {
  padding-top: 50px;
  padding-bottom: 80px;
}

.works-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
}

.works-item {
  width: 29%;
  margin: 20px 0px 140px 0px;
  position: relative;
}

.pic_works_item {
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: 55px;
  margin-bottom: 1em;
}

.pic_works_item img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.25s;
}

.pic_works_item_no {
  position: relative;
}

.pic_works_item_no::before {
  content: "";
  background-color: #000;
  opacity: 0.05;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.pic_works_item:hover img {
  transform: scale(1.1);
  transition: 0.25s;
}

.item_txt {
  position: absolute;
  left: -1em;
  top: -1.9rem;
  color: #fff;
  text-align: left;
  font-weight: 500;
  z-index: 1;
}

.works-title {
  position: absolute;
  bottom: -2em;
  right: -0.5em;
  text-align: right;
  width: 90%;
  margin-left: auto;
  font-size: 0.9375rem;
  font-size: clamp(0.9375rem, 0.7625rem + 0.7vw, 1.375rem);
  z-index: 1;
}

.works-title span {
  background-color: #025593;
  color: #fff;
  padding: 0.1em 0.5em;
  line-height: 1.8;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone; /* Safari対応 */
}

.works-slug {
  font-size: 1.75rem;
  font-size: clamp(1.75rem, 1.05rem + 2.8vw, 3.5rem);
  line-height: 1.1;
  font-weight: bold;
  letter-spacing: 0.05em;
  width: 90%;
}

.works-office {
  font-size: 0.625rem;
  font-size: clamp(0.625rem, 0.375rem + 1vw, 1.25rem);
}

.works-acf-title, .works-date {
  font-size: 0.8125rem;
  font-size: clamp(0.8125rem, 0.6375rem + 0.7vw, 1.25rem);
}

@media screen and (max-width: 900px) {
  .works-item {
    width: 46%;
    margin: 20px 0px 50px 0px;
  }
  .works-title {
    position: static;
    text-align: left;
    width: 95%;
    margin-left: 0;
  }
  .pic_works_item {
    border-radius: 25px;
  }
  .works-cat-list li {
    width: 30%;
  }
}
@media screen and (max-width: 700px) {
  .works-cat-list li {
    width: 48%;
  }
}
@media screen and (max-width: 640px) {
  .pic_works_item {
    border-radius: 15px;
  }
}
/* 投稿一覧
--------------------------------------------- */
.sec_sonota {
  padding-top: 100px;
  padding-bottom: 100px;
}

.wrap_postlist {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.ttl_sonota {
  margin-bottom: 5px;
}

.deco_sonota {
  color: #025593;
}

.ttkbox_sonota {
  margin-bottom: 80px;
}

/* 投稿
--------------------------------------------- */
.sec_works_acf {
  position: relative;
  margin-top: -180px;
  padding-bottom: 80px;
}

.wrap_works_acf {
  max-width: 1180px;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.info-details {
  padding-top: 20px;
  line-height: 1.8;
}

.works-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 170px;
  margin-top: 0rem;
  margin-top: clamp(0rem, -26.5625rem + 42.5vw, 10.625rem);
  width: 430px;
  padding-right: 20px;
  text-align: left;
  color: #025593;
}

.info-row {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #025593;
}

.info-row:last-child {
  border-bottom: none;
}

.info-row dt {
  min-width: 100px;
  font-weight: bold;
  padding: 10px 10px 12px 10px;
}

.info-row dd {
  margin: 0;
  flex: 1;
  padding: 10px 10px 12px 10px;
}

.slide_works {
  width: calc(95% - 430px);
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
}

.slide_works img {
  -o-object-fit: cover;
     object-fit: cover;
  min-width: 100%;
  min-height: 100%;
}

@media screen and (max-width: 1000px) {
  .works-info {
    width: 100%;
    padding-right: 0;
  }
  .slide_works {
    width: 100%;
  }
  .wrap_works_acf {
    max-width: 700px;
  }
}
/* スライダー
--------------------------------------------- */
.thumb-slider .slick-current img {
  opacity: 1;
}

.slick-slide {
  overflow: hidden;
  aspect-ratio: 4/3;
  cursor: pointer;
  width: 100%;
}

.main-slider {
  margin-bottom: 20px;
}

.single-image {
  margin: 0 auto;
}

.main-slider .slick-slide, .single-image img {
  border-radius: 50px;
}

.thumb-slider .slick-slide {
  border-radius: 12px;
  margin: 4px;
}

.main-slider img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.thumb-slider img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  opacity: 0.7;
  transition: opacity 0.3s;
}

.thumb-slider img:hover {
  opacity: 1;
}

@media screen and (max-width: 900px) {
  .main-slider .slick-slide, .single-image img {
    border-radius: 25px;
  }
}
@media screen and (max-width: 640px) {
  .main-slider .slick-slide, .single-image img {
    border-radius: 15px;
  }
}
/* 詳細
--------------------------------------------- */
.sec_content {
  padding-top: 0px;
  padding-bottom: 80px;
}

/* 
--------------------------------------------- */
.site-footer, .sec_pagetop {
  background-color: #DCE2F1;
}