.validate-failed {
    border: 1px red solid !important;
}

/* Your custom CSS styles here */
.product-variants-wp {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}

.option.product-about .product-about-item {
    border-top: 1px solid #B2C2C1;
}

.option.product-about .product-about-item:first-child {
    border-top: none;
}

.product-title {
    font-size: 18px;
    font-weight: 700;
}
.product-description {
    margin-top: 20px;
}
.product-price {
    font-weight: bold;
    color: black;
}
.product-thumbnail img {
    max-width: 100%;
    height: auto;
}
.product-rating {
    margin-top: 20px;
}

.announcement-bar-container {
    padding: 8px 0;
    font-weight: bold;
    font-size: 14px;
}

.announcement-bar-container .link a {
    font-weight: 400;
    font-size: 14px;
    padding-left: 12px;
}

@media screen and (max-width: 768px){
    .announcement-bar-container {
        font-size: 10px;
    }
    
    .announcement-bar-container .link a {
        font-size: 10px;
    }
}

.section.section-breadcrumb a,.section.section-breadcrumb span{
    font-size: 14px;
    font-weight: 300;
}

/*  */
.accordion2 .title {
    display: block;
    padding: 40px 0;
    margin-bottom: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 30px;
}
 
@media screen and (max-width: 768px) {
    .accordion2 .title  {
        padding: 24px 0;
        font-size: 16px;
        line-height: 27px;
    }
}
 
.filter-block {
    border-bottom: 1px solid #B2C2C1
}
 
.accordion2  .title{
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 0;
}
 
.filter-block .filter-block-header::before, .filter-block .filter-block-header::after {
    display: none;
}
 
@media screen and (max-width: 768px) {
    .filter-block .filter-block-header {
        /* padding: 16px 0; */
        color: #051817;
    }
}
 
.filter-block-header svg {
    width: 18.5px;
    height: 18.5px;
}
 
@media screen and (max-width: 768px) {
    .filter-block-header svg {
        width: 14px;
        height: 14px;
    }
}
 
.title .icon-minus { 
    display: none;
}
 
.toggle:checked + .title .icon-plus {
    display: none;
}
 
.toggle:checked + .title .icon-minus {
    display: inline-block;
}
 
.toggle:checked + .title + .content {
    max-height: none;
    padding: 40px 0;
    transition: all 0.3s ease;
}
 
@media screen and (max-width: 768px) {
    .filter-block .toggle:checked + .title + .content {
        padding: 0 0 24px;
    }
 
    .filter-block-more {
        margin-top: 24px;
    }
}
 
.filter-block-more a, .filter-block-more button {
    border: 0;
    padding: 0;
    color: #051817;
    background-color: transparent;
}
 
.filter-block-inner + .filter-block-inner {
    margin-top: 40px;
}
 
.filter-block-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
 
.filter-block-content h3 {
    font-size: 17px;
    font-weight: 700;
    border-left:4px solid #B2C2C1;
    padding-left: 4px;
    margin-bottom: 24px;
}
 
.grid-2-col .grid-item{
    width: calc(50% - 16px * 2 / 3);
    max-width: calc(50% - 16px * 2 / 3);
}
 
.grid-3-col .grid-item{
    width: calc(33.33% - 16px * 2 / 3);
    max-width: calc(33.33% - 16px * 2 / 3);
}
 
.grid-4-col .grid-item{
    width: calc(25% - 16px * 2 / 3);
    max-width: calc(25% - 16px * 2 / 3);
}
 
@media screen and (max-width: 768px) {
    .filter-block-grid {
        gap: 12px;
    }
    .grid-2-col .grid-item{
        width: calc(50% - 12px * 2 / 3);
        max-width: calc(50% - 12px * 2 / 3);
    }
    .grid-3-col .grid-item{
        width: calc(33.33% - 12px * 2 / 3);
        max-width: calc(33.33% - 12px * 2 / 3);
    }
    .grid-4-col .grid-item{
        width: calc(25% - 12px * 2 / 3);
        max-width: calc(25% - 12px * 2 / 3);
    }
 
    .grid-2-col-sm .grid-item{
        width: calc(50% - 12px * 2 / 3);
        max-width: calc(50% - 12px * 2 / 3);
    }
}
 
.filter-control {
    position: relative;
    display: flex;
    align-items: center;
    padding: 16px 8px;
    gap: 0 6px;
}
 
