@charset "utf-8";

/*■■■■■■■■■ PC  ■■■■■■■■■ */

.btn_box:hover {
    filter: brightness(1.2);
}

.btn_box:hover {
    filter: brightness(1.2);
}

/* メインビジュアル */
#pc_main .sec_1 {
    padding-top: 84px;
    height: 46vw;
    max-height: 880px;
    overflow: hidden;
    background: linear-gradient(0.25turn, #017abc, #01a39f);
}

#pc_main .mv.sec_1 .wrap {
    height: 100%;
    max-width: 100%;
    background: url(../img/chat/grid_bg_pc.webp) 99.2% 56% / 200%;
    background-repeat: repeat-x;
}

#pc_main .mv.sec_1 .inner {
    background: url(../img/chat/chat_mv_bg.webp) no-repeat 100% 0% / 66.4%;
}

#pc_main .mv.sec_1 .sec1_cont {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 1920px;
    padding-left: 8.4vw;
}

#pc_main .mv.sec_1 .sec1_txt {
    color: #ffffff;
    position: relative;
    width: 30vw;
    max-width: 577px;
    bottom: 3.7vw;
    white-space: nowrap;
}

#pc_main .mv.sec_1 .sec1_img {
    max-width: 1105px;
    width: 57.5vw;
    position: relative;
    top: 1.3vw;
    left: 8.7vw;
    opacity: 0.97;
}

#pc_main .mv.sec_1 .sec1_txt h2 {
    font-size: clamp(2rem, 3.6vw, 6.9rem);
    font-weight: 600;
    line-height: 6.4vw;
    letter-spacing: 0.5vw;
    text-align: left;
    margin-bottom: 1.3vw;
}

#pc_main .mv.sec_1 .sec1_txt .description {
    font-size: clamp(1rem, 1.355vw, 2.6rem);
    letter-spacing: 0.175vw;
}

/* デモボタン追加 */
#pc_main .sec_5 .sub_title {
    margin: 0 auto 74px;
}

#pc_main .sec_5 .btn_wrap {
    display: flex;
    align-items: center;
    width: 63vw;
    max-width: 790px;
}

#pc_main .sec_5 .btn_box {
    max-width: 375px;
    width: 29.8vw;
    max-height: 80px;
    height: 7vw;
    background-color: #e50180;
    border-radius: 50px;
}

#pc_main .sec_5 .btn_box.inquiry {
    margin-right: 5%;
}

#pc_main .sec_5 .btn_box .link_btn {
    font-size: 2.4rem;
    font-weight: 500;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* フッター */
#under {
    padding: 44px 0 27px;
}

#under .f_inner {
    display: block;
}

#under .f_logo {
    text-align: center;
    width: 14vw;
    max-width: 229px;
    margin: 0 auto 41px;
}

#under .f_link p {
    margin: 0 30px;
}

#under .f_logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/*■■■■■■■■■ SP  ■■■■■■■■■ */
/* メインビジュアル */
#sp_main .sec1_txt {
    color: #fff;
    position: absolute;
    top: 28.5vw;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

#sp_main .sec1_txt h2 {
    font-size: 7.6vw;
    line-height: 1.47;
    margin-bottom: 2.8vw;
}

#sp_main .sec1_txt .description {
    font-size: 3.6vw;
    line-height: 1.75;
}

/* デモボタン追加 */
#sp_main .sec_6.secont {
    position: relative;
}

#sp_main .sec_6 .btn_wrap {
    text-align: center;
    padding: 0 12.3vw;
    position: absolute;
    margin: auto;
    right: 0;
    left: 0;
    bottom: 13.2vw;
    z-index: 1;
    width: 100%;
}

#sp_main .sec_6 .btn_box {
    width: 100%;
    max-height: 101.3px;
    height: 15.8vw;
    background-color: #e50180;
    border-radius: 7.7vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

#sp_main .sec_6 .btn_box.inquiry {
    margin-bottom: 3.5vw;
}

#sp_main .sec_6 .btn_box .link_btn {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 4.4vw;
    letter-spacing: 0.33vw;
    font-weight: 500;
    color: #ffffff;
}

@media (min-width: 641px) and (max-width: 1027px) {

    #pc_main .sec_1 {
        padding-top: 8vw;
    }
}

@media (max-width: 640px) {

    #sp_main .sec_1 {
        padding-top: 11.2vw;
    }
    
    #under {
        padding: 6.5vw 0vw 24.375vw;
    }

    #under .f_link {
        margin: 0 auto 6.25vw;
    }

    #under .f_link p {
        font-size: 2.9vw;
    }

    #under .f_logo {
        width: 100%;
        margin: 0 auto 6.25vw;
    }

    #under .f_logo img {
        height: 7.5vw;
        max-height: 41px;
        width: 100%;
        max-width: 220px;
    }
}


