@charset "UTF-8";
/* =====================
	旧テーマから移行
 ======================= */
/* 詳細ページ（AとB共通のデザイン）
***************************************************************/
/* 記事コンテンツ */
.singleContents {
  margin-top: 60px; }

.singleContents .caption {
  font-size: 14px;
  line-height: 1.714;
  letter-spacing: 0;
  text-align: justify;
  text-justify: inter-ideograph;
  margin-top: 10px; }

.singleContents .image {
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; }

/* /記事コンテンツここまで */
@media all and (min-width: 681px) {
  /* 記事コンテンツ */
  .singleContents .singleColumn {
    margin-top: 60px; }
  .singleContents .singleColumn:first-child {
    margin-top: 0; }
  .singleContents .leftColumn,
  .singleContents .rightColumn {
    width: 580px; }
  .singleContents .typeImage .image {
    height: 863px; }
  .singleContents .typeImage .caption {
    padding-left: 60px;
    padding-right: 60px; }
  .singleContents .typeThreeImage .leftColumn .image,
  .singleContents .typeTwoImage.typeLarge .image {
    height: 870px; }
  .singleContents .typeTwoImage,
  .singleContents .typeThreeImage {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
  .singleContents .typeTwoImage .caption,
  .singleContents .typeThreeImage .caption {
    padding-left: 30px;
    padding-right: 30px; }
  .singleContents .typeTwoImage .image,
  .singleContents .typeThreeImage .image {
    height: 382px; }
  .singleContents .typeThreeImage .rightColumn .image {
    height: 415px; }
  .singleContents .typeThreeImage .rightColumn .image + .image {
    margin-top: 40px; }
  .singleContents .typeText + .typeText {
    margin-top: 20px; }
  /* /記事コンテンツここまで */ }

@media all and (max-width: 680px) {
  /* 記事コンテンツ */
  .singleContents {
    margin-top: 30px; }
  .singleContents .singleColumn {
    margin-top: 30px; }
  .singleContents .singleColumn:first-child {
    margin-top: 0; }
  .singleContents .rightColumn {
    margin-top: 30px; }
  .singleContents .typeThreeImage .rightColumn .image + .image {
    margin-top: 10px; }
  .singleContents .typeImage .image,
  .singleContents .typeTwoImage .image,
  .singleContents .typeThreeImage .rightColumn .image {
    height: 67.5vw; }
  .singleContents .typeThreeImage .leftColumn .image,
  .singleContents .typeTwoImage.typeLarge .image {
    height: 150vw; }
  .singleContents .caption {
    font-size: 14px;
    line-height: 1.857;
    margin-top: 10px;
    margin-left: 12px;
    margin-right: 12px; }
  /* /記事コンテンツここまで */ }

/* =====================
	WORKS
 ======================= */
/** ------------------------ 絞り込み ------------------------ **/
.works-filter {
  border: 2px solid var(--c_text);
  position: relative;
  padding: 30px 24px;
  margin-bottom: 100px; }
  .works-filter-title {
    font-size: 26px;
    font-weight: 700;
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    margin: auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 10px 22px;
    background: var(--c_wht);
    -webkit-transform: translateY(50%);
            transform: translateY(50%); }
  .works-filter-scroll {
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px 54px;
    max-height: 250px; }
    .works-filter-scroll::-webkit-scrollbar {
      width: 20px; }
    .works-filter-scroll::-webkit-scrollbar-track {
      background: #D2D2D2;
      border-radius: 50px; }
    .works-filter-scroll::-webkit-scrollbar-thumb {
      background: #848484;
      border-radius: 50px;
      border: 4px solid #D2D2D2; }
  .works-filter-tag {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 20px 24px; }
    .works-filter-tag a {
      display: block;
      background: #EADFBE;
      border-radius: 50px;
      font-size: 20px;
      font-weight: 700;
      padding: 4px 32px; }
      .works-filter-tag a.is-current {
        background: var(--c_green);
        color: var(--c_wht);
        pointer-events: none; }

/** ------------------------ 一覧 ------------------------ **/
.works-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 3.8% 1fr 3.8% 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px 3.8%; }
  .works-list-item a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background: var(--c_wht);
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    -webkit-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.16);
            box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.16); }
  .works-list-item .thumb {
    position: relative;
    width: 100%;
    padding-top: 71.5%; }
    .works-list-item .thumb img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      position: absolute;
      top: 0;
      left: 0; }
  .works-list-item .txtbox {
    padding: 20px 28px 32px;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  .works-list-item .title {
    font-weight: 700;
    line-height: 1.5625;
    margin-bottom: 1em; }
  .works-list-item .tags {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 8px 10px;
    margin-bottom: 16px; }
    .works-list-item .tags > span {
      font-size: 12px;
      font-weight: 700;
      background: var(--c_green);
      color: var(--c_wht);
      border-radius: 50px;
      padding: 8px 16px; }
      .works-list-item .tags > span:before {
        content: "#"; }
  .works-list-item .more {
    margin-top: auto;
    margin-left: auto;
    font-size: 12px;
    font-weight: 700;
    padding: 0 16px 2px 8px;
    border-bottom: 2px solid var(--c_text);
    position: relative; }
    .works-list-item .more:after {
      content: "";
      width: 12px;
      height: 2px;
      background: var(--c_text);
      position: absolute;
      right: 0;
      bottom: -2px;
      -webkit-transform: rotate(30deg);
              transform: rotate(30deg);
      -webkit-transform-origin: right bottom;
              transform-origin: right bottom; }

/** ------------------------ 詳細 ------------------------ **/
.works-single .works-single-header {
  margin: 0 0 30px; }
  .works-single .works-single-header .thumb img {
    margin: 0 auto; }

.works-single .works-single-title {
  margin: 0 0 20px;
  font-size: 26px;
  font-weight: 700; }

.works-single .works-single-data {
  margin: 30px 0 50px; }

.works-single .works-single-data-tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 30px; }
  .works-single .works-single-data-tag > li {
    font-size: 24px;
    font-weight: 700;
    background: var(--c_green);
    color: var(--c_wht);
    border-radius: 50px;
    padding: 8px 36px; }

