@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
@charset "Shift_JIS";
html {
    font-size: 62.5%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
    word-break: normal;
    -moz-tab-size: 4;
    -webkit-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
}
body {
    background: #fff;
    font-family: 'Noto Sans', sans-serif;
    color: #000;
    font-size: 1.6em;
    line-height: 1;
}
img {
    width: 100%;
    height: auto;
    display: block;
}
div::-webkit-scrollbar {
    width: 12px;
}
div::-webkit-scrollbar-track {
    background: #eee;
    border: none;
    border-radius: 10px;
    box-shadow: inset 0 0 2px #aaa;
}
div::-webkit-scrollbar-thumb {
    background: #eee;
    border-radius: 10px;
    box-shadow: none;
}
.clearfix::after {
    content: "";
    display: block;
    clear: both;
}
@media screen and (max-width: 1024px) {
    .sp_none {
        display: none;
    }
}
@media screen and (min-width:1025px) {
    .pc_none {
        display: none;
    }
}
@media screen and (min-width: 600px) {
    .br_pc {
        display: block;
    }
    .br_sp {
        display: none;
    }
}
@media screen and (max-width: 600px) {
    .br_pc {
        display: none;
    }
    .br_sp {
        display: block;
    }
}
/*===============================
ヘッダー
================================*/
header {
    width: 100%;
    height: 80px;
    background: rgba(0, 0, 0, .9);
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 1000;
}
header ul {
    display: flex;
    justify-content: center;
    align-items: center;
}
header li {
    line-height: 60px;
    font-size: 1.8rem;
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
    transform: rotate(0.05deg);
}
header li + li {
    border-left: 1px dotted #333;
}
header a {
    display: block;
    padding: 10px 10px;
    color: #fff;
    text-decoration: none;
}
header .logo {
    position: absolute;
    top: -10px;
    left: 0px;
    width: 250px;
}
header h1 {
    padding-top: 30px;
    font-size: 0.8rem;
}
header .tel {
    position: absolute;
    width: 260px;
    top: -15px;
    right: 0px;
}
/*===============================
フッター
================================*/
footer {
    width: 100%;
    background: #ccc;
    font-weight: bold;
    text-align: center;
}
footer a {
    display: block;
    padding: 20px;
    color: #000;
    font-size: 1.8rem;
    text-decoration: none;
}
@media screen and (max-width: 599px) {
    footer {
        height: 165px;
    }
    footer a {
        padding-top: 15px;
        font-size: 1.5rem;
    }
}
/*===============================

ナビ

================================*/
.hamburger {
    display: block;
    position: fixed;
    z-index: 5;
    right: 0;
    left: 0;
    bottom: 20px;
    width: 42px;
    height: 42px;
    margin: auto;
    cursor: pointer;
    text-align: center;
}
.hamburger span {
    display: block;
    position: absolute;
    width: 30px;
    height: 2px;
    left: 6px;
    background: #ef017c;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
    top: 10px;
}
.hamburger span:nth-child(2) {
    top: 20px;
}
.hamburger span:nth-child(3) {
    top: 30px;
}
/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
    top: 16px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.hamburger.active span:nth-child(2), .hamburger.active span:nth-child(3) {
    top: 16px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
.nav_footer {
    position: fixed;
    width: 100%;
    z-index: 3;
    bottom: 0;
    left: 0;
}
.nav_footer ul {
    display: flex;
    height: 60px;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(34, 34, 34, 1) 100%);
}
.nav_footer li {
    width: calc(100% / 5);
}
.nav_footer a {
    display: block;
    color: #fff;
    font-size: 1.1rem;
    text-decoration: none;
    text-align: center;
}
.nav_footer i {
    display: block;
    padding: 9px 0 5px 0;
    font-size: 2.5rem;
    font-weight: 900;
}
nav.globalMenuSp {
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.9);
    text-align: center;
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
    height: 100vh;
}
nav.globalMenuSp ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
nav.globalMenuSp ul li {
    list-style-type: none;
    width: calc(100% / 2);
    border-bottom: 1px dotted #333;
    color: #fff;
}
nav.globalMenuSp ul li:hover {
    background: #444;
}
nav.globalMenuSp ul li a {
    display: block;
    padding: 15px 0;
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none;
}
nav.globalMenuSp ul li span {
    display: block;
    padding-top: 5px;
    color: #aaa;
    font-size: 1.2rem;
}
nav.globalMenuSp.active {
    transform: translateY(0%);
}
.nav_menu {
    position: fixed;
    width: 70px;
    height: 70px;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(51, 51, 51, 1) 100%);
    z-index: 4;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 5px 5px 0 0;
}
.nav_menu p {
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    text-align: center
}
.nav_open {
    width: 90%;
    margin: auto;
    color: #fff;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    text-align: center
}
.nav_open a {
    display: block;
    padding-top: 5px;
    color: #ef017c;
    font-size: 3rem;
    text-decoration: none;
}
.nav_logo {
    width: 50%;
    margin: auto;
    padding: 10px 0;
}
.nav_side {
    position: fixed;
    width: 120px;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    z-index: 10
}
.nav_side img {
    width: 120px;
}
@media screen and (max-width: 768px) {
    .nav_side {
        display: none;
    }
    .nav_side img {
        width: 60px;
    }
}
.nav_reservation {
    position: fixed;
    width: 150px;
    height: 80px;
    top: 0;
    right: 0;
    background: rgb(239, 1, 124);
    background: linear-gradient(300deg, rgba(239, 1, 124, 1) 0%, rgba(255, 45, 154, 1) 100%);
}
.nav_reservation dl {
    display: flex;
    margin: 0;
    padding: 0;
}
.nav_reservation dt {
    margin: 0;
    padding: 0;
}
.nav_reservation .text {
    display: block;
    margin-left: -15px;
    font-size: 1.8rem;
}
.nav_reservation a {
    display: block;
    padding-top: 18px;
    color: #fff;
    font-size: 2.2rem;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0px 1px 1px #000;
    line-height: 1.2
}
.nav_reservation span {
    display: block;
    padding-top: 5px;
    color: #ff0;
    font-size: 1.5rem;
}
.nav_reservation i {
    display: block;
    padding: 0 0 0 0px;
    font-size: 40px;
    color: #000;
}
.nav_girl {
    position: fixed;
    width: 200px;
    height: 80px;
    bottom: 0;
    right: 0;
    background: rgb(239, 1, 124);
    background: linear-gradient(300deg, rgba(239, 1, 124, 1) 0%, rgba(255, 45, 154, 1) 100%);
    text-align: center;
}
.nav_girl a {
    display: block;
    padding-top: 18px;
    color: #fff;
    font-size: 2.2rem;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0px 1px 1px #000;
}
.nav_girl span {
    display: block;
    padding-top: 5px;
    color: #ff0;
    font-size: 1.5rem;
}
.nav_men {
    position: fixed;
    width: 200px;
    height: 80px;
    bottom: 0;
    left: 0;
    background: rgb(16, 110, 255);
    background: linear-gradient(300deg, rgba(16, 110, 255, 1) 0%, rgba(3, 144, 255, 1) 100%);
    text-align: center;
}
.nav_men a {
    display: block;
    padding-top: 18px;
    color: #fff;
    font-size: 2.2rem;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0px 1px 1px #000;
}
.nav_men span {
    display: block;
    padding-top: 5px;
    color: #ff0;
    font-size: 1.5rem;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .nav_girl {
        position: static;
        width: 95%;
        margin: auto;
        margin-top: 10px;
        border-radius: 10px;
        bottom: 100px;
    }
    .nav_girl a {
        padding: 15px 0;
        font-size: 2.5rem;
        font-weight: bold;
    }
    .nav_girl span {
        font-size: 1.8rem;
    }
    .nav_men {
        position: static;
        width: 95%;
        margin: auto;
        margin-top: 10px;
        border-radius: 10px;
    }
    .nav_men a {
        padding: 15px 0;
        font-size: 2.5rem;
    }
    .nav_men span {
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 599px) {
    .nav_girl {
        position: static;
        width: 95%;
        margin: auto;
        margin-top: 10px;
        border-radius: 10px;
    }
    .nav_girl a {
        padding: 15px 0;
        font-size: 2.5rem;
        font-weight: bold;
    }
    .nav_girl span {
        font-size: 1.8rem;
    }
    .nav_men {
        position: static;
        width: 95%;
        margin: auto;
        margin-top: 10px;
        border-radius: 10px;
    }
    .nav_men a {
        padding: 15px 0;
        font-size: 2.5rem;
    }
    .nav_men span {
        font-size: 1.8rem;
    }
}
/*===============================

タイトル

================================*/
.ttl_frame {
    width: 536px;
    margin: auto;
    padding: 10px 0;
    color: #000;
    font-size: 2.5rem;
    font-weight: bold;
}
.ttl_frame h3 {
    margin: 10px 0
}
.ttl .inner {
    padding: 15px 5px;
    text-align: center;
    border: 3px solid;
    border-top: none;
    width: 520px;
}
.ttl .inner h2 {
    -ms-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    overflow: hidden;
    margin: -15px -8px 0 -8px;
    position: absolute;
    width: 536px;
    font-size: 2rem;
    text-transform: uppercase;
}
.ttl .inner h2:before, .ttl .inner h2:after {
    content: "";
    position: absolute;
    width: 100%;
    margin-top: -2px;
    border-top: 3px solid;
    top: 50%;
}
.ttl .inner h2:before {
    -ms-transform: translate(-100%, 0);
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0);
    margin-left: -15px;
}
.ttl .inner h2:after {
    margin-left: 15px;
}
@media screen and (max-width: 599px) {
    .ttl_frame {
        width: 336px;
        font-size: 2rem;
    }
    .ttl .inner {
        padding: 5px;
        width: 320px;
    }
    .ttl .inner h2 {
        margin: -5px -8px 0 -8px;
        position: absolute;
        width: 336px;
        font-size: 1.5rem;
    }
}
/*===============================

パンくずリスト

================================*/
.breadcrumb {
    background: #eee;
    margin-top: 80px;
    padding: 12px 0;
}
.breadcrumb ol {
    width: 75%;
    margin: auto;
    font-size: 1.2rem;
}
.breadcrumb ol li {
    display: inline;
    list-style-type: none;
}
.breadcrumb ol li:after {
    content: " > ";
}
.breadcrumb ol li:last-child:after {
    content: "";
}
.breadcrumb li a {
    color: #000;
    text-decoration: none;
}
.breadcrumb span {
    color: #000;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .breadcrumb {
        margin-top: 0;
    }
}
@media screen and (max-width: 599px) {
    .breadcrumb {
        margin-top: 0;
    }
    .breadcrumb ol {
        width: 95%;
        font-size: 1.1rem;
    }
}
/*===============================

在籍キャスト

================================*/
.girls {
    width: 100%;
    padding: 100px 0;
}
.girls ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    margin: auto;
    padding-top: 50px;
}
.girls .filter {
    width: 75%;
    margin: auto;
}
.girls li {
    width: calc(100% / 5);
    min-height: 680px;
}
.girls dl {
    display: flex;
    flex-wrap: wrap;
    width: 50%;
    margin: auto;
    padding-top: 60px
}
.girls dt {
    width: calc(100% / 7);
    text-align: center
}
.girls a {
    color: #000;
    text-decoration: none;
}
.girls figure {
    margin: 10px;
    box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.2);
    text-align: center;
}
.girls .image {
    position: relative;
}
.girls .image .new {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 50px;
}
.girls .image .soku {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 12px 0;
    color: #fff;
    font-weight: bold;
    background: rgba(0, 0, 0, .7);
    font-size: 2rem;
}
.girls .image .soku span {
    color: #ff2d9a;
    font-size: 2.2rem;
}
.girls .image .soku_no {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 12px 0;
    color: #fff;
    font-weight: bold;
    background: rgba(153, 153, 153, .7);
    font-size: 2rem;
}
.girls .data {
    padding: 10px;
}
.girls .name {
    font-size: 2.5rem;
    font-weight: bold;
}
.girls .size {
    padding: 5px 0;
    font-size: 1.7rem;
}
.girls .time {
    background: #eee;
    padding: 10px 0;
    font-size: 2.2rem;
    font-weight: bold;
}
@media screen and (max-width: 599px) {
    .girls {
        padding: 50px 0;
    }
    .girls ul {
        width: 340px;
        margin: auto;
        padding: 10px 0;
    }
    .girls li {
        width: calc(100% / 2);
        min-height: 400px;
        margin-bottom: 5px;
    }
    .girls dl {
        width: 96%;
        margin: auto;
        padding-top: 20px
    }
    .girls dt {
        width: calc(100% / 4);
        margin-bottom: 6px;
    }
    .girls .filter {
        width: 100%;
    }
    .girls figure {
        margin: 5px;
    }
    .girls .image {
        position: relative;
    }
    .girls .image .new {
        top: 5px;
        right: 5px;
        width: 40px;
    }
    .girls .image .soku {
        width: 100%;
        bottom: 0;
        left: 0;
        padding: 8px 0;
        font-size: 1.6rem;
    }
    .girls .image .soku span {
        font-size: 1.8rem;
    }
    .girls .image .soku_no {
        padding: 8px 0;
        font-size: 1.6rem;
    }
    .girls .data {
        padding: 10px;
    }
    .girls .name {
        font-size: 1.8rem;
        font-weight: bold;
    }
    .girls .size {
        padding: 5px 0;
        font-size: 1.3rem;
    }
    .girls .time {
        background: #eee;
        padding: 6px 0;
        font-size: 1.8rem;
        font-weight: bold;
    }
}
/*===============================

本日の出勤情報

================================*/
.today {
    width: 100%;
    padding: 100px 0;
}
.today ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding-top: 50px;
}
.today li {
    width: calc(100% / 5);
}
.today dl {
    display: flex;
    flex-wrap: wrap;
    width: 50%;
    margin: auto;
    padding-top: 60px
}
.today dt {
    width: calc(100% / 7);
    text-align: center
}
.today a {
    color: #000;
    text-decoration: none;
}
.today figure {
    margin: 10px;
    box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.2);
    text-align: center;
}
.today .image {
    position: relative;
}
.today .image .new {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 50px;
}
.today .image .soku {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 12px 0;
    color: #fff;
    font-weight: bold;
    background: rgba(0, 0, 0, .7);
    font-size: 2rem;
}
.today .image .soku span {
    color: #ff2d9a;
    font-size: 2.2rem;
}
.today .image .soku_no {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 12px 0;
    color: #fff;
    font-weight: bold;
    background: rgba(153, 153, 153, .7);
    font-size: 2rem;
}
.today .data {
    padding: 10px;
}
.today .name {
    font-size: 2.5rem;
    font-weight: bold;
}
.today .size {
    padding: 5px 0;
    font-size: 1.7rem;
}
.today .time {
    background: #eee;
    padding: 10px 0;
    font-size: 2.2rem;
    font-weight: bold;
}
@media screen and (min-width:600px) and (max-width:1180px) {
    .today {
        padding: 50px 0;
    }
    .today ul {
        width: auto;
        padding: 10px 5px;
    }
    .today li {
        width: calc(100% / 3);
        margin-bottom: 5px;
    }
}
@media screen and (max-width: 599px) {
    .today {
        padding: 50px 0;
    }
    .today ul {
        width: auto;
        padding: 10px 5px;
    }
    .today li {
        width: calc(100% / 2);
        margin-bottom: 5px;
    }
    .today dl {
        width: 96%;
        margin: auto;
        padding-top: 20px
    }
    .today dt {
        width: calc(100% / 4);
        margin-bottom: 6px;
    }
    .today figure {
        margin: 5px;
    }
    .today .image {
        position: relative;
    }
    .today .image .new {
        top: 5px;
        right: 5px;
        width: 40px;
    }
    .today .image .soku {
        width: 100%;
        bottom: 0;
        left: 0;
        padding: 8px 0;
        font-size: 1.6rem;
    }
    .today .image .soku span {
        font-size: 1.8rem;
    }
    .today .image .soku_no {
        padding: 8px 0;
        font-size: 1.6rem;
    }
    .today .data {
        padding: 10px;
    }
    .today .name {
        font-size: 1.8rem;
        font-weight: bold;
    }
    .today .size {
        padding: 5px 0;
        font-size: 1.3rem;
    }
    .today .time {
        background: #eee;
        padding: 6px 0;
        font-size: 1.8rem;
        font-weight: bold;
    }
}
/*===============================

週間出勤情報

================================*/
.week {
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    margin: auto;
    padding: 50px 0px
}
.week .days {
    width: calc(100% / 7);
}
a.day-btn {
    display: block;
    position: relative;
    width: 160px;
    margin: 2px;
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    color: #fff;
    font-size: 2rem;
    font-weight: bold;
    border: 1px solid #000;
    background: #000;
    overflow: hidden;
    z-index: 1 !important;
}
a.day-btn:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    height: 0;
    width: 100%;
    background: #fff;
    opacity: 0;
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
    transition: 0.3s;
    z-index: -1;
}
a.day-btn:hover {
    color: #000;
}
a.day-btn:hover:after {
    height: 300%;
    opacity: 1;
}
a.day-btn:active:after {
    height: 350%;
    opacity: 1;
}
@media screen and (max-width: 599px) {
    .week {
        width: 95%;
        padding: 20px 0 0 0;
    }
    .week .days {
        width: calc(100% / 3);
        margin-bottom: 5px;
    }
    a.day-btn {
        width: 95%;
        margin: auto;
        padding: 10px 0;
        font-size: 1.7rem;
    }
}
/*===============================

並び替え

================================*/
.filter {
    width: 75%;
    margin: auto;
    padding-top: 50px;
}
.filter_btn .all_on {
    display: inline-block;
    width: 95%;
    padding: 1em 0;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    background-image: linear-gradient(#e4007f 0%, #db3981 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #af1057;
}
.filter_btn .all_on:active {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}
.filter_btn .all_on a {
    color: #fff;
}
.filter_btn .type_on {
    display: inline-block;
    width: 95%;
    padding: 1em 0;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    background-image: linear-gradient(#e4007f 0%, #db3981 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #af1057;
}
.filter_btn .type_on:active {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}
.filter_btn .type_on a {
    color: #fff;
}
.filter_btn div {
    display: inline-block;
    width: 95%;
    padding: 1em 0;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    background-image: linear-gradient(#444 0%, #888 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #222;
}
.filter_btn div:active {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}
.filter_btn div a {
    color: #fff;
}
@media screen and (max-width: 599px) {
    .filter {
        width: 96%;
        padding-top: 20px;
    }
}
/*===============================

新人紹介

================================*/
.newface {
    width: 100%;
    padding: 100px 0;
}
.newface figure {
    margin: 50px 10px 30px 10px;
    box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.2);
    text-align: center;
}
.newface a {
    display: block;
    color: #000;
    text-decoration: none;
}
.newface span {
    display: block;
    padding: 15px 0 10px;
    color: #ef017c;
    font-size: 2.5rem;
    font-weight: bold;
    text-align: center;
}
.newface .name {
    padding: 12px 0 6px;
    font-size: 2.8rem;
    font-weight: bold;
}
.newface .size {
    padding-bottom: 15px;
    font-size: 1.8rem;
}
.newface .time {
    background: #eee;
    padding: 10px 0;
    font-size: 2.2rem;
    font-weight: bold;
}
@media screen and (max-width: 599px) {
    .newface {
        padding: 50px 0;
    }
    .newface ul {
        padding: 0 5px
    }
    .newface figure {
        margin: 5px 5px 20px 5px;
    }
    .newface span {
        display: block;
        padding: 5px 0 10px;
        font-size: 1.8rem;
    }
    .newface .name {
        padding: 8px 0 4px;
        font-size: 1.8rem;
        font-weight: bold;
    }
    .newface .size {
        padding-bottom: 5px;
        font-size: 1.3rem;
    }
    .newface .time {
        padding: 8px 0;
        font-size: 1.6rem;
    }
}
/*===============================

新着情報

================================*/
.news {
    width: 100%;
    padding: 100px 0;
}
.news ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding-top: 50px;
}
.news li {
    display: table;
    width: calc(100% / 2);
    margin-bottom: 15px;
}
.news a {
    display: block;
    margin: 20px;
    color: #000;
    text-decoration: none;
}
.news-img, .news-data {
    display: table-cell;
    vertical-align: top;
}
.news-img img {
    width: 150px;
}
.news .title {
    padding: 0 10px;
    color: #ef017c;
    font-size: 2rem;
    font-weight: bold;
}
.news .day {
    padding: 5px 10px;
    color: #999;
    font-size: 1.4rem;
    text-align: right;
}
.news .text {
    overflow-y: auto;
    height: 180px;
    padding: 0 10px;
    font-size: 1.6rem;
    line-height: 2
}
.news .text_sub {
    padding: 0 10px;
    font-size: 1.6rem;
    line-height: 2
}
.news .click {
    width: 250px;
    margin: auto;
    padding-top: 20px;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .news ul {
        width: 95%;
        padding-top: 20px;
    }
    .news li {
        width: calc(100% / 1);
        border-bottom: 1px dotted #ccc;
        margin-bottom: 5px;
        padding-bottom: 5px;
    }
    .news-data {
        width: 100%;
    }
    .news .title {
        padding: 10px;
        color: #ef017c;
        font-size: 1.8rem;
        font-weight: bold;
    }
    .news .text {
        height: 160px;
        font-size: 1.3rem;
        line-height: 1.55
    }
}
@media screen and (max-width: 599px) {
    .news {
        padding: 50px 0;
    }
    .news ul {
        width: 100%;
        padding-top: 20px;
    }
    .news li {
        width: calc(100% / 1);
        border-bottom: 1px dotted #ccc;
        margin-bottom: 5px;
        padding-bottom: 5px;
    }
    .news a {
        color: #000;
        margin: 0;
        text-decoration: none;
    }
    .news-img, .news-data {
        display: table-cell;
        vertical-align: top;
    }
    .news-img img {
        width: 100px;
    }
    .news .title {
        padding: 10px;
        color: #ef017c;
        font-size: 1.6rem;
        font-weight: bold;
    }
    .news .day {
        padding: 5px 10px;
        color: #999;
        font-size: 1.2rem;
        text-align: right;
    }
    .news .text {
        height: 75px;
        padding: 0 10px;
        font-size: 1.3rem;
        line-height: 1.5
    }
    .news .text_sub {
        padding: 0 10px 10px 10px;
        font-size: 1.3rem;
        line-height: 1.8
    }
    .news .click {
        width: 250px;
        margin: auto;
        padding-top: 20px;
    }
}
.click {
    width: 250px;
    margin: auto;
    padding-top: 20px;
}
.button {
    position: relative;
    width: 250px;
    height: 50px;
    line-height: 50px;
    background: #000;
    color: #fff;
    font-size: 1.6rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
}
.button::after {
    content: ">";
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}
.button a {
    display: block;
    color: #fff;
    text-decoration: none;
}
/*===============================

即ご案内

================================*/
.immediate {
    padding: 100px 0;
    background: url("../img/bg.png");
    background-size: 10% auto;
}
.immediate ul {
    width: 75%;
    margin: auto;
    padding-top: 50px;
    overflow-x: auto;
    white-space: nowrap;
    overflow-scrolling: touch;
    -webkit-overflow-scrolling: touch;
}
.immediate li {
    display: inline-block;
}
.immediate figure {
    width: 250px;
    margin: 10px;
}
.immediate .data {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
    background: #000;
    color: #fff;
    border-radius: 5px;
    text-align: center;
}
.immediate .data:before {
    content: "";
    position: absolute;
    top: -20px;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-bottom: 10px solid #000;
}
.immediate .guide {
    padding: 10px;
    color: #ef017c;
    font-size: 2.2rem;
    font-weight: bold;
}
.immediate .name {
    padding: 0 10px;
    font-size: 1.8rem;
    font-weight: bold;
}
.immediate .size {
    padding: 5px 10px 10px 10px;
    font-size: 1.8rem;
}
@media screen and (min-width:600px) and (max-width:1180px) {
    .immediate ul {
        width: 95%;
    }
}
@media screen and (max-width: 599px) {
    .immediate {
        padding: 50px 0;
        background-size: 50% auto;
    }
    .immediate ul {
        width: 100%;
        padding-top: 10px;
    }
    .immediate li {
        display: inline-block;
    }
    .immediate figure {
        width: 120px;
        margin: 0;
        margin-rght: 5px;
    }
    .immediate .data {
        border-radius: 3px;
        text-align: left;
    }
    .immediate .data:before {
        left: 20%;
    }
    .immediate .guide {
        padding: 5px;
        font-size: 1.4rem;
    }
    .immediate .name {
        padding: 0 5px;
        font-size: 1.4rem;
    }
    .immediate .size {
        padding: 2px 5px 5px 5px;
        font-size: 1.2rem;
    }
}
/*===============================

写メ日記

================================*/
.diary_top {
    padding: 100px 0;
    background: url("../img/diary-bg.jpg");
    background-size: 100% auto;
}
.diary_top ul {
    max-width: 920px;
	margin: auto;
    display: flex;
    flex-wrap: wrap;
	gap: 10px;
}
.diary_top li {
    width: calc((100% - 20px) / 3);
    margin-top: 5px;
}
@media screen and (max-width: 768px) {
    .diary_top {
        padding: 15px 0 10px 0;
        background-size: 50% auto;
    }
    .diary_top ul {
        padding: 0 10px;
    }
    .diary_top li {
        width: calc(100% / 1);
        margin-top: 10px;
    }
}
@media screen and (max-width: 599px) {
    .diary_top {
        padding: 15px 0 50px 0;
        background-size: 50% auto;
    }
    .diary_top ul {
        width: 95%;
        margin: auto
    }
    .diary_top li {
        width: calc(100% / 1);
        margin-top: 5px;
    }
}
/*===============================
料金システム
================================*/
.system {
    padding: 100px 0;
    background: url("../img/system_bg.jpg");
    background-size: cover;
}
.system h4 {
    position: relative;
    display: inline-block;
    width: 270px;
    margin: auto;
    margin-top: -40px;
    margin-bottom: -20px;
    padding: 35px;
    font-size: 3rem;
    font-weight: 600;
    text-align: center;
}
.system h4:before, .system h4:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 2px;
    background-color: black;
}
.system h4:before {
    left: 0;
}
.system h4:after {
    right: 0;
}
.system .title {
    width: 340px;
    margin: auto;
    padding-top: 45px;
}
.price {
    display: flex;
    width: 900px;
    margin: auto;
    margin-top: 40px;
    border: 1px #888 solid;
    font-size: 4rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center;
}
.price span {
    font-size: 3rem;
}
.price .time {
    width: 50%;
    background: rgba(136, 136, 136, 0.8);
}
.price .time p {
    padding: 20px;
    color: #fff;
}
.price .yen {
    width: 50%;
    background: rgba(255, 255, 255, 0.8);
}
.price .yen p {
    padding: 20px;
}
.price_long {
    background: #e79297;
    max-width: 1000px;
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.price_long-inner {
    padding: 30px;
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.8
}
.price_long span {
    display: block;
    color: black;
    font-size: 2.2rem
}
@media screen and (max-width: 599px) {
    .price_long-inner {
        padding: 20px 15px 30px 15px;
    }
.price_long span {
    font-size: 1.9rem
}
}
.shimei {
    padding: 20px;
    font-size: 2rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center;
    line-height: 2;
}
.shadow-w {
    text-shadow:
        #fff 2px 0px 2px, #fff -2px 0px 2px, #fff 0px -2px 2px, #fff -2px 0px 2px, #fff 2px 2px 2px, #fff -2px 2px 2px, #fff 2px -2px 2px, #fff -2px -2px 2px, #fff 1px 2px 2px, #fff -1px 2px 2px, #fff 1px -2px 2px, #fff -1px -2px 2px, #fff 2px 1px 2px, #fff -2px 1px 2px, #fff 2px -1px 2px, #fff -2px -1px 2px, #fff 1px 1px 2px, #fff -1px 1px 2px, #fff 1px -1px 2px, #fff -1px -1px 2px;
}
.credit {
    padding-top: 25px;
    font-weight: bold;
    text-align: center
}
.credit img {
    width: 404px;
    margin: auto;
}
@media screen and (max-width: 599px) {
    .system {
        padding: 50px 0 30px;
        background-size: cover;
        background: url("../img/system_bg-sp.jpg") top center;
    }
    .system h4 {
        width: 200px;
        font-size: 2.5rem;
    }
    .system .title {
        width: 270px;
        margin: auto;
        padding-top: 25px;
    }
    .price {
        width: 95%;
        margin-top: 10px;
        font-size: 3rem;
    }
    .price span {
        font-size: 2rem;
    }
    .price .time p {
        padding: 10px;
        color: #fff;
    }
    .price .yen p {
        padding: 10px;
    }
    .price_long {
        width: 95%;
        margin-top: 10px;
    }
    .price_long p {
        padding: 15px 10px;
        color: #fff;
        font-size: 1.4rem;
        font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
        transform: rotate(.03deg);
        text-align: center;
        line-height: 1.4
    }
    .credit img {
        width: 75%;
    }
}
.shimei {
    padding: 10px;
    font-size: 1.5rem;
    line-height: 1.6;
}
/*===============================
メンバーズカード
================================*/
.member {
    padding: 80px 0 120px;
    background: #f5f5f5
}
.member h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.member h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.member h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.member h4 {
    position: relative;
    display: inline-block;
    width: 270px;
    margin: auto;
    margin-top: -40px;
    margin-bottom: -20px;
    padding: 35px;
    font-size: 2rem;
    font-weight: 600;
    text-align: center;
}
.member h4:before, .member h4:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 2px;
    background-color: black;
}
.member h4:before {
    left: 0;
}
.member h4:after {
    right: 0;
}
.member .title {
    width: 340px;
    margin: auto;
    padding-top: 25px;
}
.member .text {
    padding: 30px;
    text-align: center;
    line-height: 2
}
.member .text strong {
    display: block;
    color: #ef017c;
    font-size: 1.2rem;
    font-weight: bold
}
.member_privilege {
    width: 780px;
    height: 60px;
    line-height: 60px;
    margin: auto;
    margin-top: 30px;
    background: #ef017c;
    color: #fff;
    font-size: 2rem;
    -webkit-border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    -moz-border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    text-align: center
}
.member_privilege span {
    color: #ff0;
    font-size: 3rem;
    font-weight: bold;
}
.member_privilege2 {
    width: 900px;
    margin: auto;
    margin-top: 30px;
    padding: 15px 0 25px;
    background: #ef017c;
    color: #fff;
    font-size: 2rem;
    -webkit-border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    -moz-border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    border-radius: 0px 40px 0px 40px / 0px 40px 0px 40px;
    text-align: center;
    line-height: 1.5
}
.member_privilege2 span {
    color: #ff0;
    font-size: 3rem;
    font-weight: bold;
}
@media screen and (max-width:479px) {
    .member {
        padding: 30px 0 60px;
    }
    .member h2 {
        font-size: 2.6rem;
    }
    .member h2 span {
        font-size: 1.5rem;
    }
    .member .text {
        padding: 15px 10px;
        line-height: 1.5
    }
    .member_privilege {
        width: 95%;
        height: auto;
        line-height: 1.3;
        margin-top: 20px;
        padding: 10px 0;
        font-size: 1.5rem;
    }
    .member_privilege span {
        font-size: 2.5rem;
    }
    .member_privilege2 {
        width: 95%;
        margin: auto;
        margin-top: 20px;
        padding: 15px 0 15px;
        font-size: 1.5rem;
        line-height: 1.5
    }
    .member_privilege2 span {
        font-size: 2.5rem;
    }
}
/*===============================
ご予約
================================*/
.reservation {
    padding: 60px 0px 100px;
    background: #fff
}
.reservation h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.reservation h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.reservation h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.reservation .text {
    padding: 30px;
    text-align: center;
    line-height: 2
}
.reservation .text span{
	display: block;
	color: red;
	font-weight: bold;
	font-size: 2rem
}

