@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Amiri&display=swap");

header, div, span, applet, object, iframe, input[type=file], h1, h2, h3, h4, h5, h6, p, select, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0 auto;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    vertical-align: baseline;
    font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif
}

input, button, textarea, select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.ma20 {
    margin-top: 20px
}

small {
    font-size: 75%
}

a {
    color: #333333;
    text-decoration: none;
    outline: none;
    border: none
}

a:hover {
    color: #333333;
    text-decoration: none
}

a img, img {
    border: 0
}

blockquote, dd, div, dl, dt, h1, h2, h3, h4, h5, h6, li, p, pre, span, td, th, ul {
    margin: 0;
    padding: 0;
}

abbr, acronym {
    border: 0
}

address, caption, cite, code, dfn, em, th, strong, var {
    font-style: normal;
    font-weight: normal
}

caption, th {
    text-align: left
}

code, kbd, pre, samp, tt {
    font-family: monospace;
    line-height: 100%
}

* + html code, kbd, pre, samp, tt {
    font-size: 108%
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal
}

ul, li {
    margin: 0;
    padding: 0;
    list-style: none
}

q:before, q:after {
    content: ''
}

button, fieldset, form, input, label, legend, textarea {
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 100%
}

table td {
    vertical-align: middle
}

.right {
    float: right
}

.left {
    floar: left
}

.mb50 {
    margin-bottom: 50px
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden
}

.clearfix {
    display: inline-block
}

* html .clearfix {
    height: 1%
}

.clearfix {
    display: block
}

::-webkit-input-placeholder {
    color: #A3A3A3
}

:-moz-placeholder {
    color: #A3A3A3
}

::-moz-placeholder {
    color: #A3A3A3
}

:-ms-input-placeholder {
    color: #A3A3A3
}

.mb10 {
    margin-bottom: 10px !important
}

.mb20 {
    margin-bottom: 20px !important
}

.mb30 {
    margin-bottom: 30px !important
}

.mt15 {
    margin-top: 15px !important
}

.pc {
    display: block
}

@media screen and (max-width: 736px) {
    .pc {
        display: none
    }
}

.sp {
    display: none
}

@media screen and (max-width: 736px) {
    .sp {
        display: block
    }
}

.pb0 {
    padding-bottom: 0 !important
}

@media screen and (max-width: 736px) {
    input[type="submit"], input[type="reset"], input[type="button"], button {
        cursor: pointer;
        -webkit-appearance: button;
        *overflow: visible
    }
}

@media screen and (max-width: 736px) {
    input[type=text], textarea, input[type=button] {
        -webkit-appearance: none
    }
}

body {
    margin: 0;
    letter-spacing: .1em;
    background: #011245
}

img {
    max-width: 100%
}

p {
    font-weight: 500
}

#wrapper {
    max-width: 768px;
    margin: 0 auto;
    min-height: 70vh;
    width: 100%
}

#wrapper:before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background: url("../img/back.jpg") no-repeat;
    background-size: cover
}

header {
    position: fixed;
    width: 100%;
    z-index: 9998;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
    max-width: 768px
}

header.blur {
    filter: blur(10px);
    pointer-events: none
}

header h1 {
    background: #011245;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    padding: 15px 0;
    font-weight: bold
}

footer {
    position: fixed;
    left: 50%;
    bottom: 0;
    width: 100%;
    z-index: 999;
    background: #001245;
    max-width: 768px;
    transform: translate(-50%, 0)
}

footer.blur {
    filter: blur(10px);
    pointer-events: none
}

footer ul {
    display: flex;
    justify-content: space-between
}

footer ul li {
    width: 20%
}

footer ul li a {
    display: block;
    padding: 10px 0;
    text-align: center;
    position: relative
}

footer ul li a i {
    position: absolute;
    width: 20px;
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
    text-align: center;
    background: #E94850;
    border-radius: 50%;
    color: #FFF;
    left: 70%;
    top: 10px;
    font-size: 10px;
    font-family: "Roboto", sans-serif !important;
    letter-spacing: 0;
    transform: translate(-50%, 0)
}

footer ul li a.active svg {
    fill: #FDD000 !important
}

footer ul li a.active p {
    color: #FDD000
}

footer ul li a svg {
    width: 24px;
    height: 24px
}

footer ul li a p {
    color: #FFF;
    font-size: 10px;
    color: #A3A3A3
}

a {
    transition: all 0.3s ease-in-out
}

a:hover {
    opacity: .7
}

#splash {
    background: url("../img/splash.jpg") no-repeat;
    background-size: 100% auto;
    max-width: 768px;
    margin: 0 auto;
    width: 100%;
    position: relative;
    animation: splash-fade 1s ease-in-out 2s forwards
}

@keyframes splash-fade {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

#splash h1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
    animation: splash-title 1s ease-in-out forwards
}

@keyframes splash-title {
    0% {
        -ms-filter: blur(6px);
        filter: blur(6px);
        opacity: 0
    }
    100% {
        -ms-filter: blur(0px);
        filter: blur(0px);
        opacity: 1
    }
}

body.lock {
    overflow: hidden
}

#wrapper.blur {
    filter: blur(10px);
    pointer-events: none
}

#wrapper .stick {
    position: sticky;
    top: 51px;
    background: url("../img/back.jpg") no-repeat center 10%;
    background-size: cover;
    z-index: 99
}

#wrapper .btn_service {
    display: flex;
    justify-content: space-between
}

#wrapper .btn_service li {
    width: 24%
}

#wrapper .btn_service li:last-child {
    width: 28%
}

#wrapper .btn_service li a {
    display: block;
    color: #FFF;
    text-align: center;
    font-weight: bold;
    padding: 15px 0;
    border-bottom: 1px solid #323A7F;
    font-size: 13px;
    transition: all .3s ease-in-out
}

#wrapper .btn_service li a.active {
    color: #FDD000;
    border-bottom: 1px solid #FDD002
}

#wrapper .btn_category {
    display: flex;
    justify-content: space-between;
    margin: 15px
}

#wrapper .btn_category li {
    width: 23%;
    border-radius: 50px;
    color: #FFF;
    cursor: pointer;
    text-align: center;
    font-weight: bold;
    padding: 10px 0;
    border: 1px solid #FFF;
    font-size: 13px;
    transition: all .3s ease-in-out
}

#wrapper .btn_category li.active {
    color: #FDD000;
    border: 1px solid #FDD002
}

#wrapper .btn_category.three li {
    width: 31%
}

#wrapper .result-sort {
    display: flex;
    justify-content: space-between;
    margin: 0 15px;
    align-items: center
}

#wrapper .result-sort.favorite-wrap {
    margin: 15px 15px 0 15px
}

#wrapper .result-sort .result-count {
    font-size: 11px;
    color: #FFF
}

#wrapper .result-sort .result-count em {
    font-family: "Amiri", serif;
    font-size: 140%;
    font-weight: bold
}

#wrapper .result-sort .sort-box {
    overflow: hidden;
    width: 30%;
    margin: 0;
    text-align: center;
    position: relative;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.15)
}

#wrapper .result-sort .sort-box::before {
    position: absolute;
    top: calc(50% - 6px);
    left: 10px;
    padding: 0;
    content: '';
    display: block;
    width: 16px;
    height: 12px;
    background: url("../img/sort-icon.svg") no-repeat;
    background-size: 16px;
    pointer-events: none
}

#wrapper .result-sort .sort-box::after {
    position: absolute;
    top: calc(50% - 8px);
    right: 10px;
    padding: 0;
    content: '>';
    color: #FFF;
    display: block;
    transform: rotate(90deg) scale(0.7, 1);
    font-size: 12px;
    pointer-events: none
}

#wrapper .result-sort .sort-box select {
    width: 100%;
    padding-right: 1em;
    cursor: pointer;
    text-indent: 0.01px;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    background: #4234A5;
    background-image: none;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
    color: #FFF;
    padding: 10px 25px 10px 35px;
    font-size: 12px;
    box-sizing: border-box;
    letter-spacing: .15em
}

#wrapper .result-sort .sort-box select::-ms-expand {
    display: none
}

#wrapper .result-box.display li {
    display: flex;
    background: rgba(255, 255, 255, 0.15);
    margin: 15px 15px 0 15px;
    border-radius: 5px;
    overflow: hidden
}

#wrapper .result-box.display li .prev-edit {
    margin: 20px 0 0 0;
    display: flex;
    justify-content: space-between
}

#wrapper .result-box.display li .prev-edit p {
    width: 48%;
    text-align: center
}

#wrapper .result-box.display li .prev-edit p a {
    border: 1px solid #FFF;
    border-radius: 5px;
    background: none;
    color: #FFF;
    margin: 0;
    font-size: 12px;
    padding: 9px 0;
    display: block
}

#wrapper .result-box.display li .prev-edit div {
    width: 48%
}

#wrapper .result-box.display li .prev-edit div button {
    position: static !important;
    background: #FDD000;
    color: #303984;
    width: 100%;
    border-radius: 5px;
    padding: 10px 0;
    font-weight: bold;
    font-size: 12px
}

#wrapper .result-box.display li button.trash {
    position: absolute;
    top: 10px;
    left: 5px;
    background: none;
    border: none
}

#wrapper .result-box.display li button.trash svg {
    fill: #fff !important;
    stroke: none !important
}

#wrapper .result-box.display li .pic {
    width: 40%;
    line-height: 0;
    height: 23vw;
    max-height: 217px;
}

@media screen and (max-width: 736px) {
    #wrapper .result-box.display li .pic {
        height: 75vw;
        max-height: 225px;
    }
}

#wrapper .result-box.display li .pic img {
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    pointer-events: none
}

#wrapper .result-box.display li .text {
    width: 55%;
    padding: 15px
}

#wrapper .result-box.display li .text .icon-menu p span {
    font-size: 11px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    padding: 5px 10px;
    text-align: center;
    color: #FFF
}

#wrapper .result-box.display li .text .title {
    margin: 10px 0
}

#wrapper .result-box.display li .text .title h2 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold
}

#wrapper .result-box.display li .text .service dl {
    display: flex;
    font-size: 11px;
    color: #C8D1D3;
    margin: 0 0 10px 0;
    white-space: nowrap;
    align-items: center
}

#wrapper .result-box.display li .text .service dl dt.shop {
    background: url("../img/icn_home_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 15px 0 17px
}

#wrapper .result-box.display li .text .service dl dt.trip {
    background: url("../img/icn_trip_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 15px 0 17px
}

#wrapper .result-box.display li .text .service dl dt.online {
    background: url("../img/icn_online_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 0 0 17px
}

#wrapper .result-box.display li .text .service dl dd p {
    line-height: 1;
    color: #FDD000;
    text-align: right;
    white-space: normal;
}

#wrapper .result-box.display li .text .service dl dd p small {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 13px
}

#wrapper .result-box.display li .text .service dl dd p em {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 20px
}

