#page_product_detail .ec-productRole__btn .ec-blockBtn--cancel {
    border-radius: 9999px !important;
}

@media (min-width: 1024px) {
    body:not(.front_page):not(.product_page):not(.product_detail_page) .ec-layoutRole .ec-layoutRole__contents > .ec-layoutRole__main > main {
        padding-top: 5rem !important;
    }
}

body[id^="page_shopping"] .legacy-scope .ec-role,
body[id^="page_shopping"] .legacy-scope .ec-cartRole,
body[id^="page_shopping"] .legacy-scope .ec-orderRole,
body[id^="page_shopping"] .legacy-scope .ec-registerRole,
body[id^="page_shopping"] .legacy-scope .ec-cartCompleteRole,
body[id^="page_shopping"] .legacy-scope .ec-AddAddress,
body[id^="page_plugin_coupon"] .legacy-scope .ec-role,
body[id^="page_plugin_coupon"] .legacy-scope .ec-registerRole {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 1440px !important;
    margin-right: auto;
    margin-left: auto;
    padding-right: 16px !important;
    padding-left: 16px !important;
}

body[id^="page_shopping"] .ec-layoutRole__legacy-wrapper.legacy-scope {
    margin: 0 !important;
    padding-top: 0 !important;
}

body[id^="page_shopping"] .ec-layoutRole__legacy-wrapper.legacy-scope .ec-layoutRole__contents {
    width: 100%;
    max-width: none;
    margin: 0;
}

body[id^="page_shopping"] .ec-layoutRole__legacy-wrapper.legacy-scope .ec-layoutRole__main {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding-bottom: clamp(3.5rem, 6vw, 5rem);
}

body[id^="page_shopping"] .ec-layoutRole .ec-layoutRole__contents > .ec-layoutRole__main > main {
    padding-top: 0 !important;
}

#page_shopping_nonmember .ec-layoutRole__legacy-wrapper {
    padding-top: 0 !important;
}

#page_shopping_nonmember .simple09-nonmember-main {
    padding-top: 0 !important;
}

#page_shopping_nonmember .simple09-nonmember-form-shell {
    margin-top: 0;
}

@media (min-width: 768px) {
    #page_shopping_nonmember .simple09-nonmember-form-shell {
        margin-top: 1.25rem;
    }
}

@media (min-width: 640px) {
    body[id^="page_shopping"] .legacy-scope .ec-role,
    body[id^="page_shopping"] .legacy-scope .ec-cartRole,
    body[id^="page_shopping"] .legacy-scope .ec-orderRole,
    body[id^="page_shopping"] .legacy-scope .ec-registerRole,
    body[id^="page_shopping"] .legacy-scope .ec-cartCompleteRole,
    body[id^="page_shopping"] .legacy-scope .ec-AddAddress,
    body[id^="page_plugin_coupon"] .legacy-scope .ec-role,
    body[id^="page_plugin_coupon"] .legacy-scope .ec-registerRole {
        padding-right: 24px !important;
        padding-left: 24px !important;
    }
}

@media (min-width: 1024px) {
    body[id^="page_shopping"] .ec-layoutRole__legacy-wrapper.legacy-scope {
        margin-left: var(--simple09-sidebar-width) !important;
    }

    body[id^="page_shopping"] #custom-page-header,
    body[id^="page_shopping"] #custom-progress-bar {
        box-sizing: border-box;
        width: calc(100% - var(--simple09-sidebar-width)) !important;
        margin-left: var(--simple09-sidebar-width) !important;
    }

    body[id^="page_shopping"] .legacy-scope .ec-role,
    body[id^="page_shopping"] .legacy-scope .ec-cartRole,
    body[id^="page_shopping"] .legacy-scope .ec-orderRole,
    body[id^="page_shopping"] .legacy-scope .ec-registerRole,
    body[id^="page_shopping"] .legacy-scope .ec-cartCompleteRole,
    body[id^="page_shopping"] .legacy-scope .ec-AddAddress,
    body[id^="page_plugin_coupon"] .legacy-scope .ec-role,
    body[id^="page_plugin_coupon"] .legacy-scope .ec-registerRole {
        padding-right: 48px !important;
        padding-left: 48px !important;
    }
}

.progress-step {
    position: relative;
    flex: 1;
    text-align: center;
}

.progress-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 20px;
    left: 50%;
    width: 100%;
    height: 1px;
    background-color: #E5E5E5;
    z-index: -1;
}

.dark .progress-step:not(:last-child)::after {
    background-color: #333333;
}

.progress-step.active:not(:last-child)::after,
.progress-step.completed:not(:last-child)::after {
    background-color: #383838;
}

.dark .progress-step.active:not(:last-child)::after,
.dark .progress-step.completed:not(:last-child)::after {
    background-color: #EAEAEA;
}

.ec-blockBtn--action {
    background-color: black !important;
    color: white !important;
    border: none !important;
}

.ec-blockBtn--cancel {
    background-color: #d9d9d9 !important;
    color: #333333 !important;
    border: none !important;
}

.ec-blockBtn--cancel:hover,
.ec-blockBtn--action:hover {
    opacity: 0.8;
}

.ec-orderAccount .ec-rectHeading h2 {
    margin-top: 0 !important
}

.ec-totalBox__paymentTotal .ec-totalBox__taxLabel,
.ec-totalBox__paymentTotal .ec-totalBox__price {
    color: #004285 !important;
}

.legacy-scope .ec-rectHeading h1,
.legacy-scope .ec-rectHeading .h1,
.legacy-scope .ec-rectHeading h2,
.legacy-scope .ec-rectHeading .h2,
.legacy-scope .ec-rectHeading h3,
.legacy-scope .ec-rectHeading .h3,
.legacy-scope .ec-rectHeading h4,
.legacy-scope .ec-rectHeading .h4,
.legacy-scope .ec-rectHeading h5,
.legacy-scope .ec-rectHeading .h5,
.legacy-scope .ec-rectHeading h6,
.legacy-scope .ec-rectHeading .h6 {
    background: #faf9f7;
    border: 1px solid #e8e4da;
    color: #47403a;
}

.legacy-scope .ec-totalBox {
    background: #faf9f7;
    border: 1px solid #e8e4da;
}

.legacy-scope .ec-totalBox .ec-totalBox__pointBlock {
    background: #ffffff;
    border: 1px solid #eee4d7;
}

.dark .legacy-scope .ec-rectHeading h1,
.dark .legacy-scope .ec-rectHeading .h1,
.dark .legacy-scope .ec-rectHeading h2,
.dark .legacy-scope .ec-rectHeading .h2,
.dark .legacy-scope .ec-rectHeading h3,
.dark .legacy-scope .ec-rectHeading .h3,
.dark .legacy-scope .ec-rectHeading h4,
.dark .legacy-scope .ec-rectHeading .h4,
.dark .legacy-scope .ec-rectHeading h5,
.dark .legacy-scope .ec-rectHeading .h5,
.dark .legacy-scope .ec-rectHeading h6,
.dark .legacy-scope .ec-rectHeading .h6 {
    background: #1f1f1f;
    border-color: #3f3f46;
    color: #f4f4f5;
}

.dark .legacy-scope .ec-totalBox {
    background: #18181b;
    border-color: #3f3f46;
}

.dark .legacy-scope .ec-totalBox .ec-totalBox__pointBlock {
    background: #27272a;
    border-color: #3f3f46;
}