.filter-control input {
    cursor: pointer;
    opacity: 0;
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
 
.check-mark {
    line-height: 1;
}
 
.check-mark img{
    object-fit: contain;
    width: 18px;
    height: 18px;
}
 
@media screen and (max-width: 768px) {
    .check-mark img{
        min-width: 14px;
        min-height: 14px;
        width: 14px;
        height: 14px;
    }
 
}
 
.checked {
    display: none;
}
 
.filter-control input:checked + .check-mark, .filter-control input:checked + .check-mark + .filter-bg {
    border-color: #21D4C8;
}
 
.filter-control input:checked + .check-mark img.checked {
    display: block;
}
 
.filter-control input:checked + .check-mark img.uncheck {
    display: none;
}
 
.filter-control label {
    margin-bottom: 0;
    font-family: Roboto;
    font-size: 16px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 0.04em;
}
 
@media screen and (max-width: 768px){
    .filter-control label {
        font-size: 12px;
        line-height: 10.8px;
    }
}
 
.filter-select {
    position: relative;
    border: 1px solid #B2C2C1;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
}
 
.filter-select .select-arrow {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    pointer-events: none;
}
 
.filter-select .select-arrow svg{
    width: 18px;
    height: 10px;
}
 
.filter-control select {
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 14px 40px 14px 16px;
    width: 321px;
    max-width: 100%;
    height: auto;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    border: 0;
}
 
@media screen and (max-width: 768px) {
    .filter-control select {
        font-size: 12px;
    }
}
 
.filter-select-control {
    padding: 0;
}
 
.filter-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 1px solid #B2C2C1;
    border-radius: 8px;
    z-index: -1;
}
 
.more-filter, .filter-action {
    padding: 40px 0;
}
 
.more-filter button {
    border: 0;
    background-color: transparent;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
}
 
.filter-action .filter-action-button {
    width: 343px;
    height: 56px;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #21D4C8;
    border-radius: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}
 
@media screen and (max-width: 768px) {
    .more-filter, .filter-action {
        padding: 16px 0;
    }
}

/* Product modal */
.modal-custom .modal-footer {
    padding: 16px;
    text-align: center;
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    box-shadow: 0px -4px 4px 0px #00000014;
    background-color: #fff;
}
 