@media screen and (max-width: 736px) {
    #wrapper .result-box.display li .text .service dl dd p small {
        font-size: 11px
    }

    #wrapper .result-box.display li .text .service dl dd p em {
        font-size: 16px
    }

    #wrapper .result-box.display li .text .service dl dd p i {
        font-size: 11px
    }
}

#wrapper .result-box.display li .text .service dl dd p i {
    display: inline-block;
}

#wrapper .result-box h2 {
    font-size: 14px;
    color: #FFF;
}

#wrapper .result-box h2 em {
    font-weight: bold;
    font-size: 16px
}

#wrapper .result-box ul li {
    position: relative
}

#wrapper .result-box ul li button {
    position: absolute;
    top: 5px;
    left: 20px;
    background: none;
    border: none
}

#wrapper .result-box ul li button svg {
    fill: transparent !important;
    stroke: #FFF;
    stroke-width: 2px
}

#wrapper .result-box ul li button.on svg {
    fill: #FD2F76 !important;
    stroke: #FFF !important;
    animation: fav 1s ease-in-out forwards
}

@keyframes fav {
    0% {
        transform: scale(1)
    }
    50% {
        transform: scale(1.2)
    }
    100% {
        transform: scale(1)
    }
}

#wrapper .result-box ul li a {
    display: flex;
    background: rgba(255, 255, 255, 0.15);
    margin: 15px 15px 0 15px;
    border-radius: 5px;
    overflow: hidden
}

#wrapper .result-box ul li a .pic {
    width: 40%;
    line-height: 0;
    height: 23vw;
    max-height: 217px;
}

@media screen and (max-width: 736px) {
    #wrapper .result-box ul li a .pic {
        height: 75vw;
        max-height: 225px;
    }
}
#wrapper .result-box ul li a .pic img {
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    pointer-events: none
}

#wrapper .result-box ul li a .text {
    width: 55%;
    padding: 13px;
}

#wrapper .result-box ul li a .text .icon-menu p span {
    font-size: 11px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    padding: 5px 10px;
    text-align: center;
    color: #FFF
}

#wrapper .result-box ul li a .text .title {
    margin: 7px 0
}

#wrapper .result-box ul li a .text .title h2 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold
}

#wrapper .result-box ul li a .text .service dl {
    display: flex;
    font-size: 11px;
    color: #C8D1D3;
    margin: 0 0 7px 0;
    white-space: nowrap;
    align-items: center
}

#wrapper .result-box ul li a .text .service dl dt.shop {
    background: url("../img/icn_home_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 10px 0 20px
}

#wrapper .result-box ul li a .text .service dl dt.trip {
    background: url("../img/icn_trip_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 10px 0 20px
}

#wrapper .result-box ul li a .text .service dl dt.online {
    background: url("../img/icn_online_gray.svg") no-repeat;
    background-size: 12px;
    padding: 0 10px 0 20px
}

#wrapper .result-box ul li a .text .service dl dd p {
    color: #FDD000
}

#wrapper .result-box ul li a .text .service dl dd p small {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 13px
}

#wrapper .result-box ul li a .text .service dl dd p em {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 20px
}

#wrapper .result-box ul li a .text .therapist {
    display: flex
}

#wrapper .result-box ul li a .text .therapist .face {
    margin: 0 10px 0 0;
    overflow: hidden;
    min-width: 30px;
}

#wrapper .result-box ul li a .text .therapist .face img {
    object-fit: cover;
    width: 30px;
    height: 30px;
    border-radius: 50%
}

#wrapper .result-box ul li a .text .therapist .data .value p {
    font-size: 11px;
    color: #FDD000
}

#wrapper .result-box ul li a .text .therapist .data .value p:before {
    content: "★";
    margin: 0 3px 0 0
}

#wrapper .result-box ul li a .text .therapist .data .name p {
    color: #FFF;
    font-size: 12px
}

#wrapper .result-box ul li a .text .therapist .data .price p {
    color: #FFBE2B;
    font-size: 12px;
    line-height: 1.3
}

#wrapper .result-box ul li a .text .therapist .data .price p small {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 13px
}

#wrapper .result-box ul li a .text .therapist .data .price p em {
    font-family: "Amiri", serif;
    font-weight: bold;
    font-size: 20px
}

@media screen and (max-width: 736px) {
    #wrapper .result-box ul li a .text .therapist .data .price p small {
        font-size: 11px
    }

    #wrapper .result-box ul li a .text .therapist .data .price p em {
        font-size: 16px
    }

    #wrapper .result-box ul li a .text .therapist .data .price p i {
        font-size: 11px
    }
}

.hidden-box {
    background: url("../img/back.jpg") no-repeat;
    background-size: cover;
    border-radius: 20px 20px 0 0 / 20px 20px 0 0;
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    max-width: 768px;
    transform: translate(-50%, 0);
    left: 50%
}

.hidden-box .title {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #303985;
    align-items: center
}

.hidden-box .title h2 {
    text-align: center;
    padding: 15px 0;
    color: #FFF;
    margin-left: auto;
    margin-right: auto
}

.hidden-box .title p {
    color: #FFF;
    position: relative;
    right: 15px;
    font-size: 20px;
    cursor: pointer
}

.hidden-box .hidden-contents {
    overflow: scroll;
    margin: 15px 15px 15px 15px;
    max-height: calc(100vh - 178px)
}

.hidden-box .hidden-contents > h3 {
    text-align: center;
    color: #FFF;
    font-size: 13px;
    margin: 0 0 15px 0
}

.hidden-box .hidden-contents .time {
    margin: 30px 0 110px 0
}

.hidden-box .hidden-contents .time h3 {
    color: #FFF;
    font-size: 14px;
    margin: 0 0 10px 0
}

.hidden-box .hidden-contents .time .select-box {
    position: relative
}

.hidden-box .hidden-contents .time .select-box::after {
    position: absolute;
    top: calc(50% - 8px);
    right: 10px;
    padding: 0;
    content: '>';
    color: #FFF;
    display: block;
    transform: rotate(90deg) scale(0.7, 1);
    font-size: 12px;
    pointer-events: none
}

.hidden-box .hidden-contents .time .select-box select {
    width: 100%;
    background: rgba(255, 255, 255, 0.15);
    padding: 10px 15px;
    border-radius: 5px;
    color: #FFF
}

.hidden-box .hidden-contents .two-list {
    margin: 0 0 110px 0
}

.hidden-box .hidden-contents .two-list ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.hidden-box .hidden-contents .two-list ul li {
    width: 48%;
    margin: 0 0 4% 0
}

.hidden-box .hidden-contents .two-list ul li:nth-last-child(-n+2) {
    margin-bottom: 0
}

.hidden-box .hidden-contents .two-list ul li input[type=checkbox] {
    display: none
}

.hidden-box .hidden-contents .two-list ul li input[type=checkbox]:checked + label {
    background: #FDD000;
    color: #303984
}

.hidden-box .hidden-contents .two-list ul li input[type=checkbox] + label {
    font-size: 15px;
    display: block;
    float: left;
    width: 100%;
    height: 45px;
    text-align: center;
    line-height: 45px;
    cursor: pointer;
    color: #FFF;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 50px
}

.hidden-box .hidden-contents .one-list {
    margin: 0 0 110px 0
}

.hidden-box .hidden-contents .one-list li {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    margin: 0 0 13px 0
}

.hidden-box .hidden-contents .one-list li:last-child {
    margin: 0
}

.hidden-box .hidden-contents .one-list li input[type=checkbox] {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

.hidden-box .hidden-contents .one-list li input[type=checkbox] + label {
    position: relative;
    color: #FFF;
    font-size: 15px;
    cursor: pointer;
    display: block;
    padding: 13px
}

.hidden-box .hidden-contents .one-list li input[type=checkbox] + label:before {
    content: "";
    display: block;
    position: absolute;
    right: 15px;
    width: 16px;
    height: 16px;
    top: 15px;
    border: solid 2px #979797;
    border-radius: 3px;
    transition: all ease-in-out 0.125s
}

.hidden-box .hidden-contents .one-list li input[type=checkbox] + label:after {
    content: "";
    position: absolute;
    top: 25px;
    right: 15px;
    transform: rotate(-45deg) scaleX(0);
    transform-origin: left;
    width: 12px;
    height: 5px;
    border-left: 2px solid #303984;
    border-bottom: 2px solid #303984;
    transition: transform 0.125s ease-in-out
}

.hidden-box .hidden-contents .one-list li input:checked + label:before {
    background: #FDD000;
    border-color: #303984
}

.hidden-box .hidden-contents .one-list li input:checked + label:after {
    transform: rotate(-45deg) scaleX(1)
}

.hidden-box .search-box {
    position: fixed;
    left: 50%;
    bottom: 0;
    width: 100%;
    z-index: 9999;
    background: #001245;
    max-width: 768px;
    transform: translate(-50%, 0);
    display: flex;
    justify-content: space-between;
    padding: 20px 15px 30px 15px;
    box-sizing: border-box
}

.hidden-box .search-box .cancel {
    width: 30%;
    border: 1px solid #FDD000;
    color: #FDD000;
    background: none;
    font-size: 14px;
    padding: 10px 0
}

.hidden-box .search-box .search {
    width: 65%;
    background: #FDD000;
    color: #303984;
    font-size: 14px;
    border: none;
    padding: 10px 0;
    font-weight: bold;
    letter-spacing: .5em
}

#under-page .under-kv {
    position: relative;
    line-height: 0
}

#under-page .under-kv .back {
    position: fixed;
    left: 15px;
    top: 15px;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #323A7F;
    background: #FFF;
    border-radius: 50%;
    border: none;
    z-index: 2;
}

#under-page .under-kv .back:before {
    content: "";
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #323A7F;
    border-left: solid 2px #323A7F;
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -4px;
    margin-left: -3px
}

#under-page .under-kv .favorite {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(255, 255, 255, 0.3);
    border: none;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    padding: 5px 0 0 0;
    z-index: 2;
}

#under-page .under-kv .favorite svg {
    fill: transparent !important;
    stroke: #FFF;
    stroke-width: 2px
}

#under-page .under-kv .favorite.on svg {
    fill: #FD2F76 !important;
    stroke: #FFF !important;
    animation: fav 1s ease-in-out forwards
}

@keyframes fav {
    0% {
        transform: scale(1)
    }
    50% {
        transform: scale(1.2)
    }
    100% {
        transform: scale(1)
    }
}

#under-page .category-view {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 15px
}

#under-page .category-view .icon-menu p span {
    font-size: 11px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    padding: 5px 10px;
    text-align: center;
    color: #FFF
}