.reservation .frame {
    width: 1000px;
    margin: auto;
	margin-top: 40px;
	margin-bottom: 50px;
    border: 4px #eee solid;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center;
	line-height: 1.5
}
.reservation .frame a {
    color: #000;
    text-decoration: none
}
.reservation .frame p {
    padding: 50px;
    font-size: 4rem;
}
.reservation .frame span {
    font-size: 2rem;
}
.reservation_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 25px;
    border-radius: 2px;
    width: 320px;
    height: 60px;
    margin: auto;
    margin-top: 25px;
    font-weight: bold;
    border-bottom: 4px solid #c30065;
    transition: 0.3s;
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4);
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.8);
    background-color: #ef017c;
}
.reservation_btn:hover {
    box-shadow: 0 0 rgba(0, 0, 0, 0.4);
    border-bottom-width: 2px;
    transform: translateY(2px);
}
@media screen and (max-width:479px) {
    .reservation {
        padding: 30px 0 60px;
    }
    .reservation h2 {
        font-size: 2.6rem;
    }
    .reservation h2 span {
        font-size: 1.5rem;
    }
    .reservation .text {
        padding: 15px 10px;
        font-size: 1.3rem;
        text-align: center;
        line-height: 1.6
    }
    .reservation .frame {
        width: 93%;
        margin: auto;
	margin-top: 30px;
	margin-bottom: 20px;
        line-height: 1.2;
    }
    .reservation .frame a {
        color: #000;
        text-decoration: none
    }
    .reservation .frame p {
        padding: 15px 10px 20px 10px;
        font-size: 3rem;
    }
    .reservation .frame span {
        font-size: 1.5rem;
    }
}
/*===============================

チケット

================================*/
.ticekt {
    padding: 80px 0 120px;
    background: #f2efea;
}
.ticekt ul {
    display: flex;
    flex-wrap: wrap;
    width: 77%;
    margin: auto;
    padding-top: 15px;
}
.ticekt li {
    display: table;
    width: calc(100% / 2);
    margin: auto;
}
.ticekt img {
    width: 95%;
    margin: auto;
}
.ticekt h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.ticekt h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.ticekt h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.ticekt .text {
    padding: 10px 0;
    text-align: center;
    line-height: 1.8
}
.ticekt .text .card{
	display: block;
    width: 404px;
	margin: auto;
	padding: 25px 0
}
.ticekt .text strong {
    display: block;
    font-size: 2.2rem;
    line-height: 1.3
}
.ticekt .text span {
    color: #ef017c;
    font-size: 3rem;
}
.googlemybusiness {
    width: 915px;
    margin: auto;
    padding-top: 50px;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .ticekt {
        padding: 50px 0 75px;
    }
    .ticekt ul {
        width: 95%;
        margin: auto;
    }
}
@media screen and (max-width: 599px) {
    .ticekt {
        padding: 15px 0 0;
    }
    .ticekt ul {
        width: 100%;
        margin: auto;
    }
    .ticekt li {
        width: calc(100% / 1);
        margin-top: 10px;
    }
    .ticekt img {
        width: 100%;
    }
    .ticekt h2 {
        font-size: 2.6rem;
    }
    .ticekt h2 span {
        font-size: 1.5rem;
    }
    .ticekt .text {
        font-size: 1.3rem;
    }
    .ticekt .text strong {
        font-size: 1.8rem;
    }
    .ticekt .text span {
        font-size: 2.2rem;
    }
    .googlemybusiness {
        width: 100%;
        padding: 10px 0 40px;
    }
}
/*===============================

アクセス

================================*/
.access {
    margin-bottom: -5px;
    padding: 100px 0;
    background: #f2efea;
}
.access h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.access h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.access h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.access iframe {
    display: block;
    width: 75%;
    height: 500px;
    margin: auto;
}
.access .text {
    padding: 20px;
    text-align: center;
    line-height: 1.8
}
.access .text strong {
    font-size: 2rem;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .access {
        padding: 50px 0;
    }
    .access iframe {
        display: block;
        width: 95%;
        height: 350px;
        margin-top: 10px;
    }
}
@media screen and (max-width: 599px) {
    .access {
        margin-bottom: -5px;
        padding: 15px;
        background: #f2efea;
    }
    .access h2 {
        font-size: 2.6rem;
    }
    .access h2 span {
        font-size: 1.5rem;
    }
    .access .text {
        padding: 0;
        font-size: 1.3rem;
    }
    .access .text strong {
        font-size: 1.6rem;
    }
    .access iframe {
        display: block;
        width: 100%;
        height: 350px;
        margin-top: 10px;
    }
}
/*===============================

注意事項

================================*/
.notes {
    margin-bottom: -5px;
    padding: 100px 0;
    background: #fdf3e6;
    line-height: 2;
    text-align: center
}
.notes h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.notes h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.notes h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.notes strong {
    display: block;
    color: #ef017c;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
}
@media screen and (max-width: 599px) {
    .notes {
        padding: 15px 15px 50px;
        font-size: 1.4rem;
        line-height: 1.5;
        text-align: left;
    }
    .notes h2 {
        font-size: 2.6rem;
    }
    .notes h2 span {
        font-size: 1.5rem;
    }
    .notes strong {
        font-size: 1.6rem;
    }
}
/*===============================

ウィジェット

================================*/
.widget {
    width: 780px;
	margin: auto;
	padding: 50px 0;
}

