.single_works {
  padding-left: 17.5rem;
  padding-bottom: 20rem;
  background-color: #CACACA;
}

.main_visual {
  width: 100%;
  height: 25rem;
}

.single_works_inner {
  width: 93.1rem;
  margin: 0 auto;
}

.page_title {
  margin-top: 6rem;
  margin-bottom: 10rem;
  text-align: center;
}

.page_title h1 {
  font-size: 3rem;
  font-family: var(--Asc);
}

.eye_catch_img {
  width: 100%;
  height: 52.37rem;
  position: relative;
}

.ec_img_inner{
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.eye_catch_date {
  width: 13.8rem;
  height: 3.3rem;
  position: absolute;
  top: 97%;
  left: 1rem;
  text-align: center;
  background-color: black;
}

.eye_catch_date p {
  font-size: 2.2rem;
  font-family: var(--Asc);
  line-height: 3.3rem;
  color: white;
}

.eye_catch_title {
  margin-top: 4.13rem;
}

.eye_catch_title h2 {
  font-size: 2rem;
  font-weight: bold;
  font-family: var(--Shippori);
}


.flexible_content{
  margin-top: 2.5rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 2.5rem;
}

.comment_wrap {
  font-size: 1.6rem;
  font-family: var(--NotoSans);
  font-weight: 400;
  line-height: calc(32/16);
}

.img_wrapper {
  width: 100%;
  margin-top: 2.5rem;
}

.img_two_pages{
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 5rem;
}

.img_two_page{
  aspect-ratio: 440/247.5;
  width: 44rem;
  overflow: hidden;
}

.img_four_page{
  aspect-ratio: 200/300;
  width: 20rem;
  overflow: hidden;
}

.img_four_pages {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 4.3rem;
  justify-content: center;
}

.text_wrap {
  margin-top: 2.5rem;
}

.text_wrap p {
  font-size: 1.6rem;
  font-family: var(--NotoSans);
  line-height: calc(32/16);
}

.contact_jump {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22.6rem;
  height: 5.4rem;
  margin-top: 5.7rem;
  border-radius: 2.7rem;
  background-color: #002C5E;
  font-size: 1.6rem;
  font-family: var(--NotoSans);
  line-height: 5.4rem;
  color: white;
}


.return_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 21.2rem;
  height: 5.4rem;
  margin-top: 10rem;
  margin: 10rem auto 0 auto;
  background-color: #000000;
  text-align: center;
  font-size: 1.6rem;
    font-family: var(--NotoSans);
    line-height: 5.4rem;
    color: white;
}


/* --------------
    -- SP --
-------------- */
@media screen and (max-width: 699.98px) {

  .single_works {
    padding-left: 0;
    padding-bottom: 15rem;
    background-color: #CACACA;
  }

  .main_visual {
    width: 100%;
    height: 15rem;
  }
  .page_title {
  margin-top: 2.5rem;
  margin-bottom: 3rem;
  text-align: center;
}
.single_works_inner {
  width: 34.5rem;
  margin: 0 auto;
}
.eye_catch_img {
  width: 100%;
  height: 19.4rem;
  position: relative;
}
.eye_catch_date {
  width: 8.8rem;
  height: 2.6rem;
  position: absolute;
  top: 95%;
  left: 2%;
  text-align: center;
  background-color: black;
}

.eye_catch_date p {
  font-size: 1.6rem;
  line-height: 2.6rem;
  color: white;
}

.eye_catch_title {
  margin-top: 2.5rem;
}
.eye_catch_title h2{
  font-size: 1.8rem;
  line-height: calc(26/18);
}

.flexible_content {
  margin-top: 3.2rem;
  gap: 5rem;
}

/* .comment_wrap{ */
  /* font-size: 1.5rem; */
  /* line-height: calc(32/15); */
/* } */


.img_two_pages{
  gap: .5rem;
}

.img_two_page{
  width: 17.1rem;
}

.img_four_pages {
  justify-content: start;
  gap: 2rem;
  flex-wrap: wrap;
}

.img_four_page{
  width: 16.2rem;
  /* height: 24.4rem; */
}
.text_wrap{
  margin-top: 6rem;
}
.contact_jump{
  margin-top: 5rem;
}
}