#under-page .category-view .view {
    color: #FFF;
    font-size: 12px;
    color: #A3A3A3;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAZdJREFUSEvtlT1SAkEQhV+zszmeQEytssDURDiBmM9QEBnKDcQb4AmWYgjMxBOIkaFQlrFwA4y3l7EGF2r/kDXYjAmnet735vX8EAoeVLA+DoC9Cf8Zked5Zdd1r4wxbQBlALVQcQpgSUQD3/efO53OchcpE2CFhRC3AHp7Lf4W9Jj5IQuUAoTiLxG3ORmYMnMjCYkBQvGvMI6o8AJAl5ltNBBC2Kj6AI4T9BQkBtBaTwBcJhYtmLmWdBaascAkZKKUamw0toDhcNgmIi8jj2ul1Hg0Gp0ZYx6J6BvAjZTyQ2vdBPCUXGOM6bRarYGd3wK01vMMN2DmI+tea/0J4HS9iOhNSnnheV5FCGEjjQ0imkspTwoDAFgopSoxQOERWVpWk+12fd8/z2qy67rvxpi108h4VUrVU022E7tOhoUEQdBdrVYzW1cqlaqO4/QzxGfMXI+a2XXR7HGt5r1hYV1KPNaDqFi4ky6Au5yQe2bu53oqkiDHcZpEtHnsNruaGWPssR4HQTD+92OX03WussOPtjemwiP6AYCz0xnRuGoQAAAAAElFTkSuQmCC) no-repeat;
    background-size: 20px;
    padding: 0 0 0 25px
}

#under-page .title {
    padding: 0 15px
}

#under-page .title h2 {
    color: #FFF;
    font-size: 20px;
    font-weight: bold;
    margin: 0 0 15px 0
}

#under-page .title p {
    color: #FFF;
    font-size: 13px
}

#under-page .trouble {
    padding: 30px 15px 15px 15px
}

#under-page .trouble h2 {
    font-size: 18px;
    color: #FFF;
    font-weight: bold
}

#under-page .trouble ul {
    display: flex
}

#under-page .trouble ul li {
    color: #FFF;
    font-size: 12px
}

#under-page .trouble ul li:after {
    content: "/"
}

#under-page .trouble ul li:last-child:after {
    content: ""
}

#under-page .therapist {
    border-top: 1px solid #565B86;
    margin: 15px 0 0 0;
    padding: 30px 15px 15px 15px
}

#under-page .therapist.ver2 {
    padding: 10px 0 0 0;
    border: 0;
    margin: 0
}

#under-page .therapist.ver2 h3 {
    margin: 0 !important
}

#under-page .therapist .name-face {
    display: flex;
    justify-content: space-between;
    margin: 0 0 15px 0
}

#under-page .therapist .name-face .face {
    margin: 0 10px 0 0;
    overflow: hidden
}

#under-page .therapist .name-face .face img {
    object-fit: cover;
    width: 50px;
    height: 50px;
    border-radius: 50%
}

#under-page .therapist .name-face .name h3 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold
}

#under-page .therapist .name-face .star {
    display: flex;
    align-items: center;
    color: #FDD000
}

#under-page .therapist .name-face .star .value {
    margin: 0 10px 0 0
}

#under-page .therapist .name-face .star .value p {
    font-size: 11px;
    color: #FDD000
}

#under-page .therapist .name-face .star .value p:before {
    content: "★";
    margin: 0 3px 0 0
}

#under-page .therapist .name-face .star .review-count p a {
    color: #FDD000;
    font-size: 11px;
    border-bottom: 1px solid #FDD000;
    padding: 0 0 3px 0;
    position: relative;
    top: -2px
}

#under-page .therapist table {
    width: 100%
}

#under-page .therapist table th, #under-page .therapist table td {
    color: #FFF;
    font-size: 13px;
    padding: 0 0 5px 0
}

#under-page .therapist table th {
    position: relative;
    width: 22%
}

#under-page .therapist table th:after {
    content: ":";
    position: absolute;
    right: 0
}

#under-page .therapist table td p.text-intro {
    line-height: 1.5
}

#under-page .therapist table td a.more {
    border-bottom: 1px solid #FDD000;
    color: #FDD000;
    padding: 0 0 3px 0
}

#under-page .course {
    border-top: 1px solid #565B86;
    border-bottom: 1px solid #565B86;
    padding: 30px 15px;
    margin: 15px 0 30px 0
}

#under-page .course.service {
    border: none;
    padding: 15px;
    margin-bottom: 0
}

#under-page .course h2 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 10px 0
}

#under-page .course .radio-btns input[type=radio] {
    display: none
}

#under-page .course .radio-btns li:not(:last-child) {
    margin: 0 0 10px 0
}

#under-page .course .radio-btns label {
    position: relative;
    color: #FFF;
    display: block;
    background: rgba(255, 255, 255, 0.15);
    padding: 15px;
    border-radius: 5px
}

#under-page .course .radio-btns input[type=radio] + label::before {
    position: absolute;
    content: '';
    display: block;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: transparent;
    border: 2px solid #FFF;
    right: 15px;
    top: 33%
}

#under-page .course .radio-btns input[type=radio] + label::after {
    position: absolute;
    content: '';
    display: block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #FDD000;
    right: 20px;
    top: 41%;
    opacity: 0;
    transition: .3s
}

#under-page .course .radio-btns input[type=radio]:checked + label::after {
    opacity: 1
}

#under-page .course .radio-btns input[type=radio]:checked + label::before {
    border: 2px solid #FDD000
}

#under-page .review {
    border-bottom: 1px solid #565B86;
    padding: 0 0 30px 15px;
    margin: 15px 0 30px 0
}

#under-page .review p.btn-all-review {
    margin: 30px 15px 0 0
}

#under-page .review p.btn-all-review a {
    border: 1px solid #FFF;
    display: block;
    color: #FFF;
    text-align: center;
    padding: 10px 0;
    font-size: 14px
}

#under-page .review h2 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 10px 0
}

#under-page .review ul {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    min-height: 158px;
}

#under-page .review ul li {
    display: inline-block;
    width: 80%;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    padding: 15px;
    margin: 0 10px 0 0;
    flex: none;
}

#under-page .review ul li:last-child {
    margin-right: 15px
}

#under-page .review ul li .message {
    margin: 15px 0 0 0
}

#under-page .review ul li .message p {
    font-size: 14px;
    color: #FFF;
    white-space: normal !important
}

#under-page .review ul li p {
    color: #C8D1D3;
    font-size: 11px
}

#under-page .review ul li .date {
    display: flex;
    justify-content: space-between;
    align-items: center
}

#under-page .review ul li .date p {
    color: #C8D1D3;
    font-size: 12px
}

#under-page .review ul li .date .value p {
    color: #FDD000;
    display: inline-block;
    font-family: "Amiri", serif;
    font-size: 18px
}

#under-page .review ul li .date .value p:before {
    content: "★"
}

#fixed-confirm {
    display: flex;
    position: fixed;
    bottom: 68px;
    left: 0;
    width: 100%;
    background: #FFF;
    justify-content: space-between;
    padding: 15px;
    box-sizing: border-box;
    align-items: center
}

#fixed-confirm button {
    background: #FDD000;
    border: none;
    padding: 15px 30px;
    font-size: 14px;
    color: #323A7F;
    font-weight: bold
}

#fixed-confirm .time-price {
    line-height: 1.2
}

#fixed-confirm .time-price time {
    font-size: 14px
}

#fixed-confirm2 {
    display: flex;
    position: fixed;
    bottom: 60px;
    left: 0;
    width: 100%;
    background: #FFF;
    justify-content: space-between;
    padding: 15px;
    box-sizing: border-box;
    align-items: center
}

#fixed-confirm2 button {
    background: #FDD000;
    border: none;
    padding: 15px 20px;
    font-size: 14px;
    color: #323A7F;
    font-weight: bold
}

#fixed-confirm2 .time-price {
    line-height: 1.2
}

#fixed-confirm2 .time-price time {
    font-size: 14px
}

.back2 {
    position: absolute;
    left: 15px;
    top: 10px;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #FFF;
    border-radius: 50%;
    border: none;
    background: none
}

.back2:before {
    content: "";
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #FFF;
    border-left: solid 2px #FFF;
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -4px;
    margin-left: -3px
}

.calendar-wrap {
    padding: 15px
}

.calendar-wrap input[type=checkbox] {
    display: none
}

.mb90 {
    margin-bottom: 90px
}

.calendar-output {
    width: 75%;
    line-height: 1.5
}

.calendar {
    width: 100%
}

.calendar th, .calendar td {
    text-align: center;
    font-size: 12px;
    color: #FFF;
    padding: 3px
}

.calendar th {
    color: #C8D1D3;
    vertical-align: middle
}

.calendar th span {
    display: block;
    color: #FFF;
    font-weight: bold
}

.calendar th.sun {
    color: #D67E7E
}

.calendar th.sat {
    color: #67CDE5
}

.calendar th .this-month {
    display: flex;
    justify-content: space-between;
    margin: 0 0 15px 0
}

.calendar th .this-month button {
    background: none;
    border: none;
    color: #FFF
}

.calendar th .this-month button i {
    display: inline-block;
    transform: scale(0.7, 1)
}

.calendar th .this-month button i.prev {
    margin: 0 5px 0 0
}

.calendar th .this-month button i.next {
    margin: 0 0 0 5px
}

.calendar th .this-month div {
    font-size: 15px;
    color: #FFF
}

.calendar td.bk span {
    background: rgba(255, 255, 255, 0.15);
    padding: 11px 5px;
    text-align: center
}

.calendar td.bk span.bk-color {
    background: #FDD000
}

.calendar td.right-t {
    text-align: right
}

.calendar td time.small {
    font-size: 90%
}

.calendar td span {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    padding: 11px;
    display: block
}

.calendar td#mycld_ span {
    display: none
}

.calendar input[type=radio] {
    display: none
}

.calendar input[type=radio] + label {
    position: relative;
    display: block;
    padding: 10px 0
}

.calendar input[type=radio] + label:after, .calendar input[type=radio] + label:before {
    position: absolute;
    content: "";
    display: block;
    top: 50%
}

.calendar input[type=radio] + label:after {
    left: 4px;
    top: 1px;
    width: 15px;
    height: 15px;
    border: 2px solid #FDD000;
    border-radius: 50%
}

.calendar input[type=radio] + label:before {
    left: 8px;
    top: 5px;
    width: 7px;
    height: 7px;
    border: 2px solid #FDD000;
    border-radius: 50%
}

.calendar input[type=radio]:checked + label:before {
    opacity: 1
}

.calendar input[type=radio]:checked + label:before, .calendar input[type=radio]:checked + label:after {
    border-color: #303984
}

.login-wrap {
    padding: 30px 15px 30px 15px;
    color: #FFF
}

.login-wrap.plr0 {
    padding: 15px 0
}

.login-wrap .confirm-list li {
    border-bottom: 1px solid #565B86;
    padding: 15px 0
}

.login-wrap .confirm-list li:last-child {
    margin-bottom: 15px
}

.login-wrap .confirm-list li p.total {
    text-align: right;
    font-size: 24px;
    position: relative;
    top: -10px;
    margin-bottom: -10px
}

.login-wrap .confirm-list li p.total small {
    display: block;
    font-size: 12px
}

.login-wrap .confirm-list li p.total span {
    font-size: 14px
}

.login-wrap .confirm-list li p.total em {
    font-family: "Amiri", serif;
    font-size: 32px;
    letter-spacing: .1em
}