.modal-custom .modal-footer button{
    padding: 8px 0;
    width: 100%;
    height: 56px;
    max-width: 100%;
    background: linear-gradient(180deg, #35F1E5 0%, #21D4C8 100%);
    border-radius: 8px;
    border: none;
    letter-spacing: 1px;
    text-align: center;
    font-size: 14pt !important;
    color: #fff !important;
    font-family: "Noto Sans JP", sans-serif;
}

.modal-custom .modal-footer button:hover{
    background: linear-gradient(180deg, #21D4C8 0%, #35F1E5 100%);
}
 
/*  */
.filter-field-container, .filter-message-container {
    padding: 16px 0;
}
 
.filter-field-container {
    display: flex;
    gap: 8px;
    overflow: auto;
}

.filter-field {
    display: inline-block;
    border: 1px solid #B2C2C1;
    padding: 7px 8px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    min-width: max-content;
}
 
.filter-message-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
 
.filter-message-left {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Roboto;
    font-size: 22px;
    font-weight: 400;
    line-height: 31px;
}
 
.filter-message-left .check-mark {
    line-height: 0;
}
 
@media screen and (max-width: 768px){
    .filter-message-left {
        font-size: 14px;
    }
}
 
.filter-message-left .filter-control {
    padding: 0;
}
 
.filter-message-right {
    font-size: 16px;
}
 
@media screen and (max-width: 768px){
    .filter-message-right {
        font-size: 12px;
    }
 
    .filter-message-right img {
        width: 15px;
        object-fit: contain;
    }
}
 
.filter-products {
    display: flex;
    flex-wrap: wrap;
    gap: 60px 0;
}
 
.filter-products .card {
    width: 20%;
    max-width: 20%;
    word-break: break-all;
    padding: 0 8px;
}
 
@media screen and (max-width: 768px){
    .filter-products .card{
        width: 33.33%;
        max-width: 33.33%;
        padding: 0 4px;
    }
}
 
.filter-products .card__heading--small {
    margin-bottom: 8px !important;
}
 
.small {
    display: inline-block;
    color: #05181780;
}
 
.filter-products .card__heading {
    font-size: 16px;
    font-weight: 400;
}
 
@media screen and (max-width: 768px){
    .filter-products .card__heading {
        font-size: 12px;
    }
 
    .small {
        font-size: 9px;
    }
}
 
.card-product-price {
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
}
 
.card-product-price .price {
    font-family: Roboto;
    font-size: 22px;
    font-weight: 700;
    line-height: 26px;
}
 
@media screen and (max-width: 768px){
    .card-product-price .price {
        font-size: 16px;
    }
}
 
.card-product-star {
    margin-bottom: 16px;
    line-height: 1;
}
 
.card-product-star img {
    width: 20px;
}
 
@media screen and (max-width: 768px) {
    .card-product-star img {
        width: 16px;
    }
}
 
.card-product-reviews {
    font-family: Roboto;
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
}
 
.product-card-wp .card__caption {
    gap: 12px 8px;
}
 
.filter-products .card__caption span {
    font-size: 14px;
    font-weight: 500;
}
 
@media screen and (max-width: 768px){
    .filter-products .card__caption span {
        font-size: 10px;
    }
 
    .product-card-wp .card__caption {
        gap: 8px
    }
}
 
.card__caption span.bg-green {
    background: #D5E5E0;
    color: #27795C;
}
 
.card__caption span.bg-light-green {
    background: #E3F5DD;
    color: #68BB4B;
}
 
 
.card__caption span.bg-blue{
    background: #21D4C8;
    color: #fff;
 
}
 
.card__caption span.bg-brow {
    background: #F4E1CF;
    color: #66380E;
}
 
 
.card__caption span.bg-pink {
    background: #FFF0F5;
    color: #EA578C;
 
}
 
.card__caption span.bg-yellow {
    background: #FFF5D1;
    color: #DCAC00;
}
 
.card__caption span.bg-orange {
    background: #FFE8D2;
    color: #FF8F28;
}
 
.card__alert {
    margin-bottom: 0;
    font-size: 14px;
}
 
.card__alert span{
    padding: 4px;
    color: #B2C2C1;
    border: 1px solid #B2C2C1;
    border-radius: 3px;
    line-height: 35px;
}
 
@media screen and (max-width: 768px){
    .card__alert{
        font-size: 12px;
    }
}
 
.pagination {
    margin-top: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px ;
}
 
.pagination a {
    border: 1px solid #B2C2C1;
    width: 48px;
    height: 48px;
    border-radius: 100%;
    color: #21D4C8;
    display: flex;
    justify-content: center;
    align-items: center;
}
 
@media screen and (max-width: 768px){
    .pagination {
        margin-top: 40px;
        gap: 16px;
    }
    
    .pagination .pagination-space, .pagination .pagination-num {
        display: none;
    }
}
 
 
.header img{
    width: 100%;
    object-fit: cover;
}
 
.announcement-bar-section {
    background-color: #F2F2F2;
}
 
.breadcrumb-wp {
    display: flex;
    align-items: center;
    gap: 0 8px;
    color:  #21D4C8;
    padding: 8px 0;
    overflow-x: auto;
}
 
.breadcrumb-wp > * {
    min-width: fit-content;
}
 
.breadcrumb-wp a {
    color:  #21D4C8;
}
 
.breadcrumb-wp .active{
    color: var(--color-dark);
}
 
/* product detail */
.product-grid {
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-areas: 
        "product-media product-detail"
        "product-related product-detail";
}

@media screen and (min-width: 992px){
    .product-grid {
        grid-template-columns: repeat(auto-fit, min(580px));
        justify-content: space-between;
    }

    .product-detail {
        max-width: 360px;
    }

    .product-service .product-detail {
        max-width: none;
    }
}

@media screen and (max-width: 991px){
    .product-grid {
        grid-template-columns: repeat(auto-fit, minmax(325px, 1fr));
        grid-template-rows: auto;
        grid-template-areas: 
        "product-media"
        "product-detail"
        "product-related";
    }
}
.product a {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    color: #21D4C8;
    text-decoration: underline;
    text-decoration-color: #21D4C8;
    text-underline-offset: 3px;
}

.product .slide-item a {
    color: #051817;
    text-decoration: none;
}
 

 
.product-media {
    grid-area: product-media;
}
 
.product-detail {
    grid-area: product-detail;
}
 
.product-detail > * + * {
    margin-top: 16px;
    margin-bottom: 0;
}
 
.product-detail > .product-variants, .product-detail > .product-concept {
    margin-top: 54px;
}
 
.product-brand{
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 1.5%;
    display: flex;
    align-items: flex-end;
    gap: 4px;
}

.product-brand a {
    text-decoration: none;
    line-height: 1;
    font-size: 16px;
    letter-spacing: 0.5px;
}

.product-title-jp {
    font-size: 12px;
    color: #7A8B8A;
    font-weight: 300;
    margin-top: 0;
}
.product-rate .card-product-reviews{
    color: #555B5B;
}
.product__alert{
 
}
.product-note{
    padding: 24px 16px;
    border: 1px solid #B2C2C1;
    border-radius: 8px;
}
.product-note-inner + .product-note-inner{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #B2C2C1
}
.product-note-inner h5 {
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 16px;
    line-height: 21px;
}
.product-note-inner h6 {
    font-size: 12px;
    line-height: 18px;
    margin: 0;
}
.text-red{
    color: #ED293E;
}
.product-freeship{
    background: #F2F2F2;
    padding: 8px;
    border-radius: 4px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}

.product-concept{
    font-size: 15px;
}
.title-border{
    font-weight: 700;
    margin: 0 0 16px 0;
    border-left: 4px solid #B2C2C1;
    padding-left: 4px;
    height: 26px;
    line-height: 26px;
}
.product-main-fragrance-prod {
    gap: 0 16px;
}
.product-main-fragrance-prod a{
    font-size: 13px;
    font-weight: 700;
}
.product-fragrance-note{
    padding: 24px 16px;
    border: 1px solid #B2C2C1;
    border-radius: 8px;
}
.product-content-inner + .product-content-inner{
    margin-top: 16px;
    padding-top: 16px;
    /* border-top: 1px solid #B2C2C1 */
}
.product-fragrance-inner:not(:first-child) a {
    text-decoration: none;
    color: var(--color-dark);
}
.product-fragrance-inner label {
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
}
.product-fragrance-title{
    font-size: 13px;
    font-weight: 700;
    line-height: 22px;
    padding-left: 15px;
    position: relative;
    color:#B2C2C1;
}
.product-fragrance-title::after{
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 10px;
    height: 10px;
    background-color: #B2C2C1;
}
.product-block + .product-block{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #B2C2C1;
}
.product-option-bottom.product-has-radio {
    margin-top: 0;
    margin-left: 28px;
}
.product-fragrance-block p{
    margin-bottom: 16px;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 1.5px;
}

.product-fragrance-block a.disabled-link {
    color: #B2C2C1;
    text-decoration: none;
}
.product-fragrance-note h5 {
    margin: 0 0 10px 0;
}
.product-accordion-label.title {
    padding: 24px 16px;
    font-size: 16px;
}
.product-accordion-content .pagination a {
    padding: 0;
    background: white;
}
@media screen and (max-width: 768px){
    .product-accordion-label.title {
        color: var(--color-dark);
    }
}
.product-accordion-label.title::after, .product-accordion-label.title::before {
    display: none;
}
.product-accordion-label .product-rate {
    align-items: center;
}
.product-accordion-label .product-rate img{
    width: 16px;
}
.product-accordion-label .product-rate .small {
    font-size: 12px;
}
.product-accordion-label p {
    margin-bottom: 0;
}
.product-accordion .toggle:checked + .title + .content {
    padding: 0 0 24px 0;
}
.product-review-header{
    padding: 32px;
    text-align: center;
    background-color: #fff;
}
.product-review-header, .product-review-body {
    border-top: 1px solid #B2C2C1;
}
.product-review-header button {
    width: 100%;
    max-width: 343px;
    margin: 0 auto;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
}
.product-review-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin-bottom: 16px;
}
.product-review-inner-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 10px;
    min-width: fit-content;
}
 
