body {
  min-width: 1280px;
}

.cast_wrapper {
  width: 1110px;
  margin: auto;
  padding: 50px 0 90px;
}

.cast_container {
  background: linear-gradient(90deg, #202E49 0%, #500F2F 100%);
  margin-top: 64px;
}

.cast_profile {
  position: relative;
  background: linear-gradient(90deg, #202E49 0%, #500F2F 100%);
  padding: 35px 0 40px;
}

.dodge {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 680px;
  mix-blend-mode: color-dodge;
}

.left_area {
  position: relative;
  width: 50%;
  float: left;
  padding-left: 30px;
}

.cast_name_en {
  position: absolute;
  left: -51px;
}

.cast_name_en p {
  writing-mode: vertical-lr;
  font-family: tangier, sans-serif;
  color: #EEC873;
  font-size: 75px;
}

.cast_dt_img img {
  position: relative;
  bottom: 87px;
  margin-bottom: -87px;
}

.dt_ichigo {
  width: 100%;
}

.dt_miruku {
  left: 105px;
  width: 74.4%;
}

.dt_shizuku {
  width: 64.8%;
  left: 135px;
}

.dt_nonoco {
  width: 71%;
  left: 120px;
}

.dt_cocoa {
  width: 96.7%;
  left: 25px;
}

.dt_yomi {
  width: 98.7%;
  left: 43px;
}

.dt_kei {
  width: 63.1%;
  left: 108px;
}

.dt_erika {
  width: 94.2%;
  left: 79px;
}

_::-webkit-full-page-media, _:future, :root .dt_ichigo {
  width: 102.5%;
}

_::-webkit-full-page-media, _:future, :root .dt_miruku {
  width: 76.2%;
}

_::-webkit-full-page-media, _:future, :root .dt_shizuku {
  width: 66.4%;
}

_::-webkit-full-page-media, _:future, :root .dt_nonoco {
  width: 72.6%;
}

_::-webkit-full-page-media, _:future, :root .dt_cocoa {
  width: 99.2%;
}

_::-webkit-full-page-media, _:future, :root .dt_yomi {
  width: 101%;
}

_::-webkit-full-page-media, _:future, :root .dt_kei {
  width: 64.7%;
}

_::-webkit-full-page-media, _:future, :root .dt_erika {
  width: 96.4%;
}

.right_area {
  display: inline-block;
  width: 50%;
  padding: 0 85px 0 38px;
}

.name_area {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}

.cast_name_jp {
  font-size: 50px;
  color: #EEC873;
  letter-spacing: 1.25px;
}

rt {
  font-size: 18px;
  letter-spacing: 7.2px;
}

.rt_miruku {
  letter-spacing: 2.2px;
}

.rt_yomi {
  letter-spacing: 3.2px;
}

.rt_kei {
  letter-spacing: 0;
}

.sns {
  width: 65px;
  display: flex;
  justify-content: space-between;
}

.sns a:nth-child(1) i {
  font-size: 20px;
}

.sns a:nth-child(2) i {
  font-size: 22px;
}

.sns i {
  color: #fff;
}

.cast_video {
  position: relative;
  cursor: pointer;
}

.cast_video img {
  width: 100%;
  height: 200px;
}

.cast_into {
  margin-top: 20px;
}

.cast_into p {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 15px;
  letter-spacing: 0.38px;
  line-height: 30px;
  margin-bottom: 5px;
}

.cast_details {
  position: relative;
}

.birth,
.hobby {
  display: flex;
}

.birth p,
.hobby p {
  margin-bottom: 0;
}

.birth p:nth-child(1),
.hobby p:nth-child(1) {
  color: #EEC873;
  letter-spacing: 0.4px;
  font-weight: 600;
  flex-shrink: 0;
}

.birth hr,
.hobby hr {
  flex-grow: 0;
}

.birth p:nth-child(3),
.hobby p:nth-child(3) {
  flex-grow: 1;
}

.birth p,
.hobby p {
  font-family: 'Noto Sans Japanese', sans-serif;
}

hr {
  border-top: 1px dashed #EEC873 !important;
  display: inline-block;
  margin-bottom: 5px !important;
}

.birth hr {
  width: 40px;
}

.hobby hr {
  width: 57px;
}

.staff_msg {
  position: relative;
  display: flex;
  align-items: center;
  background: #150924;
  border-radius: 6px;
  padding: 30px 20px 20px;
  margin-top: 16px;
}

.staff_msg p:nth-child(1) {
  color: #5D8AE0;
  font-size: 14px;
  letter-spacing: 0.35px;
  line-height: 25px;
  padding-right: 20px;
  font-weight: 700;
}

.staff_msg p:nth-child(2) {
  font-size: 14px;
  line-height: 25px;
  letter-spacing: 0.35px;
  padding-left: 20px;
  border-left: 1px solid #33273E;
  color: #ABC3F0;
}

.reservation {
  margin-top: 33px;
}

.link_entry_btn {
  width: 100%;
  font-size: 20px;
  letter-spacing: 0.5px;
}

.link_entry_btn svg {
  position: absolute;
  right: 30px;
  bottom: 18px;
}

.switch {
  position: relative;
}

.pc-space {
  width: 100%;
}

.cast_switch {
  display: grid;
  grid-template-columns: 162px 162px 162px 162px 162px;
  text-align: center;
  grid-gap: 40px 0;
  justify-content: space-between;
  margin-top: 63px;
}

.cast_switch .on::before {
  content: '';
  display: block;
  position: absolute;
  top: -11%;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-top: 13px solid #EEC873;
}

.cast_switch .on a {
  pointer-events: none;
}

.switch img {
  height: 162px;
  width: 162px;
  border-radius: 50%;
}

.img-active {
  transition: 0.8s;
}

.switch a {
  position: relative;
  display: block;
  border-radius: 50%;
  z-index: 0;
  cursor: pointer;
}

.switch a::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0;
  transition: 0.5s;
  box-shadow: 0px 0px 30px #a20242;
}

.switch a:hover {
  text-decoration: none;
  color: #fff;
  transition: 0.5s;
}

.switch a:hover:after {
  opacity: 1;
}

.switch p {
  font-size: 18px;
  letter-spacing: 0.45px;
  text-align: center;
  color: #EEC873;
  margin-top: 22px;
  font-weight: 500;
}

.top_link {
  margin-top: 97px;
}

.top_btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #202E49;
  color: #A7D3EF;
  font-size: 16px;
  letter-spacing: 0.4px;
  height: 50px;
  width: 480px;
  border-radius: 4px;
  margin: auto;
  font-weight: 100;
}

