@charset "UTF-8";

/* ページ編集 */

body {
  width: 100%;
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  margin: auto;
  margin-bottom: 10%;
  font-family: "Noto Sans JP", sans-serif;
}

a {
  text-decoration: none;
}
/* ナビゲーション */
header {
  background-color: #ff5b9d;
}

.header-flex {
  display: flex;
  justify-content: space-between;
  height: 60px;
  padding: 0 20px;
}

/* TEL */
.tel-inner {
  display: flex;
  justify-content: center;
}

.tel-number {
  font-weight: 300;
  color: #fff;
  margin: auto;
  font-weight: bold;
}

.tel-icon {
  width: 30px;
  margin: auto;
}

.tel-icon img {
  width: 30px;
}

/* flex 右側 */
.flex-right {
  display: flex;
}

/* 女性求人 */
.recruit-inner {
  background-color: #fff;
  margin: auto;
  height: 40px;
  position: relative;
  left: -40px;
}

.recruit-btn {
  text-decoration: none;
  color: #ff0268;
  font-size: 14px;
  position: relative;
  top: 5px;
  padding: 10px;
  font-weight: bold;
  padding: 20px;
  font-size: 20px;
}

/*=========================================
#hamburger
=========================================*/
.hamburger {
  position: relative;
  top: 10px;
  right: 20px;
  z-index: 150;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.hamburger.is-active span:nth-child(1) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(135deg);
}

.hamburger.is-active span:nth-child(2) {
  opacity: 0;
}

.hamburger.is-active span:nth-child(3) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(-135deg);
}

.hamburger span {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 2px;
  transition: transform 0.3s;
  background-color: #fff;
}

.hamburger.is-active span {
  background-color: #ffffff;
}

.hamburger span:nth-child(1) {
  top: 30%;
}

.hamburger span:nth-child(2) {
  top: 60%;
}

.hamburger span:nth-child(3) {
  top: 90%;
}

/* ===============================================
# 共通
=============================================== */
a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  background-size: cover;
  background-repeat: no-repeat;
  font-style: italic;
  vertical-align: middle;

  shape-margin: 0.75rem;
}

li {
  list-style: none;
}

h2 {
  text-align: center;
}

a:hover {
  opacity: 0.6;
}

a .cast-img img:hover {
  transform: scale(1.2, 1.2);
  opacity: none;
  transition: 1s all;
}

/* メインビジュアル */
.main {
  margin: 0;
}

/* イベント */
.event {
  margin-left: 0;
  margin-right: 0;
}

/* 出勤情報 */
.schedule-wrapper {
  background-image: url(../images/bg-img.png);
  background-size: cover;
}

.schedule-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.schedule-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 3px;
  left: 30px;
}

.schedule-title::after {
  content: "SCHEDULE";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

/* 出勤情報　内枠 */
.cast-wrapper {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 20px;
  padding: 0;
  margin: 0;
  padding-bottom: 30px;
  padding-top: 30px;
}

/* キャスト　プロフィール */

.cast-item {
  width: 32%;
  display: block;
  margin-bottom: 10px;
}

.work-cast {
  text-align: center;
  font-weight: bold;
  color: #fff;
  background-color: #ff5b9d;
  margin: 0;
}

.cast-img {
  margin: 0;
  overflow: hidden;
  transition: 1s all;
}

.cast-name {
  text-align: center;
  background-color: #ff0268f2;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  margin-top: 0;
  margin-bottom: 0;
}

.size {
  font-size: 12px;
}

.cast-greet {
  text-align: center;
  color: #fff;
  background-color: #ff5b9de6;
  font-weight: bold;
  margin-top: 0;
  margin-bottom: 0;
  padding: 5px;
  font-size: 12px;
}

/* ランキング */
.ranking-wrapper {
  position: relative;
  overflow: hidden;
}

.ranking-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.ranking-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/king-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  left: 30px;
}