.product-review-inner-left h3 {
    font-size: 25px;
    font-weight: 700;
}
 
.product-review-inner-left img {
    width: 10px;
}
 
.reviews-bar__list {
    width: 210px;
}
 
.reviews-bar__item+.reviews-bar__item {
    margin-top: 8px;
}
 
.progress-bar-outline {
    overflow: hidden;
    position: relative;
    height: 4px;
    border-radius: 40px;
    background-color: #e9eaec;
}
 
.progress-bar__inner-line {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-radius: 40px;
    background-color: #FFC700;
}
.product-accordion-content {
    background-color: #F5F5F5;
}
.product-review-body{
    padding-bottom: 24px;
}
.product-review-filter{
    background-color: #fff;
    padding: 24px 16px;
    gap: 0 8px;
}
.product-review-filter .d-flex{
    overflow-x: auto;
    padding-bottom: 8px;
}
.product-review-filter a {
    text-decoration: none;
    font-size: 13px;;
    color: black;
    font-weight: normal;
    display: inline-block;
    min-width: fit-content;
    padding: 7px 8px;
    border-radius: 4px;
    border: 1px solid #B2C2C1;
    border-radius: 4px;
}
.product-review-filter a.active {
    border: 1px solid #21D4C8;
    background-color: #EDFCFB;
}
.product-review-detail{
    padding: 24px 16px;
}
.product-review-item{
    padding: 24px 16px;
    border: 1px solid #B2C2C1;
    border-radius: 8px;
    font-size: 12px;
    background: white;
}
.product-review-item + .product-review-item {
    margin-top: 16px;
}
.product-review-item .d-flex {
    justify-content: space-between;
}
.product-review-item > p {
    margin: 22px 0 0 ;
    font-size: 13px;
}
.product-review-item span{
    color: #555B5B;
}
.d-flex{
    display: flex;
    gap: 16px;
}
.product-review-navigation{
 
}
.product-accordion .pagination {
    margin: 0;
}
.red{
    background: #ED293E;
    color: white;
}
.gray{
    background: #B2C2C1;
    color: white;
}
.product-about{
 
}
.product-accordion .toggle:checked + .title + .product-about-content{
    padding: 24px 16px 24px 16px!important;
}
/* .product-about-item{
    padding: 24px 16px 8px;
} */
.product-about-item p {
    margin: 0;
    font-size: 12px;
}
.product-about-item .product-block:first-child {
    display: flex;
    gap: 15px;
}
.product-about-item .product-block h6 {
    margin-top: 0;
    font-size: 16px;
    color: #21D4C8;
}

