@charset "utf-8";

/* ==================
共通
===================*/
.tablet {
    display: none;
}

.sp {
    display: none;
}

.wrapper {
    max-width: 1120px;
    margin: 0 auto;
    width: 80%;
}

p,h2,h3,h4,h5 {
    font-feature-settings: "palt";
}

h3 {
    font-size: clamp(30px,2.2vw,36px);
    font-weight: 700;
    text-align: center;
}

h3 span {
    display: block;
    font-size: clamp(18px,1.5vw,24px);
}

h4 {
    font-size: clamp(40px, 4vw, 50px);
    font-weight: 700;
    color: #005eb8;
    text-align: center;
}

h4 span {
    display: block;
    font-size: clamp(35px,2.5vw,40px);
}

h5 {
    font-size: clamp(40px,3vw,48px);
    font-weight: 700;
    text-align: center;
    color: #005eb8;
}

h5 span{
    display: block;
    font-size: clamp(20px,1.5vw,24px);
}


/* テキストアニメーション */
.mask-bg {
    color: transparent;
    display: inline-block;
    overflow: hidden;
    position: relative;
    transition: color 0ms 450ms;
}

.mask-bg::after {
    background: #005eb8;
    bottom: 0;
    content: '';
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: translate3d(0,100%,0);
    top: -1px;
    bottom: -1px;
}

.mask-bg.is-animated {
    color: #005eb8;
}

.mask-bg.is-animated::after {
    animation: mask-bg 1.2s cubic-bezier(0.8,0,0.170,1);
}

@keyframes mask-bg {
    0% {
        transform: translate(0, 101%);
    }
    40%, 60% {
        transform: translate(0, 0%);
    }
    100% {
        transform: translate(0, -100%);
    }
}


/* フェードインアニメーション */
.fadeIn{
	opacity: 0;
	transform : translate(0px, 20px);
	transition : all 1s;
}

.fadeIn.active{
	opacity: 1;
	transform : translate(0, 0);
}

/* ===================
header
====================*/
body {
    position: relative;
}

header {
    position: absolute;
    left: 5%;
}

h1 {
    width: clamp(150px, 14vw, 230px);
    margin: 50px 0 0 3%;
}

header p {
    font-size: clamp(18px,1.3vw,21px);
    margin: 20px 0 0 3%;
    white-space: nowrap;
}


