@charset "UTF-8";
/* Sassでpxからvwへの変換式を定義して使う */
.pc_vw {
  font-size: 1.6rem;
  /* font-size: 1.111vw; */
}

.sp_vw {
  font-size: 1.6rem;
  /* font-size: 4.267vw; */
}

/* guide */
.guide {
  background-color: #fff5f7;
}

.guide-wrap {
  width: 85vw;
  margin: 0 auto;
  padding: 2.08333vw 0;
}

.guide-ttl {
  padding: 4.16667vw 0;
  font-size: 3.6rem;
  font-weight: bold;
  line-height: 1.22;
  letter-spacing: 0.125vw;
}

.guide-inner {
  width: 85vw;
  /* display: flex;
  flex-wrap: wrap; */
  /* align-items: flex-start; */
  padding-bottom: 2.08333vw;
  gap: 4.16667vw 1.66667vw;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.guide-box {
  /* width: 27.22222vw; */
  border-top: solid 0.20833vw #fb849c;
  padding-top: 1.16667vw;
  display: grid;
  grid-template-rows: 1fr auto;
}

.guide-box .guide_blood {
  display: flex;
  flex-direction: column;
  gap: 1.16667vw 0;
  min-height: 0;/* Flexアイテム/Gridアイテム内でflex-basis/flex-growを使用する際の安全策 */
}

.guide-box dt {
  /* height: 8.33333vw; */
  display: flex;
  /* flex-direction: row; */
  align-items: center;
  gap: 1.38889vw;
  font-size: 2.4rem;
  font-weight: bold;
  vertical-align: middle;
  flex-shrink: 0;
}

.guide-box dt img {
  width: 4.16667vw;
  vertical-align: middle;
  flex-shrink: 0;
}

.guide-box ul {
  display: flex;
  flex-flow: column;
  gap: 1.38889vw;
  min-height: 300px;
}

.guide-box li {
  padding: 1.38889vw;
  background-color: #fff;
  font-size: 1.8rem;
}

.guide-box li a {
  font-weight: 500;
  color: #0971b2;
}

.guide-box a:hover {
  text-decoration: underline;
}

.guide-all {
  margin-top: 1.38889vw;
  text-align: right;
}

.guide-all a {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.06944vw;
  color: #0971b2;
}

@media print, screen and (max-width: 768px) {
  .guide-wrap {
    width: 100%;
    padding: 0;
  }
  .guide-ttl {
    padding: 5.33333vw 4.8vw;
    font-size: 2rem;
    line-height: 1.35;
    letter-spacing: 0.26667vw;
  }
  .guide-inner {
    width: 100%;
    flex-flow: column;
    padding: 0 5.33333vw 8vw;
    gap: 8vw 0;
    display: flex;
  }
  .guide-box {
    width: 100%;
    border-top: solid 0.53333vw #fb849c;
  }
  .guide-box dt {
    height: 18.66667vw;
    gap: 2.66667vw;
    font-size: 1.8rem;
    line-height: 1.2;
  }
  .guide-box dt img {
    width: 10.66667vw;
  }
  .guide-box ul {
    gap: 4vw;
    min-height: initial;
  }
  .guide-box li {
    padding: 4vw;
    font-size: 1.6rem;
  }
  .guide-all {
    margin-top: 4vw;
  }
  .guide-all a {
    font-size: 1.8rem;
  }
}