@charset "UTF-8";
/* ============================================ */
/* font
/* ============================================ */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Prompt:wght@100;200;300;400;500;600&display=swap");
/* ============================================ */
/* reset（destyle.cssの追加設定） 
/* ============================================ */
html {
  box-sizing: border-box;
  line-break: strict;
}

html.scroll-lock {
  position: fixed;
  width: 100%;
  left: 0;
  right: 0;
  overflow: hidden;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

/* ============================================ */
/* :root 
/* ============================================ */
:root {
  --fontfamily-gothic: "Noto Sans JP", sans-serif;
  --fontfamily-en: "Prompt", sans-serif;
  --color-white: #fff;
  --color-black: #000;
  --color-lightgray: #f3f5f7;
  --color-gray: #c1cad6;
  --color-darkgray: #60656F;
  --color-red: #e50012;
  --dark-pink: #FF9FB2;
  --color-lightpink: #FBDADC;
  --color-pink: #facccf;
  --color-yellow: #f4d35e;
  --color-lightgreen: #e1f8ec;
  --color-green: #69dc9e;
  --color-lightblue: #deeefa;
  --color-blue: #5aa9e6;
  --color-aqua: #25ced1;
  --color-lightaqua: #d3f5f6;
  --color-purple: #a288e3;
}

/* ============================================ */
/* base
/* ============================================ */
body {
  position: relative;
  font-family: var(--fontfamily-gothic);
  font-weight: 400;
  font-size: 15px;
  font-size: 0.9375rem;
  background: var(--color-white);
  overflow-x: hidden;
  letter-spacing: 0.05em;
}

img {
  max-width: 100%;
}

img[src$=".svg"] {
  width: 100%;
}

@media screen and (max-width: 768px) {
  body {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
/* ============================================ */
/* 共通style
/* ============================================ */
/* ===== ページ移動エフェクト ===== */
body {
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  /* フェードイン用 */
}

/* ページ読み込み後 */
body.loaded {
  opacity: 1;
}

/* 白い円トランジション */
#milk-transition {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 150vmax;
  height: 150vmax;
  border-radius: 50%;
  background: var(--color-white);
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
  /* 拡大を少し早く＆緩急 */
  z-index: 9999;
  pointer-events: none;
}

#milk-transition.active {
  transform: translate(-50%, -50%) scale(1);
}

.skip-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 10000;
  background: var(--color-white);
  border: none;
  border-radius: 9999px;
  padding: 0.3em 1em;
  font-size: 14px;
  font-size: 0.875rem;
  font-family: var(--fontfamily-en);
  cursor: pointer;
  transition: opacity 0.3s;
}

.skip-btn:hover {
  opacity: 0.7;
}

/* ===== 表示切り替え ===== */
.d-switch {
  display: none !important;
}

@media screen and (min-width: 1401px) {
  .d-switch.min-xxl {
    display: block !important;
  }
}
@media screen and (max-width: 1400px) {
  .d-switch.max-xxl {
    display: block !important;
  }
}
@media screen and (min-width: 1201px) {
  .d-switch.min-xl {
    display: block !important;
  }
}
@media screen and (max-width: 1200px) {
  .d-switch.max-xl {
    display: block !important;
  }
}
@media screen and (min-width: 1025px) {
  .d-switch.min-lg {
    display: block !important;
  }
}
@media screen and (max-width: 1024px) {
  .d-switch.max-lg {
    display: block !important;
  }
}
@media screen and (min-width: 769px) {
  .d-switch.min-md {
    display: block !important;
  }
}
@media screen and (max-width: 768px) {
  .d-switch.max-md {
    display: block !important;
  }
}
@media screen and (min-width: 601px) {
  .d-switch.min-sm {
    display: block !important;
  }
}
@media screen and (max-width: 600px) {
  .d-switch.max-sm {
    display: block !important;
  }
}
@media screen and (min-width: 361px) {
  .d-switch.min-xs {
    display: block !important;
  }
}
@media screen and (max-width: 360px) {
  .d-switch.max-xs {
    display: block !important;
  }
}
/* ===== scroll-hint ===== */
.scroll-hint-icon {
  height: 90px !important;
}