.login-wrap .confirm-list li h2 {
    margin: 0 0 5px 0
}

.login-wrap .confirm-list li h3 {
    font-size: 14px;
    margin: 0 0 5px 0
}

.login-wrap .confirm-list li h3 span {
    color: #D67E7E;
    font-size: 12px;
    margin: 0 0 0 10px;
    font-weight: bold
}

.login-wrap .confirm-list li .therapist {
    display: flex;
    align-items: center
}

.login-wrap .confirm-list li .therapist .face {
    overflow: hidden;
    border-radius: 50%;
    line-height: 0;
    margin: 0 10px 0 0
}

.login-wrap .confirm-list li .therapist .face img {
    width: 50px;
    height: 50px;
    object-fit: cover
}

.login-wrap .confirm-list li .therapist .value h3 {
    font-size: 14px
}

.login-wrap .confirm-list li .therapist .value p {
    font-family: "Amiri", serif;
    color: #FFBE2B
}

.login-wrap .confirm-list li .therapist .value p:before {
    content: "★"
}

.login-wrap .confirm-list li .therapist .value p small {
    font-size: 85%
}

.login-wrap .confirm-list li .two {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.login-wrap .confirm-list li .two.end {
    justify-content: flex-end
}

.login-wrap .confirm-list li .two.total > div:nth-child(1) {
    width: 40%
}

.login-wrap .confirm-list li .two.total > div:nth-child(2) {
    width: 40%;
    display: flex;
    align-items: center
}

.login-wrap .confirm-list li .two.total > div:nth-child(2) small {
    font-size: 24px
}

.login-wrap .confirm-list li .two.total > div:nth-child(2) input[type=text] {
    text-align: right;
    background: none;
    margin: 0;
    font-family: "Amiri", serif;
    font-size: 30px;
    padding: 0;
    letter-spacing: .1em
}

.login-wrap .confirm-list li .two .select-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 30%
}

.login-wrap .confirm-list li .two .select-wrap p {
    width: 35%;
    font-size: 14px
}

.login-wrap .confirm-list li .two .select-wrap .select-box {
    width: 65%
}

.login-wrap .confirm-list li .two .select-wrap .select-box:after {
    top: 23px
}

.login-wrap .confirm-list li .two .select-wrap .select-box select {
    padding: 15px 20px;
    background: #3331A5;
    border-radius: 5px
}

.login-wrap .confirm-list li .two .pic {
    width: 40%;
    line-height: 0;
    margin: 0 0 0 2%
}

.login-wrap .confirm-list li .two .link button {
    border: 2px solid #FDD000;
    color: #FDD000;
    padding: 7px 14px;
    background: transparent;
    font-weight: bold;
    border-radius: 5px;
    letter-spacing: .2em;
    font-size: 14px
}

.login-wrap h2 {
    font-size: 14px;
    margin: 0 0 10px 0;
    font-weight: bold
}

.login-wrap h2 span {
    color: #D67E7E;
    font-size: 12px;
    margin: 0 0 0 10px
}

.login-wrap p {
    font-size: 14px
}

.login-wrap .birth {
    display: flex;
    padding: 0 20px 0 0
}

.login-wrap .birth li {
    width: 28%;
    position: relative;
    margin-right: 8%
}

.login-wrap .birth li:last-child {
    margin-right: 0
}

.login-wrap .birth li.year:after {
    content: "年";
    position: absolute;
    right: -20px;
    top: 10px;
    font-size: 12px
}

.login-wrap .birth li.month:after {
    content: "月";
    position: absolute;
    right: -20px;
    top: 10px;
    font-size: 12px
}

.login-wrap .birth li.day:after {
    content: "日";
    position: absolute;
    right: -20px;
    top: 10px;
    font-size: 12px
}

.login-wrap .birth li span {
    display: block
}

.login-wrap .short {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.login-wrap .short .select-box, .login-wrap .short input {
    width: 90% !important
}

.login-wrap .select-box {
    position: relative
}

.login-wrap .select-box:after {
    content: "";
    position: absolute;
    right: 8px;
    top: 18px;
    width: 5px;
    height: 5px;
    border-top: 2px solid #FFF;
    border-left: 2px solid #FFF;
    pointer-events: none;
    transform: translateY(-50%) rotate(-135deg)
}

.login-wrap .select-box select {
    background: #3A387B;
    position: relative;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 10px 15px;
    box-sizing: border-box;
    color: #FFF;
    font-size: 14px;
    border-radius: 5px
}

.login-wrap input[type="text"], .login-wrap input[type="password"], .login-wrap input[type="number"] {
    width: 100%;
    padding: 10px 15px;
    color: #FFF;
    font-size: 14px;
    border-radius: 5px;
    box-sizing: border-box;
    border: none;
    background: rgba(255, 255, 255, 0.15);
    margin: 0 0 20px 0
}

.login-wrap input[type="text"].three, .login-wrap input[type="password"].three, .login-wrap input[type="number"].three {
    width: 35%
}

.login-wrap input[type=email] {
    width: 100%;
    padding: 10px 15px;
    color: #FFF;
    font-size: 14px;
    border-radius: 5px;
    box-sizing: border-box;
    border: none;
    background: rgba(255, 255, 255, 0.15);
    margin: 0 0 20px 0
}

.login-wrap textarea {
    width: 100%;
    padding: 10px 15px;
    color: #FFF;
    font-size: 14px;
    border-radius: 5px;
    box-sizing: border-box;
    border: none;
    background: rgba(255, 255, 255, 0.15);
    margin: 0 0 20px 0;
    height: 200px
}

.login-wrap p.forgetpassword {
    text-align: center;
    font-size: 13px;
    padding: 10px 0
}

.login-wrap p.forgetpassword a {
    color: #FFF;
    text-decoration: underline
}

.login-wrap p.notyet {
    text-align: center;
    margin: 30px 0 0 0
}

.login-wrap p.notyet a {
    border: 1px solid #FDD000;
    color: #FDD000;
    display: block;
    font-size: 14px;
    padding: 15px 0;
    font-weight: bold
}

.submit-wrap {
    margin: 10px 0
}

.submit-wrap button {
    background: #FDD000;
    padding: 15px;
    border: none;
    border-radius: 5px;
    width: 100%;
    box-sizing: border-box;
    color: #303984;
    font-weight: bold;
    font-size: 14px;
    box-shadow: 0px 10px 10px -3px rgba(0, 0, 0, 0.5)
}

.submit-wrap button.back {
    border: 1px solid #FDD000;
    background: none;
    color: #FDD000
}

.explain {
    padding: 30px 15px 15px 15px
}

.explain h2 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 15px 0
}

.explain p {
    font-size: 13px;
    color: #FFF
}

.explain.finish h2 {
    font-size: 20px;
    background: url("../img/checkbox.svg") no-repeat center top;
    background-size: 15vw;
    padding-top: 15vw;
    letter-spacing: initial;
}

.explain.finish p {
    text-align: center
}

p.con {
    color: #FFF;
    font-size: 12px;
    margin: 0 0 15px 0
}

.step {
    display: flex;
    padding: 15px 30px;
    margin: 0 auto;
    border-bottom: 1px solid #5A5656
}

.step dt {
    font-family: "Amiri", serif;
    color: #FFF;
    width: 15%;
    font-size: 13px;
    padding: 10px 0 0 0
}

.step dd {
    width: 85%
}

.step dd ul {
    display: flex;
    justify-content: space-between;
    margin: 0 0 20px
}

.step dd ul li {
    color: #FFF;
    font-size: 12px;
    text-align: center;
    position: relative
}

.step dd ul li:after {
    content: ">";
    position: absolute;
    top: 10px;
    right: -6vw;
    display: block;
    transform: scale(0.7, 1)
}

.step dd ul li:last-child:after {
    display: none
}

.step dd ul li span {
    background: rgba(255, 255, 255, 0.15);
    display: block;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    font-family: "Amiri", serif;
    color: #FFF;
    border-radius: 50%;
    font-size: 150%;
    margin: 0 0 5px 0;
    font-size: 20px
}