.top_btn:hover {
  text-decoration: none;
  color: #A7D3EF;
  background: #293F6A;
}

.arrow {
  position: absolute;
  left: 20px;
  width: 5px;
  height: 5px;
  border: 1px solid;
  border-color: #A7D3EF #A7D3EF transparent transparent;
  transform: rotate(-135deg);
}

@media screen and (max-width: 1024px) {
  .link_entry_btn {
    font-size: 20px;
    padding: 15px 19px 15px 28px;
  }
}

@media screen and (min-width: 600px) {
  .pc {
    display: block;
  }
  .sp {
    display: none !important;
  }
}

@media screen and (max-width: 600px) {
  body {
    min-width: initial;
  }
  .pc {
    display: none !important;
  }
  .sp {
    display: block;
  }
  .cast_wrapper {
    width: auto;
    padding: 8.24588vh 0 13.49325vh;
  }
  .cast_container {
    margin-top: 4.49775vh;
  }
  .cast_profile {
    padding: 3.44828vh 0 40px;
  }
  .left_area,
  .right_area {
    padding: 0 5.33333vw;
  }
  .left_area {
    width: auto;
    float: initial;
  }
  .dodge {
    width: 100%;
  }
  .name_area {
    display: flex;
  }
  .cast_name_jp {
    font-size: 35px;
    letter-spacing: 0.88px;
  }
  rt {
    font-size: 12px;
    letter-spacing: 4.8px;
  }
  .img_group {
    position: relative;
    display: flex;
  }
  .cast_name_en {
    top: 7px;
    left: initial;
  }
  .cast_name_en p {
    font-size: 14.93333vw;
    letter-spacing: 0.37333vw;
    margin: 0 -12px;
  }
  .cast_dt_img img {
    bottom: initial;
    margin-bottom: initial;
  }
  .dt_ichigo {
    width: 75.73333vw !important;
    left: 6.93333vw;
  }
  .dt_miruku {
    left: 20vw;
    width: 56.8vw !important;
  }
  .dt_shizuku {
    left: 22.66667vw;
    width: 48vw !important;
  }
  .dt_nonoco {
    width: 71% !important;
    left: 14.66667vw;
  }
  .dt_cocoa {
    width: 100% !important;
    left: 0;
  }
  .dt_yomi {
    width: 94.5% !important;
    left: 2.66667vw;
  }
  .dt_kei {
    width: 60.8% !important;
    left: 21.33333vw;
  }
  .dt_erika {
    width: 88.2% !important;
    left: 16vw;
  }
  .right_area {
    width: auto;
    padding-top: 3.74813vh;
  }
  .cast_video img {
    height: initial;
  }
  .cast_into {
    margin-top: 2.9985vh;
  }
  .cast_details {
    margin-top: 1.49925vh;
  }
  .birthp:nth-child(1), .birthp:nth-child(2),
  .hobyp:nth-child(1),
  .hobyp:nth-child(2) {
    flex-shrink: 0;
  }
  .birth p {
    font-size: 15px;
    letter-spacing: 0.38px;
    line-height: 30px;
  }
  .birth p:nth-child(1) {
    letter-spacing: initial;
  }
  .birth hr {
    width: 40px;
    flex-shrink: 0;
  }
  .hobby hr {
    width: 54px;
    flex-shrink: 0;
  }
  .hobby p:nth-child(3) {
    flex-shrink: 1;
    text-indent: -8px;
    margin-left: 8px;
  }
  .staff_msg {
    margin-top: 2.3988vh;
    padding: 2.24888vh 4vw 1.49925vh;
  }
  .staff_msg p:nth-child(1) {
    width: 65.33333vw;
    padding-right: initial;
  }
  .staff_msg p:nth-child(2) {
    padding-left: 3.46667vw;
  }
  .reservation {
    margin-top: 4.94753vh;
  }
  .link_entry_btn {
    padding: 16px 14px 16px 23px;
  }
  .link_entry_btn svg {
    bottom: 21px;
  }
  .cast_switch {
    grid-template-columns: 26.93333vw 26.93333vw 26.93333vw;
    grid-gap: 0;
    width: 90%;
    margin: 6.14693vh auto 0;
  }
  .cast_switch .on::before {
    top: -9%;
    border-left: 5.5px solid transparent;
    border-right: 5.5px solid transparent;
    border-top: 8px solid #EEC873;
  }
  .switch p {
    font-size: 14px;
    margin-top: 1.1994vh;
    margin-bottom: 4.49775vh;
  }
  .switch img {
    height: 26.93333vw;
    width: 26.93333vw;
  }
  .pc-space {
    width: 0;
  }
  .top_link {
    margin-top: 2.9985vh;
    width: 90%;
    margin: auto;
  }
  .top_btn {
    width: 65%;
    font-size: 12px;
    letter-spacing: 0.3px;
  }
}
