:root {
    --mirai-color-green-100: #198754; /*changed for sitekit performance optimization 32885d*/
    --mirai-color-green-90: #47946e; /*#32885d, 90%*/
    --mirai-color-green-10: hsl(150, 24%, 93%); /*#247a4f, 10%*/
    --mirai-color-green-dark: #247a4f;
    --mirai-color-green-darker: #00703c;
    --mirai-color-green-muted: #4d6755;
    --mirai-color-black-100: #281d1b;
    --mirai-color-black-90: #3e3432; /*#281d1b, 90%*/
    --mirai-color-black-60: #7e7776; /*#281d1b, 60%*/
    --mirai-color-black-40: #B6ACAB; /*#281d1b, 40%*/
    --mirai-color-black-20: #d4d2d1; /*#281d1b, 20%*/
    --mirai-color-black-10: #eae9e9; /*#281d1b, 10%*/
    --mirai-color-black-5: #f4f3f3; /*#281d1b, 5%*/
    --mirai-color-beige-light: #f9f9f7;
    --mirai-color-beige-heavy: #ebeae8;
    --mirai-color-white: #ffffff;
    --mirai-color-blue-100: #3285eb;
    --mirai-color-blue-10: #ebf3fd; /*#3285eb, 10%*/
    --mirai-color-red-100: #c82333; /*changed for sitekit performance optimization f55959*/
    --mirai-color-red-5: #fef4f4;
    --mirai-color-red-light: #ffecec;
}