.widget ul {
    display: flex;
    flex-wrap: wrap;
	gap: 10px;
}
.widget li {
    width: calc((100% - 20px) / 3);
    margin-top: 5px;
}

@media screen and (min-width:600px) and (max-width:1024px) {
    .widget ul {
        padding: 0 10px
    }
    .widget li {
        width: calc(100% / 1);
        margin-tbottom: 10px;
    }
}
@media screen and (max-width: 599px) {
    .widget {
        width: auto;
		padding:10px;
    }
    .widget li {
        width: calc(100% / 1);
        margin-top: 5px;
    }
}
/*===============================
プロフィール
================================*/
.profile {
    padding: 60px 0px;
    background: #fff
}
.profile h2 {
    font-size: 1.5rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center
}
.profile h3 {
    margin-bottom: 10px;
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center
}
.profile ul {
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    margin: auto;
    padding: 50px 0px
}
.profile li {
    width: calc(100% / 2);
}
.profile .left {
    width: 700px;
}
.profile .name {
    color: #ef017c;
    font-size: 4rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
}
.profile .name span {
    font-size: 2.3rem;
}
.profile .size {
    padding: 15px 0px 20px 5px;
    font-size: 2.5rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    font-weight: bold;
}
.profile .right {
    width: 480px;
    padding-left: 20px;
}
.profile .profile_qa {
    display: flex;
    flex-wrap: wrap;
    width: 670px;
    margin: auto
}
.profile .profile_qa .qa_q {
    width: 220px;
    background: #888
}
.profile .profile_qa .qa_q p {
    padding: 15px 10px;
    color: #fff;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center
}
.profile .profile_qa .qa_a {
    width: 450px;
}
.profile .profile_qa .qa_a p {
    padding: 15px 10px;
    font-size: 1.5rem;
    font-weight: bold;
}
.profile .profile_qa .qa_line {
    width: 100%;
    margin: 3px 0px 2px 0px;
    height: 1px;
    border: none;
    border-top: 1px #ccc dotted;
}
.profile_sub {
    padding: 60px 0px;
    background: url("../img/bg.png");
    background-size: 10% auto;
}
.profile_sub ul {
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    margin: auto;
    padding: 50px 0px
}
.profile_sub li {
    width: calc(100% / 2);
}
.profile_sub li.photo_diary {
    width: 400px;
    margin-right: 20px
}
.profile_sub li.comment {
    width: 760px;
    padding-left: 20px;
}
.profile_sub li.comment p {
    padding: 10px 0 20px;
    font-size: 1.5rem;
    line-height: 2
}
.profile_sub h3 {
    padding: 0 0.5em;
    font-size: 2.5rem;
    color: #000;
    background: transparent;
    border-left: solid 5px #e4007f;
    line-height: 1.1
}
.profile_sub h3 span {
    font-size: 2.0rem;
    font-family: 'Parisienne', cursive;
    font-weight: 400;
}
.profile_week {
    padding: 60px 0px 100px;
    background: #fff;
}
.profile_week h2 {
    margin-bottom: 10px;
    font-size: 3.6rem;
    position: relative;
    padding: 25px 0 15px 0;
    text-align: center;
}
.profile_week h2 span {
    margin-bottom: 7px;
    font-size: 2rem;
    text-transform: uppercase;
    display: block;
}
.profile_week h2:before {
    position: absolute;
    bottom: 0;
    left: calc(50% - 30px);
    width: 80px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #ef017c;
}
.profile_week ul {
    display: flex;
    flex-wrap: wrap;
    padding-top: 30px;
    text-align: center
}
.profile_week li {
    width: calc(100% / 7);
    height: 150px;
    color: #fff;
    background: -moz-linear-gradient(top left, #111, #000);
    background: -webkit-linear-gradient(top left, #111, #000);
    background: linear-gradient(to bottom right, #111, #000);
}
.profile_week li.todays {
    background: -moz-linear-gradient(top left, #f82e9e, #e4007f);
    background: -webkit-linear-gradient(top left, #f82e9e, #e4007f);
    background: linear-gradient(to bottom right, #f82e9e, #e4007f);
}
.profile_week li p {
    width: 65%;
    margin: auto;
    margin-bottom: 10px;
    padding-top: 35px;
    font-size: 2rem;
    font-weight: 600;
    border-bottom: solid 1px #fff;
    transform: rotate(.03deg);
    line-height: 2.1
}
.profile_week li span {
    font-size: 2.5rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
}
@media screen and (max-width:479px) {
    .profile {
        padding: 0 0 20px;
    }
    .profile ul {
        width: 95%;
        padding: 10px 0px;
    }
    .profile li {
        width: 100%;
    }
    .profile .left {
        width: 100%
    }
    .profile .left img {
        width: 100%
    }
    .profile .name {
        padding-top: 20px;
        font-size: 3.0rem;
        text-align: center
    }
    .profile .name span {
        font-size: 2.3rem;
    }
    .profile .size {
        padding: 5px 0 20px;
        font-size: 1.8rem;
        text-align: center;
    }
    .profile .right {
        width: 100%;
        padding-left: 0px;
    }
    .profile .profile_qa {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        font-weight: bold;
    }
    .profile .profile_qa .qa_q {
        width: 40%;
        background: #888
    }
    .profile .profile_qa .qa_q p {
        padding: 10px;
        color: #fff;
        font-size: 1.3rem;
        text-align: center
    }
    .profile .profile_qa .qa_a {
        width: 60%;
    }
    .profile .profile_qa .qa_a p {
        padding: 10px;
        font-size: 1.4rem
    }
    .profile .profile_qa .qa_line {
        width: 100%;
        margin: 3px 0px 2px 0px;
        height: 1px;
        border: none;
        border-top: 1px #ccc dotted;
    }
    .profile_sub {
        padding: 30px 10px 0 10px;
    }
    .profile_sub ul {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin: auto;
        padding: 0px 0px
    }
    .profile_sub li {
        width: calc(100% / 1);
    }
    .profile_sub li.photo-diary {
        width: 100%;
        margin: auto
    }
    .profile_sub li.comment {
        width: 100%;
        padding-left: 0px;
    }
    .profile_sub li.comment p {
        padding-top: 10px;
        font-size: 1.4rem;
        line-height: 1.6
    }
    .profile_sub h3 {
        margin-top: 10px;
        padding: 0.1em 0.5em;
        font-size: 1.7rem;
        line-height: 1.1
    }
    .profile_sub h3 span {
        font-size: 1.5rem;
    }
    .profile_sub .photo_diary iframe {
        width: 100%;
    }
    .profile_week {
        padding: 15px 0 30px;
        background: #fff;
    }
    .profile_week h2 {
        font-size: 2.6rem;
    }
    .profile_week h2 span {
        font-size: 1.5rem;
    }
    .profile_week ul {
        overflow: hidden;
        height: 160px;
    }
    .profile_week li {
        width: calc(100% / 3);
        height: 80px;
    }
    .profile_week li p {
        padding-top: 10px;
        font-size: 1.4rem;
    }
    .profile_week li span {
        font-size: 1.5rem;
    }
}
/*===============================
写メ日記
================================*/
.diary {
    width: 100%;
    padding: 100px 0;
}
.diary ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding: 50px 0px
}
.diary li {
    width: calc(100% / 4);
}
.diary li .photo_diary {
    margin: 8px;
}
.photo_diary_iframe {
    width: 75%;
    margin: auto;
    padding: 30px 0 30px
}
@media screen and (max-width:479px) {
    .diary {
        padding: 30px 0 10px 0;
    }
    .diary ul {
        width: 95%;
        padding: 10px 0px
    }
    .diary li {
        width: calc(100% / 2);
    }
    .diary li .photo_diary {
        margin: 3px;
    }
    .photo_diary_iframe {
        width: 95%;
        margin-top: -15px;
        padding: 0 0 40px
    }
}
/*===============================
コスチューム
================================*/
.costume {
    padding: 100px 0 0;
    background: #fff
}
.costume .box {
    padding: 60px 0px 80px 0px;
    text-align: center
}
.costume .box h4 {
    position: relative;
    display: inline-block;
    width: 250px;
    padding: 20px;
    font-size: 2.4rem;
    font-weight: 600
}
.costume .box h4:before, .costume .box h4:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 1px;
    background-color: black;
}
.costume .box h4:before {
    left: 0;
}
.costume .box h4:after {
    right: 0;
}
.costume .box ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding: 30px 0 0;
}
.costume .box li {
    width: calc(100% / 4);
}
.costume .box li img {
    border-radius: 0px 30px 0px 30px;
    -webkit-border-radius 0px 30px 0px 30px;
    -moz-border-radius: 0px 30px 0px 30px;
}
.costume .box li .detail {
    margin: 10px;
    background: #ffe4f2;
    border-radius: 0px 30px 0px 30px;
    -webkit-border-radius 0px 30px 0px 30px;
    -moz-border-radius: 0px 30px 0px 30px;
}
.costume .box li .detail p {
    padding: 25px;
    font-size: 2rem;
    font-weight: 600;
    text-align: center
}
.costume .box2 {
    margin-top: 20px;
    padding: 100px 0;
    background: #000;
    text-align: center
}
.costume .box2 h4 {
    position: relative;
    display: inline-block;
    width: 250px;
    padding: 20px;
    color: #fff;
    font-size: 2.4rem;
    font-weight: 600
}
.costume .box2 h4:before, .costume .box2 h4:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 1px;
    background-color: white;
}
.costume .box2 h4:before {
    left: 0;
}
.costume .box2 h4:after {
    right: 0;
}
.costume .box2 ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding: 30px 0 0;
}
.costume .box2 li {
    width: calc(100% / 4);
}
.costume .box2 li img {
    border-radius: 0px 30px 0px 30px;
    -webkit-border-radius 0px 30px 0px 30px;
    -moz-border-radius: 0px 30px 0px 30px;
}
.costume .box2 li .detail {
    margin: 10px;
    background: #999;
    color: #fff;
    border-radius: 0px 30px 0px 30px;
    -webkit-border-radius 0px 30px 0px 30px;
    -moz-border-radius: 0px 30px 0px 30px;
}
.costume .box2 li .detail p {
    padding: 25px;
    font-size: 2rem;
    font-weight: 600;
    text-align: center
}
@media screen and (max-width:479px) {
    .costume {
        padding: 30px 0 0;
    }
    .costume .box {
        margin-top: 20px;
        padding: 0 0 20px;
    }
    .costume .box h4 {
        width: 200px;
        font-size: 1.8rem;
    }
    .costume .box ul {
        width: 95%;
        padding: 0;
    }
    .costume .box li {
        width: calc(100% / 2);
    }
    .costume .box li .detail {
        margin: 5px;
    }
    .costume .box li .detail p {
        padding: 10px 0;
        font-size: 1.2rem;
    }
    .costume .box2 {
        padding: 20px 0;
    }
    .costume .box2 ul {
        width: 95%;
        padding: 0 0 20px;
    }
    .costume .box2 li {
        width: calc(100% / 2);
    }
    .costume .box2 li .detail {
        margin: 5px;
    }
    .costume .box2 li .detail p {
        padding: 10px 0;
        font-size: 1.2rem;
    }
}
/*===============================
ランキング
================================*/
.ranking {
    padding-top: 100px;
    background: #fff
}
.ranking .box {
    margin-top: 50px;
    padding: 30px 0px;
    background: url("../img/bg.png");
}
.ranking ul {
    display: flex;
    flex-wrap: wrap;
    width: 75%;
    margin: auto;
    padding: 50px 0px
}
.ranking li {
    width: calc(100% / 5);
}
.ranking li .detail {
    margin: 10px;
    background: #fff;
}
.ranking.detail img {
    width: 100%;
}
.ranking .image {
    position: relative;
}
.ranking .subname {
    position: absolute;
    bottom: -25px;
    left: 0;
    right: 0;
    font-size: 5rem;
    font-family: 'Parisienne', cursive;
    text-align: center;
}
.ranking .name {
    padding-top: 35px;
    font-size: 2.5rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-weight: 400;
    text-align: center;
}
.ranking .name span {
    font-size: 1.4rem;
    transform: rotate(.03deg);
}
.ranking .comment {
    padding-top: 10px;
    font-size: 0.8rem;
    text-align: center;
}
.ranking .size {
    padding: 0 0 25px;
    font-size: 1.5rem;
    font-weight: 500;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
    text-align: center;
}
.ranking .time {
    position: absolute;
    width: 75px;
    height: 60px;
    background: rgba(105, 175, 184, .9);
    bottom: 15px;
    left: 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.ranking .time p {
    padding: 10px 0px;
    color: #fff;
    line-height: 12px;
    text-align: center
}
.ranking .time span {
    font-size: 0.6rem;
}
.ranking .rank {
    position: absolute;
    top: -20px;
    right: -10px;
}
.ranking .rank img {
    width: 80px
}
.ranking .new {
    position: absolute;
    width: 50px;
    height: 50px;
    bottom: 5px;
    left: 5px;
}
@media screen and (max-width:479px) {
    .ranking {
        padding-top: 30px;
        background: #fff
    }
    .ranking .box {
        margin-top: 10px;
        padding: 0px 0px;
        background: url("../img/bg.png");
        background-size: 25% auto;
    }
    .ranking ul {
        display: flex;
        flex-wrap: wrap;
        width: 95%;
        margin: auto;
        padding: 20px 0px
    }
    .ranking li {
        width: calc(100% / 2);
    }
    .ranking li .detail {
        margin: 5px;
        background: #fff;
    }
    .ranking.detail img {
        width: 100%;
    }
    .ranking .image {
        position: relative;
    }
    .ranking .subname {
        position: absolute;
        bottom: -20px;
        left: 0;
        right: 0;
        font-size: 3rem;
        text-align: center;
    }
    .ranking .name {
        padding-top: 25px;
        font-size: 1.6rem;
        font-weight: 400;
        text-align: center;
    }
    .ranking .name span {
        font-size: 1.2rem;
    }
    .ranking .comment {
        padding-top: 10px;
        font-size: 0.8rem;
        text-align: center;
    }
    .ranking .size {
        padding: 0px 0px 25px 0px;
        font-size: 1.2rem;
        font-weight: 500;
        font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
        transform: rotate(.03deg);
        text-align: center;
    }
    .ranking .time {
        position: absolute;
        width: 75px;
        height: 60px;
        background: rgba(105, 175, 184, .9);
        bottom: 15px;
        left: 5px;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
    }
    .ranking .time p {
        padding: 10px 0px;
        color: #fff;
        line-height: 12px;
        text-align: center
    }
    .ranking .time span {
        font-size: 0.6rem;
    }
    .ranking .rank {
        position: absolute;
        top: -10px;
        right: -5px;
    }
    .ranking .rank img {
        width: 50px
    }
    .ranking .new {
        position: absolute;
        width: 35px;
        bottom: 0px;
        left: 5px;
    }
}
/*===============================
認証ページ
================================*/
.index {
    background-attachment: fixed;
    background-image: url("../img/bg.jpg");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    text-align: center;
}
.index_space {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    text-align: center;
    overflow-y: auto
}
.index_space .inner {
    padding-bottom: 0px;
}
.index_space img {
    width: 640px;
    margin: auto;
    padding-top: 10px;
}
.index_space h1 {
    padding: 50px 0 20px;
    color: #fff;
    font-size: 2.2rem;
    font-weight: bold;
    text-shadow: 0px 1px 0px #000;
}
.index_space h2 {
    padding: 10px;
    color: #ffe0ef;
    font-size: 1.8rem;
    font-weight: bold;
    text-shadow: 0px 1px 0px #000;
}
.index_space h3 {
    width: 100%;
    margin-top: 20px;
    padding: 10px 0 20px;
    color: #000;
    font-size: 1.3rem;
    font-weight: bold;
    text-shadow:
        #fff 2px 0px 2px, #fff -2px 0px 2px, #fff 0px -2px 2px, #fff -2px 0px 2px, #fff 2px 2px 2px, #fff -2px 2px 2px, #fff 2px -2px 2px, #fff -2px -2px 2px, #fff 1px 2px 2px, #fff -1px 2px 2px, #fff 1px -2px 2px, #fff -1px -2px 2px, #fff 2px 1px 2px, #fff -2px 1px 2px, #fff 2px -1px 2px, #fff -2px -1px 2px, #fff 1px 1px 2px, #fff -1px 1px 2px, #fff 1px -1px 2px, #fff -1px -1px 2px;
    text-align: center;
    line-height: 2
}
.rec_banner {
    width: 290px;
    margin: auto;
    padding-bottom: 25px
}
.rec_banner img {
    width: 290px;
}
@media screen and (max-width:479px) {
    .index {
        height: 100%;
    }
    .index_space {
        width: 100%;
        height: auto;
        font-size: 100px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .index_space .inner {
        padding-bottom: 30px;
        background-image: url(../img/bg.jpg);
        background-position: top center;
        background-size: 200% auto;
        text-align: center
    }
    .index_space .logo-l {
        width: 95%;
        margin: auto;
        padding-top: 10px;
    }
    .index_space .logo-l img {
        width: 100%
    }
    .index_space h1 {
        padding-top: 100px;
        color: #fff;
        font-size: 1.8rem;
        font-weight: bold
    }
    .index_space h2 {
        padding: 10px 0;
        font-size: 1.4rem;
        font-weight: bold
    }
    .index_space h3 {
        padding: 0;
        font-size: 1rem;
        font-weight: bold;
        text-align: center;
        line-height: 2
    }
}
.container {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    margin: 0 auto;
}
.container a {
    text-decoration: none;
}
.container span {
    font-size: 3.5rem;
    font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    transform: rotate(.03deg);
}
.btn {
    flex: 1 1 auto;
    margin: 10px;
    padding: 10px 20px 20px 20px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    border-radius: 10px;
    font-size: 2.5rem;
}
.btn:hover {
    background-position: right center;
    text-decoration: none;
}
.btn-enter {
    width: 250px;
    background-image: linear-gradient(to right, #ff3da1 0%, #ef017c 51%, #ff3da1 100%);
    font-size: 1.5rem
}
.btn-leave {
    width: 150px;
    background-image: linear-gradient(to right, #444 0%, #000 51%, #444 100%);
    font-size: 1.3rem
}
.link_banner {
    width: 100%;
    justify-content: center;
    padding-bottom: 25px;
}
.link_banner img {
    width: auto;
    padding: 5px
}
@media screen and (max-width:479px) {
    .link_banner img {
        max-width: 100%;
        padding: 5px 0
    }
}
.review_btn {
    padding-top: 20px
}
.review_btn ul {
    display: flex;
    width: 936px;
    margin: auto;
}
.review_btn li {
    width: 50%
}
.review_btn a {
    display: block;
    margin: 0 10px
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .review_btn {
        width: auto;
        padding-top: 5px
    }
    .review_btn ul {
        width: auto;
        padding: 0 12px
    }
    .review_btn li {
        width: 50%;
        padding-top: 7px
    }
    .review_btn a {
        margin: 0 5px
    }
}
@media screen and (max-width:599px) {
    .review_btn {
        width: 95%;
        margin: auto;
        padding-top: 0px
    }
    .review_btn ul {
        flex-wrap: wrap;
        width: 100%;
    }
    .review_btn li {
        width: 100%;
        padding-top: 7px
    }
    .review_btn a {
        margin: 0
    }
}
.top-banner {
    width: 915px;
    margin: auto;
    padding-bottom: 30px;
    position: relative;
}
@media screen and (max-width: 768px) {
    .top-banner {
        width: 100%;
        margin: auto;
        margin-top: -15px;
        margin-bottom: 7px;
        padding-bottom: 0px
    }
}
.top_banner {
    padding: 70px 0 100px 0;
    background: url("../img/bg.png");
    background-size: 10% auto;
}
@media screen and (min-width:600px) and (max-width:1024px) {
    .top_banner {
        padding: 40px 0 50px 0;
        background-size: 10% auto;
    }
}
@media screen and (max-width:599px) {
    .top_banner {
        padding: 40px 0 50px 0;
        background-size: 50% auto;
    }
}
.top_event {
    width: 915px;
    margin: auto;
    padding: 30px 0 0;
}
@media screen and (max-width: 768px) {
    .top_event {
        width: 95%;
        margin: auto;
        padding: 12px 0 0
    }
}
.heaven img {
    width: auto
}
.vanilla {
    max-width: 468px;
    margin: auto
}
.vanilla img {
    width: 100%
}
.price-box {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    margin-bottom: 30px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 768px) {
    .price-box {
        max-width: 90%;
    }
}
.price-row {
    display: flex;
    width: 100%;
}
.price-col {
    flex: 1 1 33.333%;
    text-align: center;
    background: #fff;
    border-right: 1px solid #ddd; /* 値段部分のグレー区切り線 */
}
.price-col:last-child {
    border-right: none;
}
.plan-header {
    padding: 15px 10px;
    color: #fff;
    font-weight: bold;
    font-size: 2.5rem;
}
@media screen and (max-width: 768px) {
    .plan-header {
        padding: 10px;
        font-size: 2rem;
    }
}
.light .plan-header {
    background: #e79297;
}
.regular .plan-header {
    background: #3fbab3;
}
.premium .plan-header {
    background: #caa034;
}
.plan-price {
    padding: 20px 10px;
    font-size: 3.5rem;
    font-weight: bold;
}
@media screen and (max-width: 768px) {
    .plan-price {
        padding: 15px 10px;
        font-size: 3rem;
    }
}
.light .plan-price {
    color: #e79297;
}
.regular .plan-price {
    color: #3fbab3;
}
.premium .plan-price {
    color: #caa034;
}
.plan-price span {
    font-size: 0.7em;
    margin-left: 5px;
    color: #555;
}
/* コース間の白線 */
.price-col:not(:first-child) {
    border-left: 2px solid #fff;
}
@media screen and (max-width: 768px) {
    .price-row {
        flex-direction: column;
    }
    .price-col {
        border-right: none;
        border-left: none;
        border-bottom: 1px solid #ddd;
    }
    .price-col:last-child {
        border-bottom: none;
    }
    .price-col:not(:first-child) {
        border-left: none;
    }
}
.extra-fee {
    padding: 0 0 15px;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
}
.extra-fee span {
    color: red
}
.note {
    padding: 0 0 15px;
    font-weight: bold;
    text-align: center;
}
.heading-shimei {
    display: flex;
    margin-top: 25px;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    font-size: 2.5rem
}
@media screen and (max-width: 768px) {.heading-shimei {
    margin-top: 15px;
    font-size: 2.2rem
}
}

.heading-shimei::before, .heading-shimei::after {
    width: 3px;
    height: 30px;
    background-color: #ffffff;
    content: '';
}
.heading-shimei::before {
    transform: rotate(-35deg);
    margin-right: 30px;
}
.heading-shimei::after {
    transform: rotate(35deg);
    margin-left: 30px;
}
.shimei-text {
    background: #fff;
    padding: 10px;
    border-radius: 100vh;
    color: black
}
@media screen and (max-width: 768px) {
    .shimei-text {
        padding: 10px;
        border-radius: 10px;
        color: black;
        font-size: 1.3rem
    }
}
.newface-discount{
	width: 95%;
	max-width: 1000px;
	margin: auto;
	padding: 40px 0
}
@media screen and (max-width: 768px) {
	.newface-discount{
	padding: 30px 0 20px;
}
}