@charset "UTF-8";
/*===================================
 page --- その他調査内容
===================================*/
footer {
  margin-top: 115px;
}
@media screen and (min-width: 600px) {
  footer {
    margin-top: 83px;
  }
}

/*----------------------------------
 ページタイトル
----------------------------------*/
.page__title-area {
  background-image: url("../../images/work/other/mv_sp.jpg");
}
@media screen and (min-width: 600px) {
  .page__title-area {
    background-image: url("../../images/work/other/mv.jpg");
  }
}

/*----------------------------------
 冒頭
----------------------------------*/
.intro {
  font-family: "Noto Serif JP", serif;
  font-style: normal;
  font-weight: 400;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  text-align: center;
  margin-top: 35px;
}
@media screen and (min-width: 600px) {
  .intro {
    margin-top: 45px;
  }
}
.intro .l-inner {
  padding: 0 13px;
}
@media screen and (min-width: 600px) {
  .intro .l-inner {
    padding: 0 40px;
  }
}

.intro__txt01 {
  font-size: 2.1rem;
  line-height: 1.4634146341;
}
@media screen and (min-width: 600px) {
  .intro__txt01 {
    font-size: 2.7rem;
    line-height: 1.4814814815;
  }
}

.intro__txt02 {
  font-size: 2.1rem;
  line-height: 1.6829268293;
  margin-top: 3px;
}
@media screen and (min-width: 600px) {
  .intro__txt02 {
    font-size: 3rem;
    line-height: 1.6666666667;
    margin-top: 13px;
  }
}
.intro__txt02 .c-marker:nth-of-type(1) {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #e4cca5));
  background: linear-gradient(transparent 70%, #e4cca5 50%);
}
.intro__txt02 .c-marker:nth-of-type(2) {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #c3d2e4));
  background: linear-gradient(transparent 70%, #c3d2e4 50%);
}
.intro__txt02 .c-marker:nth-of-type(3) {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #c8deba));
  background: linear-gradient(transparent 70%, #c8deba 50%);
}
.intro__txt02 span {
  display: inline-block;
  margin-top: 7px;
}
@media screen and (min-width: 600px) {
  .intro__txt02 span {
    margin-top: 7px;
  }
}

/*----------------------------------
 ページメニュー
----------------------------------*/
.page-menu-wrap {
  position: relative;
  z-index: 1;
  margin-top: 23px;
}
@media screen and (min-width: 600px) {
  .page-menu-wrap {
    margin-top: 74px;
  }
}
.page-menu-wrap .l-inner {
  padding: 0 30px;
}
@media screen and (min-width: 600px) {
  .page-menu-wrap .l-inner {
    max-width: calc(1037px + (40px * 2));
    padding: 0 40px;
  }
}

.page-menu {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(143px, 1fr));
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  gap: 27px 4.3%;
}
@media screen and (min-width: 600px) {
  .page-menu {
    grid-template-columns: repeat(auto-fit, minmax(241px, 1fr));
    gap: 40px 2.3%;
  }
}

.page-menu__item {
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.page-menu__item:nth-child(1) {
  background-color: #a68744;
}
.page-menu__item:nth-child(1) .page-menu__link {
  /* 三角形 */
}
.page-menu__item:nth-child(1) .page-menu__link::after {
  background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, transparent), color-stop(51.8%, #a68744)) no-repeat top left/50.2% 100%, -webkit-gradient(linear, right bottom, left top, color-stop(50%, transparent), color-stop(51.8%, #a68744)) no-repeat bottom right/50.2% 100%;
  background: linear-gradient(to top right, transparent 50%, #a68744 51.8%) no-repeat top left/50.2% 100%, linear-gradient(to top left, transparent 50%, #a68744 51.8%) no-repeat bottom right/50.2% 100%;
}
.page-menu__item:nth-child(2) {
  background-color: #567783;
}
.page-menu__item:nth-child(2) .page-menu__link {
  /* 三角形 */
}
.page-menu__item:nth-child(2) .page-menu__link::after {
  background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, transparent), color-stop(51.8%, #567783)) no-repeat top left/50.2% 100%, -webkit-gradient(linear, right bottom, left top, color-stop(50%, transparent), color-stop(51.8%, #567783)) no-repeat bottom right/50.2% 100%;
  background: linear-gradient(to top right, transparent 50%, #567783 51.8%) no-repeat top left/50.2% 100%, linear-gradient(to top left, transparent 50%, #567783 51.8%) no-repeat bottom right/50.2% 100%;
}
.page-menu__item:nth-child(3) {
  background-color: #6c9069;
}
.page-menu__item:nth-child(3) .page-menu__link {
  /* 三角形 */
}
.page-menu__item:nth-child(3) .page-menu__link::after {
  background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, transparent), color-stop(51.8%, #6c9069)) no-repeat top left/50.2% 100%, -webkit-gradient(linear, right bottom, left top, color-stop(50%, transparent), color-stop(51.8%, #6c9069)) no-repeat bottom right/50.2% 100%;
  background: linear-gradient(to top right, transparent 50%, #6c9069 51.8%) no-repeat top left/50.2% 100%, linear-gradient(to top left, transparent 50%, #6c9069 51.8%) no-repeat bottom right/50.2% 100%;
}
.page-menu__item:nth-child(4) {
  background-color: #d1906f;
}
.page-menu__item:nth-child(4) .page-menu__link {
  /* 三角形 */
}
.page-menu__item:nth-child(4) .page-menu__link::after {
  background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, transparent), color-stop(51.8%, #d1906f)) no-repeat top left/50.2% 100%, -webkit-gradient(linear, right bottom, left top, color-stop(50%, transparent), color-stop(51.8%, #d1906f)) no-repeat bottom right/50.2% 100%;
  background: linear-gradient(to top right, transparent 50%, #d1906f 51.8%) no-repeat top left/50.2% 100%, linear-gradient(to top left, transparent 50%, #d1906f 51.8%) no-repeat bottom right/50.2% 100%;
}
.page-menu__item:hover {
  opacity: 0.75;
}

.page-menu__link {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Noto Serif JP", serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 2.0689655172;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  text-align: center;
  width: 100%;
  padding: 9px 10px;
  /* 三角形アイコン */
  /* 三角形 */
}
@media screen and (min-width: 600px) {
  .page-menu__link {
    font-size: 2.4rem;
    line-height: 2.0833333333;
    padding: 17px 10px;
  }
}
.page-menu__link::before, .page-menu__link::after {
  position: absolute;
  left: 50%;
  -webkit-transform: translateY(0) translateX(-50%);
          transform: translateY(0) translateX(-50%);
  display: block;
  content: "";
}
.page-menu__link::before {
  bottom: 2px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 5px 0 5px;
  border-color: rgba(255, 255, 255, 0.5) transparent transparent transparent;
}
@media screen and (min-width: 600px) {
  .page-menu__link::before {
    bottom: 8px;
    border-width: 6px 8px 0 8px;
  }
}
.page-menu__link::after {
  bottom: -11px;
  width: 100%;
  height: 11px;
}
@media screen and (min-width: 600px) {
  .page-menu__link::after {
    bottom: -18px;
    height: 18px;
  }
}
.page-menu__link:hover {
  opacity: 1;
}

/*----------------------------------
 コンテンツ
----------------------------------*/
.content {
  position: relative;
  max-width: 1260px;
  margin: 0 auto;
  padding-top: 48px;
}
@media screen and (min-width: 600px) {
  .content {
    padding-top: 90px;
  }
}
.content:nth-of-type(n + 3) {
  padding-top: 82px;
}
@media screen and (min-width: 600px) {
  .content:nth-of-type(n + 3) {
    padding-top: 94px;
  }
}
.content:nth-of-type(even) {
  padding-top: 82px;
}
@media screen and (min-width: 600px) {
  .content:nth-of-type(even) {
    padding-top: 198px;
  }
}
.content:nth-of-type(even) .content-detail {
  margin-left: auto;
}
@media screen and (min-width: 600px) {
  .content:nth-of-type(even) .content-detail {
    padding-right: 7%;
    padding-left: 12.3%;
  }
}
.content:nth-of-type(even) .content__img {
  left: 0;
  right: auto;
}
@media screen and (min-width: 600px) {
  .content:nth-of-type(even) .content__img {
    top: 16.8%;
    bottom: auto;
  }
}
.content:nth-of-type(even) .content__img img {
  margin-right: auto;
  margin-left: 0;
}

.content-detail {
  position: relative;
  font-family: "Noto Serif JP", serif;
  font-style: normal;
  font-weight: 400;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  width: 91.94%;
  padding-top: 19px;
  padding-right: 7%;
  padding-bottom: 220px;
  padding-left: 7.8%;
}
@media screen and (min-width: 600px) {
  .content-detail {
    width: 61.75%;
    padding-top: 64px;
    padding-right: 10%;
    padding-bottom: 58px;
    padding-left: 9.4%;
  }
}

.content__catch {
  font-size: 1.9rem;
  line-height: 1.4736842105;
  margin-bottom: 6px;
}
@media screen and (min-width: 600px) {
  .content__catch {
    font-size: 2.7rem;
    line-height: 1.4814814815;
    margin-bottom: 2px;
  }
}

.content__title {
  display: inline;
  font-size: 2.8rem;
}
@media screen and (min-width: 600px) {
  .content__title {
    font-size: 4rem;
  }
}

.content__head {
  line-height: 1.6666666667;
  margin-top: 16px;
}
@media screen and (min-width: 600px) {
  .content__head {
    font-size: 1.9rem;
    line-height: 1.8947368421;
    margin-top: 32px;
  }
}

.content__txt {
  color: #595757;
  font-family: "NotoSans-Light", sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 1.4rem;
  line-height: 1.4814814815;
  -webkit-font-feature-settings: normal;
          font-feature-settings: normal;
  margin-top: 18px;
}
@media screen and (min-width: 600px) {
  .content__txt {
    font-size: 1.5rem;
    line-height: 1.8;
    margin-top: 16px;
  }
}

.content__img {
  position: absolute;
  right: 0;
  bottom: -6.6%;
  z-index: 1;
  display: block;
  margin-left: auto;
  width: 93.06%;
}
@media screen and (min-width: 600px) {
  .content__img {
    right: 0;
    bottom: -9.5%;
    width: 44.6%;
  }
}
.content__img img {
  display: block;
  margin-left: auto;
}
@media screen and (min-width: 600px) {
  .content__img img {
    width: 100%;
  }
}

.btn-contact {
  max-width: 280px;
  margin: 20px 0 25px;
}
@media screen and (min-width: 600px) {
  .btn-contact {
    max-width: 455px;
    margin: 34px 0 -4px;
  }
}
.btn-contact .c-btn-base__link {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  font-family: "Noto Serif JP", serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.7rem;
  letter-spacing: 0;
  line-height: 1.3235294118;
  text-align: left;
  padding: 11px 17px;
  /* 矢印 */
}
@media screen and (min-width: 600px) {
  .btn-contact .c-btn-base__link {
    font-size: 1.8rem;
    line-height: 1.3333333333;
    padding: 13px 17px;
  }
}
.btn-contact .c-btn-base__link::after {
  right: 21px;
  border-top-width: 3px;
  border-right-width: 3px;
}
@media screen and (min-width: 600px) {
  .btn-contact .c-btn-base__link::after {
    right: 21px;
  }
}
.btn-contact p {
  border: 1px solid #fff;
  font-size: 2.2rem;
  line-height: 1.3488372093;
  min-width: 56px;
  margin-right: 18px;
  padding: 10px 5px;
}
@media screen and (min-width: 600px) {
  .btn-contact p {
    font-size: 1.8rem;
    line-height: 1.3333333333;
    min-width: 46px;
    margin-right: 21px;
    padding: 10px 5px;
  }
}
.btn-contact:hover {
  opacity: 0.75;
}

/* ------ 各コンテンツの設定 ------ */
.content01 .content-detail {
  background-color: #fdefde;
}
.content01 .content__catch,
.content01 .content__title {
  color: #a68744;
}
.content01 .c-marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #e4cca5));
  background: linear-gradient(transparent 70%, #e4cca5 50%);
}

.content02 .content-detail {
  background-color: #e2f2fc;
}
.content02 .content__catch,
.content02 .content__title {
  color: #567783;
}
.content02 .c-marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #c3d2e4));
  background: linear-gradient(transparent 70%, #c3d2e4 50%);
}

.content03 .content-detail {
  background-color: #e4f1e9;
}
@media screen and (min-width: 600px) {
  .content03 .content-detail {
    padding-bottom: 45px;
  }
}
.content03 .content__catch,
.content03 .content__title {
  color: #6c9069;
}
.content03 .c-marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #c8deba));
  background: linear-gradient(transparent 70%, #c8deba 50%);
}
.content03 .btn-contact {
  background-color: #6c9069;
}

.content04 .content-detail {
  background-color: #fdf0e8;
}
.content04 .content__catch,
.content04 .content__title {
  color: #9c8371;
}
.content04 .c-marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(50%, #f9d5bf));
  background: linear-gradient(transparent 70%, #f9d5bf 50%);
}
/*# sourceMappingURL=work_other.css.map */