/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
chat_1 var2
◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/
/*===============================
SP
===============================*/
/* ChatGPTの実⼒ 
===============================*/ 
#sp_main.var2 .sec_7 .abs {
    top: inherit;
    bottom: 14vw;
}
#sp_main.var2 .sec_8 .abs {
    top: inherit;
    bottom: 14vw;
}
@media (min-width: 641px) and (max-width: 1027px) {
/*===============================
pc
===============================*/
     /* Media Coverage 
    ===============================*/
    #pc_main.var2 .sec_3{
        background: #fff;
    }
    #pc_main.var2 .sec_3 .inner_wrap {
        max-width: 100%;
        padding: 22px 2vw 13px;
    }
    /*Title*/
    #pc_main.var2 .sec_3 .area_title {
        max-width: 19vw;
        margin: 0 auto 12px;
    }
    /*Content*/
    #pc_main.var2 .sec_3 .media_img {
        max-width: 1028px;
        margin: 0 auto;
    }

    /* こんなお悩みありませんか？
    ===============================*/
    #pc_main.var2 .sec_4 {
        background: #eaf3fa;
    }
    #pc_main.var2 .sec_4 .inner_wrap {
        padding: 38px 2vw 46px;
    }
    /*Title*/
    #pc_main.var2 .sec_4 .area_title {
        margin: 0 auto 36px;
    }
    /* Content */
    #pc_main.var2 .sec_4 .nayami {
        max-width: 905px;
        margin: 0 auto;
    }
    /*Mask*/
    #pc_main.var2 .sec_4 .mask1 {
        background: #eaf3fa;
    }

    /* 「うちのAI」がすべて解決します！ 
    ===============================*/
    #pc_main.var2 .sec_5 {
        position: relative;
        padding-top: 162px;
        background: #ffffff;
    }
    #pc_main.var2 .sec_5 .inner_wrap {
        padding: 78px 2vw 0;
    }
    /* Title */
    #pc_main.var2 .sec_5 .area_title {
        margin: 0 auto 57px;
    }
    /* Txt */
    #pc_main.var2 .sec_5 .sub_title {
        margin: 0 auto 82px;
    }
    /* Button */
    #pc_main.var2 .sec_5 .btn_wrap {
        justify-content: center;
        width: 100%;
        max-width: 100%;
    }

    /* 独自データで訓練 
    ===============================*/
    #pc_main.var2 .sec_2{
        overflow: hidden;
        padding:0 2vw;
    }
    #pc_main.var2 .sec_2 .inner_wrap {
        padding:77px 0 62px;
        margin: 92px auto 92px;
        box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.12);
        background: #fff;
    }
    /*Title*/
    #pc_main.var2 .sec_2 .area_title {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        margin: 0 auto;
    }
    #pc_main.var2 .sec_2 .sub_title {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        margin: 3vw auto 10vw;
    }

    /* ChatGPTの実⼒ 
    ===============================*/
    #pc_main.var2 .sec_6 {
        padding: 131px 0 0;
    }
}

@media (min-width: 1028px) {
/*===============================
pc
===============================*/
    /* Media Coverage 
    ===============================*/
    #pc_main.var2 .sec_3{
        background: #fff;
    }
    #pc_main.var2 .sec_3 .inner_wrap {
        max-width: 100%;
        padding: 22px 0 13px;
    }
    /*Title*/
    #pc_main.var2 .sec_3 .area_title {
        max-width: 198px;
        margin: 0 auto 12px;
    }
    /*Content*/
    #pc_main.var2 .sec_3 .media_img {
        max-width: 1028px;
        margin: 0 auto;
    }

    /* こんなお悩みありませんか？
    ===============================*/
    #pc_main.var2 .sec_4 {
        background: #eaf3fa;
    }
    #pc_main.var2 .sec_4 .inner_wrap {
        padding: 38px 0 46px;
    }
    /*Title*/
    #pc_main.var2 .sec_4 .area_title {
        max-width: 407px;
        margin: 0 auto 36px;
    }
    /* Content */
    #pc_main.var2 .sec_4 .nayami {
        max-width: 905px;
        margin: 0 auto;
    }
    /*Mask*/
    #pc_main.var2 .sec_4 .mask1 {
        background: #eaf3fa;
    }

    /* 「うちのAI」がすべて解決します！ 
    ===============================*/
    #pc_main.var2 .sec_5 {
        position: relative;
        padding-top: 162px;
        background: #ffffff;
    }
    #pc_main.var2 .sec_5 .inner_wrap {
        padding-top: 78px;
    }
    /* Title */
    #pc_main.var2 .sec_5 .area_title {
        margin: 0 auto 57px;
    }
    /* Txt */
    #pc_main.var2 .sec_5 .sub_title {
        margin: 0 auto 82px;
    }
    /* Button */
    #pc_main.var2 .sec_5 .btn_wrap {
        justify-content: center;
        width: 100%;
        max-width: 100%;
        margin: 0 auto 244px;
    }

    /* 独自データで訓練 
    ===============================*/
    #pc_main.var2 .sec_2{
        overflow: hidden;
    }
    #pc_main.var2 .sec_2 .inner_wrap {
        padding:77px 0 62px;
        margin: 92px auto 92px;
        box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.12);
        background: #fff;
    }
    /*Title*/
    #pc_main.var2 .sec_2 .area_title {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        margin: 0 auto;
    }
    #pc_main.var2 .sec_2 .sub_title {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        margin: 27px auto 92px;
    }

    /* ChatGPTの実⼒ 
    ===============================*/
    #pc_main.var2 .sec_6 {
        padding: 131px 0 0;
    }

}