.ranking-title::after {
  content: "RANKING";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

.indicator li {
  width: 260px;
  padding-right: 10px;
}

.indicator {
  width: fit-content;
  bottom: 10px;
  display: flex;
  z-index: 10;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #ff5b9d7d;
}

.next {
  content: "";
  background-image: url(../images/slider-next.png);
  width: 40px;
  height: 40px;
  position: absolute;
  right: 30px;
  bottom: 260px;
  transition: all 0.3s;
  z-index: 10;
  cursor: pointer;
}

.prev {
  content: "";
  background-image: url(../images/slider-prev.png);
  width: 40px;
  height: 40px;
  position: absolute;
  left: 30px;
  bottom: 260px;
  transition: all 0.3s;
  z-index: 10;
  cursor: pointer;
}

.ranking-slider .cast-img {
  aspect-ratio: 243 / 365;
}

.ranking-slider .cast-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 新人情報 */

.new-wrapper {
  overflow: hidden;
  position: relative;
}

.new-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.new-title::before {
  content: "";
  display: block;
  width: 35px;
  height: 35px;
  background-image: url(../images/new-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 6px;
  left: 30px;
}

.new-title::after {
  content: "NEW";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

/* 写メ日記 */
.photo-wrapper {
  background-color: #fff;
}

.photo-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.photo-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/camera-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  left: 30px;
}

.photo-title::after {
  content: "PHOTO";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

.photo-inner {
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
  justify-content: space-between;
  padding: 0;
  padding: 20px;
  margin: 0;
}

.photo-item {
  width: 32%;
}

.photo-img {
  width: 100%;
  margin: 0;
}

time {
  text-align: center;
  color: #ff0268;
  margin-top: 10px;
}

.photo-comment {
  text-align: center;
  font-weight: bold;
  color: #ff0268;
  margin: 10px 0;
  font-size: 16px;
  text-align: justify;
}

/* もっと見るボタン */
.btn-inner {
  height: 70px;
  text-align: center;
  margin: 40px;
}

.btn {
  font-weight: bold;
  color: #fff;
  background-color: #ff0268;
  border-radius: 10px;
  text-align: center;
  padding: 20px;
  font-size: 20px;
}

/* フッダー */

footer {
  position: fixed;
  bottom: 0;
  width: 767px;
}

.contact-flex {
  display: flex;
  justify-content: space-between;
}

.footer-link {
  width: calc(100% / 3);
}

.telephone-inner {
  background-color: #ff5b9d;
  text-align: center;
  padding: 10px;
  position: relative;
}

.telephone-area {
  color: #fff;
  font-weight: bold;
}

.telephone-area::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/tell-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 22px;
  left: 77px;
}

.line-inner {
  background-color: #ffcde1;
  text-align: center;
  padding: 10px;
  position: relative;
}

.line-area {
  color: #fff;
  font-weight: bold;
}
.line-area::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/LINE_Brand_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 22px;
  left: 70px;
}

.mail-inner {
  background-color: #ff5b9d;
  text-align: center;
  padding: 10px;
  position: relative;
}

.mail-area {
  color: #fff;
  font-weight: bold;
}

.mail-area::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/mail-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 22px;
  left: 45px;
}

/*  copyright */
.copyright-inner {
  text-align: center;
  background-color: #ff0268;
}

.copyright {
  color: #fff;
}

/* -----------------
    スマホサイズ
    ーーーーーーーーーーー */
