header h1 {
  width: min(300px, 50%);
  margin: 2em auto 1em;
}
header h1 img {
  pointer-events: all;
}

.mypage .list--menu a[target=_blank] {
  display: flex;
  flex-direction: row-reverse;
  justify-content: start;
}
.mypage .list--menu a[target=_blank]:not([class])::after {
  content: "";
  position: absolute;
  top: 50%;
}
.mypage .list--menu a[target=_blank]:not([class])::before {
  font-family: FontAwesome;
  display: inline-block;
  position: relative;
  top: 0.1em;
  content: "\f08e";
  margin-left: 0.5em;
}
.mypage .section.regist {
  max-width: 600px;
  padding: 2em 5% 3em 5%;
  margin: 0 auto 0 auto;
}
.mypage .section.regist .sectionTit {
  color: inherit;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.06em;
  margin: 0 0 1em;
}
.mypage .section.regist .txt {
  color: inherit;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.05em;
  margin: 0 0 1em;
}
.mypage .section.regist dl {
  margin: 0 auto 2em auto;
}
.mypage .section.regist dl dt {
  margin: 2em 0 0.5em;
  font-size: 0.8em;
  font-weight: bold;
  opacity: 0.5;
}
.mypage .section.regist dl dd {
  margin: 0 0 1em;
}
.mypage .section.regist dl dt.statusConfirm {
  margin: 2em 0 0.5em;
  font-size: 0.8em;
  font-weight: bold;
  opacity: 0.5;
}
.mypage .section.regist .btn input {
  color: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.05em;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: inline-block;
  min-width: 75%;
  text-align: center;
  text-decoration: none;
  line-height: 3.4;
  border-radius: 0.3em;
  padding: 0 1.5em;
  cursor: pointer;
  background: #333;
  color: #f8f8f8;
  border: none;
}
.mypage .section.regist .btn input.main {
  background: #ff00a8;
  border: solid 1px #ff00a8;
}
.mypage .section.regist .btn input.sub {
  background: none;
  border: solid 1px;
  color: #333;
}
.mypage .section.regist .btn a {
  color: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.05em;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: inline-block;
  min-width: 75%;
  text-align: center;
  text-decoration: none;
  line-height: 3.4;
  border-radius: 0.3em;
  padding: 0 1.5em;
  cursor: pointer;
  background: #333;
  color: #f8f8f8;
  border: none;
}
.mypage .section.regist .btn a.main {
  background: #ff00a8;
  border: solid 1px #ff00a8;
}
.mypage .section.regist .btn a.sub {
  background: none;
  border: solid 1px;
  color: #333;
}

img {
  pointer-events: none;
}

.block--card {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: rgba(245, 241, 244, 0.8666666667);
  transition: 0.3s;
}
.block--card.cdopen {
  opacity: 1;
  visibility: visible;
  max-height: 100dvh;
  overflow: auto;
}
.block--card.cdopen::-webkit-scrollbar {
  display: none;
}
.block--card .close {
  display: inline-block;
  z-index: 2;
  min-width: 150px;
  margin: 2em auto 0;
  padding: 0.8em;
  border-radius: 100em;
  border: solid 1px #ff00a8;
  background: none;
  color: #ff00a8;
  /* @include font-japanese(700); */
  text-align: center;
  cursor: pointer;
  transition: 0.3s;
}
.block--card .close:hover {
  background: #ff00a8;
  color: #fff;
  border: solid 1px #ff00a8;
}
.block--card .block--card--inner {
  width: min(300px, 90%);
  position: absolute;
  transform: translate(-50%, 0);
  top: 5dvh;
  left: 50%;
  padding-bottom: 5dvh;
}
.block--card .card {
  width: 100%;
  text-align: center;
}
.block--card .card .card--inner {
  width: min(100%, 640px);
  padding-top: 215%;
  position: relative;
  background: #f9d4ea;
  border-radius: 1em;
  overflow: hidden;
}
.block--card .card .card--inner > * {
  position: absolute;
}
.block--card .card .card--inner ul {
  top: 5%;
  display: flex;
  width: min(1000px, 90%);
  margin: 0 auto;
  justify-content: center;
  width: 100%;
}
.block--card .card .card--inner ul li {
  width: 22.2222222222%;
  position: relative;
}
.block--card .card .card--inner ul li:nth-child(2) {
  top: -0.5em;
}
.block--card .card .card--inner ul li div {
  width: 100%;
  padding-top: 120.54%;
  background: url(/static/yuriyan/img/home/dance/1.png) center center;
  background-size: contain;
  animation: dance1 4s infinite;
  position: relative;
}
.block--card .card .card--inner ul li div span {
  position: absolute;
  width: 0.5em;
  transform: translate(0, -50%);
}
.block--card .card .card--inner ul li div span.onp {
  width: 0.6em;
}
.block--card .card .card--inner ul li div span.sib {
  width: 0.6em;
}
.block--card .card .card--inner ul li div span img {
  position: relative;
  animation: onp 2.5s infinite;
}
.block--card .card .card--inner ul li:nth-child(2n) div {
  animation: dance2 4s infinite;
}
.block--card .card .card--inner ul li:nth-child(3n) div {
  animation: dance3 4s infinite;
}
.block--card .card .card--inner ul li:nth-child(1) span:nth-child(1) {
  left: -10%;
  top: 50%;
}
.block--card .card .card--inner ul li:nth-child(1) span:nth-child(2) {
  right: 10%;
  top: 60%;
}
.block--card .card .card--inner ul li:nth-child(2) span:nth-child(1) {
  left: 0;
  top: 40%;
}
.block--card .card .card--inner ul li:nth-child(3) span:nth-child(1) {
  left: -5%;
  top: 20%;
}
.block--card .card .card--inner ul li:nth-child(3) span:nth-child(2) {
  right: 0%;
  top: 50%;
}
.block--card .card .card--inner ul li:hover div {
  animation-duration: 0.3s;
}
.block--card .card .card--inner .bg_card {
  width: 150%;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}