/* ===== main ===== */
#main {
  padding: 86px 0 0;
  overflow: hidden;
}

@media screen and (max-width: 1024px) {
  #main {
    padding: 70px 0 0;
  }
}
/* ===== wrap ===== */
.out-wrap {
  position: relative;
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
}

.in-wrap {
  position: relative;
}
.in-wrap.right {
  margin: 0 0 0 auto;
}

.wrap {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
}

@media screen and (min-width: 1401px) {
  .in-wrap {
    width: calc(100% - (100% - 1100px) / 2);
  }
  .wrap {
    width: 100%;
  }
}
@media screen and (max-width: 1400px) {
  .in-wrap {
    width: 90%;
  }
  .wrap {
    width: 80%;
  }
}
@media screen and (min-width: 1201px) {
  .in-wrap.left.indent {
    padding-right: 80px;
  }
  .in-wrap.right.indent {
    padding-left: 80px;
  }
  .wrap.indent {
    padding: 0 80px;
  }
  .wrap.indent:has(.page-text) {
    padding: 0 75px;
  }
}
/* ===== milk-line ===== */
.milk-line {
  position: relative;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  margin: -1px 0;
}
.milk-line .size-l,
.milk-line .size-m,
.milk-line .size-s {
  display: none;
}
.milk-line.top-red .top {
  fill: var(--color-red);
}
.milk-line.top-wh .top {
  fill: var(--color-white);
}
.milk-line.top-lightgray .top {
  fill: var(--color-lightgray);
}
.milk-line.top-yellow .top {
  fill: var(--color-yellow);
}
.milk-line.top-lightpink .top {
  fill: var(--color-lightpink);
}
.milk-line.top-lightgreen .top {
  fill: var(--color-lightgreen);
}
.milk-line.top-lightblue .top {
  fill: var(--color-lightblue);
}
.milk-line.top-lightaqua .top {
  fill: var(--color-lightaqua);
}
.milk-line.top-none .top {
  fill: none;
}
.milk-line.bottom-red .bottom {
  fill: var(--color-red);
}
.milk-line.bottom-wh .bottom {
  fill: var(--color-white);
}
.milk-line.bottom-lightgray .bottom {
  fill: var(--color-lightgray);
}
.milk-line.bottom-yellow .bottom {
  fill: var(--color-yellow);
}
.milk-line.bottom-lightpink .bottom {
  fill: var(--color-lightpink);
}
.milk-line.bottom-lightgreen .bottom {
  fill: var(--color-lightgreen);
}
.milk-line.bottom-lightblue .bottom {
  fill: var(--color-lightblue);
}
.milk-line.bottom-lightaqua .bottom {
  fill: var(--color-lightaqua);
}
.milk-line.bottom-none .bottom {
  fill: none;
}

@media screen and (min-width: 1401px) {
  .milk-line {
    width: 4000px;
  }
  .milk-line .size-l {
    display: block;
  }
}
@media screen and (min-width: 769px) and (max-width: 1400px) {
  .milk-line {
    width: calc(100% + 2px);
  }
  .milk-line .size-m {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .milk-line {
    width: calc(100% + 2px);
  }
  .milk-line .size-s {
    display: block;
  }
}
/* ===== page-title ===== */
#page-title:has(.page-text) {
  padding: 0 0 100px;
}
#page-title .category-name {
  color: var(--color-gray);
  font-family: var(--fontfamily-en);
  font-size: 110px;
  font-size: 6.875rem;
  font-weight: 100;
  line-height: 1.2;
  padding: 0.3em 0;
  white-space: nowrap;
}
#page-title .page-name {
  display: flex;
  align-items: first baseline;
  gap: 20px;
  white-space: nowrap;
}
#page-title .page-name.vertical {
  flex-direction: column;
  gap: 10px;
}
#page-title .page-name .en {
  display: inline-block;
  color: var(--color-red);
  font-family: var(--fontfamily-en);
  font-size: 43px;
  font-size: 2.6875rem;
  font-weight: 300;
}
#page-title .page-name .ja {
  display: inline-block;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 600;
}
#page-title .page-name .ja.wh {
  color: var(--color-white);
}
#page-title .page-text {
  margin: 60px 0 0;
  font-size: 19px;
  font-size: 1.1875rem;
  line-height: 2.2;
}

