@charset "UTF-8";

/* ===============================================
  Utility — 部分的な指定（プレフィックスなし）
=============================================== */

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

.overflow-hidden {
    overflow: hidden !important;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Display */
@media (max-width: 767px) {
    .sp-hide {
        display: none !important;
    }
}
@media (min-width: 768px) and (max-width: 1023px) {
    .tbs-hide {
        display: none !important;
    }
}
@media (min-width: 1024px) and (max-width: 1279px) {
    .tbl-hide {
        display: none !important;
    }
}
@media (min-width: 768px) and (max-width: 1279px) {
    .tb-hide {
        display: none !important;
    }
}
@media (min-width: 768px) {
    .tbpc-hide {
        display: none !important;
    }
}
@media (min-width: 1280px) {
    .pc-hide {
        display: none !important;
    }
}

/* Text */
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

@media (max-width: 767px) {
    .sp-text-left { text-align: left !important; }
    .sp-text-center { text-align: center !important; }
    .sp-text-right { text-align: right !important; }
}

.text-indent {
    padding-left: 1em;
    text-indent: -1em;
}

.firstletter-accent {
    color: var(--color-primary);
}

.text-vertical { writing-mode: vertical-rl; }
.text-horizontal { writing-mode: horizontal-tb; }

/* Border */
.bd { border: 1px solid var(--color-black); }
.bd-t { border-top: 1px solid var(--color-black); }
.bd-r { border-right: 1px solid var(--color-black); }
.bd-b { border-bottom: 1px solid var(--color-black); }
.bd-l { border-left: 1px solid var(--color-black); }

/* Color / Background */
.color-primary { color: var(--color-primary) !important; }
.color-secondary { color: var(--color-secondary) !important; }
.color-accent { color: var(--color-accent) !important; }
.color-black { color: var(--color-black) !important; }
.color-white { color: var(--color-white) !important; }
.color-dark-gray { color: var(--color-dark-gray) !important; }
.color-light-gray { color: var(--color-light-gray) !important; }

.bg-primary { background-color: var(--color-primary) !important; }
.bg-secondary { background-color: var(--color-secondary) !important; }
.bg-accent { background-color: var(--color-accent) !important; }
.bg-black { background-color: var(--color-black) !important; }
.bg-white { background-color: var(--color-white) !important; }
.bg-dark-gray { background-color: var(--color-dark-gray) !important; }
.bg-light-gray { background-color: var(--color-light-gray) !important; }

.marker-primary,
.marker-secondary,
.marker-accent {
    display: inline;
    background-repeat: no-repeat;
    background-position: 0 0;
}

.marker-primary {
    background-image: linear-gradient(transparent 70%, color-mix(in srgb, var(--color-primary) 30%, white 70%) 70%);
}

.marker-secondary {
    background-image: linear-gradient(transparent 70%, color-mix(in srgb, var(--color-secondary) 30%, white 70%) 70%);
}

.marker-accent {
    background-image: linear-gradient(transparent 70%, color-mix(in srgb, var(--color-accent) 100%, white 70%) 70%);
}

/* Spacing */
.mgt-none { margin-top: 0 !important; }
.mgt-xxs { margin-top: 0.5em !important; }
.mgt-xs { margin-top: 0.75em !important; }
.mgt-sm { margin-top: 1em !important; }
.mgt-md { margin-top: 1.5em !important; }
.mgt-lg { margin-top: 2em !important; }
.mgt-xl { margin-top: 3em !important; }
.mgt-xxl { margin-top: 5em !important; }

.mgb-none { margin-bottom: 0 !important; }
.mgb-xxs { margin-bottom: 0.5em !important; }
.mgb-xs { margin-bottom: 0.75em !important; }
.mgb-sm { margin-bottom: 1em !important; }
.mgb-md { margin-bottom: 1.5em !important; }
.mgb-lg { margin-bottom: 2em !important; }
.mgb-xl { margin-bottom: 3em !important; }
.mgb-xxl { margin-bottom: 5em !important; }

.pdt-none { padding-top: 0 !important; }
.pdt-xxs { padding-top: 0.5em !important; }
.pdt-xs { padding-top: 0.75em !important; }
.pdt-sm { padding-top: 1em !important; }
.pdt-md { padding-top: 1.5em !important; }
.pdt-lg { padding-top: 2em !important; }
.pdt-xl { padding-top: 3em !important; }
.pdt-xxl { padding-top: 5em !important; }

.pdb-none { padding-bottom: 0 !important; }
.pdb-xxs { padding-bottom: 0.5em !important; }
.pdb-xs { padding-bottom: 0.75em !important; }
.pdb-sm { padding-bottom: 1em !important; }
.pdb-md { padding-bottom: 1.5em !important; }
.pdb-lg { padding-bottom: 2em !important; }
.pdb-xl { padding-bottom: 3em !important; }
.pdb-xxl { padding-bottom: 5em !important; }

@media (max-width: 767px) {
    .sp-mgt-none { margin-top: 0 !important; }
    .sp-mgt-xxs { margin-top: 0.5em !important; }
    .sp-mgt-xs { margin-top: 0.75em !important; }
    .sp-mgt-sm { margin-top: 1em !important; }
    .sp-mgt-md { margin-top: 1.5em !important; }
    .sp-mgt-lg { margin-top: 2em !important; }
    .sp-mgt-xl { margin-top: 3em !important; }
    .sp-mgt-xxl { margin-top: 5em !important; }

    .sp-mgb-none { margin-bottom: 0 !important; }
    .sp-mgb-xxs { margin-bottom: 0.5em !important; }
    .sp-mgb-xs { margin-bottom: 0.75em !important; }
    .sp-mgb-sm { margin-bottom: 1em !important; }
    .sp-mgb-md { margin-bottom: 1.5em !important; }
    .sp-mgb-lg { margin-bottom: 2em !important; }
    .sp-mgb-xl { margin-bottom: 3em !important; }
    .sp-mgb-xxl { margin-bottom: 5em !important; }
}

/* Width */
.w25p { width: 25% !important; }
.w33p { width: 33.333% !important; }
.w50p { width: 50% !important; }
.w75p { width: 75% !important; }
.w100p { width: 100% !important; }

@media (max-width: 767px) {
    .sp-w50p { width: 50% !important; }
    .sp-w100p { width: 100% !important; }
}

/* Image */
.img-rounded-md {
    border-radius: clamp(20px, 4.5vw, 40px) !important;
    overflow: hidden;
}

.img-rounded-sm {
    border-radius: 10px !important;
}

.img-circle {
    border-radius: 50% !important;
}

.img-area {
    line-height: 0;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

.img-full {
    display: block;
    width: 100%;
    height: auto;
}
.img-md {
    display: block;
    width: 80%;
    height: auto;
    margin-inline: auto;
}
.img-sm {
    display: block;
    width: 50%;
    height: auto;
    margin-inline: auto;
}

@media (max-width: 767px) {
    .sp-img-full {
        display: block;
        width: 100%;
        height: auto;
    }
    .sp-img-md {
        display: block;
        width: 70% !important;
        height: auto;
        margin-inline: auto;
    }
    .sp-img-sm {
        display: block;
        width: 50% !important;
        height: auto;
        margin-inline: auto;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .tbs-img-md {
        display: block;
        width: 70% !important;
        height: auto;
        margin-inline: auto;
    }
    .tbs-img-sm {
        display: block;
        width: 50% !important;
        height: auto;
        margin-inline: auto;
    }
}

.filter-softlight {
    position: relative;
    display: inline-block;
    line-height: 0;
}

.filter-softlight::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(40, 168, 56, 0.3);
    mix-blend-mode: soft-light;
    pointer-events: none;
}

/* Icon link helper */
.icon {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    vertical-align: middle;
    text-decoration: none;
}

.icon::before,
.icon::after {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 1.2em;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    flex-shrink: 0;
}

.icon--left::after,
.icon--right::before {
    display: none;
}

.icon-external::before { content: 'open_in_new'; }
.icon-pdf::before { content: 'picture_as_pdf'; }
.icon-half-arrow::before,
.icon-half-arrow::after { content: 'arrow_forward'; }
.icon-mail::before { content: 'mail'; }
.icon-call::before { content: 'call'; }
.icon-download::before { content: 'download'; }
.icon-home::before { content: 'home'; }
.icon-search::before { content: 'search'; }
.icon-menu::before { content: 'menu'; }
.icon-close::before { content: 'close'; }
.icon-check::before { content: 'check'; }
.icon-info::before { content: 'info'; }
.icon-location::before { content: 'location_on'; }
.icon-schedule::before { content: 'schedule'; }

@media (min-width: 768px) {
    .icon {
        gap: 0.7em;
    }
}