body {
    /* resets */
    margin: 0;
    padding: 0;

    /* defaults */
    background-color: var(--mirai-color-beige-light);
    /*font-family: "Noto Sans JP", 'Arial', sans-serif;*/
    font-family: "Zen Kaku Gothic New", 'Arial', sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 17px;
    font-weight: 400;
    line-height: 180%;
    letter-spacing: 1px;
    color: var(--mirai-color-black-90);
    word-wrap: break-word;

    /* smoother fonts */
    -webkit-font-smoothing: antialiased; /* Safari, Chrome */
    -moz-osx-font-smoothing: grayscale; /* macOS, Firefox */
}
body * {
    line-height: 170%;
}
* {
    box-sizing: border-box;
}
label {
    font-weight: 700;
}
input[type="text"], input[type="number"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type=reset], input[type=tel], input[type=date], select {
    height: 40px;
    padding: 0 5px;
    border: 1px solid var(--mirai-color-black-10);
    border-radius: 4px;
    color: var(--mirai-color-black-90);
}
input:focus, textarea:focus, select:focus {
    outline: none;
    box-shadow: none;
}
input[type="button"]:disabled, input[type="submit"]:disabled,
button.button.disabled-button {
    background-color: #f1f1f1;
    color: #777;
}
textarea {
    height: 100px;
    padding: 15px;
    border: 1px solid var(--mirai-color-black-10);
    border-radius: 4px;
    color: var(--mirai-color-black-90);
}
.custom-form input[type="text"], input[type="number"] {
    width: 100%;
}
a {
    color: var(--mirai-color-green-100);
    text-decoration: none;
}
a:hover {
    color: var(--mirai-color-green-100);;
    text-decoration: underline;
}
time {
    color: #444;
}
/* header */
/*.site-header {
    background: inherit;
    border-bottom: 1px solid #EBEAE8;
}*/
.site-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    background: inherit;
    border-bottom: 1px solid #EBEAE8;
}
.header-container {
    width: 100%;
    padding: 16px 60px 16px 40px;
    margin: 0 auto;
}
.header-logo {
    font-size: 26px;
    font-weight: 600;
    text-decoration: none;
    color: var(--mirai-color-black-90);
}
.header-menu {
    display: flex;
    align-items: center;
}
.header-link {
    padding: 8px 20px;
    font-size: 18px;
    font-weight: 700;
    line-height: 170%;
    text-decoration: none;
    color: var(--mirai-color-black-90);
}
.header-logo:hover, .header-link:hover {
    text-decoration: inherit;
    color: inherit;
}
.header-button, .header-button:hover {
    margin-right: 16px;
    padding: 8px 20px;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    line-height: 170%;
    background: var(--mirai-color-green-100);
    color: var(--mirai-color-white);
    border-radius: 25px;
}
.header-icon {
    font-size: 18px;
    text-decoration: none;
    color: #000;
}
.header-icon .cart-item-count {
    font-weight: 500;
    position: absolute;
    background-color: black;
    color: white;
    height: 17px;
    width: 17px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 10px;
    top: 0;
    left: 15px;
    line-height: calc(1 + .1 / 1.0);
}
/* Breadcrumb */
.breadcrumb {padding: .5rem 29px;font-size: .75rem;max-width: 1440px;width: 100%;margin: 0 auto}
.breadcrumb a {color: #333333;}/*changed for sitekit performance optimization*/
@media screen and (max-width: 1000px) {.breadcrumb {margin-top: 3rem; padding: .5rem 17px;}}
/* page */
.content-container {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    gap: 0;
    margin: 0 auto;
}
/*.menu-container {
    margin: 0;
    padding: 100px 29px;
    width: 240px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;  
    gap: 16px;
}*/
.menu-container {
    position: sticky;
    top: 80px;
    align-self: start;
    
    max-height: 1500px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE/Edge */

    margin: 0;
    padding: 100px 29px 100px;
    width: 240px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;  
    gap: 16px;
}
.menu-container::-webkit-scrollbar {
    display: none;
}

.menu-container .menu .menu-link {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 16px; 
    padding: 8px 12px;
    border-radius: 5px;
    font-size: 20px;
    font-weight: 700;
    text-decoration: inherit;
    color: inherit;
}
.menu-container .menu .menu-label-link {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;    
    gap: 0;
    margin: 0 12px;
    border-radius: 5px;
    font-size: 20px;
    font-weight: 700;
    text-decoration: inherit;
    color: inherit;
}
.menu-container .menu .menu-submenu-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-radius: 5px;
    font-size: 20px;
    font-weight: 700;
    text-decoration: inherit;
    color: inherit;
}
.menu-container .menu .menu-submenu-link.parent-category {
    padding: 0 12px 0 0;
}
.menu-container .menu .submenu .submenu ul li a {
    font-size: 14px;
    color: var(--mirai-color-black-60);
}
.menu:has(.menu-submenu-link) {
    width: 100%;
}
.menu-container .menu .menu-submenu-link .menu-submenu-link-label {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
}
.menu-container .menu .menu-submenu-link .icon.icon-up {
    display: none;
}
.menu-container .menu .menu-submenu-checkbox:checked + label .icon-down {
    display: none;
}
.menu-container .menu .menu-submenu-checkbox:checked + label .icon-up {
    display: inline;
}
.menu-container .menu .submenu {
    -display: none;
    /*animate*/
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 1.2s ease, opacity 1.2s ease;
}
.menu-container .menu .submenu ul {
    margin: 0;
    margin-top: 12px;
    padding: 0;
    padding-left: 12px;
    list-style: none;
}
.menu-container .menu .submenu ul li {
    margin-top: 12px;
}
.menu-container .menu .submenu ul li a {
    font-size: 16px;
    font-weight: 500;
    text-decoration: inherit;
    color: inherit;
}
.menu-container .menu .submenu ul li a.submenu-link {
    font-weight: 700;
    color: var(--mirai-color-green-100);
}
.menu-container input[type="checkbox"] {
    display: none;
}
.menu-container input[type="checkbox"]:checked ~ .submenu {
    display: block; /*on mobile*/
    /*animate*/
    max-height: 1000px;
    opacity: 1;
}
.menu-container input[type="checkbox"]:checked ~ label {
    background: var(--mirai-color-beige-heavy);
}
.menu-container input[type="checkbox"]:checked ~ label.parent-category {
    background: none;
}
.menu#mobile-menu {
    display: none;
}
.menu-container .menu .menu-link:hover, .menu-label-link:hover, .menu-submenu-link:hover {
    border-radius: 5px;
    background: var(--mirai-color-black-5);
}
.menu-submenu-link.parent-category:hover, .menu-submenu-link.parent-category .menu-link:hover {
    background: none;
}
.right-panel {
    flex: 1;
    padding: 60px 40px 60px;
}
.right-panel h1 {
    display: flex;
    align-items: center;
    font-weight: 900;
    font-size: 28px;
    gap: 10px;
}
.right-panel .content-img {
    width: 100%;
    overflow: hidden;
}
.site-footer {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: var(--mirai-color-black-10);
    color: inherit;
}
.footer-menu {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 120px;
    margin: 84px 65px;
    padding: 0;
}
.footer-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-menu li {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
}
.footer-menu a {
    text-decoration: none;
    color: inherit;
}
.footer-menu a:hover {
    color: inherit;
}
.footer-menu > div {
    align-self: flex-end;
    margin-bottom: 16px;
}
.footer-menu > div img {
    height: 25px;
    width: auto;
}
.footer-copyright {
    font-size: 10px;
    margin: 0 auto 2em auto;
    text-align: center;
}

