@charset "UTF-8";
.top {
  position: relative;
}

@media screen and (min-width: 769px) {
  .l-header {
    pointer-events: all;
  }
  body.mvAniPlayingPC .l-header {
    opacity: 0;
    pointer-events: none;
  }
  body.mvAniPlayingPC .l-header.scrollact {
    opacity: 1;
    pointer-events: all;
  }
}
.mv-full {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.mv-sp {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100vh;
  background: url(../img/top/mv-bg-sp.webp) 50% 50%/cover #fff;
}
.mv-sp .mv-s-copy-01 {
  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;
}
.mv-sp .mv-s-copy-01-in {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: min(6.933vw, 31.2px);
  opacity: 0;
}
.mv-sp .mv-s-copy-01-a {
  width: min(6.995vw, 31.476px);
}
.mv-sp .mv-s-copy-01-b {
  width: min(5.011vw, 22.548px);
}
.mv-sp .mv-s-copy-02 {
  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;
}
.mv-sp .mv-s-copy-02-in {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: min(6.933vw, 31.2px);
  opacity: 0;
}
.mv-sp .mv-s-copy-02-a {
  width: min(12.259vw, 55.164px);
}
.mv-sp .mv-s-copy-02-b {
  width: min(4.981vw, 22.416px);
}
.mv-sp .mv-s-catch {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  opacity: 0;
}
.mv-sp .mv-s-catch img {
  width: min(31.629vw, 142.332px);
  translate: 20% 0;
}
.mv-sp .mv-s-cg .cg {
  height: 110%;
  opacity: 0;
}
.mv-sp .mv-s-cg .cg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 40%;
     object-position: 50% 40%;
}
.mv-sp .mv-s-cg-cap {
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.8), 0 0 3px rgba(0, 0, 0, 0.9), 0 0 2px rgb(0, 0, 0);
  opacity: 0;
}
@media screen and (min-width: 769px) {
  .mv-sp {
    display: none;
  }
}
.mv-pc {
  overflow: hidden;
  position: relative;
  aspect-ratio: 1388/714;
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background: url(../img/top/mv-bg-pc.webp) 50% 50%/cover #fff;
}
.mv-pc .mv-s-copy-01 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.mv-pc .mv-s-copy-01-in {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(1.873vw, 31.2px);
  opacity: 0;
}
.mv-pc .mv-s-copy-01-a {
  width: min(16.189vw, 269.64px);
}
.mv-pc .mv-s-copy-01-b {
  width: min(24.416vw, 406.68px);
}
.mv-pc .mv-s-copy-02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.mv-pc .mv-s-copy-02-in {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(1.873vw, 31.2px);
  opacity: 0;
}
.mv-pc .mv-s-copy-02-a {
  width: min(31.921vw, 531.672px);
}
.mv-pc .mv-s-copy-02-b {
  width: min(22.442vw, 373.788px);
}
.mv-pc .mv-s-cg::after {
  content: "";
  display: block;
  width: 35.74%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background: -webkit-gradient(linear, left top, right top, color-stop(10%, rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.7) 100%);
}
.mv-pc .mv-s-cg .cg {
  aspect-ratio: 1388/1008;
  opacity: 0;
}
.mv-pc .mv-s-cg .cg img {
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.mv-pc .mv-s-catch {
  position: absolute;
  z-index: 1;
  top: 59%;
  right: min(10.591vw, 176.4px);
  opacity: 0;
  translate: 0 -50%;
}
.mv-pc .mv-s-catch img {
  width: min(10.017vw, 166.836px);
}
.mv-pc .mv-s-cg-cap {
  color: #282626;
}
@media screen and (max-width: 768px) {
  .mv-pc {
    display: none;
  }
}
.mv-skip {
  display: none;
  opacity: 0;
  position: absolute;
  z-index: 10;
  right: min(1.441vw, 24px);
  bottom: min(1.441vw, 24px);
  display: block;
  padding: min(0.865vw, 14.4px) min(2.305vw, 38.4px);
  background-color: rgba(0, 0, 0, 0.7);
  font-size: clamp(11.2px, 1.009vw, 16.8px);
  font-family: "Roboto", YakuHanJPs, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: #fff;
  letter-spacing: 0.1em;
  line-height: 1;
  border-radius: 2px;
}
@media screen and (max-width: 768px) {
  .mv-skip {
    display: none;
    right: min(2.667vw, 12px);
    bottom: min(2.667vw, 12px);
    font-size: clamp(9.6px, 3.2vw, 14.4px);
    padding: min(2.133vw, 9.6px) min(4.267vw, 19.2px);
  }
}
.mv-new {
  opacity: 0;
  position: absolute;
  z-index: 10;
  left: max(min(1.441vw, 24px), (100vw - min(100.865vw, 1680px)) / 2);
  top: calc(clamp(59.2px, 5.331vw, 88.8px) + min(1.153vw, 19.2px));
  font-size: min(1.801vw, 30px);
  line-height: 1;
  letter-spacing: 0.22em;
  color: #fff;
  border: solid #fff;
  border-width: 1px 0;
  padding: 0.25em 0;
}
@media screen and (max-width: 768px) {
  .mv-new {
    top: calc(clamp(59.2px, 5.331vw, 88.8px) + min(2.133vw, 9.6px));
    left: min(3.2vw, 14.4px);
    font-size: min(6.667vw, 30px);
  }
}
@media screen and (max-width: 768px) and (min-aspect-ratio: 375/667) {
  .mv-new {
    color: #a48341;
    border-color: #a48341;
  }
}

.usp {
  background: #282626;
  padding: min(5.187vw, 86.4px) 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .usp {
    padding-block: min(14.933vw, 67.2px);
  }
}
.usp img {
  width: 100%;
}
.usp-inner {
  max-width: min(74.64vw, 1243.2px);
  margin-inline: auto;
}
@media screen and (max-width: 768px) {
  .usp-inner {
    max-width: min(77.867vw, 350.4px);
  }
}
.usp-copy .item-a {
  display: inline-block;
  margin-right: min(0.908vw, 15.12px);
  width: min(13.71vw, 228.348px);
}
@media screen and (max-width: 768px) {
  .usp-copy .item-a {
    display: block;
    width: min(40vw, 180px);
    margin-right: 0;
    margin-inline: auto;
  }
}
.usp-copy .item-b {
  display: inline-block;
  width: min(26.404vw, 439.788px);
}
@media screen and (max-width: 768px) {
  .usp-copy .item-b {
    display: block;
    width: min(76.8vw, 345.6px);
    margin-top: min(4.267vw, 19.2px);
    margin-inline: auto;
  }
}
.usp-point {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 603.89fr min(2.161vw, 36px) 277.15fr;
  grid-template-columns: 603.89fr 277.15fr;
  gap: 0 min(2.161vw, 36px);
  margin-top: min(2.305vw, 38.4px);
}
@media screen and (max-width: 768px) {
  .usp-point {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    margin-top: min(10.667vw, 48px);
  }
}
.usp-point .item-01 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 346.18fr min(0.937vw, 15.6px) 244.76fr;
  grid-template-columns: 346.18fr 244.76fr;
  gap: min(0.937vw, 15.6px);
}
@media screen and (max-width: 768px) {
  .usp-point .item-01 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: min(4.8vw, 21.6px);
  }
  .usp-point .item-01 .item-a {
    width: min(77.333vw, 348px);
    margin-inline: auto;
  }
  .usp-point .item-01 .item-b {
    width: min(67.733vw, 304.8px);
    margin-inline: auto;
  }
}
.usp-point .item-02 {
  border-left: 1px solid rgba(204, 204, 204, 0.5);
  padding-left: min(2.161vw, 36px);
}
@media screen and (max-width: 768px) {
  .usp-point .item-02 {
    border-left: none;
    border-top: 1px solid rgba(204, 204, 204, 0.5);
    padding-left: 0;
    padding-block: min(5.867vw, 26.4px);
    margin-top: min(5.867vw, 26.4px);
  }
  .usp-point .item-02 .item {
    width: min(53.067vw, 238.8px);
    margin-inline: auto;
  }
}
.usp-point .item-03 {
  -ms-grid-column-span: 2;
  grid-column: span 2;
  border-top: 1px solid rgba(204, 204, 204, 0.5);
  padding-top: min(1.945vw, 32.4px);
  margin-top: min(1.369vw, 22.8px);
}
.usp-point .item-03-inner {
  width: 53.19%;
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 285.62fr min(2.882vw, 48px) 225.32fr;
  grid-template-columns: 285.62fr 225.32fr;
  gap: min(2.882vw, 48px);
}
@media screen and (max-width: 768px) {
  .usp-point .item-03 {
    -ms-grid-column-span: 1;
    grid-column: span 1;
    margin-top: 0;
    padding-top: min(5.867vw, 26.4px);
  }
  .usp-point .item-03-inner {
    width: 100%;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: min(7.733vw, 34.8px);
  }
  .usp-point .item-03-inner .item-a {
    width: min(61.867vw, 278.4px);
    margin-inline: auto;
  }
  .usp-point .item-03-inner .item-b {
    width: min(76.533vw, 344.4px);
    margin-inline: auto;
  }
}