.product-acc-container .product-block h6 {
    color: #051817;
    font-size: 13px;
    margin-bottom: 16px;
}
.product-about-item .product-block:first-child img {
    width: 100px;
    height: 80px;
    border-radius: 10px;
}
.product-related {
    grid-area: product-related;
    margin-top: 80px;
}
.product-related .product-related-title {
    margin-bottom: 36px;
}

.product-related .product-related-title h3 {
    font-size: 28px;
    font-weight: 700;
    line-height: 30px;
}
 
.swiper-related:not(.swiper-initialized) .swiper-scrollbar {
    display: none;
}
 
@media screen and (min-width: 768px){
    .swiper-related:not(.swiper-initialized) .swiper-wrapper {
        flex-wrap: wrap;
        gap: 16px;
    }
    .swiper-related:not(.swiper-initialized) .swiper-slide {
        width: calc(33.33% - 16px * 2 / 3);
        max-width: calc(33.33% - 16px * 2 / 3);
    }
}
 
.product-related .card__icons {
    justify-content: flex-start;
}
.modal {
    padding-right: 0 !important;
}
.modal-review{
 
}
 
.modal-title{
 
}
.modal-review .modal-body {
    padding: 16px;
}
.modal-review .modal-body > * + * {
    margin-top: 32px;
}
.modal-review label {
    font-size: 14px;
}
.modal-review-block > span{
    display: block;
    font-size: 12px;
    margin-bottom: 8px;
    color:#B2C2C1;
    font-weight: 300;
}
.modal-review-block input {
    padding: 8px 12px;
    width: 100%;
    height: 56px;
    border-radius: 8px;
    border: 1px solid #B2C2C1;
}
.modal-review-block textarea {
    padding: 8px 12px;
    border: 1px solid #B2C2C1;
    width: 100% !important;
    height: 120px;
    border-radius: 8px;
}
@media screen and (max-height: 668px) {
    /* .modal-custom .modal-dialog {
        align-items: flex-end;
    } */
    .modal-custom .modal-content {
        width: 100%;
        border-radius: 0px;
        /* height: 100%;
        max-height: calc(100vh - 50px); */
        box-shadow: none;
        border: 0;
    }
}
 
.swiper-scrollbar  .swiper-scrollbar-drag {
    opacity: 1 !important;
    visibility: visible !important;
    height: 100% !important;
    background: #b2c2c1 !important;
}
 
.product-action-mobile {
    display: flex;
    flex-direction: column;
    gap: 0;
    font-size: 14px;
}