/*animations*/
.right-panel img {
    transition: transform 0.3s ease;
}
.right-panel img:hover { 
    transform: scale(1.02); 
}
.right-panel .top-img img:hover,
.right-panel .content-img img:hover,
.payment_method_stripe img:hover,
.woocommerce a.remove img:hover { 
    transform: none; 
}

/* buttons */
.site-button, .site-button:hover {
    font-size: 18px;
    font-weight: 900;
    text-decoration: none;
    color: var(--mirai-color-green-100);
    background: var(--mirai-color-black-5);
    padding: 15px 20px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: bold;
}

/* parts */
.mt-1 {
    margin-top: 1em;
}
.mt-2 {
    margin-top: 2em;
}
.mr-1 {
    margin-right: 1em;
}
.mr-2 {
    margin-right: 2em;
}
.mb-1 {
    margin-bottom: 1em;
}
.mb-2 {
    margin-bottom: 2em;
}
.ml-1 {
    margin-left: 1em;
}
.flex-top {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
}
.flex-start-center {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
}
.flex-end-center {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}
.flex-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1em;
}
.flex-space-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.g-4 {
    gap: 4px;
}
.g-16 {
    gap: 16px;
}
.text-align-center {
    text-align: center;
}
.font-size-small {
    font-size: 12px;
}
.font-size-mid {
    font-size: 16px;
}
.color-black-60 {
    color: var(--mirai-color-black-60);
}
.color-black-20 {
    color: var(--mirai-color-black-20);
}
.delete {
    background-color: red;
}

.content-img {
    text-align: center;
}

/*matter support*/
.matter-support {
    display: none;
}
.post-content .matter-support.supported {
    display: block;
    height: 28px;
    background-image: url('/wp-content/themes/mirai/img/matter28.png');
    background-size: auto;
    background-repeat: no-repeat;
}
.woocommerce ul.products li.product a .product-text-wrapper .matter-support.supported,
.woocommerce-page ul.products li.product a .product-text-wrapper .matter-support.supported {
    display: inline-block;
    margin-top: 5px;
    background-image: url('/wp-content/themes/mirai/img/matter20.png');
    background-repeat: no-repeat;
    background-size: auto;
    height: 16px;
    width: 74px;
    height: 20px;
    width: 92px;
}


/*dashboard*/
button.button {
    border-radius: 8px;
    padding: 12px 10px;
}