.action {
  padding: min(5.187vw, 86.4px) 0;
}
@media screen and (max-width: 768px) {
  .action {
    padding-block: min(14.933vw, 67.2px);
  }
}
.action-main {
  font-size: clamp(24px, 2.161vw, 36px);
  line-height: 1.6;
  letter-spacing: 0.15em;
  color: #a48341;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .action-main {
    font-size: clamp(16px, 5.333vw, 24px);
  }
}
.action-link {
  margin: min(1.729vw, 28.8px) auto 0;
  max-width: min(57.637vw, 960px);
}
@media screen and (max-width: 768px) {
  .action-link {
    margin-top: min(4.267vw, 19.2px);
    max-width: none;
  }
}
.action-link .c-button {
  font-size: clamp(14.4px, 1.297vw, 21.6px);
  height: min(5.187vw, 86.4px);
}
@media screen and (max-width: 768px) {
  .action-link .c-button {
    font-size: clamp(11.2px, 3.733vw, 16.8px);
    height: min(12.8vw, 57.6px);
  }
}

.info {
  background: #e5dfdc;
  padding: min(2.882vw, 48px) 0;
  text-align: center;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .info {
    padding-block: min(8.533vw, 38.4px);
  }
}
.info-hd {
  font-size: clamp(12.8px, 1.153vw, 19.2px);
  line-height: 1;
  font-family: "Roboto", YakuHanJPs, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  font-weight: 500;
  letter-spacing: 0.15em;
}
.info-body {
  font-size: clamp(12.8px, 1.153vw, 19.2px);
  margin-top: min(1.153vw, 19.2px);
  display: inline-block;
  text-align: left;
  font-family: "Roboto", YakuHanJPs, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  max-width: 720px;
}