@media screen and (max-width: 767px) {
  body {
    width: 100%;
    background-image: url("../images/bg.png");
  }

  /* ヘッダーナビゲーション */
  .recruit-inner {
    left: 0;
  }

  .recruit-btn {
    font-size: 12px;
    padding: 7px;
  }

  .hamburger {
    right: 0;
    margin-left: 10px;
  }

  /* 出勤情報 */

  .schedule-title {
    font-size: 24px;
  }

  .schedule-title::before {
    width: 30px;
    height: 30px;
  }

  .schedule-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  .cast-wrapper {
    justify-content: space-evenly;
  }

  .cast-item {
    width: 48%;
    padding: 0;
  }

  .cast-name {
    font-size: 12px;
  }

  .size {
    font-size: 8px;
  }

  .cast-wrapper {
    padding-bottom: 20px;
  }

  /* ボタン　*/
  .btn-inner {
    margin: 10px;
  }

  .btn {
    padding: 16px;
    font-size: 16px;
    border-radius: 27px;
  }

  /* スライダー　*/

  .indicator {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .indicator li {
    padding-left: 5px;
  }

  /* ランキング */

  .ranking-title {
    font-size: 24px;
  }

  .ranking-title::before {
    width: 30px;
    height: 30px;
  }

  .ranking-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  /* リストアイテム */

  .indicator li {
    width: 160px;
    padding-left: 5px;
    padding-right: 0;
  }

  .next {
    right: 0;
    bottom: 180px;
  }

  .prev {
    left: 0;
    bottom: 180px;
  }

  /* 新人情報 */

  .new-title {
    font-size: 24px;
  }

  .new-title::before {
    width: 30px;
    height: 30px;
  }

  .new-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  /* 写メ日記 */

  .photo-title {
    font-size: 24px;
  }

  .photo-title::before {
    width: 30px;
    height: 30px;
  }

  .photo-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  .photo-item {
    width: 32%;
  }

  time {
    font-size: 10px;
  }

  .photo-comment {
    font-size: 10px;
    margin: 4px 0;
  }

  /* フッダー */

  footer {
    width: 100%;
  }

  .telephone-inner {
    padding: 1px;
  }

  .telephone-area {
    font-size: 10px;
  }

  .telephone-area::before {
    width: 20px;
    height: 20px;
    top: 8px;
    left: 30px;
  }

  .line-inner {
    padding: 1px;
  }

  .line-area {
    font-size: 10px;
  }

  .line-area::before {
    width: 20px;
    height: 20px;
    top: 8px;
    left: 22px;
  }

  .mail-inner {
    padding: 1px;
  }

  .mail-area {
    font-size: 10px;
  }

  .mail-area::before {
    width: 20px;
    height: 20px;
    top: 8px;
    left: 10px;
  }

  .copyright {
    font-size: 8px;
  }
}

@media screen and (max-width: 1023px) {
  body {
    width: 100%;
    background-image: url("../images/bg.png");
  }
}

/* ----------------
 イベント
 ーーーーーーーーーーー */

.event-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.event-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.event-title::after {
  content: "EVENT";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

.event-banner {
  margin: 0;
}

.secret-banner {
  margin: 0;
}

.secret-title-inner {
  background-color: #f8416c;
  padding-top: 5px;
  padding-bottom: 5px;
}

.secret-title {
  color: #fff;
  background-color: #f8416c;
  border-top: #fff 2px dotted;
  border-bottom: #fff 2px dotted;
  margin: 0;
  position: relative;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
}

.secret-title::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/hurt-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  left: 30px;
}

.secret-title::after {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/hurt-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  right: 30px;
}

article {
  margin-top: 20px;
}

.secret-banner img {
  width: 100%;
}

.secret-content-inner {
  background-color: #fff;
  border: 2px solid #ff5b9d;
  border-radius: 10px;
  margin-top: 10px;
  width: 100%;
}

tbody.secret-tbody {
  display: block;
}

h3.secret-subtitle {
  margin: 0;
  background-color: #ff5b9d;
  color: #fff;
  font-size: 20px;
  text-align: center;
  width: 50%;
  border-radius: 6px 10px 10px 0;
  padding: 5px;
}

.secret-table {
  margin: auto;
  padding: 20px;
}

.secret-td {
  padding-bottom: 5px;
}

.secret-td-top {
  font-weight: bold;
}

.stg {
  background-color: #ff0268;
  border-radius: 10px;
  font-size: 12px;
  text-align: center;
  padding: 6px;
  color: #fff;
  font-weight: bold;
}

.secret-event-rule {
  padding-left: 40px;
  padding-right: 40px;
}

/* 注意事項 */

.note-title {
  color: #fff;
  background-color: #000;
  margin: 0;
  position: relative;
  margin-top: 20px;
}

.note-title::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/warning-logo.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  left: 30px;
}

.note-title::after {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/warning-logo.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  right: 30px;
}

.note-inner {
  margin: 0;
  background-image: url("../images/note-bg.jpg");
  margin-bottom: 20px;
}

.note-text {
  margin: 0;
  padding: 20px;
}

/*ーーーーーーーーーー
イベント　　スマホサイズ
ーーーーーーーーーーー */
@media screen and (max-width: 767px) {
  .event-title {
    font-size: 24px;
  }

  .event-title::before {
    width: 30px;
    height: 30px;
  }

  .event-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  .event-banner {
    margin: 0;
  }

  .secret-banner {
    margin: 0;
  }

  .secret-title::before {
    width: 25px;
    height: 25px;
    top: 6px;
    left: 40px;
  }

  h3.secret-subtitle {
    font-size: 14px;
  }

  .secret-subtitle-long {
    font-size: 10px !important;
  }

  .secret-title::after {
    width: 25px;
    height: 25px;
    top: 6px;
    right: 40px;
  }

  .secret-content-inner {
    width: 100%;
  }

  tbody.secret-tbody {
    display: block;
  }

  .secret-table {
    padding: 4px;
  }
}

