@charset "UTF-8";

/* =========================================
   MarksUp Custom Styles
   ========================================= */

/* Font Family */
body {
    font-family: 'Noto Sans JP', sans-serif;
}

/* Custom Utilities */
.text-shadow {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

.clip-diagonal {
    clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
}

.clip-diagonal-reverse {
    clip-path: polygon(0 15%, 100% 0, 100% 100%, 0 100%);
}

/* Marker animation */
.marker-anim {
    background: linear-gradient(transparent 60%, #FFD700 60%);
    background-size: 0% 100%;
    background-repeat: no-repeat;
    transition: background-size 0.8s ease;
}
.marker-anim.active {
    background-size: 100% 100%;
}

.section-number {
    font-family: 'Montserrat', sans-serif;
    -webkit-text-stroke: 1px #e5e7eb;
    color: transparent;
}

/* Loader */
.loader {
    border: 3px solid #f3f3f3;
    border-radius: 50%;
    border-top: 3px solid #FFD700;
    width: 20px;
    height: 20px;
    -webkit-animation: spin 1s linear infinite; /* Safari */
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}