@media screen and (max-width: 768px) {
  #page-title:has(.page-text) {
    padding: 0 0 60px;
  }
  #page-title .category-name {
    font-size: 68px;
    font-size: 4.25rem;
  }
  #page-title .page-name .en {
    font-size: 30px;
    font-size: 1.875rem;
  }
  #page-title .page-name .ja {
    font-size: 16px;
    font-size: 1rem;
  }
  #page-title .page-text {
    margin: 40px 0 0;
    font-size: 17px;
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 600px) {
  #page-title .category-name {
    font-size: 50px;
    font-size: 3.125rem;
  }
  #page-title .page-name {
    flex-direction: column;
    gap: 5px;
  }
  #page-title .page-name .en {
    font-size: 24px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 360px) {
  #page-title .category-name {
    font-size: 45px;
    font-size: 2.8125rem;
  }
  #page-title .page-name .en {
    font-size: 21px;
    font-size: 1.3125rem;
  }
}
/* ===== タイトル（英語と日本語） ===== */
.g-title.en-ja {
  display: flex;
  align-items: first baseline;
  gap: 5px 20px;
}
.g-title.en-ja .en {
  display: inline-block;
  color: var(--color-red);
  font-family: var(--fontfamily-en);
  font-size: 43px;
  font-size: 2.6875rem;
  font-weight: 200;
}
.g-title.en-ja .ja {
  display: inline-block;
  color: var(--color-red);
  font-size: 16px;
  font-size: 1rem;
}
.g-title.en-ja.big {
  align-items: center;
}
.g-title.en-ja.big .en {
  font-size: 62px;
  font-size: 3.875rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .g-title.en-ja .en {
    font-size: 36px;
    font-size: 2.25rem;
  }
  .g-title.en-ja .ja {
    font-size: 13px;
    font-size: 0.8125rem;
  }
  .g-title.en-ja.big .en {
    font-size: 42px;
    font-size: 2.625rem;
  }
}
@media screen and (max-width: 600px) {
  .g-title.en-ja {
    flex-direction: column;
  }
  .g-title.en-ja.big {
    align-items: flex-start;
  }
}
/* ===== 見出し（normal/underline共通） ===== */
.g-title.text-red {
  color: var(--color-red);
}
.g-title.text-blue {
  color: var(--color-blue);
}
.g-title.text-green {
  color: #21d875;
}
.g-title.text-aqua {
  color: var(--color-aqua);
}

/* ===== 見出し（normal） ===== */
.g-title.normal {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.5;
  margin: 0 0 1em;
}

