@charset "UTF-8";
@media screen and (max-width: 767px) {

/* -------------------------
    このファイルは ict-dx.html（04_ICT・DX）専用のスタイルです。
    ヘッダー・フッター・共通ボタン等は css/common.css を参照しています。
    このページのみ Figma上で紺色の背景（#0073BA）とグラデーション装飾を使用しているため、
    配色トークンはこのファイル内で完結させています。
------------------------- */

.ict-dx {
    min-width: 100vw;
}

.ict-dx section > div {
    max-width: none;
    padding: 0 7.5vw;
}


/* -------------------------
    見出しピル（紫〜水色グラデーションの角丸見出し）
------------------------- */

.c-pill {
    min-width: 70vw;
    max-width: 100%;
    padding: 1.5vw 5vw;
    margin: 0 auto 5vw;
}

.c-pill__text {
    font-size: 4.4vw;
    line-height: 1.35;
    white-space: normal;
}

.c-pill--lg {
    max-width: 70vw;
    min-width: 0;
    padding: 2vw 3vw;
}


/* -------------------------
    ヒーロー
------------------------- */

.ict-hero {
    height: auto;
    padding: 35vw 0 10vw;
    background-image:
        radial-gradient(ellipse at 20% 20%, rgba(106, 0, 255, 0.35), transparent 55%),
        radial-gradient(ellipse at 75% 55%, rgba(0, 200, 220, 0.3), transparent 55%),
        url("../images/ict-dx/bg_circuit_sp.webp");
    background-position: 0 0, 0 0, center top;
    background-size: cover, cover, 100vw auto;
}

.ict-hero__inner {
    padding: 0;
}

.ict-hero__watermark {
    inset: 5.3vw 0 auto 0;
    font-size: 27vw;
}

.ict-hero__title {
    font-size: 6.5vw;
    line-height: 1.3;
}

.ict-hero__sub {
    margin-top: 4vw;
    font-size: 3.7vw;
}

.ict-hero__lead {
    max-width: 76vw;
    margin: 20vw auto 0;
    font-size: 3.8vw;
    line-height: 2.2;
    text-align: left;
}


/* -------------------------
    ひだまりDXのポイント
------------------------- */

.ict-points {
    padding: 15vw 0 10vw;
}

.ict-deco-blob {
    width: 60vw;
}

.ict-points .ict-deco-blob {
    top: 20vw;
    right: -45vw;
    width: 100vw;
}

.ict-points__list {
    width: 100%;
    gap: 15vw 0;
    flex-direction: column;
    margin: 5vw auto 0;
}

.ict-points__item {
    width: 100%;
    padding-top: 0;
}

.ict-icon_point01,
.ict-icon_point02_1,
.ict-icon_point02_2,
.ict-icon_point03 {
    display: none;
}

.ict-points__label {
    font-size: 7vw;
}

.ict-points__title {
    margin: 2vw 0 5vw;
    font-size: 4.6vw;
    line-height: 1.3;
}

.ict-points__text {
    margin-top: 2vw;
    font-size: 3.8vw;
    line-height: 1.8;
}

.ict-points__photos {
    position: relative;
    height: 45vw;
    margin: 6vw 0 0;
}

.ict-points__photo {
    position: absolute;
    display: block;
    object-fit: cover;
    border-radius: 0;
}

.ict-points__photo--exercise {
    top: 0;
    right: 0;
    width: 52vw;
    height: 34vw;
    z-index: 1;
}

.ict-points__photo--nurse {
    left: 0;
    bottom: 0;
    width: 34vw;
    height: 23vw;
    z-index: 2;
}

.ict-points__photo--team {
    top: 0;
    right: 0;
    width: 52vw;
    height: 34vw;
    z-index: 1;
}

.ict-points__photo--monitor {
    left: 0;
    bottom: 0;
    width: 34vw;
    height: 23vw;
    z-index: 2;
}


/* -------------------------
    劇的ビフォーアフター／ペーパレス化
    【判断が必要】Figma SP側では本来この2つの比較図（ict-time-compare／
    ict-paperless）を個別カード＋数値テキストとして再現しているようですが、
    要素数が非常に多く（4行×2図＝カード8枚分の見出し・本文・矢印・数値）、
    今回は既存PC版と同じ「1枚の比較画像をwidth:100%で縮小」方式のまま
    レスポンシブ対応のみ行いました。SPで画像文字が小さく読みにくい場合は、
    このセクションをHTML化する追加対応をご検討ください。
------------------------- */

.ict-result {
    padding: 10vw 0;
}

.ict-result .ict-deco-blob {
    bottom: 20vw;
    left: -20vw;
    width: 100vw;
}

.ict-result__lead {
    margin-top: 0;
    margin-bottom: 8vw;
    font-size: 3.5vw;
}

.ict-result__heading {
    margin-bottom: 4vw;
    font-size: 4.6vw;
}

.ict-time-compare {
    max-width: none;
    margin-top: 4vw;
}

.ict-result__summary {
    max-width: none;
    margin: 5vw 0 20vw;
    padding: 0;
    font-size: 3.5vw;
    line-height: 1.8;
}

.ict-paperless {
    max-width: none;
    margin-top: 4vw;
}


/* -------------------------
    チームで挑む組織への変革
------------------------- */

.ict-team {
    padding: 0 0 10vw;
}

.ict-team__heading {
    padding-top: 10vw;
    padding-bottom: 5vw;
    margin-bottom: 6vw;
    font-size: 5vw;
}

.ict-team__illust {
    border-radius: 2.6vw;
}

.ict-team__caption {
    margin-top: 4vw;
    font-size: 3.5vw;
    line-height: 1.7;
}


/* -------------------------
    ICT・DXの成果と現在地
    【判断が必要】ステータスバナー（時間／人員／質の3項目）について、
    FigmaのSPフレームには個別テキスト・アイコンで再現したとみられる要素
    （Group 1970）がありますが、フレーム幅750pxの外側にはみ出す座標
    （x=-405〜1155）に配置されており、正しく表示される想定の要素か判断
    できませんでした。誤って残った複製の可能性もあるため、既存PC版と
    同じ1枚のバナー画像をwidth:100%で縮小する形のままにしています。
------------------------- */

.ict-status {
    padding: 10vw 0;
}

.ict-status .ict-deco-blob {
    top: 5vw;
    right: -30vw;
    width: 90vw;
}

.ict-status-banner {
    max-width: none;
    margin-top: 4vw;
    width: 70vw;
}

.ict-status__summary {
    max-width: none;
    margin: 5vw 0;
    font-size: 3.5vw;
    line-height: 1.8;
}


/* -------------------------
    ツール紹介
------------------------- */

.ict-tools {
    padding: 10vw 0 15vw;
}

.ict-tools .c-pill__text {
    font-size: 4vw;
}

.ict-tools__lead {
    max-width: none;
    margin-top: 4vw;
    font-size: 3.5vw;
    line-height: 1.8;
    text-align: left;
}

.ict-tools__list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7vw;
    margin-top: 6vw;
}