/*contact form 7*/
.wpcf7 {
    background-color: var(--mirai-color-white);
    border-radius: 20px;
    padding: 24px;
    max-width: 75%;
    margin: 0 auto;
}
.wpcf7-form {
    text-align: center;
}
.wpcf7 table {
    width: 100%;
    border-collapse: collapse;
}
.wpcf7 th,
.wpcf7 td {
    vertical-align: center;
    padding: 0 12px;
}
.wpcf7 th p {
    margin: 0;
    white-space: nowrap;
}
.wpcf7 td p {
    text-align: left;
}
.wpcf7 td p .wpcf7-not-valid-tip {
    font-size: 10px;
    font-weight: 700;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
    width: 100%;
}
.wpcf7 table tr:last-of-type th {
    padding-top: 1em;
}
.wpcf7 td p.privacy {
    margin: 0;
    padding: 0;
    text-align: left;
}
.wpcf7 td .wpcf7-list-item {
    width: 40%;
}
.wpcf7 td p.privacy .wpcf7-list-item.first.last {
    margin: 0;
    width: 100%;
}
.wpcf7 th p em {
    margin-left: 6px;
    padding: 3px 5px;
    border-radius: 5px;
    font-size: 10px;
    font-style: normal;
    color: var(--mirai-color-white);
    background: var(--mirai-color-red-100);
}
.wpcf7 input[type="submit"] {
    margin-top: 1em;
    padding: 19px 20px;
    width: 200px;
    font-size: 18px;
}

/*recapthca badge*/
.grecaptcha-badge {
    display: none;
}

/*brevo*/
.sib-form {
    text-align: center;
}
#sib-container input:-ms-input-placeholder {
    text-align: left;
    color: var(--mirai-color-black-20);
}
#sib-container input::placeholder {
    text-align: left;
    color: var(--mirai-color-black-20);
}
.sib-form-block {
    text-align: center;
}
.sib-form-block p {
    font-size:30px;
    text-align:left;
    font-weight:700;
    background-color:transparent;
}
.sib-form-message-panel {
    font-size:16px;
    text-align:left;
    border-radius:3px;
    max-width:540px;
}
#error-message {
    color: var(--mirai-color-red-100);
    background-color: var(--mirai-color-red-5);
    border-color: var(--mirai-color-red-100);
}
#success-message {
    color: var(--mirai-color-blue-100);
    background-color: var(--mirai-color-blue-10);
    border-color: var(--mirai-color-blue-100);
}
.sib-container--large.sib-container--vertical {
    text-align:left;
    background-color: var(--mirai-color-white);
    max-width: 540px;
    border-radius: 12px;
    border: 0;
    direction:ltr;
}
.entry__label {
    font-weight: 700;
    text-align:left;
    font-size:16px;
}
.sib-form .input:first-child, .sib-form .input__affix:first-child {
    height: 40px;
    padding: 0 5px;
    border: 1px solid var(--mirai-color-black-10);
    border-radius: 4px;
    color: var(--mirai-color-black-90);
}
.sib-form .entry__error.entry__error--primary {
    padding: 0;
    font-size:14px;
    text-align:left; 
    border-radius:3px; 
    color: var(--mirai-color-red-100);
    background: none;
}
.sib-form-block__button.sib-form-block__button-with-loader {
    border-radius: 99px;
    background-color: var(--mirai-color-green-100);
    color: var(--mirai-color-white);
    font-weight: 500;
    letter-spacing: 2px;
    padding: 19px 20px;
    font-size: 18px;
    width: 200px;
}
.subscribe-container {
    margin-top: 36px;
    text-align: center;
}
.subscribe-container div {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 700;
}
.subscribe-container a {
    width: 200px;
    display: inline-block;
    padding: 10px 20px;
    border: 3px solid var(--mirai-color-black-90);
    border-radius: 99px;
    font-size: 18px;
    font-weight: 700;
    color: var(--mirai-color-black-100);
    text-decoration: none;
}

