html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Noto Sans JP', 'BIZ UDGothic', sans-serif;
    color: #333; /* Dark gray for general text */
}
#logo-text {
    font-family: 'M PLUS 1', sans-serif;
}
.ff-MPLUS1 {
    font-family: 'M PLUS 1', sans-serif;
    font-weight: 400;
}

.ff-MPLUS1-700 {
    font-family: 'M PLUS 1', sans-serif;
    font-weight: 700;
}

.ff-MPLUS1-900 {
    font-family: 'M PLUS 1', sans-serif;
    font-weight: 900;
}

.text-shadow {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.not-deco {
    text-decoration: none !important;
}

/* Custom royal blue color */
.bg-royal-blue {
    background-color: #4169E1; /* Royal Blue */
}
.bg-rangerblue {
    background-color: #0062b2; /* Ranger Blue */
}

.text-royal-blue {
    color: #4169E1; /* Royal Blue */
}
.text-rangerblue {
    color: #0062b2 !important; /* Ranger Blue */
}
.decoration-rangeblue {
    text-decoration: #0062b2; /* Ranger Blue */
}

.border-royal-blue {
    border-color: #4169E1; /* Royal Blue */
}


.header-transparent {
    background-color: transparent;
    box-shadow: none;
}

.header-scrolled {
    background-color: rgba(255, 255, 255, 0.9); /* White with opacity */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}

.flex-grow-for-footer {
    flex-grow: 1;
}

.separator-gradient {
    height: 10px;
    background: linear-gradient(90deg,#33404E, #8AADAD, #33404E);
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.2));
}

.section-datasets {
    background-image: linear-gradient(to bottom, #e0f7fa, #f8f8ff);
}

a {
    color: #3498db; /* Blue color */
    text-decoration: underline;
}

    a:hover {
        text-decoration: underline;
    }

.after-introduction {
    background-image: linear-gradient(to right, rgba(255,255,255,0.7), rgba(255,255,255,0.6), rgba(255,255,255,0.5)),url('../img/bg-nashi.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.case-study {
    background-image: linear-gradient(to right, rgba(255,255,255,0.95), rgba(255,255,255,0.85), rgba(255,255,255,0.95)),url('../img/bg-nashi.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.index-cta {
    background-image: linear-gradient(to right, rgba(0,98,178,0.7), rgba(0,98,178,0.6), rgba(0,98,178,0.5)),url('../img/bg-nashi.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.cta-case {
    background-image: linear-gradient(to right, rgba(0,98,178,0.95), rgba(0,98,178,0.85), rgba(0,98,178,0.7)),url('../img/bg-nashi.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* 他の事例紹介カードの縁を少し強調 */
.case-links a {
    border: 2px solid rgba(51, 64, 78, 0.15); /* #33404E を薄めて */
    border-radius: 1rem; /* 角丸 */
    transition: border-color 0.3s, box-shadow 0.3s;
}

    .case-links a:hover {
        border-color: rgba(51, 64, 78, 0.35); /* hover時に少し濃く */
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08); /* 控えめな影 */
    }

.site-footer {
    background: #000;
    color: #fff;
    padding: 48px 20px 24px;
    font-size: 14px;
    line-height: 1.8;
}

    .site-footer a {
        color: #fff;
        text-decoration: none;
    }

        .site-footer a:hover,
        .site-footer a:focus {
            text-decoration: underline;
            outline: none;
        }

.footer-inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

.footer-section {
    grid-column: span 3;
    min-width: 0;
}

.footer-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 6px;
}

.footer-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

    .footer-list li {
        margin: 4px;
    }

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.2);
    margin-top: 32px;
    padding-top: 16px;
    text-align: center;
    color: rgba(255,255,255,.8);
}

/* レスポンシブ */
@media (max-width: 1024px) {
    .footer-section {
        grid-column: span 6;
    }
}

@media (max-width: 640px) {
    .footer-inner {
        grid-template-columns: repeat(6, 1fr);
    }

    .footer-section {
        grid-column: span 6;
    }
}