.ict-tools__item {
    width: 70vw;
    padding: 3vw;
}

.ict-tools__photo {
    margin-bottom: 3vw;
}

.ict-tools__title {
    font-size: 4.2vw;
    font-weight: 500;
    margin: 0 3vw;
}

.ict-tools__text {
    margin: 3vw;
    font-size: 3.8vw;
    line-height: 1.6;
}


/* -------------------------
    VOICE
------------------------- */

.ict-voice {
    overflow: clip;
        padding: 15vw 0 30vw;
}

.ict-voice__en {
    top: -19vw;
    left: -33vw;
    font-size: 29vw;
}

.ict-voice__title {
    font-size: 5.5vw;
}

.ict-voice__title::after {
    height: 2px;
    margin-top: 3vw;
}

.ict-voice__list {
    gap: 12vw;
    margin-top: 10vw;
}

.ict-voice__item {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 2vw;
    padding: 8vw 6.5vw;
}

.ict-voice__item::after {
    left: 29vw;
    bottom: -9.1vw;
    width: 7.8vw;
    height: 9.1vw;
}

.ict-voice__item:nth-child(2)::after {
    left: 29vw;
    right: auto;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}

.ict-voice__photo {
    flex-direction: row;
    align-items: center;
    gap: 4vw;
    align-self: center;
}

.ict-voice__photo img {
    width: 30vw;
    height: 30vw;
    object-fit: cover;
    object-position: center;
}

.ict-voice__photo p {
    display: none;
}

.ict-voice__name {
    display: block;
    font-size: 3.2vw;
    font-weight: 400;
    margin: 0 auto;
}

.ict-voice__bubble {
    width: 100%;
}

.ict-voice__catch {
    margin-top: 4vw;
    font-size: 4vw;
}

.ict-voice__text {
    margin-top: 3vw;
    font-size: 3.5vw;
    line-height: 1.8;
}


/* -------------------------
    公的認定
------------------------- */

.ict-cert {
    padding: 15vw 0;
}

.ict-cert__heading {
    margin-bottom: 5vw;
    font-size: 5vw;
}

.ict-cert__body {
    flex-direction: column;
    align-items: flex-start;
    gap: 5vw;
    max-width: none;
}

.ict-cert__badge {
    width: 100%;
    height: auto;
    aspect-ratio: 385 / 392;
}

.ict-cert__title {
    font-size: 5.5vw;
    line-height: 1.6;
}

.ict-cert__text {
    margin-top: 4vw;
    font-size: 3.8vw;
    line-height: 1.7;
}


/* -------------------------
    CONTACT
------------------------- */

.ict-cta {
    overflow: clip;
        padding: 20vw 0 40vw;
}

.ict-cta .ict-deco-blob--lg {
    width: 200vw;
    max-width: 200vw;
    top: -20vw;
    right: -62vw;
}

.ict-cta__en {
    top: -31vw;
    left: 0;
    font-size: 25vw;
}

.ict-cta__buttons {
    flex-direction: column;
    gap: 6vw;
    margin: 10vw auto 0;
}

}