/* woocommerce -- generic */
.woocommerce-error, .woocommerce-info, .woocommerce-message {
    padding-top: 12px;
    padding-bottom: 12px;
    border-radius: 8px;
}
.woocommerce-error::before, .woocommerce-info::before, .woocommerce-message::before {
    margin-top: -3px;
}
.woocommerce-error {
    border: 1px solid var(--mirai-color-red-100);
    background: var(--mirai-color-red-5);
}
.woocommerce-error::before {
    color: var(--mirai-color-red-100);
}
.woocommerce-info {
    border: 1px solid var(--mirai-color-black-60);
    background: var(--mirai-color-black-10);
}
.woocommerce-info::before {
    color: var(--mirai-color-black-100);
}
.woocommerce-message {
    border: 1px solid var(--mirai-color-blue-100);
    background: var(--mirai-color-blue-10);
}
.woocommerce-message::before {
    color: var(--mirai-color-blue-100);
}
.woocommerce span.onsale {
    /*background: var(--mirai-color-red-100);*/
    display: none;
}
.woocommerce .sale-percent {
    margin-right: 8px;
    margin-bottom: 4px;
    padding: 0 8px 2px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 700;
    background: var(--mirai-color-red-100);
    color: var(--mirai-color-white);
}
.woocommerce .outlet-tags {
    margin-right: 8px;
    margin-bottom: 4px;
    padding: 0 8px 2px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    background: var(--mirai-color-black-40);
    color: var(--mirai-color-white);
}
.tags a,
button,
.woocommerce-js a.button, 
.woocommerce button.button, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt, 
input[type="button"], input[type="submit"],
button .woocommerce-button button {
    border-radius: 99px;
    background-color: var(--mirai-color-green-100);
    padding: 12px 20px;
    color: var(--mirai-color-white);
    font-weight: 500;
    font-size: 15px;
    line-height: 1em;
    border-style: solid;
    border-top-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-bottom-width: 0;
}
.woocommerce-js a.button:hover, input[type="submit"]:hover, .woocommerce button.button.alt:hover {
    background-color: var(--mirai-color-green-100);
    color: var(--mirai-color-white);
}