.product-action-mobile p {
    margin: 0 auto;
    font-size: 11px;
}
@media screen and (max-width: 768px){
    .product-action-mobile {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 100;
        padding: 12px 16px 1px 16px;
        background-color: #fff;
        box-shadow: 0px 2px 8px 0px #0000004D;
        height: 88px;
    }
    .product-action-mobile.special-product {
        padding: 16px;
    }
}
 
.product-action-mobile > button {
    outline: none !important;
    flex: 1;
    border-radius: 8px;
    font-size: 14px;
    height: 56px;
    min-height: 56px;
}

@media screen and (min-width:768px) {
    .modal-option:not(:has(.modal-footer)) .modal-body, .modal-custom:not(:has(.modal-footer)) .modal-body{
        max-height: calc(70vh - 60px);
        height: max-content;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .modal-option:has(.modal-footer) .modal-body, .modal-custom:has(.modal-footer) .modal-body {
        max-height: calc(70vh - 60px - 89px);
        height: max-content;
        overflow-x: hidden;
        overflow-y: auto;
    }
}

@media screen and (min-width:768px) {
    .modal-option:not(#modal_product_option) .modal-body {
        height: calc(80vh - 52px);
    }
}
 
.modal-option .modal-body::-webkit-scrollbar, .modal-custom .modal-body::-webkit-scrollbar {
    display: block;
    width: 10px;
}
.modal-option .modal-body::-webkit-scrollbar-track, .modal-custom .modal-body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
/* Handle */
.modal-option .modal-body::-webkit-scrollbar-thumb, .modal-custom .modal-body::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #F2F2F2;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
}

.rating.js-wc-star-rating {
    display: block !important;
}
.js-wc-rating-value {display: none;}
.js-wc-label {
    display: none;
}
.rating.js-wc-star-rating i{
    line-height: 0;
}
.rating.js-wc-star-rating i::before{
    font-size: 28px;
}
.rating.js-wc-star-rating .fa-star-o::before{
    color: #B2C2C1;
}
.fa::before, .fas::before, .far::before {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 1;
}
.swiper--wrapper {
  width: 100%;
  height: auto !important; }
  .swiper-wrapper .swiper-slide {
    line-height: 1 !important;
    height:auto !important;
  }
 
 
.swiper-slide:nth-child(3n + 1) {
  background-color: #fff !important;
  }
 
.swiper-slide:nth-child(3n + 2) {
  background-color: #fff !important; }
 
.swiper-slide:nth-child(3n + 3) {
  background-color: #fff !important; }



  .rate {
    float: left;
    height: 46px;
    /* padding: 0 10px; */
}
.rate:not(:checked) > input {
    position:absolute;
    top:-9999px;
}
.rate:not(:checked) > label {
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:25px;
    color:#ccc;
}
.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #ffc700;    
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #deb217;  
}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #c59b08;
}

.rate + .modal-review-block {
    margin-top: 50px;
}

.single-product div.product::after {
    display: none;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-left-color: #7986cb;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto;
}
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Product services */
@media screen and (max-width: 991px) {
    .section-product {
        padding-top: 42px;
    }
    /* .product-service > .product-media {
        display: none;
    } */
}
.product-service .product-title {
    margin-bottom: 16px;
    font-size: 28px;
}

@media screen and (max-width: 768px) {
    .product-service .product-detail .product-title, .product-service .product-detail > .product-rate {
        display: none;
    }
}

@media screen and (min-width: 769px) {
    .product-service .product-media .product-title, .product-service .product-media .product-rate {
        display: none;
    }
}

.product-serv-des {
    font-size: 15px;
    font-weight: 400;
}

@media screen and (min-width: 992px){
    .product-service.product-grid {
        grid-template-columns: 360px minmax(520px, 580px);
        gap: 60px;
    }
}

@media screen and (max-width: 991px) {
    .product-service.product-grid {
        grid-template-columns: minmax(100%, 1fr);
    }
}

.product-flow-wp {
    margin-top: 40px;
}

.product-flow {
    font-size: 15px;
    line-height: 24px;
}

.product-step:last-child {
    padding-bottom: 16px;
}

.product-step .product-step-row {
    display: flex;
    gap: 16px;
}

.product-step .product-step-row {
    margin-top: 16px;
}

