@charset "UTF-8";
.cont__center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.cont__center > * {
  min-height: 0%;
}

.cont__container {
  box-sizing: content-box !important;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .cont__container {
    max-width: 85.3333333333vw;
    padding-left: 0;
    padding-right: 0;
  }
}

.selected__btn, .introduction__sns-link, .link {
  color: inherit;
  transition: opacity 0.3s;
  cursor: pointer;
}
.selected__btn:hover, .introduction__sns-link:hover, .link:hover {
  opacity: 0.7;
}

.selected__txt, .selected__nickname, .tokushou__box-txt {
  margin-top: -9px;
  margin-bottom: -9px;
  flex-grow: 1;
  font-size: 1.8rem;
  line-height: 2;
  color: #4b2404;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767px) {
  .selected__txt, .selected__nickname, .tokushou__box-txt {
    margin-top: -1.7333333333vw;
    margin-bottom: -1.7333333333vw;
    font-size: 4.2666666667vw;
    line-height: 1.8125;
  }
}

.selected__nickname, .tokushou__nickname {
  display: flex;
  align-items: flex-end;
  justify-content: end;
  line-height: 1;
  font-weight: bold;
}

/* common:start */
[v-cloak] {
  display: none;
}

@media screen and (max-width: 767px) {
  .pcOnly {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .spOnly {
    display: none !important;
  }
}

.cont {
  background-color: #ffced7;
  font-feature-settings: "palt";
  padding-top: 100px;
  padding-bottom: 50px;
}
@media screen and (max-width: 1000px) {
  .cont {
    padding-top: 95px;
  }
}
@media screen and (max-width: 767px) {
  .cont {
    padding-top: 70px;
    padding-bottom: 5.3333333333%;
  }
}
.cont img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.cont__btn {
  width: 56px;
  height: 56px;
  position: sticky;
  bottom: 50px;
  right: 170px;
  z-index: 50;
  display: flex;
  margin-left: auto;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
@media screen and (max-width: 1920px) {
  .cont__btn {
    right: 8.8541666667vw;
  }
}
@media screen and (max-width: 767px) {
  .cont__btn {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
    bottom: 10.6666666667vw;
    right: 7.4666666667vw;
  }
}
.cont__btn-img {
  border-radius: 50%;
}
.cont__btn.show {
  opacity: 1;
  pointer-events: auto;
}

/* common:end */
/* kv:start */
.kv__container {
  background-color: #4c2505;
}
.kv__ttl {
  max-width: 1000px;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .kv__ttl {
    max-width: 100%;
  }
}

/* kv:end */
.tokushou__nickname, .tokushou__txt {
  margin-top: -5px;
  margin-bottom: -5px;
  font-size: 1.8rem;
  line-height: 1.5555555556;
  color: #4b2404;
  font-weight: 500;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 767px) {
  .tokushou__nickname, .tokushou__txt {
    margin-top: -0.9333333333vw;
    margin-bottom: -0.9333333333vw;
    font-size: 4.2666666667vw;
    line-height: 1.4375;
  }
}

.tokushou__note--top, .tokushou__note {
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 500;
  text-align: center;
  color: #4b2404;
}
@media screen and (max-width: 767px) {
  .tokushou__note--top, .tokushou__note {
    padding-left: 1.1em;
    text-indent: -1.1em;
    font-size: 3.7333333333vw;
    line-height: 1.4285714286;
    text-align: left;
  }
}
.tokushou__note--top::before, .tokushou__note::before {
  content: "※";
}

/* tokushou:start */
.tokushou {
  padding-top: 50px;
  padding-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .tokushou {
    padding-top: 6.6666666667%;
    padding-bottom: 6%;
  }
}
.tokushou__container {
  margin: auto;
}
@media screen and (max-width: 767px) {
  .tokushou__container {
    max-width: 82.6666666667vw;
  }
}
.tokushou__ttl {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .tokushou__ttl {
    margin-bottom: 8.064516129%;
  }
}
.tokushou__box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 830px;
  border-radius: 50px;
  box-shadow: 0 4px 0 #4b2404;
  background-color: #fff;
  border: 3px solid #4b2404;
  padding: 60px 65px 30px;
  margin: 0 auto 38px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .tokushou__box {
    width: 82.6666666667vw;
    border-radius: 6.6666666667vw;
    box-shadow: 0 1.0666666667vw 0 #4b2404;
    border-width: 0.5333333333vw;
    padding: 12.9032258065% 6.4516129032% 6.4516129032%;
    margin-bottom: 11.2903225806%;
  }
}
.tokushou__box::before {
  content: "";
  display: block;
  background-image: url(/misdo55th/omoide_cam/nyusen/images/tokushou_icon.png);
  background-repeat: no-repeat;
  width: 77px;
  height: 64px;
  position: absolute;
  top: -56px;
  left: -36px;
}
@media screen and (max-width: 767px) {
  .tokushou__box::before {
    background-image: url(/misdo55th/omoide_cam/nyusen/images/tokushou_icon_sp.png);
    background-size: 100%;
    width: 13.0666666667vw;
    height: 9.8666666667vw;
    top: -10.4vw;
    left: -2.1333333333vw;
  }
}
.tokushou__txt {
  margin-bottom: 20px;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .tokushou__txt {
    margin-bottom: 2.4193548387%;
  }
}
.tokushou__nickname {
  margin-top: 77px;
}
@media screen and (max-width: 767px) {
  .tokushou__nickname {
    margin-top: 10.1851851852%;
    margin-right: 2vw;
  }
}
.tokushou__note--top {
  margin-bottom: 65px;
}
@media screen and (max-width: 767px) {
  .tokushou__note--top {
    margin-bottom: 8.59375%;
  }
}

/* tokushou:end */
/* introduction:start */
.introduction__container {
  padding-top: 80px;
  padding-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .introduction__container {
    padding-top: 15.625%;
    padding-bottom: 10.9375%;
  }
}
.introduction__ttl {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .introduction__ttl {
    margin-bottom: 12.5%;
  }
}
.introduction__box {
  background-image: url(/misdo55th/omoide_cam/nyusen/images/introduction_bg.png);
  background-repeat: no-repeat;
  background-position: top center;
  max-width: 932px;
  height: 454px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  letter-spacing: 0.08em;
  padding: 100px 55px 0;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .introduction__box {
    background-image: url(/misdo55th/omoide_cam/nyusen/images/introduction_bg_sp.png);
    background-size: 100%;
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    height: 100%;
    flex-direction: column;
    padding: 17.3333333333vw 0 24vw;
  }
}
.introduction__img {
  width: 330px;
}
@media screen and (max-width: 767px) {
  .introduction__img {
    width: 54.1333333333vw;
    margin-left: 26.6666666667vw;
    margin-bottom: 14.6666666667vw;
  }
}
.introduction__txt {
  font-size: 1.6rem;
  line-height: 1.375;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .introduction__txt {
    font-size: 4.2666666667vw;
    line-height: 1.375;
  }
}
.introduction__txt-wrap {
  width: 367px;
  margin-left: 90px;
}
@media screen and (max-width: 767px) {
  .introduction__txt-wrap {
    width: 100%;
    margin: auto;
    padding-left: 7.3333333333%;
    padding-right: 7.3333333333%;
  }
}
.introduction__txt-name {
  margin-bottom: 22px;
  font-size: 2.4rem;
  line-height: 1;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .introduction__txt-name {
    margin-bottom: 6.7796610169%;
    font-size: 6.4vw;
  }
}
.introduction__txt + .introduction__txt {
  margin-top: 7px;
}
@media screen and (max-width: 767px) {
  .introduction__txt + .introduction__txt {
    margin-top: 2.5423728814%;
  }
}
.introduction__sns {
  width: 255px;
  display: flex;
  margin: 20px auto 0;
}
@media screen and (max-width: 767px) {
  .introduction__sns {
    width: 100%;
    margin-top: 5.3333333333vw;
    padding-left: 10.6666666667vw;
  }
}
.introduction__sns-item:first-child {
  margin-right: 40px;
}
@media screen and (max-width: 767px) {
  .introduction__sns-item:first-child {
    margin-right: 10vw;
  }
}
.introduction__sns-link {
  font-size: 1.6rem;
  color: #e8342f;
  font-weight: bold;
  text-decoration: underline;
}
@media screen and (max-width: 767px) {
  .introduction__sns-link {
    font-size: 4.2666666667vw;
  }
}

/* introduction:end */
.selected__icon--02, .selected__icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 2px;
  margin-bottom: 2px;
}
@media screen and (max-width: 767px) {
  .selected__icon--02, .selected__icon {
    width: 4.1333333333vw;
    height: 4.1333333333vw;
    margin-right: 0.5333333333vw;
    margin-bottom: 1.0666666667vw;
  }
}

