/* 共通スタイル - 株式会社PLUS ウェブサイト */

/* フォント設定 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap');

body {
    font-family: 'Noto Sans JP', sans-serif;
}

/* ==============================
   レスポンシブ改行補助
   ============================== */

.br-sp {
    display: none;
}

.br-pc {
    display: block;
}

@media (max-width: 767px) {
    .br-sp {
        display: block;
    }

    .br-pc {
        display: none;
    }
}

/* ==============================
   アニメーション定義
   ============================== */

/* フェードイン + 上昇 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out;
}

/* 右からスライドイン */
@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(100px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-slideInRight {
    animation: slideInRight 0.5s ease-out;
}

/* ==============================
   スクロールアニメーション
   ============================== */

.fade-in-section {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in-section.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ==============================
   グラデーションボーダー（資料請求ページ用）
   ============================== */

.gradient-border {
    position: relative;
}

.gradient-border::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: 1rem;
    background: linear-gradient(135deg, #1e3a8a, #3b82f6, #60a5fa);
    z-index: 0;
    pointer-events: none;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.gradient-border > * {
    position: relative;
    z-index: 1;
}

/* ==============================
   フォーム埋め込み（iframe）
   ============================== */

.form-embed {
    border-radius: 1.25rem;
    overflow: hidden;
    border: none;
    background: #ffffff;
    box-shadow: 0 20px 50px -35px rgba(15, 23, 42, 0.5);
}

.form-embed iframe {
    display: block;
    width: 100%;
    border: 0;
    background: #ffffff;
}