.product-step .product-step-row:first-child span {
    display: inline-block;
    color: #21d4c8;
    font-family: Roboto;
    font-size: 12px;
    font-weight: 700;
    line-height: 21px;
    letter-spacing: 0.04em;
    text-align: center;
    margin-left: 8px;
}

.product-step .product-step-row:nth-child(2) {
    align-items: center;
    margin-top: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 23.8px;
    letter-spacing: 0.04em;
}

.product-step .small {
    font-size: 12px;
    color: #051817;
}

.product-step-left {
    min-width: 48px;
}

.product-step-left-inner {
    flex-direction: column;
    align-items: center;
    gap: 4px;
    line-height: 1;
}

.product-service .product-action-mobile > button {
    flex: 1;
    border-radius: 8px;
    height: 56px;
}

.product-service .product-action-mobile > a {
    flex: 1;
    border-radius: 8px;
    height: 56px;
    line-height: inherit;
    text-decoration: none;
}

.product-service-accordion {
    margin-top: 54px;
}

.product-service-accordion .option:last-child {
    border-bottom: 1px solid #b2c2c1;
}

.product-service-accordion label.title {
    border-top: 1px solid #b2c2c1 !important;
    line-height: 1;
    padding: 18px 16px;
    height: 60px;
}

.product-service-accordion .toggle:checked + .title + .content {
    border-top: 1px solid #b2c2c1;
}

.product-service .icon-plus svg, .product-service .icon-minus svg{
    width: 16px;
}

.product-service-variants .product-price {
    color: #051817;
    text-wrap: nowrap;
}

.product-option-select-wp {
    margin: 12px 0 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
}

.product-option-select-wp + * {
    margin-top: 36px;
}

.product-service-variant {
    padding: 0;
}

.product-service-option {
    padding: 16px;
}

.product-service-option.selected {
    background: #e5f5f4;
    border-top: 1px solid #21d4c8;
    border-bottom: 1px solid #21d4c8;
}

.product-service-option + .product-service-option {
    margin-top: 0;
}

.product-service .product-option-select {
    background-color: #fff;
    position: relative;
    border: 1px solid #b2c2c1;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    padding: 14px 16px;
}

.product-service .product-option-select label {
    margin-bottom: 0;
}

.product-service .product-option-select .select-arrow {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    pointer-events: none;
}

.product-service .product-option-select .select-arrow svg {
    width: 18px;
    height: 10px;
}

.product-service .product-option-select select {
    background-color: #fff;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0px 40px 0 10px;
    width: fit-content;
    max-width: 100%;
    height: auto;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    border: 0;
}

.product-service .modal .product-option .btn-add-to-cart {
    padding: 15px 16px !important;
    font-weight: 500 !important;
    border-radius: 4px;
    letter-spacing: 0;
}

.product-service .product-option .btn-add-to-cart:hover {
    color: #fff;
    box-shadow: #00000030 0px 5px 10px;
}

.product-option-desc {
    padding-left: 15px;
    position: relative;
    margin-bottom: 0;
    font-size: 12px;
    letter-spacing: -1px;
}

.product-option-desc::after {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
}

.filter-control input:checked + .check-mark,
.filter-control input:checked + .check-mark + .filter-bg {
    border-color: #21d4c8;
    background: #edfcfb;
}

.modal-body .check-mark {
    line-height: 0;
}

.modal-body .check-mark svg {
    width: 15px;
}

.filter-control input:checked + .check-mark .checked {
    display: block;
}

.filter-control input:checked + .check-mark .uncheck {
    display: none;
}

.product-service-option {
    display: flex;
    gap: 16px;
}

.product-service-option.product-has-radio {
    padding-top: 0;
    padding-bottom: 16px;
    display: block;
}

.product-service-option.product-has-radio .product-option-inner {
    padding-top: 16px;
    padding-bottom: 16px;
    margin-bottom: 0;
    font-weight: normal;
}

.product-service-option.product-has-radio .product-option-inner .product-option-top .filter-control {
    margin-right: 8px;
}

.product-service-option > .product-option-right {
    flex: 1;
}

.product-service-option .filter-control {
    padding: 16px 0;
}

#modal_fill_card {
    font-size: 14px;
    font-weight: 400;
}

@media screen and (min-height: 669px) {
    .modal-fill-card .modal-content {
        max-height: 80vh;
    }
}

.modal-subtitle {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}

.red,
.gray {
    padding: 2px 4px;
    border-radius: 3px;
    font-size: 12px;
}