/* --------------
---コスプレ一覧 
ーーーーーーーーーー*/

.cos-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.cos-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.cos-title::after {
  content: "COSPLAY";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

.cos-inner {
  display: flex;
  flex-wrap: wrap;
  background-image: url("../images/bg-img.png");
  justify-content: space-between;
  padding: 0;
  padding: 20px;
  margin: 0;
  margin-bottom: 20px;
}

.cos-item {
  width: 32%;
}

.cos-img {
  width: 100%;
  margin: 0;
}

.cos-comment {
  text-align: center;
  font-weight: bold;
  color: #fff;
  background-color: #ff0268;
  margin: 0;
  margin-bottom: 10px;
  font-size: 12px;
}

/* ----------
コスプレ
スマホサイズ
ーーーーーーー*/

@media screen and (max-width: 767px) {
  .cos-title {
    font-size: 24px;
  }

  .cos-title::before {
    width: 30px;
    height: 30px;
  }

  .cos-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }
}

/*-------------------------
        プレイ内容
ーーーーーーーーーーーーーー*/

.play-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.play-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.play-title::after {
  content: "SCHEDULE";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

/*------------
    プレイ内容
--------------*/

@media screen and (max-width: 767px) {
  .play-title {
    font-size: 24px;
  }

  .play-title::before {
    width: 30px;
    height: 30px;
  }

  .play-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  .price-inner {
    padding: 10px !important;
  }

  td.price-td.price-left {
    padding: 5px 10px !important;
  }

  td.price-td.price-right {
    padding: 5px 10px !important;
  }
}

/* プレイ内容　*/
.play-content-inner {
  background-color: #fff;
  width: 100%;
  margin: auto;
  margin-bottom: 20px;
  border-radius: 10px;
}

h3.play-content-title {
  text-align: center;
  background-color: #ff0268;
  color: #fff;
  padding: 5px;
  border-radius: 10px 10px 0 0;
}

.play-content-text-inner {
  text-align: center;
  padding-bottom: 20px;
}

table.play-table {
  margin: auto;
}

td.play-td.play-left {
  background-color: #ff5b9d;
  color: #fff;
  padding: 5px 20px;
  text-align: center;
  border-radius: 10px;
  font-weight: 600;
}

td.play-td.playright {
  text-align: center;
  padding: 5px 15px;
  border-bottom: #ff5b9d 2px solid;
}

/* コース説明　*/
.course-inner {
  background-color: #fff;
  border-radius: 10px;
  border: 2px solid #ff5b9d;
  margin-top: 20px;
}

h3.course-title {
  background-color: #ff5b9d;
  color: #fff;
  text-align: center;
  padding: 5px;
  margin-bottom: 0;
  margin-top: 0;
  border-radius: 6px 0 10px 0;
  width: 30%;
}

.course-text-inner {
  padding: 20px;
}

span.course-content-title {
  font-weight: 600;
}

p.course-content-text {
  margin: 0;
}

/* . 料金表　*/

article.price-article {
  width: 100%;
  margin: auto;
}

h3.price-title {
  background-color: #ff0268;
  padding: 5px;
  text-align: center;
  color: #fff;
  border-radius: 10px 10px 0 0;
  margin-bottom: 0;
}

.price-inner {
  padding: 20px 100px;
  background-color: #fff;
  border-radius: 0 0 10px 10px;
}

.price-flex-inner {
  display: flex;
  justify-content: space-around;
}

td.price-td.price-left {
  background-color: #ff5b9d;
  text-align: center;
  padding: 5px 20px;
  color: #fff;
  border-radius: 10px;
  font-weight: bold;
}

td.price-td.price-right {
  border-bottom: 2px #ff5b9d solid;
  padding: 5px 20px;
  font-weight: bold;
}

td.price-end.end-left {
  background-color: #ff5b9d;
  text-align: center;
  padding: 5px 20px;
  color: #fff;
  border-radius: 10px;
  font-weight: bold;
}

td.price-end.end-right {
  border-bottom: 2px #ff5b9d solid;
  padding: 5px 20px;
  font-weight: bold;
}

/*  オプション　*/

.option-article {
  width: 100%;
  margin: auto;
}

h3.option-title {
  background-color: #ff0268;
  padding: 5px;
  text-align: center;
  color: #fff;
  border-radius: 10px 10px 0 0;
  margin-bottom: 0;
}

h4.option-price {
  margin: 0;
}

.option-inner {
  background-color: #fff;
  border-radius: 0 0 10px 10px;
  padding: 20px;
}

.option-content {
  margin-bottom: 20px;
}

.option-flex {
  display: flex;
  flex-wrap: wrap;
}

p.option-item {
  background-color: #ff0268;
  padding: 5px;
  color: #fff;
  border-radius: 10px;
  margin: 3px;
  font-weight: bold;
}

.price-inner {
  padding: 10px;
}

td.price-td.price-left {
  font-size: 16px;
}

td.price-td.price-right {
  font-size: 16px;
}

td.price-end.end-left {
  font-size: 16px;
}

td.price-end.end-right {
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  td.price-td.price-left {
    font-size: 10px;
  }

  td.price-td.price-right {
    font-size: 10px;
  }

  td.price-end.end-left {
    font-size: 10px;
  }

  td.price-end.end-right {
    font-size: 10px;
  }

  p.option-item {
    font-size: 10px;
    padding: 10px;
  }

  h3.course-title {
    font-size: 14px;
  }
}

/*-----------------------
  プレイの流れ
----------------------*/

.flow-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.flow-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.flow-title::after {
  content: "EVENT";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

.flow-article {
  margin-top: 30px;
  margin-bottom: 30px;
}

.flow-content-inner {
  background-color: #fff;
  border: #ff5b9d 3px solid;
  border-radius: 10px;
}

h3.flow-content-title {
  margin: 0;
  padding: 5px;
  width: 20%;
  background-color: #ff5b9d;
  color: #fff;
  text-align: center;
  border-radius: 0 0 10px 0;
}

p.flow-content-text {
  margin: 0;
  padding: 20px;
}

figure.flow-parts {
  width: 100px;
  margin: 30px auto 0;
}

.flow-play-title-inner {
  background-color: #f8416c;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 50px;
  margin-bottom: 50px;
}

.flow-play-title {
  color: #fff;
  background-color: #f8416c;
  border-top: #fff 2px dotted;
  border-bottom: #fff 2px dotted;
  margin: 0;
  position: relative;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
}

.flow-play-title::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/hurt-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  left: 30px;
}

.flow-play-title::after {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../images/hurt-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 5px;
  right: 30px;
}

/*ーーーーーーーーーー
イベント　　スマホサイズ
ーーーーーーーーーーー */
@media screen and (max-width: 767px) {
  .flow-title {
    font-size: 24px;
  }

  .flow-title::before {
    width: 30px;
    height: 30px;
  }

  .flow-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  .flow-article {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  figure.flow-parts {
    width: 100px;
    margin: 20px auto 0;
  }
}

/*--------------
    新人情報
---------------*/

.new-cast-wrapper {
  background-image: url(../images/bg-img.png);
  background-size: cover;
}

.new-cast-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.new-cast-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/new-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.new-cast-title::after {
  content: "NEW";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

/* 出勤情報　内枠 */
.new-cast-wrapper {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  padding-bottom: 30px;
  padding-top: 30px;
}

@media screen and (max-width: 767px) {
  .new-cast-title {
    font-size: 24px;
  }

  .new-cast-title::before {
    width: 30px;
    height: 30px;
  }

  .new-cast-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }
}

/*----------------
     在籍女性　　
-----------------*/

.new-cast-wrapper {
  background-image: url(../images/bg-img.png);
  background-size: cover;
}

.enrollment-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.enrollment-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.enrollment-title::after {
  content: "CAST";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

@media screen and (max-width: 767px) {
  .enrollment-title {
    font-size: 24px;
  }

  .enrollment-title::before {
    width: 30px;
    height: 30px;
  }

  .enrollment-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }
}

/*   承認ページ　　*/

.approval-inner {
  text-align: center;
  width: 30%;
  margin: auto;
  margin-top: 40px;
  padding: 5px 0;
  background-color: #ff0268;
}

p.approval {
  background-color: #ff0268;
  color: #fff;
  padding: 5px;
  border-bottom: 2px dotted;
  border-top: 2px dotted;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .approval-inner {
    width: 50%;
    margin-top: 30px;
  }
}

/*---------------
       404 
  --------------*/

h2.\34 04-title {
}
p.\34 04-text {
  text-align: center;
  font-weight: bold;
}

.\34 04-btn-inner {
  width: 30%;
  margin: auto;
}

p.\34 04-btn {
  color: #fff;
  font-weight: bold;
  background-color: #ff0268;
  padding: 10px;
  border-radius: 10px;
  text-align: center;
  margin-top: 80px;
}

@media screen and (max-width: 767px) {
  .\34 04-btn-inner {
    width: 50%;
  }
}

/*-----------------------
     求人情報
---------------------*/

.recruit-title {
  background-color: #ff5b9d;
  font-size: 30px;
  position: relative;
  color: #fff;
  margin-bottom: 0;
}

.recruit-title::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../images/strawberry-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 30px;
}

.recruit-title::after {
  content: "RECRUIT";
  height: 30px;
  font-size: 20px;
  position: absolute;
  top: 7px;
  right: 30px;
}

h3.recruit-subtitle {
  text-align: center;
  background-color: #ff5b9d;
  color: #fff;
  margin: 0;
}

.recruit-wrapper {
  background: #ffffff9c;
  padding: 10px;
  margin-bottom: 20px;
}

table.recruit-table {
  border: 1px solid;
  border-collapse: collapse;
  width: 100%;
  overflow: hidden;
}

tr.recruit-tr {
  border: 1px solid #d2bea5;
}

td.recruit-td-left {
  width: 40%;
  padding: 10px;
  border: 1px solid #d2bea5;
  background-color: #f6f3e5;
  color: #330000;
}

td.recruit-td-right {
  width: 60%;
  padding: 5px;
  background-color: #fff;
}

.contact-title-inner {
  background-color: #f8416c;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 20px;
}

.contact-title {
  color: #fff;
  background-color: #f8416c;
  border-top: #fff 2px dotted;
  border-bottom: #fff 2px dotted;
  margin: 0;
  position: relative;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .recruit-title {
    font-size: 24px;
  }

  .recruit-title::before {
    width: 30px;
    height: 30px;
  }

  .recruit-title::after {
    font-size: 12px;
    top: 10px;
    right: 15px;
  }

  td.recruit-td-left {
    display: block;
    width: 100%;
    border-top: none;
  }

  td.recruit-td-right {
    display: block;
    width: 100%;
  }

  span.contact {
    font-size: 16px;
  }
}

/*---------------------
        プロフィール
---------------------*/

h2.profile-title {
  color: #ff0268;
}

.profile-title-inner {
  position: relative;
}

.profile-wrapper {
  background: #ffffff3d;
  width: 80%;
  margin: auto;
  padding: 20px;
  border-radius: 10px;
}

.profile-title-inner::before {
  content: "";
  display: block;
  width: 100px;
  height: 100px;
  background-image: url(../images/dec.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: -10px;
}

.profile-title-inner::after {
  content: "";
  display: block;
  width: 100px;
  height: 100px;
  background-image: url(../images/dec-right.png);
  background-size: contain;
  background-repeat: no-repeat;

  position: absolute;
  top: 0;
  right: 0;
}

h3.profile-name {
  text-align: center;
}

p.profile-size {
  text-align: center;
  font-weight: bold;
}

ul.profile-ul {
  display: flex;
  justify-content: center;
  padding: 0;
}

li.profile-item {
  background-color: #ff0268;
  color: #fff;
  padding: 10px;
  margin: 10px;
  width: 100px;
  text-align: center;
  font-weight: bold;
  border-radius: 10px;
}

/* .  一言コメント　　*/

.profile-flex {
  display: flex;
  justify-content: space-between;
  border-bottom: 2px dotted #ff0268;
  width: 60%;
  margin: auto;
}

p.profile-left {
  width: 40%;
  text-align: center;
  background-color: #ff5b9d;
  color: #fff;
  font-weight: bold;
  padding: 5px;
  border-radius: 10px;
}

p.profile-right {
  width: 40%;
  text-align: center;
  padding: 5px;
}

/*   店からのメッセージ　*/

.shop-message-inner {
  border: 3px solid #ff5b9d;
  border-radius: 10px;
  background-color: #fff;
  margin-top: 60px;
}

h3.shop-message-title {
  background-color: #ff5b9d;
  width: 30%;
  padding: 10px;
  text-align: center;
  color: #fff;
  border-radius: 0 0 10px 0;
  margin: 0;
}

p.shop-message-text {
  padding: 10px;
}

/* . 対応可能コーズ　*/

.ng-course-inner {
  margin-top: 60px;
}

h3.ng-course-title {
  text-align: center;
  color: #fff;
  margin-bottom: 0;
  background-color: #ff0268;
  padding: 5px;
}

ul.ng-course-ul {
  padding: 0;
  display: flex;
  background-color: #fff;
  margin: 0;
  justify-content: center;
}

li.ng-course-item {
  width: 25%;
  border: 0.5px solid;
  padding: 10px;
}

li.ng-course-item.ng {
  background-color: #cfcfcf;
}

/* . 可能オプション　*/

.cast-option-inner {
  background-color: #fff;
  margin-bottom: 60px;
}

h3.cast-option-title {
  text-align: center;
  color: #fff;
  padding: 5px;
  background-color: #ff0268;
  margin-bottom: 0;
  margin-top: 60px;
}

.cast-option-content {
  display: flex;
  flex-wrap: wrap;
  padding: 20px;
}

p.cast-option-item {
  background-color: #ff5b9d;
  color: #fff;
  padding: 10px;
  border-radius: 10px;
  font-weight: bold;
  margin: 5px;
}

/*   出勤スケジュール */

.schedule-wrapper {
  margin-top: 60px;
  margin-bottom: 60px;
}

.schedule-inner {
  background-color: #fff;
  padding-bottom: 30px;
  padding-top: 30px;
}

.schedule-flex {
  display: flex;
  justify-content: space-between;
  border-bottom: 2px dotted #ff0268;
  width: 60%;
  margin: auto;
}

p.schedule-left {
  width: 40%;
  text-align: center;
  color: #483d3d;
  font-weight: bold;
  padding: 5px;
  border-radius: 10px;
}

p.schedule-right {
  width: 40%;
  text-align: center;
  padding: 5px;
}

.mon {
  background-color: #fcda5c;
}

.tues {
  background-color: #ed896c;
}

.wednes {
  background-color: #a7bcef;
}

.thurs {
  background-color: #88ce90;
}

.fri {
  background-color: #ceb457;
}

.satur {
  background-color: #d5ab7b;
}

.sun {
  background-color: #fda561;
}

@media screen and (max-width: 767px) {
  .section-slider {
    width: 86%;
  }

  .profile-flex {
    width: 90%;
  }
  .profile-wrapper {
    width: 90%;
  }

  p.profile-left {
    width: 50%;
    font-size: 14px;
  }

  p.profile-right {
    width: 60%;
    font-size: 14px;
  }

  h3.shop-message-title {
    font-size: 10px;
    width: 40%;
  }

  p.cast-option-item {
    font-size: 14px;
  }

  .schedule-flex {
    width: 80%;
  }
}

/*---------------------
   キャストロゴ設定
---------------------*/
.new-logo {
  position: relative;
}

.new-logo::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-image: url(../images/new-logo.png);
  background-size: contain;
  background-repeat: no-repeat;

  position: absolute;
  top: 5px;
  left: -1px;
}

.no1-logo {
  position: relative;
}

.no1-logo::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-image: url(../images/no1.png);
  background-size: contain;
  background-repeat: no-repeat;

  position: absolute;
  top: 10px;
  left: 2px;
}

.no2-logo {
  position: relative;
}

.no2-logo::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-image: url(../images/no2.png);
  background-size: contain;
  background-repeat: no-repeat;

  position: absolute;
  top: 10px;
  left: 2px;
}

.no3-logo {
  position: relative;
}

.no3-logo::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-image: url(../images/no3.png);
  background-size: contain;
  background-repeat: no-repeat;

  position: absolute;
  top: 10px;
  left: 2px;
}

p {
  font-size: 16px;
}


/*追記*/
/* 点滅 */
p.waiting_times {
    text-align: center;
    background: #ff0268f2;
}
p.waiting_times span {
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
    color:#fff;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}