.step dd ul li p {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.step dd ul li.active {
    color: #FDD000
}

.step dd ul li.active span {
    background: #FDD000
}

.step2 {
    padding: 15px 15px;
    margin: 0 auto;
    border-bottom: 1px solid #5A5656
}

.step2 dt {
    font-family: "Amiri", serif;
    color: #FFF;
    display: block;
    font-size: 13px;
    padding: 10px 0 0 0
}

.step2 dd {
    width: 100%
}

.step2 dd ul {
    display: flex;
    justify-content: space-between;
    margin: 0
}

.step2 dd ul li {
    color: #FFF;
    font-size: 12px;
    text-align: center;
    position: relative
}

.step2 dd ul li:after {
    content: ">";
    position: absolute;
    top: 10px;
    right: -5vw;
    display: block;
    transform: scale(0.7, 1)
}

.step2 dd ul li:last-child:after {
    display: none
}

.step2 dd ul li span {
    background: rgba(255, 255, 255, 0.15);
    display: block;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    font-family: "Amiri", serif;
    color: #FFF;
    border-radius: 50%;
    font-size: 150%;
    margin: 0 0 5px 0;
    font-size: 20px
}

.step2 dd ul li p {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.step2 dd ul li.active {
    color: #FDD000
}

.step2 dd ul li.active span {
    background: #FDD000
}

.privacy-box {
    background: #FFF;
    border-radius: 5px;
    color: #001245;
    padding: 10px 15px;
    overflow-y: scroll;
    height: 100px
}

.privacy-box p {
    font-size: 14px
}

.check {
    text-align: center;
    margin: 20px 0
}

.check input[type=checkbox] {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

.check input[type=checkbox] + label {
    position: relative;
    color: #FFF;
    font-size: 14px;
    cursor: pointer;
    display: block;
    width: 78%;
    margin: 0 auto;
    padding-left: 20px
}

.check input[type=checkbox] + label:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    width: 16px;
    height: 16px;
    top: 1px;
    border: solid 2px #979797;
    border-radius: 3px;
    transition: all ease-in-out 0.125s
}

.check input[type=checkbox] + label:after {
    content: "";
    position: absolute;
    top: 11px;
    left: 5px;
    transform: rotate(-45deg) scaleX(0);
    transform-origin: left;
    width: 12px;
    height: 5px;
    border-left: 2px solid #303984;
    border-bottom: 2px solid #303984;
    transition: transform 0.125s ease-in-out
}

.check input:checked + label:before {
    background: #FDD000;
    border-color: #303984
}

.check input:checked + label:after {
    transform: rotate(-45deg) scaleX(1)
}

.review-all {
    padding: 0 15px 30px 15px;
    margin: 15px 0 30px 0
}

.review-all .review-title {
    display: flex;
    align-items: flex-start
}

.review-all .review-title .value {
    margin: 0 10px 0 0
}

.review-all .review-title .value p {
    color: #FDD000;
    display: inline-block;
    font-family: "Amiri", serif;
    font-size: 20px;
    position: relative;
    top: -5px
}

.review-all .review-title .value p:before {
    content: "★"
}

.review-all p.btn-all-review {
    margin: 30px 15px 0 0
}

.review-all p.btn-all-review a {
    border: 1px solid #FFF;
    display: block;
    color: #FFF;
    text-align: center;
    padding: 10px 0;
    font-size: 14px
}

.review-all h2 {
    color: #FFF;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 10px 0
}

.review-all ul li {
    border-top: 1px solid #565B86;
    padding: 15px 0
}

.review-all ul li:last-child {
    border-bottom: 1px solid #565B86
}

.review-all ul li .message {
    margin: 15px 0 0 0
}

.review-all ul li .message p {
    font-size: 14px;
    color: #FFF;
    white-space: normal !important
}

.review-all ul li p {
    color: #C8D1D3;
    font-size: 11px
}

.review-all ul li .date {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.review-all ul li .date p {
    color: #C8D1D3;
    font-size: 12px
}

.review-all ul li .date .value p {
    color: #FDD000;
    display: inline-block;
    font-family: "Amiri", serif;
    font-size: 16px
}

.review-all ul li .date .value p:before {
    content: "★"
}

.middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 768px
}

ul.tab-reserve {
    display: flex;
    justify-content: space-between
}

ul.tab-reserve li {
    width: 50%;
    color: #FFF;
    text-align: center;
    border-bottom: 1px solid #323A7F;
    font-size: 13px;
    padding: 15px 0;
    font-weight: bold
}

ul.tab-reserve li.active {
    border-bottom: 1px solid #FDD000;
    color: #FDD000
}

.reserve-wrap {
    padding: 15px
}

.reserve-wrap .tab_panel {
    display: none
}

.reserve-wrap .tab_panel.active {
    display: block
}

.reserve-wrap .tab_panel ul li {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    padding: 15px;
    margin: 0 0 15px 0
}

.reserve-wrap .tab_panel ul li.no-ma {
    background: none;
    border: 1px solid #323A7F;
    margin: 0 0 50px 0
}

.reserve-wrap .tab_panel ul li.mb0 {
    margin-bottom: 0
}

.reserve-wrap .tab_panel ul li .title {
    display: flex;
    justify-content: space-between
}

.reserve-wrap .tab_panel ul li .title .text {
    width: 75%
}

.reserve-wrap .tab_panel ul li .title .text h2 {
    color: #FFF;
    font-size: 14px;
    font-weight: bold
}

.reserve-wrap .tab_panel ul li .title .pic {
    width: 20%;
    max-height: 10.5vw;
    padding-bottom: 8px;
    text-align: right;
}

@media screen and (max-width: 736px) {
    .reserve-wrap .tab_panel ul li .title .pic {
        max-height: 11.8vw;
    }
}
.reserve-wrap .tab_panel ul li .title .pic img {
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
}

.reserve-wrap .tab_panel .reserve-content {
    position: relative
}

.reserve-wrap .tab_panel .reserve-content p.price {
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 14px;
    color: #FDD000;
    line-height: 1
}

.reserve-wrap .tab_panel .reserve-content p.price span {
    font-family: "Amiri", serif;
    font-size: 18px
}

.reserve-wrap .tab_panel .reserve-content table {
    width: 100%
}

.reserve-wrap .tab_panel .reserve-content table th, .reserve-wrap .tab_panel .reserve-content table td {
    color: #FFF;
    font-size: 11px;
    padding: 0 0 3px 0
}

.reserve-wrap .tab_panel .reserve-content table th {
    position: relative;
    width: 20%
}

.reserve-wrap .tab_panel .reserve-content table th:after {
    content: ":";
    position: absolute;
    right: 0
}

.reserve-wrap .tab_panel .reserve-content table td p.text-intro {
    line-height: 1.5
}

.reserve-wrap .tab_panel .reserve-content table td a.more {
    border-bottom: 1px solid #FDD000;
    color: #FDD000;
    padding: 0 0 3px 0
}

.reserve-wrap .two-btns-reserve {
    display: flex;
    justify-content: space-between
}

.reserve-wrap .two-btns-reserve > div {
    width: 48%
}

.reserve-wrap button.zoom {
    width: 100%;
    display: block;
    border: none;
    padding: 11px 0;
    color: #FFF;
    font-size: 14px;
    background: #2D8CFF;
    margin: 15px 0 0 0;
    border-radius: 5px
}

.reserve-wrap button.con {
    width: 100%;
    display: block;
    border: 1px solid #FFF;
    padding: 10px 0;
    color: #FFF;
    font-size: 14px;
    background: none;
    margin: 15px 0 0 0;
    border-radius: 5px
}

.reserve-wrap .explain-reserve {
    padding: 30px 0
}

.reserve-wrap .explain-reserve h2 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 15px 0
}

.reserve-wrap .explain-reserve p {
    font-size: 13px;
    color: #FFF
}

.under-kv-reserve {
    line-height: 0
}

.under-kv-reserve img {
    width: 100%;
    height: 170px;
    object-fit: cover
}

.message-wrap {
    background: #EFF1F7;
    border-radius: 5px;
    margin: -50px 15px 0 15px;
    position: relative;
    z-index: 999;
    padding: 15px
}

.message-wrap h2 {
    font-weight: bold;
    color: #001245;
    font-size: 14px;
    margin: 0 0 10px 0
}

.message-wrap p {
    font-size: 12px;
    margin: 0 0 10px 0
}

.message-wrap p span {
    padding: 3px;
    margin: 0 5px 0 0
}

.message-wrap p span.now {
    background: #FDD000;
    color: #303984
}

.message-wrap p span.done {
    color: #FDD000;
    border: 1px solid #FDD000
}

.message-wrap p.chat a {
    border: 1px solid #041242;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    display: block;
    padding: 7px 0
}

.message-wrap p.zoom a {
    background: #2D8CFF;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    display: block;
    padding: 12px 0;
    line-height: 0
}

.message-wrap p.zoom a img {
    width: 20%
}

.cancel-wrap p {
    font-size: 12px;
    margin: 0 0 20px 0
}

.cancel-wrap p a {
    color: #FFF;
    text-decoration: underline
}

.cancel-wrap h3 {
    font-size: 13px
}

.cancel-wrap ul {
    margin: 0 0 30px 0
}

.cancel-wrap ul li {
    font-size: 12px
}

.cancel-list {
    margin: 0 0 15px 0
}

.cancel-list ul li:not(:last-child) {
    margin: 0 0 10px 0
}

.cancel-list input[type=radio] {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

.cancel-list input[type=radio] + label {
    position: relative;
    color: #FFF;
    font-size: 15px;
    cursor: pointer;
    display: block;
    background: rgba(255, 255, 255, 0.15);
    display: block;
    padding: 15px;
    border-radius: 5px
}

.cancel-list input[type=radio] + label:before {
    content: "";
    display: block;
    position: absolute;
    right: 15px;
    width: 16px;
    height: 16px;
    top: 17px;
    border: solid 2px #979797;
    border-radius: 3px;
    transition: all ease-in-out 0.125s
}

.cancel-list input[type=radio] + label:after {
    content: "";
    position: absolute;
    top: 28px;
    right: 15px;
    transform: rotate(-45deg) scaleX(0);
    transform-origin: left;
    width: 12px;
    height: 5px;
    border-left: 2px solid #303984;
    border-bottom: 2px solid #303984;
    transition: transform 0.125s ease-in-out
}

.cancel-list input:checked + label:before {
    background: #FDD000;
    border-color: #303984
}

.cancel-list input:checked + label:after {
    transform: rotate(-45deg) scaleX(1)
}

.reason-detail {
    display: none
}

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

.two-btns.fixed {
    padding: 20px;
    position: fixed;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    background: #011245;
    z-index: 9999;
    max-width: 736px;
    left: 50%;
    transform: translateX(-50%)
}

.two-btns .back {
    width: 30%
}

.two-btns .back button {
    border: 1px solid #FDD000;
    color: #FDD000;
    border-radius: 5px;
    width: 100%;
    background: none;
    padding: 14px 0;
    font-size: 14px
}

.two-btns .submit-wrap {
    width: 67%;
    margin: 0
}

.star-rating {
    font-size: 0;
    white-space: nowrap;
    display: inline-block;
    width: 250px;
    height: 50px;
    overflow: hidden;
    position: relative;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2CAYAAACMRWrdAAAAAXNSR0IArs4c6QAAA5FJREFUaEPtWV1y0zAQ3k9peKWcgPYNks4QTkDsHIBwApIT0J6A9gSUE7ScgPYA+eEEpENdeCM5Aekr1FpGstzYTlIrTmu3HeslnrEl7bff6ttdBfRIBx4pLiqBLWOWBy+2mCsD9R7wHTi/xvchCtZmzO/Xj0H0XoFhoi8V1+s8eGCGrd9RIIC/fR9YW4sxv1c/BOhDFBgzfa60vN2iWcsMjAeNTeZ/iq3NBIgpUN2GM5oWCS4zML+3sw/wR2P8xPw+1yLCtIeWd/gggcl+XamfAcJdLR7AkQEzFq63/eCAca/WmYHgS+Fe6HCU/dqUCE8D1riL1sVxUeAyhaLs10dE9EqzxDiotM731XMiPEfC9V7fG2A82GkSgyX8ZmgUpGgQOBSJxkww+BJ4shUKRSAof8cha0SkBEQ5QcXplIUMnolIcGWomXV/fLsL8DHGZL82JMIb240WJeRowrZcZyhcz7H81vqzJLDrM2KxwgSoNpKybtKAYkYLS/qYndH0b+2/iAGLi0KwiEq4QsghUcXkpauxbWWhKhOija1gJX+TWahy623UvLsSmTnxWABuBFSddRMuD162mYVKB+asqvMp2nDO9Vm77bFQFW8b3Px6ChQ14Vxci0kuwHQIxnKV3nYM8LtVjeFefZdBnyKGTwBur7rOqsBvzGMLwE0BdmyNWqCQZ0C1uW5Y24BMTdA8qDWYSaUBXVGovGSTeBc4JTdQyshUYDosg4P/1QCbCNczSrfcd4kQPBOupxJ7bsMKWLRUsu2Sk02ocD2rvW4LudVmsl8/CfPPKnkn1gFAvoPzU62Ty7AEFqnaE62/CVOteoDcixof7bDz7qxTgQXige+Bm2fljy6d5NURgdsxChgnEBtdpXyJs5lrj5YOLJ7PToXrteeriLnomgKyq9iT/TqHb/O86EkFFrteYxxA9WFJlohOjfGxOpAYJwT5LOwY8rwySAUWFYD5U69KI+6E5ypgEseRnJecohnPQz1urjyCm6g/Sww5BaqdJW2LuhKIs2cWyUv2U4DFErMxLc7SMu8vYw85yf6NwBJ3GArDQpaWg9OMx9iL3pHcZUimMKb/cAjuJiB3syZYo6L6nhHwm7aN6jrAU8VjncWLnFsCK9L7WfYuGcvitSLnlIwV6f0se5eMZfFakXNKxor0fpa9S8ayeK3IOSVjRXo/y94lY1m8VuSckrEivZ9l75KxLF4rcs5/7xW2RmcdyZoAAAAASUVORK5CYII=");
    background-size: contain
}

.star-rating i {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20%;
    z-index: 1;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2CAYAAACMRWrdAAAAAXNSR0IArs4c6QAAArpJREFUaEPtmVGS0kAQhvsfimf3BitvClslnkASDiCeQDyB6wlcb7CeQDyBywEgeALZcoO+uZ5A9tlK2poAW4DJTGqSzMBW8kRVMt399T/pnjSgB3rhgXJRDZalLAdPHjM3AnkfiDx4P28PYRcUViyadkYgei1hmOhzww+HRw+2VuvXNggQtQ5BtUKKRZPOJUBvt8GY6WOjH567Vs0YjIPuCfNfqdbJHsQSaLbgzZcu4YzBosnZBcDv04IH0zv0w8ujBIunHVn9TjOCvxV+2Do6MJ60hwx8UgUO5jfoL0au4Iy2YjztzInomSboufDD5wcDxsFZjxgcI+ptgkIsugTeFIluSsHIil8WEJkEIsaSRbz6TUSCG7Okqfvfv1YBv6NYPG3PiPCiCkcKmzPhh17ZPvfBlkR4VLYTtT2+E/5iv2UUDmEHLE9RKOxxz0BVRea/4mEPju8AMYB3k7xrZV+pVbF6OAlFPXiL+2JiBSwpYjl6lWEwvwEeVAmVVFtVcBXAXQPNno1zpLZBy77GHF+VUC2tQWkV26jJwdMBs/hiuPXksmvhh7KxW7u0islIVCf5vJEKP8zlK6893XO5nMXTzhURvdQZU90H4lfwfkg7Vq6cYO3CJxLbX9ZaMA7aXWZ8KyHNVr/R9GAl9jObgx4t2PZ4TaHaeH1P+R7aHBlowdQjAHk04uGmKKzaAkaKnjcWfjgoYVtrTahPHqtJ1J8MK2OgOdw/RaynV3IkkKqerbKvAUtrzLsqZaUuSz1bZV8JltKYU1XKhksU31GPGR8a/ZsL7V4q+IBGseQPh9VsAvG5aYNdH8mSOSMQ9WyMwLXFo2DinC2vwZyl3tBxrZhh4pwtqxVzlnpDx7ViholztqxWzFnqDR3XihkmztmyWjFnqTd0XCtmmDhny2rFnKXe0HGtmGHinC37B+gDDUY3IDYBAAAAAElFTkSuQmCC");
    background-size: contain
}

.star-rating input {
    -moz-appearance: none;
    -webkit-appearance: none;
    opacity: 0;
    display: inline-block;
    width: 20%;
    height: 100%;
    margin: 0;
    padding: 0;
    z-index: 2;
    position: relative
}

.star-rating input:hover + i, .star-rating input:checked + i {
    opacity: 1
}

.star-rating i ~ i {
    width: 40%
}

.star-rating i ~ i ~ i {
    width: 60%
}

.star-rating i ~ i ~ i ~ i {
    width: 80%
}

.star-rating i ~ i ~ i ~ i ~ i {
    width: 100%
}

.choice {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    padding: 20px;
    display: block
}

.this-trouble {
    margin: 0 0 30px 0
}

.this-trouble ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.this-trouble ul li {
    width: 48%;
    margin: 0 0 4% 0;
    padding: 0 !important;
    background: none !important
}

.this-trouble ul li:nth-last-child(-n+2) {
    margin-bottom: 0
}

.this-trouble ul li input[type=checkbox] {
    display: none
}

.this-trouble ul li input[type=checkbox]:checked + label {
    background: #FDD000;
    color: #303984
}

.this-trouble ul li input[type=checkbox] + label {
    font-size: 15px;
    display: block;
    float: left;
    width: 100%;
    height: 45px;
    text-align: center;
    line-height: 45px;
    cursor: pointer;
    color: #FFF;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 50px
}

.ct-text, .ct-text2, .ct-text3 {
    color: #FFF;
    font-size: 12px
}

.count-text, .ct-text2 {
    color: #FFF;
    font-size: 12px
}

.ct-text span, .ct-text2 span {
    font-family: "Amiri", serif;
    font-size: 16px
}

.count-text span, .ct-text2 span, .ct-text3 span {
    font-family: "Amiri", serif;
    font-size: 16px
}

.explain-favorite {
    padding: 30px 15px
}

.explain-favorite h2 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 15px 0
}

.explain-favorite h2 svg {
    fill: #FD2F76 !important;
    stroke: #FFF !important;
    stroke-width: 2px;
    margin: 0 10px 0 0;
    position: relative;
    top: 5px
}

.explain-favorite p {
    font-size: 13px;
    color: #FFF
}

ul.message-list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 15px 5px 15px
}