.addon-description {
    font-size: 12px;
    font-weight: 400;
    line-height: 20.4px;
    color: #7a8b8a;
}

.addon-description p {
    margin-bottom: 8px;
}

.product-addon textarea {
    padding: 12px 16px;
    border-radius: 8px;
    width: 100%;
    border: 1px solid #b2c2c1;
}

.product-addon-title textarea {
    height: 56px;
}

.product-addon-desc textarea {
    height: 200px;
}

.modal-scent-type .filter-control {
    display: inline-flex;
    min-width: 106px;
}

.modal-scent-type h3.addon-name {
    font-size: 14px;
    margin-bottom: 8px;
}

.modal-scent-type .product-addon + .product-addon {
    padding-top: 20px;
}

.grid-1-col .filter-control {
    width: 100%;
}

.modal-scent-type .filter-bg {
    z-index: 0;
}

.modal-scent-type label {
    font-size: 16px;
}

@media screen and (max-width: 768px) {
    .modal-scent-type label {
        font-size: 12px;
    }

    .modal-scent-type .filter-control {
        min-width: 72px;
    }
}
.modal-scent-type .filter-control .check-mark,
.modal-scent-type .filter-control label {
    position: relative;
    z-index: 1;
}

.modal-block-grid .grid-item + .grid-item {
    margin-top: 16px;
}

.primary {
    color: #fff;
    background-color: #21d4c8;
    border-radius: 30px;
    padding: 4px 8px;
    font-size: 10px;
    font-weight: 700;
}

.product-suggestion {
    margin-top: 54px;
}

.product-suggestion .product-block a{
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-dark);
    text-decoration: none;
}

.product-suggestion-inner .product-block:first-child  {
    padding-top: 16px;
    border-top: 1px solid #B2C2C1
}

.product-suggestion-inner .product-block:last-child  {
    border-bottom: 1px solid #B2C2C1;
}

.product-suggestion-inner .product-block + .product-block {
    border-top: 1px solid #B2C2C1
}

.product-suggestion .product-block h5 {
    font-weight: 700;
    font-size: 16px;
    margin: 0 0 12px 0;
    line-height: 1;
}

.product-suggestion .product-block img {
    width: 130px;
}

.product-suggestion-desc {
    padding-right: 10px;
    flex: 1;
}

.product-suggestion .product-block svg {
    min-width: 7px;
}

.product-carousel .owl-item img {
    height: 240px;
}

.product-thumb .owl-item img {
    height: 109px;
}

.product-carousel.owl-carousel .owl-stage-outer {
    margin-bottom: 16px;
}

@media screen and (max-width: 768px){
    .product-media {
        max-width: 100%;
        width: 100%;
    }
}

.product-serv-des-inner p {
    margin-bottom: 20px;
    position: relative;
    padding-left: 15px;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: -0.02em;

}

.product-serv-des-inner p:after {
    content: "・";
    position: absolute;
    top: 0;
    left: 0;
}

.product-suggestion + .product-service-variants  {
    margin-top: 54px;
}

#modal_slect_quantity.modal-option .modal-body {
    height: auto;
}

#modal_product_amount .modal-body {
    padding: 16px;
}

#modal_product_amount  .filter-control {
    padding: 0;
}

#modal_product_amount .modal-body > * + * {
    margin-top: 32px;
}

#modal_product_amount .modal-body p.small {
    margin-top: 8px;
    margin-bottom: 0;
    display: block;
    font-size: 12px;
}

#modal_product_amount .product-option-select-wp {
    margin-top: 0;
}

#modal_product_amount .product-option-select-wp {
    gap: 0;
}

.label-outside {
    display: inline-block; 
    margin-right: 16px;
    margin-left: 4px;
}

.product-media-inner > * + * {
    margin-top: 16px;
}

.product-media-inner .d-flex {
    align-items: center;
}

.product-option-select-wp label {
    font-weight: unset;
}

.bottom-page-wrap {
    z-index: auto !important;
}

.modal-scent-type .filter-control label {
    font-family: "Noto Sans JP", sans-serif;
}

@media screen and (max-width: 768px){
    .padding-bottom-product-single {
        padding-bottom: 88px;
    }
}

@media (min-width: 992px) {
    .container {
        width: unset;
    }
}

@media (min-width: 769px) and (max-width: 991px) {
    .container {
        max-width: 750px;
        width: calc(100% - 30px);
    }

    .product-service.product-grid {
        row-gap: 20px;
    }
}