/* woocommerce -- product list */
.woocommerce-loop-product__title {
    margin-bottom: 8px !important;
    max-height: 54px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.4em;
    color: var(--mirai-color-black-100);
}
.woocommerce-loop-custom-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price .tax-note {
    margin-top: 8px;
    font-size: 18px;
    font-weight: 700;
    line-height: 170%;
    color: var(--mirai-color-green-dark);
}
.woocommerce ul.products li.product .price ins {
    text-decoration: none;
}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .tax-note {
    font-size: 13px;
    font-weight: 500;
    line-height: 170%;
    color: var(--mirai-color-green-dark);
    opacity: 1;
}    
/*img*/
.woocommerce ul.products li.product a img {
    border-radius: 12px;
    border: 5px solid var(--mirai-color-white);
}
/*list item wrapper*/
.product-text-wrapper {
    height: 165px;
}
/*add to cart*/
.woocommerce ul.products li.product .button {
    display: flex;
    justify-content: center;
    padding: 12px 20px;
    gap: 8px;
    margin-top: 12px;
    line-height: 170%;
    font-weight: 700;
}
.woocommerce ul.products li.product .button span {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.woocommerce a.added_to_cart {
    width: 100%;
    text-align: center;
}

/* woocommerce -- my page */
.woocommerce-js div.product div.summary .single-product-category {
    display: block;
    line-height: 1;
    margin-bottom: 1em;
}

/* woocommerce -- cart */
.woocommerce table.shop_table {
    -border: 1px solid var(--mirai-color-black-100);
}
.woocommerce table.shop_table td, 
.woocommerce-cart .cart-collaterals .cart_totals tr td, .woocommerce-cart .cart-collaterals .cart_totals tr th, .woocommerce-checkout .cart-collaterals .cart_totals tr td, .woocommerce-checkout .cart-collaterals .cart_totals tr th {
    -border-top: 1px solid var(--mirai-color-black-100);
}
/*.woocommerce a.remove {
    padding: 0 0 0 2px;
    font-size: 20px;
    color: var(--mirai-color-red-100) !important;
}
.woocommerce a.remove:hover {
    background: var(--mirai-color-red-100);
    color: var(--mirai-color-white);
}*/
.woocommerce a.remove img {
    width: 100%;
}
.woocommerce .woocommerce-cart-form table.woocommerce-cart-form__contents td.product-name a,
.woocommerce .woocommerce-cart-form table.woocommerce-cart-form__contents td.product-name a:hover {
    -font-weight: 700;
    text-decoration: none;
    color: var(--mirai-color-black-100);
}
.woocommerce .woocommerce-cart-form table.woocommerce-cart-form__contents td.product-price,
.woocommerce .woocommerce-cart-form table.woocommerce-cart-form__contents td.product-subtotal {
    -font-weight: 700;
}
.woocommerce-cart .cart-collaterals .cart_totals tr td, 
.woocommerce-cart .cart-collaterals .cart_totals tr th,
.woocommerce table.shop_table tr th,
.woocommerce table.shop_table tr td {
    border: 0;
}
.woocommerce-cart .cart-collaterals .cart_totals table th,
.woocommerce-cart .cart-collaterals .cart_totals table td,
.woocommerce table.shop_table tr th,
.woocommerce table.shop_table tr td {
    font-size: 16px;
    font-weight: 500;
}
.woocommerce table.shop_table tr th:nth-child(2) {
    text-align: right;
}
.woocommerce-cart .cart-collaterals .cart_totals table th,
.woocommerce table.shop_table tr td:nth-child(1) {
	color: var(--mirai-color-green-muted);
}
.woocommerce-cart .cart-collaterals .cart_totals table td,
.woocommerce table.shop_table tr td:nth-child(2) {
    text-align: right;
}

/*coupon*/
.coupon #coupon_code {
    width: unset;
}
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button:disabled[disabled] {
    padding: 12px 20px;
}
/*quantity*/
.woocommerce .quantity:has(input[type="number"]) {
    display: inline-flex;
    align-items: center;
    border: 3px solid var(--mirai-color-black-90);
    border-radius: 99px;
    overflow: hidden;
    background: #fff;
    padding: 3px 10px;
}
.woocommerce table.shop_table .quantity:has(input[type="number"]) {
    border: 1px solid var(--mirai-color-black-10);
}
.woocommerce .qty-btn {
    padding: 0;
    border: none;
    background: none;
    font-size: 15px;
    font-weight: 900;
    color: var(--mirai-color-black-90);
    width: 32px;
    height: 36px;
    line-height: 170%;
    cursor: pointer;
}
.woocommerce .qty-btn.disabled {
    color: var(--mirai-color-black-40);
}
.woocommerce .quantity .qty {
    width: 40px;
    border: none;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 170%;
    background: transparent;
}
.woocommerce input.qty:focus {
    outline: none;
}
/* remove up/down arrows */
input.qty::-webkit-inner-spin-button,
input.qty::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input.qty[type=number] {
    -moz-appearance: textfield;
}
/*shipping total*/
/*.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-Price-amount.amount {
    font-weight: 700;
}*/
form.woocommerce-shipping-calculator,
.woocommerce-shipping-destination,
.shipping-calculator-button {
    display: none !important;
}
.woocommerce ul#shipping_method li {
    margin-bottom: 0;
}
#add_payment_method .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button:hover {
    background-color: var(--mirai-color-green-100);
}

/* woocommerce -- checkout */
.woocommerce .checkout.woocommerce-checkout label {
    font-size: 13px;
    font-weight: 500;
    color: var(--mirai-color-black-60);
}
.woocommerce form .form-row .input-text, .woocommerce form .form-row select {
    height: 40px;
    padding: 0 5px;
    border: 1px solid var(--mirai-color-black-10);
    border-radius: 4px;
    color: var(--mirai-color-black-90);
}
.select2-container .select2-dropdown, .select2-container .select2-selection {
    height: 40px;
    padding: 5px 0;
    font-size: 12px;
    border: 1px solid var(--mirai-color-black-10);
    color: var(--mirai-color-black-90);
}
.select2-results__options {
    background: var(--mirai-color-black-10);
}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
    padding: 0;
    background: var(--mirai-color-white);
}
#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
    padding: 0;
    background: var(--mirai-color-white);
}
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
    content: "";
    display: block;
    border: 1em solid var(--mirai-color-white);
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
    position: absolute;
    top: -.75em;
    left: 0;
    margin: -1em 0 0 2em;
}
#add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods {
    border-bottom: 0;
}