ul.message-list li a .read i {
    background: #E94850;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    display: block;
    color: #FFF;
    border-radius: 50%;
    font-family: "Roboto", sans-serif;
    font-size: 12px
}

ul.message-list li a .person {
    display: flex;
    align-items: center
}

ul.message-list li a .person .pic {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%
}

ul.message-list li a .person .pic img {
    object-fit: cover;
    width: 100%;
    height: 50px
}

ul.message-list li a .person .name p {
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    margin: 0 0 0 15px
}

.chat-wrap {
    padding-bottom: 120px
}

.chat-wrap .chat-display {
    text-align: center;
}

.chat-wrap .chat-display time {
    background: rgba(255, 255, 255, 0.15);
    font-size: 11px;
    border-radius: 50px;
    padding: 3px 12px;
    color: #FFF
}

.chat-wrap .chat-display .me {
    position: relative;
    margin: 15px 0 0 0;
    overflow: hidden
}

.chat-wrap .chat-display .me .me-chat {
    float: right;
    margin: 0 15px 0 0;
    display: flex;
    align-items: flex-end;
    max-width: 75%
}

.chat-wrap .chat-display .me .me-chat p {
    color: #FFF;
    font-size: 10px;
    padding: 0 0 15px 0
}

.chat-wrap .chat-display .me .me-chat p span {
    display: block;
    font-family: "Roboto", sans-serif
}

.chat-wrap .chat-display .me .me-chat .talking {
    background: #304EA3;
    color: #FFF;
    padding: 10px;
    border-radius: 20px 0 20px 20px / 20px 0 20px 20px;
    margin: 0 0 0 10px;
    text-align: left;
}

.chat-wrap .chat-display .me .me-chat .talking a {
    font-size: 12px;
    color: #fff;
}

.chat-wrap .chat-display .me .me-chat .talking p {
    font-size: 13px;
    text-align: left;
    padding: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.chat-wrap .chat-display .me .me-chat .talking p a{
   color: #FFF;
   text-decoration: underline;
}

.chat-wrap .chat-display .you {
    position: relative;
    margin: 15px 0 0 0;
    overflow: hidden
}

.chat-wrap .chat-display .you .you-chat {
    float: left;
    margin: 0 0 0 15px;
    display: flex;
    align-items: flex-end;
    max-width: 85%
}

.chat-wrap .chat-display .you .you-chat p {
    color: #FFF;
    font-size: 10px;
    padding: 0 0 15px 0
}

.chat-wrap .chat-display .you .you-chat p span {
    display: block;
    font-family: "Roboto", sans-serif
}

.chat-wrap .chat-display .you .you-chat .face {
    width: 30px;
    margin-bottom: auto
}

.chat-wrap .chat-display .you .you-chat .face p {
    width: 30px;
    height: 30px;
    overflow: hidden;
}

.chat-wrap .chat-display .you .you-chat .face p img {
    object-fit: cover;
    width: 30px;
    height: 30px;
    border-radius: 50%
}

.chat-wrap .chat-display .you .you-chat .talking {
    width: 72%;
    background: #001245;
    color: #FFF;
    padding: 10px;
    border-radius: 0 20px 20px 20px / 0 20px 20px 20px;
    margin: 0 10px 0 0;
    text-align: left;
}
.chat-wrap .chat-display .you .you-chat .talking a{
   font-size: 12px;
    color: #fff;
}

.chat-wrap .chat-display .you .you-chat .talking p {
    font-size: 13px;
    text-align: left;
    padding: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.chat-wrap .chat-display .you .you-chat .talking p a{
    color: #FFF;
    text-decoration: underline;
}

#send-box {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    align-items: center
}

#send-box div.file_section {
    background: #1F1F1F;
}

#send-box div.send_section {
    padding: 20px 15px 15px 15px;
    box-sizing: border-box;
    background: #101010;
    display: flex;
    justify-content: space-between;
}

#send-box .btn {
    width: 8%
}

#send-box .btn button {
    background: none;
    border: none
}

#send-box .text {
    width: 87%
}

#send-box .text textarea {
    background: #1F1F1F;
    border-radius: 15px;
    font-size: 14px;
    width: 100%;
    height: 30px;
    max-height: 200px;
    padding: 5px 15px;
    box-sizing: border-box;
    color: #FFF;
    line-height: 20px;
    border: none
}

p.towom a {
    background: rgba(253, 208, 0, 0.1);
    padding: 15px;
    color: #FFF;
    display: block;
    font-size: 14px
}

p.towom a:after {
    content: ">";
    display: inline-block;
    float: right;
    transform: scale(0.7, 1)
}

.mypage-wrap {
    padding: 30px 15px
}

.mypage-wrap h2 {
    color: #FFF;
    font-size: 20px;
    font-weight: bold
}

.mypage-wrap h2 span {
    font-size: 12px;
    margin: 0 0 0 10px
}

.mypage-wrap2 button {
    background: rgba(255, 255, 255, 0.15);
    color: #FFF;
    font-size: 14px;
    text-align: center;
    padding: 10px 30px;
    border: none;
    border-radius: 50px;
    margin: 0 auto;
    display: block
}

.mypage-wrap2 dl {
    margin: 0 0 30px 0
}

.mypage-wrap2 dl dt {
    color: #FFF;
    font-weight: bold;
    font-size: 16px;
    margin: 0 15px 5px 15px
}

.mypage-wrap2 dl dd ul li a {
    display: block;
    background: rgba(255, 255, 255, 0.15);
    padding: 15px 15px 15px 45px;
    color: #FFF;
    font-size: 14px;
    margin: 0 0 5px 0
}

.mypage-wrap2 dl dd ul li a:after {
    content: ">";
    display: inline-block;
    float: right;
    transform: scale(0.7, 1)
}