@media screen and (max-width: 768px) {
  .g-title.normal {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
/* ===== 見出し（underline） ===== */
.g-title.underline {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.5;
  margin: 0 0 1em;
  padding: 0 0 0.5em;
  border-bottom: solid 1px var(--color-black);
}
.g-title.underline.red {
  color: var(--color-red);
  border-bottom: solid 1px var(--color-red);
}

@media screen and (max-width: 768px) {
  .g-title.underline {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
/* ===== 見出し（round） ===== */
.g-title.round {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: var(--color-red);
  color: var(--color-white);
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: 600;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .g-title.round {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
@media screen and (max-width: 600px) {
  .g-title.round {
    font-size: 16px;
    font-size: 1rem;
  }
}
/* ===== 見出し（big-headline） ===== */
.g-title.big-headline {
  display: flex;
  align-items: first baseline;
  gap: 40px;
  margin: 0 0 70px;
  white-space: nowrap;
}
.g-title.big-headline .en {
  position: relative;
  display: inline-block;
  font-family: var(--fontfamily-en);
  font-size: 79px;
  font-size: 4.9375rem;
  font-weight: 100;
}
.g-title.big-headline .en::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(100% + 10vw);
  height: 1px;
  background: currentColor;
}
.g-title.big-headline .ja {
  display: inline-block;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.5;
}
.g-title.big-headline.red .en {
  color: var(--color-red);
}
.g-title.big-headline.aqua .en {
  color: var(--color-aqua);
}
.g-title.big-headline.vertical {
  flex-direction: column;
  gap: 15px;
}

@media screen and (min-width: 1401px) {
  .g-title.big-headline .en::after {
    width: calc(100% + (100vw - 1100px) / 2);
  }
}
@media screen and (max-width: 1024px) {
  .g-title.big-headline {
    gap: 20px;
  }
  .g-title.big-headline .en {
    font-size: 60px;
    font-size: 3.75rem;
  }
}
@media screen and (max-width: 768px) {
  .g-title.big-headline {
    margin: 0 0 50px;
  }
  .g-title.big-headline.big-headline {
    flex-direction: column;
    gap: 15px;
  }
  .g-title.big-headline .en {
    font-size: 50px;
    font-size: 3.125rem;
  }
  .g-title.big-headline .ja {
    font-size: 16px;
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .g-title.big-headline .en {
    font-size: 40px;
    font-size: 2.5rem;
  }
}
/* ===== 見出し（number） ===== */
.g-title.number {
  display: flex;
  align-items: last baseline;
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 600;
  margin: 0 0 1.5em;
}
.g-title.number::before {
  content: "";
  position: relative;
  top: 0.2em;
  display: inline-block;
  white-space: pre;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
  text-align: right;
  margin: 0 0.5em 0 0;
}

@media screen and (max-width: 768px) {
  .g-title.number {
    font-size: 22px;
    font-size: 1.375rem;
  }
  .g-title.number::before {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
/* ===== 数字 ===== */
.slash-number {
  position: relative;
  top: 0.1em;
  display: inline-block;
  font-family: var(--fontfamily-en);
  font-size: 62px;
  font-size: 3.875rem;
  line-height: 1.5;
  width: 1.5em;
  font-weight: 500;
  text-align: center;
  margin: 0 0.3em 0 -0.3em;
  -webkit-clip-path: polygon(100% 0, 100% 30%, 30% 100%, 0 100%, 0 0);
          clip-path: polygon(100% 0, 100% 30%, 30% 100%, 0 100%, 0 0);
}
.slash-number::after {
  content: "";
  position: absolute;
  left: 30%;
  bottom: 0;
  display: block;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform-origin: left bottom;
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
  .slash-number {
    font-size: 42px;
    font-size: 2.625rem;
  }
}
@media screen and (max-width: 600px) {
  .slash-number {
    font-size: 36px;
    font-size: 2.25rem;
  }
}
/* ===== box ===== */
.g-box-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 30px 0px;
}

.g-box {
  position: relative;
  line-height: 2.2;
  padding: 30px 40px 40px;
  background: var(--color-white);
  border-radius: 15px;
}
.g-box.full {
  width: 100%;
}
.g-box.half {
  width: 48.5%;
}
.g-box .box-name {
  width: 100%;
  max-width: 240px;
  color: var(--color-white);
  font-weight: 600;
  text-align: center;
  padding: 0.5em;
  margin: 0 0 1.5em;
  border-radius: 2em;
  flex-shrink: 0;
}
.g-box .box-name.blue {
  background: var(--color-blue);
}
.g-box .box-name.green {
  background: var(--color-green);
}
.g-box .text {
  text-align: justify;
}

@media screen and (max-width: 768px) {
  .g-box {
    padding: 25px 30px 30px;
  }
}
@media screen and (max-width: 600px) {
  .g-box-wrap {
    flex-direction: column;
  }
  .g-box.half {
    width: 100%;
  }
}
/* ===== 背景画像 ===== */
.before-bg {
  position: relative;
  overflow: hidden;
}
.before-bg::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--color-gray);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* ===== 枠（ななめ） ===== */
.frame-lean {
  position: relative;
  z-index: 1;
}
.frame-lean:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 20px;
  background: #e50012;
  z-index: -1;
}
.frame-lean .text-wrap {
  background: #fff;
  border-radius: 20px;
}

/* 傾き指定 */
.slope-right:after {
  transform: rotate(4deg);
}

.slope-left:after {
  transform: rotate(-4deg);
}

/* 色指定 */
.bg-yellow:after {
  background: var(--color-yellow);
}

.bg-green:after {
  background: var(--color-green);
}

.bg-pink:after {
  background: #ff9fb2;
}

/* ===== リンク関連 ===== */
.icon-blank {
  position: relative;
  width: 1em;
  fill: currentColor;
}

.icon-arrow {
  position: relative;
  width: 32px;
  stroke: currentColor;
  flex-shrink: 0;
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
  /*
  &.red {
    stroke: var(--color-red);
  }
  */
}

.icon-arrow-ku {
  position: absolute;
  right: 2em;
  display: block;
  width: 16px;
  height: 16px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  transition: 0.2s ease-out;
}

@media (hover: hover) {
  a:hover .icon-arrow {
    transform: translate(20%, 0);
  }
  a:hover .icon-arrow-ku {
    transform: rotate(45deg) translate(20%, -20%);
  }
}
.g-btn.round {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 350px;
  font-size: 22px;
  font-size: 1.375rem;
  padding: 0.8em 1.5em 0.9em 2em;
  border-radius: 1.5em;
  transition: 0.2s ease-out;
}
.g-btn.round.small {
  max-width: 300px;
  font-size: 17px;
  font-size: 1.0625rem;
}
.g-btn.round.wh {
  background: var(--color-white);
  border: solid 2px var(--color-white);
  color: var(--color-red);
}
.g-btn.round.wh-aqua {
  background: var(--color-white);
  border: solid 2px var(--color-white);
  color: var(--color-aqua);
}
.g-btn.round.red {
  background: var(--color-red);
  border: solid 2px var(--color-red);
  color: var(--color-white);
}
.g-btn.round.yellow {
  background: var(--color-yellow);
  border: solid 2px var(--color-yellow);
  color: var(--color-black);
}
.g-btn.round.aqua {
  background: var(--color-aqua);
  border: solid 2px var(--color-aqua);
  color: var(--color-white);
}
.g-btn.round.line-red {
  border: solid 2px var(--color-red);
}
.g-btn.round.line-aqua {
  border: solid 2px var(--color-aqua);
}

@media (hover: hover) {
  .g-btn:hover.round.wh {
    background: var(--color-red);
    border: solid 2px var(--color-red);
    color: var(--color-white);
  }
  .g-btn:hover.round.wh-aqua {
    background: var(--color-aqua);
    border: solid 2px var(--color-aqua);
    color: var(--color-white);
  }
  .g-btn:hover.round.red {
    background: var(--color-white);
    border: solid 2px var(--color-red);
    color: var(--color-red);
  }
  .g-btn:hover.round.yellow {
    background: var(--color-white);
    border: solid 2px var(--color-black);
    color: var(--color-black);
  }
  .g-btn:hover.round.aqua {
    background: var(--color-white);
    border: solid 2px var(--color-aqua);
    color: var(--color-aqua);
  }
}
@media screen and (max-width: 768px) {
  .g-btn.round {
    max-width: 260px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
/* ===== ホバー効果 ===== */
/* 下線 */
.hover-underline {
  position: relative;
  display: inline-block;
}
.hover-underline::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform-origin: left center;
  transform: scale(0, 1);
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
}

@media (hover: hover) {
  .hover-underline:hover::before {
    content: "";
    transform: scale(1, 1);
  }
  .hover-underline:hover.red {
    color: var(--color-red);
  }
  .hover-underline:hover.red + .icon-blank {
    fill: var(--color-red);
  }
}
/* 画像 */
.hover-img-zoomup {
  position: relative;
  overflow: hidden;
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
}
.hover-img-zoomup img {
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
}

@media (hover: hover) {
  a:hover .hover-img-zoomup {
    transform: translate(0, -5%);
  }
  a:hover .hover-img-zoomup img {
    transform: scale(1.1);
  }
}
/* 背景画像 */
.hover-bg-zoomup {
  position: relative;
  overflow: hidden;
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
}
.hover-bg-zoomup::before {
  transition: 0.3s cubic-bezier(0.16, 0.5, 0.43, 1);
}

@media (hover: hover) {
  a:hover .hover-bg-zoomup {
    transform: translate(0, -5%);
  }
  a:hover .hover-bg-zoomup::before {
    transform: scale(1.1);
  }
}
/* ===== page-index ===== */
#page-index {
  margin: 80px 0 160px;
}
#page-index .in-wrap > .flex-wrap {
  display: flex;
  gap: 100px;
}
#page-index .text-wrap {
  min-width: 360px;
}
#page-index .text {
  font-size: 19px;
  font-size: 1.1875rem;
  line-height: 2.2;
  text-align: justify;
}
#page-index .text .bold {
  font-weight: 600;
}
#page-index .text .red {
  color: var(--color-red);
}
#page-index .index-link {
  margin: 60px 0 0;
}
#page-index .index-link .index-title {
  font-family: var(--fontfamily-en);
  font-size: 25px;
  font-size: 1.5625rem;
  font-weight: 300;
  color: var(--color-red);
  margin: 0 0 0.2em;
}
#page-index .index-link .link-list {
  border-top: solid 1px var(--color-red);
  border-bottom: solid 1px var(--color-red);
}
#page-index .index-link .link-list .link-item {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
}
#page-index .index-link .link-list .link-item + .link-item {
  border-top: dashed 1px var(--color-red);
}
#page-index .index-link .link-list .link-item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1em 0;
}
#page-index .index-link .link-list .link-item a .round-arrow {
  display: block;
  width: 34px;
  transition: 0.2s;
}
#page-index .img {
  width: 100%;
}

@media (hover: hover) {
  #page-index .link-list .link-item a:hover .round-arrow {
    transform: scale(1.15);
  }
}
@media screen and (max-width: 1200px) {
  #page-index .in-wrap > .flex-wrap {
    gap: 50px;
  }
}
@media screen and (max-width: 768px) {
  #page-index {
    margin: 60px 0 120px;
  }
  #page-index .in-wrap > .flex-wrap {
    flex-direction: column;
  }
  #page-index .text-wrap {
    min-width: auto;
  }
  #page-index .text-wrap > .flex-wrap {
    display: flex;
    justify-content: space-between;
    gap: 50px;
  }
  #page-index .text {
    width: 100%;
    font-size: 17px;
    font-size: 1.0625rem;
  }
  #page-index .img {
    width: 100%;
  }
  #page-index .index-link {
    width: calc(100% - 10vw);
    margin: 40px 0 0;
  }
  #page-index .index-link .link-list .link-item {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 600px) {
  #page-index .text-wrap > .flex-wrap {
    flex-direction: column;
    gap: 30px;
  }
  #page-index .text {
    width: calc(100% - 10vw);
  }
}

/*# sourceMappingURL=style.css.map */