/* selected:start */
.selected {
  padding-top: 50px;
  padding-bottom: 45px;
}
@media screen and (max-width: 767px) {
  .selected {
    padding-top: 9.3333333333%;
    padding-bottom: 8%;
  }
}
.selected__container {
  background-color: #fff;
}
.selected__ttl {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .selected__ttl {
    margin-bottom: 7.8125%;
  }
}
.selected__contents {
  width: 896px;
  display: flex;
  flex-wrap: wrap;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .selected__contents {
    width: 100%;
  }
}
.selected__box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 428px;
  border-radius: 50px;
  background-color: #fff;
  padding: 55px 37px 40px;
  margin: 0 auto 30px;
  position: relative;
  z-index: 5;
}
@media screen and (max-width: 767px) {
  .selected__box {
    width: 82.6666666667vw;
    border-radius: 6.6666666667vw;
    padding: 13.28125% 6.25% 8.59375%;
    margin-bottom: 11.71875%;
    margin-right: 3.125%;
  }
}
.selected__box::before {
  content: "";
  display: block;
  width: 428px;
  height: 100%;
  background-color: transparent;
  border-radius: 50px;
  border: 2px solid #fff;
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .selected__box::before {
    width: 82.6666666667vw;
    border-radius: 6.6666666667vw;
    border-width: 0.5333333333vw;
    top: 1.3333333333vw;
    left: 1.3333333333vw;
  }
}
.selected__box::after {
  content: "";
  display: block;
  background-image: url(/misdo55th/omoide_cam/nyusen/images/selected_bg-right.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 68px;
  height: 79px;
  position: absolute;
  bottom: 2px;
  right: -62px;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .selected__box::after {
    background-image: url(/misdo55th/omoide_cam/nyusen/images/selected_bg-left_sp.png);
    width: 17.3333333333vw;
    height: 8.4vw;
    bottom: -8.4vw;
    left: 1px;
  }
}
.selected__box:nth-child(odd) {
  margin-left: 0;
  margin-right: 20px;
}
@media screen and (max-width: 767px) {
  .selected__box:nth-child(odd) {
    margin-right: 0;
    margin-left: 1.5625%;
  }
}
.selected__box:nth-child(odd)::after {
  background-image: url(/misdo55th/omoide_cam/nyusen/images/selected_bg-left.png);
  width: 61px;
  height: 81px;
  left: -52px;
}
@media screen and (max-width: 767px) {
  .selected__box:nth-child(odd)::after {
    background-image: url(/misdo55th/omoide_cam/nyusen/images/selected_bg-right_sp.png);
    width: 17.3333333333vw;
    height: 8.4vw;
    left: auto;
    right: -1.4666666667vw;
  }
}
.selected__txt {
  flex-grow: 1;
}
.selected__txt + .selected__txt {
  margin-top: 45px;
}
@media screen and (max-width: 767px) {
  .selected__txt + .selected__txt {
    margin-top: 9.3333333333vw;
  }
}
.selected__nickname {
  margin-top: 30px;
  margin-right: 8px;
}
@media screen and (max-width: 767px) {
  .selected__nickname {
    margin-top: 11.1111111111%;
    margin-right: 0;
  }
}
.selected__btn {
  display: inline-block;
  width: 355px;
  height: 60px;
  border-radius: 38px;
  box-shadow: 0 6px 0 #950000;
  background-color: #f50000;
}
@media screen and (max-width: 767px) {
  .selected__btn {
    width: 84.4vw;
    height: 14.6666666667vw;
    border-radius: 7.2vw;
    box-shadow: 0 1.3333333333vw 0 #950000;
  }
}
.selected__btn-area {
  margin-top: 60px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .selected__btn-area {
    margin-top: 13.28125%;
  }
}
@media screen and (max-width: 767px) {
  .selected__icon--02 {
    width: 5.0666666667vw;
    height: 5.0666666667vw;
  }
}

/* selected:end */