.block--card .card .card--inner .bg_card img {
  animation: rotate 120s infinite linear;
}
.block--card .card .card--inner .block--status {
  transform: translate(-50%, -50%);
  top: 48%;
  left: 50%;
  width: 55%;
}
.block--card .card .card--inner .block--status .item--tit,
.block--card .card .card--inner .block--status dl dt {
  font-size: 0.6em;
  color: #00a0e9;
}
.block--card .card .card--inner .block--status dl {
  margin-top: 1em;
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
  align-items: center;
}
.block--card .card .card--inner .block--status dl:nth-of-type(n + 2) {
  margin-top: 0.5em;
}
.block--card .card .card--inner .block--status dl dt {
  margin-right: 0.5em;
}
.block--card .card .card--inner .block--status dl dt:before {
  content: "\f004";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #ff00a8;
  margin-right: 0.5em;
}
.block--card .card .card--inner .block--status dl dd {
  font-size: 0.85em;
}
.block--card .card .card--inner .card_bottom {
  transform: translate(-50%, -50%);
  width: 60%;
  top: 88%;
  left: 50%;
}

.btn--main {
  background: #ff00a8;
  border: solid 1px #ff00a8;
}
.btn--main:hover {
  color: #ff00a8;
  background: none;
  border: solid 1px;
}

@media screen and (max-width: 961px) {
  .mypage section,
  .mypage .txtArea {
    max-width: 600px;
    padding: 2em 5% 3em 5%;
    margin: 0 auto 0 auto;
  }
  .mypage section .sectionTit,
  .mypage .txtArea .sectionTit {
    color: inherit;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.06em;
    margin: 0 0 1em;
  }
  .mypage section .txt,
  .mypage .txtArea .txt {
    color: inherit;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.05em;
    margin: 0 0 1em;
  }
  .mypage section .formArea,
  .mypage .txtArea .formArea {
    margin: 1em auto 2em auto;
    background: #fff;
    border-radius: 10px;
    padding: 1em;
  }
  .mypage section .formArea .formTit,
  .mypage .txtArea .formArea .formTit {
    margin: 2em 0 0.5em;
    /* font-size: 0.8em; */
    font-weight: bold;
    /* opacity: 0.5; */
  }
  .mypage section .formArea .formTit:nth-of-type(1),
  .mypage .txtArea .formArea .formTit:nth-of-type(1) {
    margin: 0 0 0.5em;
  }
  .mypage section .formArea .formList,
  .mypage .txtArea .formArea .formList {
    margin: 0 0 1em;
  }
  .mypage section .btn input,
  .mypage .txtArea .btn input {
    color: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.05em;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
    width: 100%;
    text-align: center;
    text-decoration: none;
    line-height: 3.4;
    border-radius: 0.3em;
    padding: 0 1.5em;
    cursor: pointer;
    background: #333;
    color: #f8f8f8;
    border: none;
  }
  .mypage section .btn input.main,
  .mypage .txtArea .btn input.main {
    background: #ff00a8;
    border: solid 1px #ff00a8;
  }
  .mypage section .btn input.sub,
  .mypage .txtArea .btn input.sub {
    background: none;
    border: solid 1px;
    color: #333;
  }
  .mypage section .btn a,
  .mypage .txtArea .btn a {
    color: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.05em;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
    min-width: 75%;
    text-align: center;
    text-decoration: none;
    line-height: 3.4;
    border-radius: 0.3em;
    padding: 0 1.5em;
    cursor: pointer;
    background: #333;
    color: #f8f8f8;
    border: none;
  }
  .mypage section .btn a.main,
  .mypage .txtArea .btn a.main {
    background: #ff00a8;
    border: solid 1px #ff00a8;
  }
  .mypage section .btn a.sub,
  .mypage .txtArea .btn a.sub {
    background: none;
    border: solid 1px;
    color: #333;
  }
}
@keyframes dance1 {
  0%, 32%, 100% {
    background: url(/static/yuriyan/img/home/dance/1.png) center center no-repeat;
    background-size: contain;
  }
  33%, 65% {
    background: url(/static/yuriyan/img/home/dance/2.png) center center no-repeat;
    background-size: contain;
  }
  66%, 100% {
    background: url(/static/yuriyan/img/home/dance/3.png) center center no-repeat;
    background-size: contain;
  }
}
@keyframes dance2 {
  0%, 32%, 100% {
    background: url(/static/yuriyan/img/home/dance/2.png) center center no-repeat;
    background-size: contain;
  }
  33%, 65% {
    background: url(/static/yuriyan/img/home/dance/3.png) center center no-repeat;
    background-size: contain;
  }
  66%, 100% {
    background: url(/static/yuriyan/img/home/dance/1.png) center center no-repeat;
    background-size: contain;
  }
}
@keyframes dance3 {
  0%, 32%, 100% {
    background: url(/static/yuriyan/img/home/dance/3.png) center center no-repeat;
    background-size: contain;
  }
  33%, 65% {
    background: url(/static/yuriyan/img/home/dance/1.png) center center no-repeat;
    background-size: contain;
  }
  66%, 100% {
    background: url(/static/yuriyan/img/home/dance/2.png) center center no-repeat;
    background-size: contain;
  }
}
@keyframes onp {
  0%, 100% {
    rotate: -15deg;
    top: 0;
  }
  25%, 75% {
    top: 0.5em;
  }
  50% {
    top: 0;
    rotate: 15deg;
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}/*# sourceMappingURL=mypage-service.css.map */