.mypage-wrap2 dl dd ul li.basic {
    background: url(../img/icon-people.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.credit {
    background: url(../img/icon-credit.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.password {
    background: url(../img/icon-setting.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.faq {
    background: url(../img/icon-faq.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.flow {
    background: url(../img/icon-flow.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.contact {
    background: url(../img/icon-contact.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.service {
    background: url(../img/icon-service.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.privacy {
    background: url(../img/icon-service.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.exhibit {
    background: url(../img/icon-exhibit.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.display {
    background: url(../img/icon-display.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.calendar {
    background: url(../img/icon-calendar.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.reserved {
    background: url(../img/icon-reserved.svg) no-repeat 15px 50%;
    background-size: 15px
}

.mypage-wrap2 dl dd ul li.profit {
    background: url(../img/icon-profit.svg) no-repeat 15px 50%;
    background-size: 15px
}

.face-pic h2 {
    margin: 15px 0 3px 0
}

.face-pic ul {
    margin: 0 0 15px 0
}

.face-pic ul li {
    font-size: 12px
}

.face-pic .upload-label {
    display: block;
    background: url("../img/icon.svg") no-repeat;
    background-size: 80px;
    width: 80px;
    height: 80px;
    transition: 0.2s;
    position: relative
}

.face-pic .upload-label:after {
    content: "";
    width: 25px;
    height: 25px;
    background: url("../img/camera.svg") no-repeat;
    position: absolute;
    right: 0;
    bottom: 0
}

.face-pic .upload-label input {
    display: none
}

.face-pic .upload-label #preview {
    overflow: hidden;
    border-radius: 50%;
    width: 80px;
    height: 80px
}

.face-pic .upload-label #preview img {
    width: 80px;
    height: 80px;
    line-height: 0;
    object-fit: cover
}

.two-card {
    display: flex;
    justify-content: flex-start
}

.two-card > div:nth-child(1) {
    width: 60%;
    margin: 0 5% 0 0
}

.two-card > div:nth-child(2) {
    width: 19%
}

ul.faq-list li {
    padding: 20px 0 !important;
    border-bottom: 1px solid #323A7F;
    background: none !important;
    margin: 0 !important
}

ul.faq-list li:last-child {
    border: none
}

ul.faq-list li dl dt {
    color: #FFF;
    font-weight: bold;
    text-indent: -1.2em;
    padding-left: 1.2em;
    margin: 0 0 5px 0;
    font-size: 15px
}

ul.faq-list li dl dt:before {
    content: "Q.";
    font-family: "Roboto", sans-serif;
    color: #FDD000;
    font-size: 13px
}

ul.faq-list li dl dd {
    color: #FFF;
    font-size: 14px;
    text-indent: -1.2em;
    padding-left: 1.2em
}

ul.faq-list li dl dd:before {
    content: "A.";
    font-weight: bold;
    font-family: "Roboto", sans-serif;
    color: #FDD000;
    font-size: 13px
}

ul.faq-list li dl dd a {
    color: #FDD000;
    text-decoration: underline
}

.etc {
    padding: 30px 15px
}

.etc p {
    color: #FFF;
    margin-bottom: 15px;
    font-size: 13px
}

.flow-wrap {
    padding: 15px
}

.flow-wrap h2 {
    font-size: 18px;
    color: #FDD000;
    font-weight: bold;
    text-align: center
}

.flow-wrap ul {
    margin: 15px 0 0 0
}

.flow-wrap ul li {
    background: #EFF1F7;
    padding: 15px 15px 0 15px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    position: relative;
    margin-bottom: 30px
}

.flow-wrap ul li:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 12px 0 12px;
    border-color: #EFF1F7 transparent transparent transparent;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -15px
}

.flow-wrap ul li:last-child:after {
    display: none
}

.flow-wrap ul li .text {
    width: 65%
}

.flow-wrap ul li .text h3 {
    line-height: 1.5
}

.flow-wrap ul li .text h3 span {
    padding: 6px 9px 3px 9px;
    border-radius: 3px;
    background: #303984;
    color: #FDD000;
    font-size: 12px;
    font-family: "Amiri", serif
}

.flow-wrap ul li .text h3 span i {
    font-size: 18px
}

.flow-wrap ul li .text h3 em {
    display: block;
    color: #001245;
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0 5px 0
}

.flow-wrap ul li .text p {
    font-size: 12px;
    padding-bottom: 15px
}

.flow-wrap ul li .pic {
    width: 35%;
    line-height: 0
}

.file-up {
    margin: 0 0 20px 0;
    position: relative
}

.file-up .delete {
    display: none;
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 999;
    background: #FDD000;
    width: 30px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    line-height: 30px;
    border-radius: 50%;
    color: #001245;
    cursor: default;
}

.file-up .delete.show {
    display: block
}

.file-up .upload-label {
    display: block;
    background: #FFF;
    transition: 0.2s;
    position: relative;
    color: #333;
    width: 45%;
    border-radius: 50px;
    padding: 20px 40px;
    box-sizing: border-box;
    font-weight: bold
}

.file-up .upload-label:before {
    content: "ファイルを選択";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px;
    white-space: nowrap;
    color: #333
}

.file-up .upload-label:after {
    content: "選択されていません";
    font-size: 11px;
    left: 105%;
    position: absolute;
    white-space: nowrap;
    color: #FFF;
    top: 35%
}

.file-up .upload-label.plus {
    background: none;
    padding: 0;
    width: 100%
}

.file-up .upload-label.plus:before {
    display: none
}

.file-up .upload-label.plus:after {
    display: none
}

.file-up .upload-label input {
    display: none
}

.file-up .upload-label #preview {
    overflow: hidden
}

.file-up .upload-label #preview img {
    line-height: 0;
    object-fit: cover
}

dl.img-check {
    margin: 0 0 30px 0
}

dl.img-check dt {
    border: 1px solid #FFF;
    padding: 5px;
    text-align: center
}

dl.img-check dd {
    border: 1px solid #FFF;
    border-top: none;
    padding: 15px;
    font-size: 13px
}

dl.img-check dd ul li {
    background: url("../img/check.svg") no-repeat left 50%;
    background-size: 12px;
    padding: 0 0 0 22px
}

dl.license-check {
    margin: 0 0 30px 0
}

dl.license-check dt {
    border: 1px solid #565B86;
    padding: 5px 15px
}

dl.license-check dd {
    border: 1px solid #565B86;
    border-top: none;
    padding: 15px 15px 0 15px;
    font-size: 13px
}

.radio-btns2 {
    display: flex
}

.radio-btns2 li {
    margin: 0 20px 0 0
}

.radio-btns2 li input[type=radio] {
    display: none
}

.radio-btns2 li li:not(:last-child) {
    margin: 0 0 10px 0
}

.radio-btns2 li label {
    position: relative;
    color: #FFF;
    display: block;
    padding: 15px 15px 15px 30px;
    border-radius: 5px
}

.radio-btns2 li input[type=radio] + label::before {
    position: absolute;
    content: '';
    display: block;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: transparent;
    border: 2px solid #FFF;
    left: 0;
    top: 30%
}

.radio-btns2 li input[type=radio] + label::after {
    position: absolute;
    content: '';
    display: block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #FDD000;
    left: 5px;
    top: 39%;
    opacity: 0;
    transition: .3s
}

.radio-btns2 li input[type=radio]:checked + label::after {
    opacity: 1
}

.radio-btns2 li input[type=radio]:checked + label::before {
    border: 2px solid #FDD000
}

.add {
    text-align: right;
    margin: 0 0 30px 0
}

.add button {
    border: 1px solid #FDD000;
    color: #FDD000;
    padding: 7px 21px;
    background: none;
    font-size: 14px
}

.service-camera-wrap {
    margin: 0 0 0 15px
}

.service-camera-wrap h2 {
    font-size: 14px;
    margin: 0 0 10px 0;
    font-weight: bold;
    color: #FFF
}

.service-camera-wrap ul.service-camera-list {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-right: 15px
}
.service-camera-wrap ul.service-camera-list li {
    display: inline-block;
    width: 40%;
    position: relative;
    vertical-align: top
}
@media only screen and (min-width:736px) {
.service-camera-wrap ul.service-camera-list {
	   display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
	.service-camera-wrap ul.service-camera-list li {
		width:18%;
	}
}
.service-camera-wrap ul.service-camera-list li:before {
    content: "";
    position: absolute;
    background: rgba(48, 57, 132, 0.15);
    width: 26px;
    height: 26px;
    line-height: 26px;
    vertical-align: middle;
    text-align: center;
    color: #070809;
    font-family: "Roboto", sans-serif;
    z-index: 99;
    border-radius: 50%;
    top: 5px;
    left: 5px
}

.service-camera-wrap ul.service-camera-list li:nth-child(1):before {
    content: "1"
}

.service-camera-wrap ul.service-camera-list li:nth-child(2):before {
    content: "2"
}

.service-camera-wrap ul.service-camera-list li:nth-child(3):before {
    content: "3"
}

.service-camera-wrap ul.service-camera-list li:nth-child(4):before {
    content: "4"
}

.service-camera-wrap ul.service-camera-list li:nth-child(5):before {
    content: "5"
}

.service-camera-wrap ul.service-camera-list li:nth-child(6):before {
    content: "6"
}

.service-camera-wrap ul.service-camera-list li:nth-child(7):before {
    content: "7"
}

.service-camera-wrap ul.service-camera-list li:nth-child(8):before {
    content: "8"
}

.service-camera-wrap ul.service-camera-list li:nth-child(9):before {
    content: "9"
}

.service-camera-wrap ul.service-camera-list li:nth-child(10):before {
    content: "10"
}

.service-camera-wrap ul.service-camera-list li:nth-child(1):after {
    content: "(必須)";
    position: absolute;
    z-index: 99;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #303984;
    font-size: 13px;
    pointer-events: none
}

.service-camera-wrap ul.service-camera-list li .file-up-camera {
    margin: 0 0 20px 0;
    position: relative
}
.service-camera-wrap ul.service-camera-list li .file-up-camera .delete {
    display: none;
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 999;
    background: #FDD000;
    width: 30px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    line-height: 30px;
    border-radius: 50%;
    color: #001245
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label {
    display: block;
    transition: 0.2s;
    position: relative;
    width: 100%;
    height: 100px;
    background: #DDD
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label:before {
    content: "";
    font-size: 12px;
    width: 25px;
    height: 18px;
    color: #333;
    background: url("../img/icon-camera.svg") no-repeat;
    background-size: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label.plus {
    background: none;
    padding: 0;
    width: 100%
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label.plus:before {
    display: none
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label.plus:after {
    display: none
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label input {
    display: none
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview2, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview3, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview4, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview5, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview6, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview7, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview8, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview9, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview10 {
    overflow-y: hidden;
    position: relative;
    z-index: 999
}

.service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview2 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview3 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview4 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview5 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview6 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview7 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview8 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview9 img, .service-camera-wrap ul.service-camera-list li .file-up-camera .upload-label #preview10 img {
    line-height: 0;
    object-fit: cover;
    width: 100%;
    height: 100px
}

.calendar-service {
    width: 100%
}

.calendar-service th, .calendar-service td {
    text-align: center;
    font-size: 12px;
    color: #FFF;
    padding: 3px
}

.calendar-service th {
    color: #C8D1D3;
    vertical-align: middle
}

.calendar-service th span {
    display: block;
    color: #FFF;
    font-weight: bold
}

.calendar-service th.sun {
    color: #D67E7E
}

.calendar-service th.sat {
    color: #67CDE5
}

.calendar-service th .this-month {
    display: flex;
    justify-content: space-between;
    margin: 0 0 15px 0
}

.calendar-service th .this-month button {
    background: none;
    border: none;
    color: #FFF
}

.calendar-service th .this-month button i {
    display: inline-block;
    transform: scale(0.7, 1)
}

.calendar-service th .this-month button i.prev {
    margin: 0 5px 0 0
}

.calendar-service th .this-month button i.next {
    margin: 0 0 0 5px
}

.calendar-service th .this-month div {
    font-size: 15px;
    color: #FFF
}

.calendar-service td.bk span {
    background: rgba(255, 255, 255, 0.15);
    padding: 11px 5px;
    text-align: center
}

.calendar-service td.bk span label {
    position: relative;
    display: block;
    padding: 9px 0
}

.calendar-service td.bk span label:before {
    content: "✕";
    position: absolute;
    left: 50%;
    transform: translateY(-50%);
    margin-left: -5px;
    top: 10px
}

.calendar-service td.bk span.bk-color input[type=checkbox] + label::before {
    position: absolute;
    content: '✕';
    display: inline-flex;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: transparent;
}

.calendar-service td.bk span.bk-color input[type=checkbox] + label::after {
    position: absolute;
    content: '';
    display: block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 2px solid #FDD000;
    left: 50%;
    transform: translateY(-50%);
    margin-left: -6px;
    top: 10px;
    opacity: 0;
    transition: .3s
}

.calendar-service td.bk span.bk-color input[type=checkbox]:checked + label::after {
    opacity: 1
}

.calendar-service td.bk span.bk-color input[type=checkbox]:checked + label::before {
    border: 2px solid #FDD000;
    content: "";
    left: 50%;
    transform: translateY(-50%);
    margin-left: -10px;
    top: 10px
}

.calendar-service td.right-t {
    text-align: right
}

.calendar-service td time.small {
    font-size: 90%
}

.calendar-service td span {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    padding: 11px;
    display: block;
    min-height: 40px;
    box-sizing: border-box
}

.calendar-service td#mycld_ span {
    display: none
}

ul.city {
    margin: 0
}

ul.city.mb30 {
    margin-bottom: 30px !important
}

ul.city li {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 5px;
    margin: 0 0 13px 0
}

ul.city li:last-child {
    margin: 0
}

ul.city li input[type=checkbox] {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

ul.city li input[type=checkbox] + label {
    position: relative;
    color: #FFF;
    font-size: 15px;
    cursor: pointer;
    display: block;
    padding: 13px
}

ul.city li input[type=checkbox] + label:before {
    content: "";
    display: block;
    position: absolute;
    right: 15px;
    width: 16px;
    height: 16px;
    top: 15px;
    border: solid 2px #979797;
    border-radius: 3px;
    transition: all ease-in-out 0.125s
}

ul.city li input[type=checkbox] + label:after {
    content: "";
    position: absolute;
    top: 25px;
    right: 15px;
    transform: rotate(-45deg) scaleX(0);
    transform-origin: left;
    width: 12px;
    height: 5px;
    border-left: 2px solid #303984;
    border-bottom: 2px solid #303984;
    transition: transform 0.125s ease-in-out
}

ul.city li input:checked + label:before {
    background: #FDD000;
    border-color: #303984
}

ul.city li input:checked + label:after {
    transform: rotate(-45deg) scaleX(1)
}

p.btn-display {
    position: fixed;
    bottom: 100px;
    right: 15px;
    width: 75px;
    animation: fade 1s ease-in-out
}

@keyframes fade {
    0% {
        bottom: -100px
    }
    100% {
        bottom: 100px
    }
}

p.btn-display a {
    display: block
}

.mb70 {
    margin-bottom: 70px !important
}

.att {
    margin: 30px 15px 15px 15px
}

.att h2 {
    border: 1px solid #FDD000;
    color: #FDD000;
    font-size: 12px;
    text-align: center;
    padding: 5px 0
}

.lock {
    overflow: hidden
}

#modal-target {
    display: none;
    position: relative;
    width: 100%;
    height: 100%
}

.modal-content {
    display: none
}

.modal-overlay {
    z-index: 9998;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%
}

.modal-wrap {
    z-index: 9999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch
}

.modal-open {
    color: #00f;
    text-decoration: underline
}

.modal-open:hover {
    cursor: pointer;
    color: #f00
}

.modal-close {
    /*font-size: 200%*/
}

.modal-close:hover {
    /*cursor: pointer;*/
    /*color: #f00*/
}

.modal-content > div {
    width: 90%;
    position: absolute;
    box-sizing: border-box;
    background: #001245;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0 15px 30px 15px;
    box-sizing: border-box
}

.modal-content > div img {
    max-width: 100%
}

.confirm-btn-atana {
    margin: 2px auto 10px;
    background: none;
    color: white;
    padding: 2px 4px;
    font-weight: bold;
    border: 1px solid #303984;
    width:200px;
    border-radius:5px;
}
.cancel-btn-atana {
    text-align: center;
    margin: 2px auto 10px;
    background: none;
    color: white;
    padding: 2px 4px;
    font-weight: bold;
    border: 1px solid #303984;
    width:200px;
    border-radius:5px;
}

.align-button {
    text-align: center;
}
.no_modal .button-area {
    bottom: 0%;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.circle-orange_ttl {
    border: 2px solid #FB7122;
    color: #FB7122;
    border-radius: 50px;
    width: 45px;
    height: auto;
    margin: 50px auto 20px;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    padding: 3px 0px;
    filter: drop-shadow(0px 10px 16px rgba(251, 113, 34, 0.6));
}

h2.modal_ttl {
    text-align: center;
    width: 100%;
    line-height: 160%;
    font-size: 22px;
}

.titlebox {
    width: 200px;
    height: 200px;
    padding: 25px;
    box-sizing: border-box;
    background: rgba(0, 159, 231, 0.8)
}

.textarea h3 {
    font-size: 16px;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    padding: 15px 0;
    border-bottom: 1px solid #A3A3A3;
    margin: 0 0 15px 0
}

.textarea p span {
    background: rgba(255, 255, 255, 0.2);
    color: #FFF;
    padding: 3px 9px;
    font-size: 13px;
    border-radius: 50px
}

.textarea h2 {
    margin: 15px 0 0 0;
    color: #FFF;
    font-size: 16px;
    font-weight: bold
}

.textarea .price p {
    color: #FDD000;
    text-align: right;
    font-size: 13px
}

.textarea .price p em {
    font-family: "Amiri", serif;
    font-size: 18px
}

.textarea table {
    width: 100%
}

.textarea table th, .textarea table td {
    color: #FFF;
    font-size: 13px
}

.textarea table th {
    width: 30%
}

.textarea table th:after {
    content: ":";
    float: right
}

.textarea table td {
    padding: 0 0 5px 5px
}

.textarea table td .customer-info {
    display: flex;
    justify-content: space-between
}

.textarea table td .customer-info .text {
    width: 50%
}

.textarea table td .customer-info .pic {
    width: 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%
}

.textarea table td .customer-info .pic img {
    width: 60px;
    height: 60px;
    object-fit: cover
}

p.closemodal {
    position: fixed;
    font-size: 16px
}

p.closemodal a {
    color: #FFF
}

p.closemodal a:hover {
    color: #333
}

@media only screen and (max-width: 736px) {
    p.closemodal {
        top: 5px;
        right: 10px
    }
}

span.tel {
    color: #FFF !important;
    margin: 0 !important;
    font-size: 13px !important
}

span.tel a {
    color: #FFF !important
}

.circle {
    margin: 30px auto;
    position: relative;
    width: 250px;
    height: 250px
}

.circle:before {
    content: "";
    position: absolute;
    width: 250px;
    height: 250px;
    left: 50%;
    margin-left: -125px;
    display: block;
    background: url("../img/circle.svg?20221019") no-repeat;
    background-size: 100%;
    animation: rot 2s linear infinite;
}

@keyframes rot {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

.circle .total {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    text-align: center
}

.circle .total p {
    color: #FFF
}

.circle .total h2 {
    font-size: 38px;
    color: #FFF;
    font-family: "Amiri", serif
}

.circle .total h2 em {
    font-size: 42px;
    font-family: "Amiri", serif;
    font-weight: bold
}

.circle .total time {
    font-size: 12px;
    color: #FDD000
}

.sell-wrap {
    margin: 0 15px
}

.sell-wrap h2 {
    color: #FFF;
    margin: 0 0 10px 0;
    font-size: 14px
}

.sell-wrap ul.linkver li a {
    display: flex;
    background: rgba(255, 255, 255, 0.15);
    height: 65px;
    align-items: center;
    justify-content: space-between;
    padding: 0 45px 0 15px;
    position: relative;
    margin: 0 0 5px 0;
    border-radius: 5px
}

.sell-wrap ul.linkver li a:after {
    content: ">";
    display: block;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%) scale(0.7, 1);
    color: #FFF
}

.sell-wrap ul.linkver li a .left time {
    color: #C8D1D3;
    font-size: 14px
}

.sell-wrap ul.linkver li a .right p {
    font-family: "Amiri", serif;
    color: #FFF;
    font-weight: bold;
    font-size: 18px
}

.sell-wrap ul.no-linkver li {
    display: flex;
    background: rgba(255, 255, 255, 0.15);
    height: 65px;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px 0 15px;
    position: relative;
    margin: 0 0 2px 0;
    border-radius: 5px
}

.sell-wrap ul.no-linkver li .left h3 {
    color: #FFF;
    font-size: 14px
}

.sell-wrap ul.no-linkver li .left time {
    color: #C8D1D3;
    font-size: 12px
}

.sell-wrap ul.no-linkver li .right p {
    font-family: "Amiri", serif;
    color: #FFF;
    font-weight: bold;
    font-size: 18px
}

.total-box {
    margin: 30px 15px 15px 15px;
    padding: 30px 15px;
    background: #001245
}

.total-box table {
    width: 100%
}

.total-box table th {
    color: #FFF;
    font-size: 13px;
    vertical-align: bottom
}

.total-box table th span {
    font-size: 16px;
    display: block;
    line-height: 2;
    margin: 10px 0 0 0;
    font-weight: bold
}

.total-box table td {
    text-align: right;
    color: #FFF;
    font-size: 13px;
    vertical-align: bottom
}

.total-box table td span {
    font-size: 26px;
    font-family: "Amiri", serif;
    line-height: 1;
    display: block;
    font-weight: bold
}

.total-box table td span em {
    font-size: 30px;
    font-family: "Amiri", serif;
    font-weight: bold
}

.btn_fileupload {
    background: unset !important; ;
    background-size: 14px;
    border: none;
    cursor: pointer;
    color: #fff;
}