/* =====================
ファーストビュー
======================*/
.section_FV {
    background-image: url(../images/FV_bgImg.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    padding: 5% 3% 3%;
}

h2 {
    padding: 12% 7% 17% 0%;
    font-size: clamp(34px, 3.4vw, 60px);
    font-weight: 900;
    color: #005eb8;
}

h2 span {
    display: block;
    font-size: clamp(20px,1.8vw,30px);
    font-weight: 700;
    margin-top: 55px;
}

.triangleImg {
    display: flex;
    flex-direction: column-reverse;
    /* margin: 5% auto 13%; */
    width: clamp(500px, 48vw, 1000px);
    height: auto;
    position: relative;
}

.piece {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: translateY(-150px);
    transition:transform 0.8s ease, opacity 0.6s ease;
}

/* 最終位置（＝積み上がった状態） */
.blue {
    z-index: 1;
}

.green {
    z-index: 2;
}

.gray {
    z-index: 3;
}

/* 落下後 */
.piece.active {
    transform: translateY(0);
    opacity: 1;
}

.triangle_logo {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition:
    opacity 0.8s ease,
    transform 0.4s ease;

}

.triangle_logo.active {
    opacity: 1;
}

/* ====================
出展のご案内
=====================*/
.exhibition {
    background-color: #eeeeee;
    padding: 75px 0 100px;
}

.exhibition_logo {
    width: clamp(600px,50vw,790px);
    margin: 0 auto 0;
}

.exhibition h3 {
    margin-top: 35px;
}

.exhibition_container {
    display: flex;
    align-items: center;
}

.exhibition_containerImg {
    width: 50%;
}

.exhibition_detail {
    margin-left: 40px;
}

.year,.time {
    font-size: clamp(25px,1.9vw,30px);
    font-weight: 700;
}

.date {
    font-size: clamp(30px,2.2vw,36px);
    font-weight: 700;
}

.date span {
    font-size: clamp(55px,3.8vw,60px);
}

.time span {
    font-size: clamp(16px,1.1vw,18px);
}

.exhibition_detail ul {
    margin-top: 35px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.exhibition_detail li {
    display: flex;
    align-items: center;
    gap: 25px;
}

.exhibition_detail li p {
    font-size: clamp(20px,1.5vw,24px);
    font-weight: 500;
}

.bgBlue {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #005eb8;
    width: 150px;
    height: 45px;
    font-size: clamp(18px,1.3vw,21px);
    color: #fff;
}

.detail_txt {
    font-size: clamp(16px,1.2vw,20px);
}

/* ======================
展示品情報
=======================*/
.displayTitle {
    text-align: center;
}

.display h3 {
    margin-top: 105px;
}

.display h4 {
    margin-top: 85px;
}

.bgColor {
    margin-top: 110px;
    background: linear-gradient(90deg, #ebf4fa 0%, #ebf4fa 50%, #edeefa 50%, #edeefa 100%);
    padding-top: 85px;
    padding-bottom: 80px;
}

.display_content {
    display: flex;
    gap: 35px;
    justify-content: center;
    margin-top: 50px;
}

.display_bgWh {
    background-color: #fff;
    border: solid 2px #005eb8;
    border-radius: 8px;
    padding: 30px 3%;
}

.purple {
    border: solid 2px #2b32b2;
}

.display_bgWh p {
    font-size: clamp(24px,1.6vw,27px);
    color: #005eb8;
    font-weight: 700;
}

.purple p {
    color: #2b32b2;
}

.display_smallTxt {
    font-size: clamp(20px,1.5vw,24px)!important;
}

.display_marutto {
    width: 285px;
    margin: 15px auto;
}

.display_smart {
    width: 280px;
    margin: 40px auto;
}

.display_bgWh li {
    font-size: clamp(16px,1.1vw,18px);
    display: flex;
    align-items: center;
    margin-top: 10px;
    font-feature-settings: "palt";
}

.display_bgWh li::before {
    content:'';
    display: inline-block;
    width: 40px;
    height: 30px;
    background-image: url(../images/check.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}




/* =====================
サービス紹介
======================*/
.service {
    margin: 115px auto;
    text-align: center;
}

.service h5 span {
    margin-top: 30px;
}

.details_marutto {
    background-color: #ebf4fa;
    padding: 55px 15% 55px;
}

summary {
    cursor: pointer;
}

.summary_marutto {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #dceaf7;
    border: solid 4px #005eb8;
    padding: 45px 6%;
    transition: 0.4s;
}

.summary_smart {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #e1e2f7;
    border: solid 4px #2b32b2;
    padding: 45px 6%;
    transition: 0.4s;
}

.click_marutto {
    font-size: 18px;
    color: #005eb8;
    margin-left: 2%;
}

.click_smart {
    font-size: 18px;
    color: #2b32b2;
    margin-left: 2%;
}
.click_marutto::after {
    content: '';
    display: block;
    width: 25px;
    height: 15px;
    background-image: url(../images/arrow_accordion.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform 0.4s;
    margin: 0 auto;
}

.click_smart::after {
    content: '';
    display: block;
    width: 25px;
    height: 15px;
    background-image: url(../images/arrow_accordion2.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform 0.4s;
    margin: 0 auto;
}

/* アコーディオンが開いた時のスタイル */
details[open] .click_marutto::after,details[open] .click_smart::after {
    transform: rotate(180deg);
}

summary:hover {
    opacity: 0.7;
}

.details_marutto h3,.details_smart h3 {
    text-align: start;
}

.details_maruttoLogo {
    width: clamp(155px,10.3vw,165px);
}

.service_bgWh {
    background-color: #fff;
    padding: 60px 6% 60px;
}

.marutto_content {
    display: flex;
    background-color: #005eb8;
    padding: 45px 3%;
    justify-content: space-between;
}

.marutto_content p {
    font-size: clamp(28px,2.5vw,40px);
    font-weight: 700;
    color: #fff;
    font-feature-settings: "palt";
}

.marutto_content p span {
    display: block;
    font-size: clamp(18px,1.5vw,24px);
    margin-top: 15px;
}

.marutto_content div {
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    width: 150px;
    height: 150px;
    justify-content: center;
}

.marutto_content div img {
    display: block;
    width: 120px;
}

.service_cw {
    background-color: #dceaf7;
    margin-top: 65px;
    padding: 45px 2%;
}

.service_cw p {
    font-size: clamp(25px,1.9vw,30px);
    color: #005eb8;
    font-weight: 700;
    text-align: center;
}

.details_smartLogo {
    width: 200px;
}

.details_smart {
    background-color: #edeefa;
    padding: 55px 15% 55px;
}

.cwPurple {
    background-color: #edeefa;
}

.cwPurple p {
    color: #2b32b2;
}

/* アコーディオンアニメーション */
body {
    interpolate-size: allow-keywords;
}

details::details-content {
    overflow: clip;
    height: 0;
    transition:
        height 400ms ease,
        border 400ms ease,
        content-visibility 400ms ease allow-discrete;
}

details[open]::details-content {
    height: auto;
}

/* =====================
支援実績
======================*/
.results {
    margin: 120px auto;
}

/* ====================
コンバージョン
=====================*/
.cv {
    background-color: #005eb8;
    padding: 80px 0;
}

.cv_btn {
    background-image: url(../images/cv_btn_bg.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: relative;
    max-width: 840px;
}

.cv_btn a {
    display: block;
    text-align: center;
    padding: 50px 0;
    font-size: clamp(30px,2.2vw,36px);
    font-weight: 700;
    color: #005eb8;
    transition: 0.4s;
}

.cv_btn a:hover {
    opacity: 0.4;
}

.cv_btn a::after {
    content: '';
    display: block;
    background-image: url(../images/arrow_btn.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 15px;
    height: 30px;
    position: absolute;
    top: 50%;
    right: 8%;
    transform: translateY(-50%);
}

/* ===================
オムロングループ
=====================*/
.group {
    margin-top: 105px;
}

.groupImg1 {
    margin-top: 45px;
}

.group_content {
    display: flex;
    margin-top: 100px;
    margin-bottom: 130px;
    align-items: center;
}

.group_contentTitl {
    color: #005eb8;
    font-size: clamp(25px,1.9vw,30px);
    font-weight: 700;
    font-feature-settings: "palt";
}

.group_content p:nth-child(2) {
    font-size: clamp(16px,1.2vw,20px);
    line-height: 2.2;
    margin-top: 40px;
    font-feature-settings: "palt";
}

.groupImg2 {
    width: clamp(380px,24vw,400px);
}


/* ========================
footer
=========================*/

footer {
    background-color: #005eb8;
    padding-top: 90px;
    padding-bottom: 70px;
}

footer ul {
    display: flex;
    justify-content: center;
    gap: 35px;
}

footer ul li {
    text-align: center;
}

footer ul li a {
    color: #fff;
    font-size: clamp(16px,1.1vw,18px);
    text-align: center;
}

small {
    display: block;
    font-size: clamp(14px,0.9vw,16px);
    text-align: center;
    color: #fff;
    margin: 70px auto 0;
}


/* ========================  tablet  =========================== */
@media screen and (min-width:768px) and (max-width:999px) {
    /* ==================
    共通
    ===================*/
    .tablet {
        display: block;
    }

    .wrapper {
        margin: 0 auto;
        width: 80%;
    }

    h3 {
        font-size: clamp(30px,2.2vw,36px);
        font-weight: 700;
        text-align: center;
    }

    h3 span {
        display: block;
        font-size: clamp(18px,1.5vw,24px);
    }

    h4 {
        font-size: clamp(40px, 4vw, 50px);
        font-weight: 700;
        color: #005eb8;
        text-align: center;
    }

    h4 span {
        display: block;
        font-size: clamp(28px,3vw,40px);
    }

    h5 {
        font-size: clamp(35px,4.6vw,48px);
        font-weight: 700;
        text-align: center;
        color: #005eb8;
    }

    h5 span{
        display: block;
        font-size: clamp(20px,1.5vw,24px);
    }

    /* ===================
    header
    ====================*/
    header {
        left: 6%;
    }

    h1 {
        width: clamp(100px, 16vw, 150px);
        margin: 30px 0 0 0;
    }

    header p {
        font-size: clamp(15px,1.3vw,21px);
        margin: 10px 0 0 0;
    }


    /* =====================
    ファーストビュー
    ======================*/
    h2 {
        padding: 11% 7% 10% 0;
        font-size: clamp(27px,3.9vw,40px);
    }

    h2 span {
        font-size: clamp(20px,2.7vw,30px);
        margin-top: 30px;
    }

    .triangleImg {
        /* margin: 15% auto 0; */
        width: clamp(440px, 50vw, 1000px);
    }

    /* ====================
    出展のご案内
    =====================*/
    .exhibition h3 {
        margin-top: 25px;
    }

    .exhibition_detail ul {
        margin-top: 25px;
        gap: 15px;
    }

    .exhibition_detail li {
        gap: 25px;
    }

    /* ======================
    展示品情報
    =======================*/
    .display h3 {
        margin-top: 80px;
    }

    .display h4 {
        margin-top: 75px;
    }

    .bgColor {
        background: #fff;
        margin-top: 0;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .bgColor .pc {
        display: none;
    }

    .display_content {
        gap: 10px;
        margin-top: 50px;
        flex-wrap: wrap;
    }

    .display_marutto {
        width: 250px;
        margin: 15px auto;
    }

    .display_smart {
        width: 250px;
        margin: 40px auto;
    }

    .display_bgWh li {
        margin-top: 10px;
        gap: 15px;
    }

    /* =====================
    サービス紹介
    ======================*/
    .service {
        margin: 100px auto;
    }

    .details_marutto {
        padding: 80px 5% 80px;
    }

    .summary_marutto {
        padding: 45px 6%;
    }

    .summary_smart {
        padding: 45px 6%;
    }

    .summary_marutto::after {
        margin-left: 2%;
    }

    .summary_smart::after {
        margin-left: 2%;
    }

    .details_maruttoLogo {
        width: clamp(155px,10.3vw,165px);
    }

    .service_bgWh {
        padding: 60px 6% 80px;
    }

    .marutto_content {
        padding: 45px 3%;
    }

    .marutto_content p span {
        margin-top: 15px;
    }

    .service_cw {
        margin-top: 65px;
        padding: 45px 2%;
    }

    .details_smartLogo {
        width: 200px;
    }

    .details_smart {
        padding: 80px 5% 80px;
    }

    /* =====================
    支援実績
    ======================*/
    .results {
        margin: 50px auto;
    }

    /* ====================
    コンバージョン
    =====================*/
    .cv {
        padding: 55px 0;
    }


    .cv_btn a {
        display: block;
        text-align: center;
        padding: 50px 0;
        font-size: clamp(24px,2.5vw,28px);
    }

    .cv_btn a::after {
        width: 10px;
        height: 30px;
        right: 15%;
    }

    /* ===================
    オムロングループ
    =====================*/
    .group {
        margin-top: 105px;
    }

    .groupImg1 {
        margin-top: 45px;
    }

    .group_content {
        display: flex;
        margin-top: 100px;
        margin-bottom: 130px;
        align-items: center;
        flex-wrap: wrap;
        gap: 50px;
        justify-content: center;
    }

    .group_content p:nth-child(2) {
        margin-top: 40px;
    }

    /* ========================
    footer
    =========================*/

    footer {
        padding-top: 90px;
        padding-bottom: 70px;
    }

    footer ul {
        display: flex;
        justify-content: center;
    }

    footer ul li a {
        color: #fff;
        font-size: clamp(13px,1.7vw,15px);
        text-align: center;
    }

    small {
        display: block;
        font-size: clamp(11px,1.5vw,14px);
        text-align: center;
        color: #fff;
        margin: 70px auto 0;
    }
}

/* ============================  sp  =============================== */
@media screen and (max-width:767px) {
    /* ==================
    共通
    ===================*/
    .pc {
        display: none;
    }

    .tablet {
        display: block;
    }

    .sp {
        display: block;
    }

    .wrapper {
        margin: 0 auto;
        width: 90%;
    }

    h3 {
        font-size: clamp(22px, 6.2vw, 28px);
        font-weight: 700;
        text-align: center;
    }

    h3 span {
        display: block;
        font-size: clamp(13px,3.8vw,16px);
    }

    h4 {
        font-size: clamp(28px, 8.5vw, 40px);
    }

    h4 span {
        display: block;
        font-size: clamp(14px, 4.5vw, 20px);
    }

    h5 {
        font-size: clamp(24px,7vw,28px);
        font-weight: 700;
        text-align: center;
        color: #005eb8;
    }

    h5 span{
        display: block;
        font-size: clamp(16px,3vw,18px);
    }

    /* ===================
    header
    ====================*/
    header {
        left: 5%;
        top: 15px;
    }

    h1 {
        width: 150px;
    }

    header p {
        font-size: clamp(12px,3.3vw,13px);
        margin-left: 15px;
    }


    /* =====================
    ファーストビュー
    ======================*/
    .section_FV {
        background-image: url(../images/FV_bgImg_sp.webp);
        justify-content: space-between;
        flex-direction: column;
    }

    .section_FV .tablet {
        display: none;
    }

    h2 {
        padding: 130px 0 5% 5%;
        font-size: clamp(30px, 8.4vw, 48px);
    }

    h2 span {
        display: block;
        font-size: clamp(18px, 5vw, 28px);
        font-weight: 700;
        margin-top: 20px;
    }

    .triangleImg {
        display: flex;
        flex-direction: column-reverse;
        margin: 0 auto;
        width: min(90vw, 650px);
        height: min(100vw, 670px);
        position: relative;
    }

    .piece {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        transform: translateY(-150px);
        transition:transform 0.9s ease, opacity 0.6s ease;
    }

    /* 最終位置（＝積み上がった状態） */
    .blue {
        z-index: 1;
    }

    .green {
        z-index: 2;
    }

    .gray {
        z-index: 3;
    }

    /* 落下後 */
    .piece.active {
        transform: translateY(0);
        opacity: 1;
    }

    .triangle_logo {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        transition:
        opacity 0.8s ease,
        transform 0.8s ease;

    }

    .triangle_logo.active {
        opacity: 1;
    }

    /* ====================
    出展のご案内
    =====================*/
    .exhibition {
        background-color: #eeeeee;
        padding: 75px 0 100px;
    }

    .exhibition_logo {
        width: min(85vw, 500px);
        margin: 0 auto 0;
    }

    .exhibition h3 {
        margin-top: 10px;
    }

    .exhibition_container {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: auto;
        margin-right: auto;
        gap: 20px;
        width: 80%;
    }

    .exhibition_containerImg {
        width: 100%;
    }

    .exhibition_detail {
        margin-left: 0px;
    }

    .year,.time {
        font-size: clamp(18px, 4vw, 24px);
    }

    .date {
        font-size: clamp(20px, 5.4vw, 28px);
    }

    .date span {
        font-size: clamp(38px, 8.8vw, 48px);
    }

    .time span {
        font-size: clamp(16px,1.1vw,18px);
    }

    .exhibition_detail ul {
        margin-top: 35px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .exhibition_detail li {
        display: flex;
        align-items: center;
        gap: 25px;
    }

    .exhibition_detail li p {
        font-size: clamp(16px,5vw,20px);
    }

    .bgBlue {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #005eb8;
        width: 110px;
        height: 45px;
        font-size: clamp(18px,1.3vw,21px);
        color: #fff;
    }

    .detail_txt {
        font-size: clamp(12px, 3.5vw, 16px);
    }

    /* ======================
    展示品情報
    =======================*/
    .display h3 {
        margin: 50px auto 0;
        width: 80%;
    }

    .display h4 {
        margin: 50px auto 0;
        width: 80%;
    }

    .bgColor {
        margin-top: 0;
        background: #fff;
        padding-top: 45px;
        padding-bottom: 0;
    }

    .display_content {
        flex-direction: column;
        gap: 35px;
        justify-content: center;
        margin-top: 50px;
        max-width: 400px;
    }

    .display_bgWh {
        background-color: #fff;
        border: solid 2px #005eb8;
        border-radius: 8px;
        padding: 30px 3%;
        flex: 1;
    }

    .purple {
        border: solid 2px #2b32b2;
    }

    .display_bgWh p {
        font-size: clamp(22px, 6.5vw, 28px);
        text-align: center;
    }

    .purple p {
        color: #2b32b2;
    }

    .display_smallTxt {
        font-size: clamp(16px, 3vw, 18px)!important;
        text-align: start !important;
    }

    .display_marutto {
        width: 220px;
        margin: 20px auto 10px;
    }

    .display_smart {
        width: 220px;
        margin: 20px auto;
    }

    .display_bgWh li {
        font-size: clamp(11px, 3.3vw, 15px);
        display: flex;
        align-items: center;
        margin-top: 10px;
    }

    .display_bgWh li::before {
        content:'';
        display: inline-block;
        width: 25px;
        height: 20px;
        background-image: url(../images/check.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        margin-right: 5px;
    }

    /* =====================
    サービス紹介
    ======================*/
    .service {
        margin: 60px auto;
    }

    .service h5 span {
        margin-top: 10px;
    }

    .details_marutto {
        background-color: #ebf4fa;
        padding: 70px 3% 70px;
    }

    .summary_marutto {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: #dceaf7;
        border: solid 4px #005eb8;
        padding: 20px 3%;
        gap: 20px;
    }

    .summary_marutto h3,.summary_smart h3 {
        text-align: center;
    }

    .summary_smart {
         flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: #e1e2f7;
        border: solid 4px #2b32b2;
        padding: 20px 3%;
        gap: 20px;
    }

    summary::before {
        font-size: 10px;
        top: 35%;
        right: 6.5%;
    }

    .details_maruttoLogo {
        width: clamp(155px,10.3vw,165px);
    }

    .service_bgWh {
        background-color: #fff;
        padding: 40px 4% 60px;
    }

    .marutto_content {
        display: flex;
        background-color: #005eb8;
        padding: 20px 3%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 20px
    }

    .marutto_content p {
        font-size: clamp(22px, 6.4vw, 24px);
        font-weight: 700;
        color: #fff;
        font-feature-settings: "palt";
        text-align: center;
    }

    .marutto_content p span {
        display: block;
        font-size: clamp(14px, 3.8vw, 16px);
        margin-top: 15px;
    }

    .marutto_content div {
        background-color: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
    }

    .marutto_content div img {
        display: block;
        width: 120px;
    }

    .service_cw {
        background-color: #dceaf7;
        margin-top: 45px;
        padding: 45px 2%;
    }

    .service_cw p {
        font-size: clamp(18px, 4.9vw, 24px);
        font-weight: 700;
        text-align: center;
    }

    .details_smartLogo {
        width: clamp(155px,10.3vw,165px);
    }

    .details_smart {
        background-color: #edeefa;
        padding: 70px 3% 70px;
    }

    .cwPurple {
        background-color: #edeefa;
    }


    /* =====================
    支援実績
    ======================*/
    .results {
        margin: 50px auto;
    }

    /* ====================
    コンバージョン
    =====================*/
    .cv {
        background-color: #005eb8;
        padding: 30px 0;
    }

    .cv_btn {
        background-image: url(../images/cv_btn_bg_sp.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        position: relative;
        width: 80%;
    }

    .cv_btn a {
        display: block;
        text-align: center;
        padding: 50px 0;
        font-size: clamp(17px, 4vw, 28px);
        font-weight: 700;
        color: #005eb8;
        transition: 0.4s;
    }

    .cv_btn a:hover {
        opacity: 0.4;
    }

    .cv_btn a::after {
        content: '';
        display: block;
        background-image: url(../images/arrow_btn.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        width: 25px;
        height: 25px;
        position: absolute;
        top: 50%;
        right: 8%;
        transform: translateY(-50%);
    }


    /* ===================
    オムロングループ
    =====================*/
    .group {
        margin-top: 80px;
    }

    .groupImg1 {
        margin-top: 45px;
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }

    .group_content {
        display: flex;
        flex-direction: column;
        margin-top: 60px;
        margin-bottom: 80px;
        align-items: center;
    }

    .group_contentTitl {
        color: #005eb8;
        font-size: clamp(24px, 5.5vw, 28px);
        font-weight: 700;
        font-feature-settings: "palt";
    }

    .group_content p:nth-child(2) {
        font-size: clamp(14px, 4vw, 16px);
        line-height: 2.2;
        margin-top: 20px;
        font-feature-settings: "palt";
    }

    .groupImg2 {
        width: min(85vw, 350px);
        margin-top: 20px;
    }


    /* ========================
    footer
    =========================*/

    footer {
        background-color: #005eb8;
        padding-top: 60px;
        padding-bottom: 40px;
    }

    footer ul {
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    footer ul li {
        text-align: center;
    }

    footer ul li a {
        color: #fff;
        font-size: clamp(12px, 3.6vw, 16px);
        text-align: center;
    }

    small {
        display: block;
        font-size: clamp(10px, 2.9vw, 12px);
        text-align: center;
        color: #fff;
        margin: 30px auto 0;
    }
}