/* woocommerce -- shop */
.woocommerce nav.woocommerce-pagination ul,
.woocommerce nav.woocommerce-pagination ul li {
    border: 0;
}
.woocommerce nav.woocommerce-pagination ul li a, 
.woocommerce nav.woocommerce-pagination ul li span {
    margin: 0 8px;
    padding: 10px 20px;
}
.woocommerce-pagination .page-numbers.current, .woocommerce-pagination .page-numbers a:hover {
    padding: 10px 20px;
    background-color: var(--mirai-color-black-10);
    border-radius: 5px;
    text-decoration: none;
    color: inherit;
}


@media screen and (min-width: 1440px) {
    .header-container {
        width: 1440px;
    }
    .content-container {
        width: 1440px;
    }
    .footer-container {
        width: 1440px;
    }
}
@media screen and (max-width: 1280px) {
    .hide-menu, a.button.hide-menu {
        display: none;
    }
}
@media screen and (max-width: 1024px) {
    /*list item wrapper*/
    .product-text-wrapper {
        height: 210px;
    }
    .woocommerce-loop-custom-fields {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .woocommerce ul.products li.product .price,
    .woocommerce ul.products li.product .price .tax-note {
        font-size: 14px;
    }
    .woocommerce ul.products li.product .price del,
    .woocommerce ul.products li.product .price del .tax-note {
        font-size: 12px;
    }
    .woocommerce ul.products li.product .button {
        padding: 12px 10px;
        font-size: 14px;
        line-height: 180%;
    }

    .wpcf7 {
        max-width: 100%;
    }
    .wpcf7 table,
    .wpcf7 tbody,
    .wpcf7 tr,
    .wpcf7 th,
    .wpcf7 td {
        display: block;
        width: 100%;
    }
    .wpcf7 th {
        padding-top: 1em;
        text-align: left;
    }
    .wpcf7 td .wpcf7-list-item {
        width: 45%;
    }
    .wpcf7-spinner {
        margin-top: 1em;
    }
}
@media screen and (max-width: 1000px) {
    .menu.hide-on-mobile, .header-container .hide-on-mobile, a.button.hide-on-mobile {
        display: none;
    }
    .site-header {
        position: sticky;
        top: 0;
        z-index: 9999;
        background-color: var(--mirai-color-white);
        border-bottom: 0;
    }
    .header-container {
        padding: 10px 25px;
    }
    .header-logo {
        padding-left: 0;
    }
    .header-link {
        font-size: 15px;
    }
    .header-link.hide-on-mobile {
        display: none;
    }
    .header-button, .header-button:hover {
        font-size: 15px;
        margin-right: 12px;
    }
    .content-container {
        width: 100%;
        margin: 0 auto;
        flex-direction: column;
        gap: 0;
    }
    .menu-container {
        position: sticky;
        top: 61px;
        z-index: 9998;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center; 
        gap: 0;
        background-color: var(--mirai-color-white);
        margin: 0 auto;
        width: 100%;
        padding: 5px;

        overflow: visible;
    }
    .menu {
        margin: 0 auto;
        width: auto;
        text-align: center;
    }
    .menu-container .menu .menu-link {
        gap: 2px; 
        padding: 8px 12px;
        font-size: 15px;
    }
    .menu-container .menu .menu-submenu-link {
        font-size: 15px;
    }
    .menu-container .menu .submenu .menu-submenu-link.parent-category {
        justify-content: center;
        gap: 6px;
        padding: 0 12px;
    }
    .menu-container .menu .menu-submenu-link .menu-submenu-link-label {
        gap: 2px;
    }
    .menu-container .menu .submenu .menu-submenu-link.parent-category .menu-submenu-link-label {
        display: inline-flex;
        align-items: center;
        flex: 0 0 auto;
    }
    .menu-container .menu .submenu .submenu ul,
    .menu-container .menu .submenu .submenu ul li {
        margin-top: 0;
    }
    .menu:has(.menu-submenu-link) {
        width: auto;
    }
    .menu-container .menu .menu-submenu-link .icon { margin-right: 2px; width:16px; height:auto; display:inline-block; vertical-align:middle; }
    .menu-container .menu .menu-submenu-link .icon-down { display:inline; }
    .menu-container .menu .menu-submenu-checkbox:checked + label .icon-down { display:none; }
    .menu-container .menu .menu-submenu-checkbox:checked + label .icon-up   { display:inline; }
    .menu label img {
        height: 21px;
        width: 21px;
    }
    .menu#mobile-menu {
        display: block;
        font-size: 1.15em;
    }
    .menu-container > .menu > .submenu {
        display: none;
        background-color: var(--mirai-color-white);
        padding: 10px;
        position: absolute;
        left: 0;
        right: 0;
        top: 100%; 
        width: 100%;
        z-index: 1;
    }
    .right-panel .top-section2 {
        display: none;
    }
    .right-panel {
        width: 100%;
        padding: 1em;
    }
    .right-panel .grid-container {
        display: flex;
        flex-direction: column;
        gap: 2em;
    }
    .right-panel h1 {
        font-size: 24px;
    }
    .right-panel h2 {
        font-size: 24px;
    }
    .right-panel h3 {
        font-size: 18px;
    }
    .site-button, .site-button:hover {
        font-size: 16px;
    }
    .footer-menu {
        gap: 40px;
    }
    .footer-menu ul {
        margin-left: 2em;
    }
}
@media screen and (max-width: 768px) {
    .woocommerce-loop-product__title {
        font-size: 18px;
    }
    .woocommerce ul.products li.product .price,
    .woocommerce ul.products li.product .price .tax-note {
        font-size: 18px;
    }
    .woocommerce ul.products li.product .price del,
    .woocommerce ul.products li.product .price del .tax-note {
        font-size: 16px;
    }
}
@media screen and (max-width: 500px) {
    .right-panel .content-img img {
        height: 115px;
    }
    .site-footer {
        justify-content: flex-start;
        align-items: flex-start;
    }
    .footer-container {
        width: 100%;
    }
    .footer-menu {
        flex-direction: column;
        gap: 20px;
        margin: 44px 45px;
    }
    .footer-menu ul {
        margin-left: 1em;
    }
    .footer-menu li {
        margin-bottom: 5px;
    }

    .sib-form .sib-form-block p {
        font-size:26px;
    }
    .sib-form .entry__label {
        font-size:14px;
    }
    .woocommerce ul.products li.product .price,
    .woocommerce ul.products li.product .price .tax-note {
        font-size: 15px;
    }
    .woocommerce ul.products li.product .price del,
    .woocommerce ul.products li.product .price del .tax-note {
        font-size: 13px;
    }
    .woocommerce ul.products li.product .button {
        padding: 12px 20px;
        font-size: 12px;
        line-height: 240%;
        gap: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    
    .coupon #coupon_code {
        width: 50%;
    }
    .coupon button.button {
        font-size: 13px;
    }

    .wpcf7 td .wpcf7-list-item {
        width: 100%;
    }
}
@media screen and (max-width: 360px) {
    .site-header,
    .content-container {
        min-width: 342px;
    }
    .menu-container {
        top: 60px;
    }

    .right-panel .content-img img {
        height: 90px;
    }

    .header-link {
        font-size: 14px;
    }

    .menu-container .menu a img,
    .menu-container .menu div img {
        display: none;
    }

    .footer-menu a {
        font-size: 14px;
    }

    .woocommerce .cart-item-details-container p.backorder_notification {
        font-size: 12px;
    }
}