.works-single .works-single-data-main {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(40.5%, auto) 2% minmax(40.5%, auto);
  grid-template-columns: repeat(2, minmax(40.5%, auto));
  gap: 20px 2%; }
  .works-single .works-single-data-main > li > dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 24px;
       -moz-column-gap: 24px;
            column-gap: 24px;
    font-size: 20px;
    margin-bottom: 20px; }
    .works-single .works-single-data-main > li > dl:last-child {
      margin-bottom: 0; }
    .works-single .works-single-data-main > li > dl dt {
      -webkit-box-flex: 0;
          -ms-flex: 0 0 180px;
              flex: 0 0 180px;
      background: #EADFBE;
      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;
      text-align: center;
      padding: 10px; }
    .works-single .works-single-data-main > li > dl dd {
      padding: 10px 0; }

.works-single .works-single-content.singleContents .caption {
  font-size: 16px;
  font-weight: 700; }

/* タブレット
  ------------------------ */
/* スマホ
  ------------------------ */
@media (max-width: 699px) {
  /** ------------------------ 絞り込み ------------------------ **/
  .works-filter {
    border-width: 1px;
    padding: 16px 8px;
    margin-bottom: 50px; }
    .works-filter-title {
      font-size: 16px;
      padding: 4px 8px; }
    .works-filter-scroll {
      padding: 12px;
      max-height: 156px; }
      .works-filter-scroll::-webkit-scrollbar {
        width: 8px; }
      .works-filter-scroll::-webkit-scrollbar-thumb {
        border-width: 2px; }
    .works-filter-tag {
      gap: 8px 12px; }
      .works-filter-tag a {
        font-size: 14px;
        padding: 2px 16px; }
  /** ------------------------ 一覧 ------------------------ **/
  .works-list {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    gap: 28px 0; }
    .works-list-item a {
      border-radius: 10px; }
    .works-list-item .txtbox {
      padding: 10px 12px 20px; }
    .works-list-item .title {
      margin-bottom: 8px; }
    .works-list-item .tags {
      margin-bottom: 12px;
      gap: 4px 8px; }
      .works-list-item .tags > span {
        font-size: 10px;
        padding: 4px 12px; }
    .works-list-item .more {
      font-size: 10px;
      padding: 0 12px 2px 6px;
      border-width: 1px; }
      .works-list-item .more:after {
        width: 8px;
        height: 1px;
        bottom: -1px; }
  /** ------------------------ 詳細 ------------------------ **/
  .works-single .works-single-header {
    margin-bottom: 16px; }
  .works-single .works-single-title {
    font-size: 18px; }
  .works-single .works-single-data {
    margin: 16px 0 24px; }
  .works-single .works-single-data-tag {
    gap: 4px; }
    .works-single .works-single-data-tag > li {
      font-size: 14px;
      padding: 4px 16px; }
  .works-single .works-single-data-main {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    row-gap: 8px; }
    .works-single .works-single-data-main > li > dl {
      -webkit-column-gap: 12px;
         -moz-column-gap: 12px;
              column-gap: 12px;
      font-size: 14px;
      margin-bottom: 8px; }
      .works-single .works-single-data-main > li > dl dt {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 80px;
                flex: 0 0 80px;
        padding: 4px; }
      .works-single .works-single-data-main > li > dl dd {
        padding: 4px 0; }
  .works-single .works-single-content.singleContents .caption {
    font-size: 12px;
    line-height: 1.5; } }