.concept {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 654fr 678fr;
  grid-template-columns: 654fr 678fr;
  -ms-grid-rows: auto auto 1fr;
  grid-template-rows: auto auto 1fr;
  margin-top: min(4.035vw, 67.2px);
}

.concept > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.concept > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}

.concept > *:nth-child(3) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}

.concept > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
}

.concept > *:nth-child(5) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.concept > *:nth-child(6) {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
}
@media screen and (max-width: 768px) {
  .concept {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: (auto)[4];
    grid-template-rows: repeat(4, auto);
  }
  .concept > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .concept > *:nth-child(2) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .concept > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .concept > *:nth-child(4) {
    -ms-grid-row: 4;
    -ms-grid-column: 1;
  }
}
.concept-map {
  -ms-grid-column-span: 2;
  grid-column: span 2;
}
.concept-map-img {
  width: min(90.778vw, 1512px);
  max-width: 1400px;
  margin-inline: auto;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 768px) {
  .concept-map-img {
    width: 100%;
  }
}
.concept-map-dir {
  position: absolute;
  z-index: 401;
  right: min(1.153vw, 19.2px);
  bottom: min(1.153vw, 19.2px);
  width: min(3.89vw, 64.8px);
}
@media screen and (max-width: 768px) {
  .concept-map-dir {
    width: min(8.533vw, 38.4px);
    right: min(2.133vw, 9.6px);
    bottom: min(2.133vw, 9.6px);
  }
}
.concept-map-cap {
  width: min(89.337vw, 1488px);
  max-width: 1400px;
  margin-inline: auto;
  text-align: right;
  padding: 0.5em 0.5em 0;
}
@media screen and (max-width: 768px) {
  .concept-map-cap {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .concept-map {
    -ms-grid-column-span: 1;
    grid-column: span 1;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: min(12.8vw, 57.6px);
  }
}
.concept-catch {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 2/1/3/2;
  padding-left: 43%;
  margin-top: min(6.628vw, 110.4px);
}
.concept-catch img {
  width: min(11.816vw, 196.8px);
}
@media screen and (max-width: 768px) {
  .concept-catch {
    grid-area: initial;
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
    padding-left: 0;
    text-align: center;
    margin-top: min(19.2vw, 86.4px);
  }
  .concept-catch img {
    width: min(27.2vw, 122.4px);
    -webkit-transform: translateX(22%);
            transform: translateX(22%);
  }
}
.concept-copy {
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 3/1/4/2;
  line-height: 3.75;
  padding-left: 25%;
  margin-top: min(11.311vw, 188.4px);
}
@media screen and (max-width: 768px) {
  .concept-copy {
    grid-area: initial;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    padding: min(5.333vw, 24px);
    margin-top: min(2.133vw, 9.6px);
  }
}
.concept-ph {
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 2/2/4/3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-top: min(4.611vw, 76.8px);
}
.concept-ph .ph-02 {
  width: 41.88%;
  margin: min(-3.89vw, -64.8px) min(7.205vw, 120px) 0 0;
}
.concept-ph .ph-02 figcaption {
  text-align: right;
}
.concept-ph .ph-03 {
  width: 67.84%;
  margin: min(2.45vw, 40.8px) 0 0 0;
}
.concept-ph .ph-03 figcaption {
  text-align: right;
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  .concept-ph {
    grid-area: initial;
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    margin-top: min(15.467vw, 69.6px);
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .concept-ph .ph-01 {
    width: 94.66%;
    margin: 0;
  }
  .concept-ph .ph-01 figcaption {
    text-align: right;
  }
  .concept-ph .ph-02 {
    width: 100%;
    margin-left: min(13.067vw, 58.8px);
    margin-top: min(-12.533vw, -56.4px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
  }
  .concept-ph .ph-02 img {
    width: 44.8%;
  }
  .concept-ph .ph-02 figcaption {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    text-align: left;
    padding-left: 1em;
  }
  .concept-ph .ph-03 {
    width: 71.2%;
    -ms-flex-item-align: self-end;
        -ms-grid-row-align: self-end;
        align-self: self-end;
  }
  .concept-ph .ph-03 figcaption {
    text-align: right;
  }
}

.pages {
  margin-top: min(12.968vw, 216px);
  margin-bottom: min(11.311vw, 188.4px);
}
@media screen and (max-width: 768px) {
  .pages {
    margin-top: min(24.533vw, 110.4px);
    margin-bottom: min(13.333vw, 60px);
  }
}
.pages-item {
  display: block;
  position: relative;
  overflow: hidden;
}
.pages-item::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: -webkit-gradient(linear, left top, right top, color-stop(25%, rgb(62, 62, 62)), color-stop(90%, rgb(255, 255, 255)));
  background: linear-gradient(90deg, rgb(62, 62, 62) 25%, rgb(255, 255, 255) 90%);
  mix-blend-mode: multiply;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .pages-item::before {
    background: rgba(0, 0, 0, 0.6);
  }
}
.pages-item-img {
  position: relative;
  z-index: 0;
  height: min(51.441vw, 856.8px);
  -webkit-transition: all 1.5s;
  transition: all 1.5s;
}
@media screen and (max-width: 768px) {
  .pages-item-img {
    height: min(102.667vw, 462px);
  }
}
.pages-item-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pages-item-cont {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 min(7.205vw, 120px);
  z-index: 2;
}
.pages-item-cont-in {
  -webkit-transform: translateY(-8%);
          transform: translateY(-8%);
}
.pages-item-cont .copy {
  color: #fff;
  font-size: clamp(13.6px, 1.225vw, 20.4px);
  line-height: 1.86;
  margin-top: min(1.873vw, 31.2px);
}
@media screen and (max-width: 768px) {
  .pages-item-cont .copy {
    font-size: clamp(12px, 4vw, 18px);
    margin-top: min(3.733vw, 16.8px);
  }
}
.pages-item-cont .link {
  margin-top: min(3.89vw, 64.8px);
}
@media screen and (max-width: 768px) {
  .pages-item-cont .link {
    margin-top: min(9.733vw, 43.8px);
  }
}
.pages-item .u-text--caption {
  z-index: 2;
}
.pages-item.item-location .pages-item-cont .ttl img {
  width: min(19.129vw, 318.612px);
}
@media screen and (max-width: 768px) {
  .pages-item.item-location .pages-item-cont .ttl img {
    width: min(62.933vw, 283.2px);
  }
}
.pages-item.item-design .pages-item-cont .ttl img {
  width: min(13.181vw, 219.54px);
}
@media screen and (max-width: 768px) {
  .pages-item.item-design .pages-item-cont .ttl img {
    width: min(43.368vw, 195.156px);
  }
}
@media screen and (min-width: 769px) {
  .pages-item:nth-child(even)::before {
    -webkit-transform: scale(-1, 1);
            transform: scale(-1, 1);
  }
  .pages-item:nth-child(even) .pages-item-cont {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .pages-item:nth-child(even) .pages-item-cont-in {
    width: min(22.334vw, 372px);
  }
}
.pages-item:hover {
  opacity: 1;
}
@media screen and (min-width: 769px) {
  .pages-item:hover::before {
    opacity: 0.3;
  }
  .pages-item:hover .pages-item-img {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
}
/*# sourceMappingURL=top.css.map */