:root {
    --color-primary-300: #F58D8F;
    --color-primary-500: #E30413;
    --color-primary-600: #BA000D;
    --color-text: #333;
    --color-border-strong: #333333;
    --color-border-light: #EAEAEA;
    --point-red: #EA5455;
    --service-store-min-width: 360px;
    --layout-header-py: 20px;
    --layout-header-pr: 20px;
    --layout-header-pl: 50px;
    --layout-content-max-width: 1538px;
    --layout-content-x: 24px;
    --layout-main-py: 40px;
    --layout-main-x: 24px;
    --slider-nav-gutter: 0px;
    --gap-section: 40px;
    --gap-grid: 30px;
    --gap-card: 24px;
    --gap-stack: 20px;
    --shadow-card-sm: 5px 5px 10px 0 rgba(0, 0, 0, 0.1);
}

:root {
    --layout-footer-py: 30px;
    --layout-footer-pr: 50px;
    --layout-footer-pl: 50px;
    --gap-block: 32px;
    --gap-inline: 10px;
    --service-store-mobile-gutter: clamp(14px, 6%, 20px);
}

.common-footer {
    background: #282828;
    font-size: 0.75rem;
    letter-spacing: -0.02em;
}

.common-footer__inner {
    width: 100%;
    margin: 0 auto;
    display: flex;
    max-width: 1920px;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--gap-block);
    padding: var(--layout-footer-py) var(--layout-footer-pr) var(--layout-footer-py) var(--layout-footer-pl);
}

.common-footer__left {
    min-width: 0;
    flex:1;
}

.common-footer__links,
.common-footer__support,
.common-footer__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gap-inline);
}

.common-footer__links,
.common-footer__support {
    font-size: 0.75rem;
    font-weight: 500;
    color: #fff;
}

.common-footer__divider {
    width: 1px;
    height: 12px;
    background: #818181;
}

.common-footer__company {
    margin-top: 10px;
    font-size: 0.75rem;
    line-height: 1.55;
    color: #BDBEC7;
}

.common-footer__company > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
}

.common-footer__company > ul > li + li {
    position: relative;
    padding-left: 10px;
}

.common-footer__company > ul > li + li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 12px;
    background: #818181;
    transform: translateY(-50%);
}

.common-footer__right {
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--gap-inline);
    color: #fff;
    flex:1;
}

.common-footer__action {
    display: inline-flex;
    min-width: 96px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #fff;
}

.isms-p {
	display:flex;
	gap:10px;
	background-color:white;
	padding:5px 7px;
	border-radius:3px;
	width:205px;
	line-height:14px;
	font-size:0.75em;
	flex:0 0 205px;
	min-height:40px;
	max-height:40px;
}
.isms-p img {height:30px;}
.isms-p p { color:#666; font-weight:bold; }

@media (max-width: 1023px) {
    :root {
        --layout-footer-pr: 24px;
        --layout-footer-pl: 24px;
        --gap-block: 28px;
    }

    .common-footer__inner {
        flex-direction: column;
        align-items: stretch;
    }

    .common-footer__right {
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    :root {
        --layout-footer-pr: 20px;
        --layout-footer-pl: 20px;
        --layout-footer-py: 24px;
        --gap-block: 24px;
        --gap-inline: 8px;
    }

    .common-footer {
        width: 100%;
        margin: 0;
    }
}

@media (max-width: 575px) {
    :root {
        --layout-footer-pr: var(--service-store-mobile-gutter);
        --layout-footer-pl: var(--service-store-mobile-gutter);
    }
}

@media (max-width: 479px) {
    :root {
        --gap-block: 20px;
        --gap-inline: 6px;
    }
}
