@charset "UTF-8";

.recipe_section {
  padding-right: calc((100 / var(--view-size)) * 288 * 1vw);
}
.recipe_head {
  border-bottom: solid 2px #656565;
  padding: calc((100 / var(--view-size)) * 8 * 1vw) calc((100 / var(--view-size)) * 60 * 1vw);
  text-align: center;
}
.recipe_head_text {
  font-size: calc((100 / var(--view-size)) * 22 * 1vw);
  font-weight: 700;
}
.recipe_box1 {
  display: flex;
  border-bottom: solid 2px #656565;
}
.recipe_box1_left {
  width: calc((100 / var(--view-size)) * 500 * 1vw);
  height: calc((100 / var(--view-size)) * 360 * 1vw);
}
.recipe_slider_wrapper {
  width: 100%;
  overflow: hidden;
}
.recipe_box1_left .slick-list {
  position: relative;
}
.recipe_slider_wrapper li {
  width: calc((100 / var(--view-size)) * 500 * 1vw);
  height: calc((100 / var(--view-size)) * 360 * 1vw);
};
.recipe_slider_wrapper li img {
  width: 100%;
  height: 100%;
}
.recipe_box1_right {
  border-left: solid 2px #656565;
  width: calc((100% - (100 / var(--view-size)) * 500 * 1vw));
  padding: calc((100 / var(--view-size)) * 30 * 1vw) calc((100 / var(--view-size)) * 60 * 1vw);
}
.recipe_box1_right_list {
  margin-top: calc((100 / var(--view-size)) * 8 * 1vw)
}
.recipe_box1_right_list:first-child {
  margin-top: 0;
}
.recipe_box1_right_list_key {
  display: flex;
  flex-wrap: wrap;
  column-gap: calc((100 / var(--view-size)) * 6 * 1vw);
  font-size: calc((100 / var(--view-size)) * 14 * 1vw);
}
.recipe_box1_right_list_key a:hover {
  opacity: .5;
}
@media (max-width: 670px) {
  .recipe_section {
    padding-right: 0;
  }
  .recipe_head {
    padding: calc((100 / var(--view-size)) * 8 * 1vw) calc((100 / var(--view-size)) * 60 * 1vw);
  }
  .recipe_head_text {
    font-size: calc((100 / var(--view-size)) * 20 * 1vw);
  }
  .recipe_box1 {
    display: block;
  }
  .recipe_box1_left {
    width: 100%;
    padding: calc((100 / var(--view-size)) * 20 * 1vw) calc((100 / var(--view-size)) * 25 * 1vw);
    border-right: none;
  }
  .recipe_box1_left .slick-list, .recipe_box1_left .slick-track {
    height: 100%;
  }
  .recipe_box1_right {
    width: 100%;
  }
  .recipe_box1_left {
    width: 100%;
    height: calc((100 / var(--view-size)) * 280 * 1vw);
  }
  .recipe_box1_left img {
    height: 100%;
  }
  .recipe_slider_wrapper {
    height: 100%;
  }
  .recipe_slider_wrapper li {
    width: calc((100 / var(--view-size)) * 375 * 1vw);
    height: calc((100 / var(--view-size)) * 280 * 1vw);
  }
  .recipe_box1_right {
    border-left: none;
    width: 100%;
    padding: 0 calc((100 / var(--view-size)) * 25 * 1vw) calc((100 / var(--view-size)) * 20 * 1vw);
  }
}

.recipe_box2 {
  display: flex;
  align-items: stretch;
  border-bottom: solid 2px #656565;
}
.recipe_box2_left {
  width: 50%;
  padding: 0 calc((100 / var(--view-size)) * 60 * 1vw) calc((100 / var(--view-size)) * 30 * 1vw);
}
.recipe_box2_title {
  width: calc(100% + (100 / var(--view-size)) * 120 * 1vw);
  height: calc((100 / var(--view-size)) * 50 * 1vw);
  margin-bottom: calc((100 / var(--view-size)) * 20 * 1vw);
  margin-left: calc((100 / var(--view-size)) * -60 * 1vw);
  padding-left: calc((100 / var(--view-size)) * 60 * 1vw);
  font-size: calc((100 / var(--view-size)) * 24 * 1vw);
  line-height: calc((100 / var(--view-size)) * 50 * 1vw);
  border-bottom: solid 2px #656565;
}
.recipe_box2 dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.recipe_box2_right {
  border-left: solid 2px #656565;
  width: 50%;
  padding: 0 calc((100 / var(--view-size)) * 60 * 1vw) calc((100 / var(--view-size)) * 30 * 1vw);
}
.recipe_step {
  display: flex;
  justify-content: space-between;
  padding: calc((100 / var(--view-size)) * 12 * 1vw) 0;
  border-bottom: dotted 1px #656565;
}
.recipe_step:nth-child(2) {
  padding-top: 0;
}
.recipe_step:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.recipe_step_content {
  display: flex;
  width: calc(100% - ((100 / var(--view-size)) * 100 * 1vw))
}
.recipe_step_num {
  margin-right: calc((100 / var(--view-size)) * 16 * 1vw);
}
.recipe_step_img {
  width: calc((100 / var(--view-size)) * 100 * 1vw);
  height: calc((100 / var(--view-size)) * 100 * 1vw);
}
.recipe_step_img img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: 100%;
}

@media (max-width: 670px) {
  .recipe_box2 {
    display: block;
  }
  .recipe_box2_left {
    width: 100%;
    padding: 0 calc((100 / var(--view-size)) * 20 * 1vw) calc((100 / var(--view-size)) * 25 * 1vw);
    border-bottom: solid 2px #656565;
  }
  .recipe_box2_title {
    width: calc(100% + (100 / var(--view-size)) * 40 * 1vw);
    margin-left: calc((100 / var(--view-size)) * -20 * 1vw);
    padding-left: calc((100 / var(--view-size)) * 20 * 1vw);
  }
  .recipe_box2_right {
    border-left: none;
    width: 100%;
    padding: 0 calc((100 / var(--view-size)) * 20 * 1vw) calc((100 / var(--view-size)) * 25 * 1vw);
  }
  .recipe_step {
    padding: calc((100 / var(--view-size)) * 8 * 1vw) 0;
  }
  .recipe_step_content {
    width: calc(100% - ((60 / var(--view-size)) * 100 * 1vw))
  }
  .recipe_step_num {
    margin-right: calc((100 / var(--view-size)) * 6 * 1vw);
  }
  .recipe_step_img {
    width: calc((100 / var(--view-size)) * 60 * 1vw);
    height: calc((100 / var(--view-size)) * 60 * 1vw);
  }
}