@charset "UTF-8";

.pagination1,
.bg2 {
  margin-top: 4em;
}

.labelsList1 {
  margin: 0 0 4em;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}

.labelsList1 > li {
  margin: 0.625em;
}

.labelsList1 a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #F0F0F0 url(../images/common/arrow_next_black.svg) no-repeat 1.25em center;
  background-size: 0.3125em auto;
  padding: 0 1.25em 0 2em;
  height: 2.5em;
  border-radius: 1.25em;
  line-height: 1.5;
  transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.labelsList1 a:hover,
.labelsList1 a.current {
  background-color: #0C7C66;
  color: #FFF;
  background-image: url(../images/common/arrow_next_white.svg);
}

.labelsList1 a:hover {
  opacity: 1;
}

@media screen and (min-width: 768px) {
  .pagination1 {
    margin-top: 8.75em;
  }

  .bg2 {
    margin-top: 3.75em;
  }

  .labelsList1 {
    margin-bottom: 6.25em;
  }
}

.workMainImg {
  margin: 0 auto 3.75em;
  width: 100%;
  height: 0;
  padding: 0 0 50.63492%;
  position: relative;
}

.workMainImg .mainImg {
  display: block;
  margin: 0 auto 3.75em;
  object-fit: contain;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.workSiteLink {
  color: #0C7C66;
}

.workSiteLink i {
  font-size: 0.857143em;
  margin-left: 0.5em;
}
/*
.snsButtonWrap {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0;
  align-items: center;
}
.snsButtonListItem {
  flex-basis: 49%;
  text-align: center;
  line-height: 1;
  margin-bottom: 2%;
}
.snsButtonItem {
  display: block;
  color: #fff;
  padding: 10px 0;
}
.snsButtonItem::before {
  font-family: "Font Awesome 5 Brands";
  /* font-size: 22px; */
  /*
  padding-right: 0.5em;
}
.twitter {
  background-color: #1da1f2;
}
.twitter::before {
  content: '\f099';
}
.facebook {
  background-color: #1778f2;
}
.facebook::before {
  content: '\f082';
}
.line {
  background-color: #06c755;
}
.line::before {
  content: '\f3c0';
}
*/
@media (min-width: 820px) {
  .workShare {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    justify-content: flex-end;
  }
  /*
    .workSnsWrap {
      max-width: 660px;
    }
    .snsButtonWrap {
      width: 500px;
    }
    .snsButtonListItem {
      flex-basis: 23%;
      margin-bottom: 0;
    }
    */
}

@media screen and (min-width: 768px) {
  .workMainImg .mainImg {
    margin-bottom: 6.25em;
  }

  .workSiteLink {
    font-size: 0.875em;
    margin-bottom: 0;
    margin-right: 3em;
    flex-shrink: 0;
  }
}

.commentBlock {
  background-color: #FFF;
  border-radius: 10px;
  padding: 2.5em 2em;
  margin: 0 0 3.5em;
}

.commentBlock:last-child {
  margin-bottom: 0;
}

.tagsList1 {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.tagsList1 > li {
  font-size: 0.875em;
  margin: 0.5em 1.428571em 0.5em 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #272727;
  color: #FFF;
  line-height: 1.1;
  height: 2.857143em;
  padding: 0 1em;
  border-radius: 4px;
}

@media screen and (min-width: 768px) {
  .commentBlock {
    padding: 3.5em 5em;
    margin-bottom: 5em;
  }

  .mainTitle1 p[lang="en"] {
    font-size: 1.9em;
  }
}

.worksSlider {
  margin: 4em auto 0;
  width: 93.75%;
}

.workImg {
  padding: 0 1em;
}

.worksSlider .slick-arrow {
  font-size: 1em;
  background: #272727;
  border: none;
  margin: 0;
  padding: 0;
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  position: absolute;
  z-index: 1000;
  top: 50%;
  margin-top: -3em;
  cursor: pointer;
  transition: opacity 0.2s ease-out;
}

.worksSlider .slick-arrow:hover {
  opacity: 0.7;
}

.worksSlider .slick-arrow img {
  display: block;
  width: 0.615385em;
}

.worksSlider .slick-prev {
  left: -0.5em;
}

.worksSlider .slick-next {
  right: -0.5em;
}

.worksSlider .slick-dots {
  margin: 2.3em 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.worksSlider .slick-dots > li {
  margin: 0 0.769231em;
}

.worksSlider .slick-dots button {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  font-size: 1em;
  display: block;
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
  background: #F0F0F0;
  border-radius: 50%;
  width: 1em;
  height: 1em;
  cursor: pointer;
  transition: opacity 0.2s ease-out;
}

.worksSlider .slick-dots button:hover {
  opacity: 0.7;
}

.worksSlider .slick-dots .slick-active button {
  background: #C6C6C6;
}

@media screen and (min-width: 768px) {
  .worksSlider {
    margin-top: 8.75em
  }

  .worksSlider .slick-dots {
    margin-top: 6.25em;
  }
}

@media screen and (min-width: 960px) {
  .worksSlider .slick-arrow {
    width: 5em;
    height: 5em;
    margin-top: -6em;
  }

  .worksSlider .slick-prev {
    left: -1.5em;
  }
  
  .worksSlider .slick-next {
    right: -1.5em;
  }
  
  .worksSlider .slick-arrow img {
    width: 1em;
  }
}

/* 20260213 */
.information {
  width: 80%;
  margin: 40px auto 0;
  @media (max-width: 767px) {
    width: 100%;
  }
}
.information__inner {
  margin-top: 50px;
}
.information__hd {
  font-size: 24px;
  display: flex;
  align-items: center;
  gap: 1em;
  @media (max-width: 767px) {
    font-size: 22px;
  }
}
.information__hdEn {
  margin: 0;
  font-family: 'Jost', sans-serif;
  font-weight: 500;
}
.information__hdJp {
  margin: 0;
  color: #0c7c66;
  font-size: 0.8em;
}
.information__description {
  width: 90%;
  margin: 30px auto 0;
  border-bottom: 1px solid #999;
  display: flex;
  align-items: center;
  padding-bottom: 10px;
  
  @media (max-width: 767px) {
    margin-top: 15px;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }
}
.information__descTerm {
  width: 12em;
  font-weight: bold;
}
.information__detail.typeFlex {
  display: flex; 
  gap: .7em;
  flex-wrap: wrap;
}
.information__catName {
  display: block;
  color: #fff;
  background-color: #0C7C66;
  padding: 3px 20px 5px;
  border-radius: 20px;

  @media (max-width: 767px) {
    padding: 2px 10px 3px;
  }
}
.information__catName:not(:last-child) {
}

.information__url {
  color: #0C7C66;
  
  i {
    margin-left: 10px;
  }
}