@charset "utf-8";

/* .ct_ai_container .ct_ai_pc { display: block; } */
.ct_ai_container .ct_ai_mo {
    display: none;
}


@media all and (max-width: 48rem) {

    /* 768px */
    .ct_ai_container .ct_ai_pc {
        display: none;
    }

    .ct_ai_container .ct_ai_mo {
        display: block;
    }

    .ct_ai_container .ct_ai_container_content {
        padding-left: 2.0833vw;
        padding-right: 2.0833vw;
    }

    .ct_ai_container .ct_ai_video_box button {
        /* width: 3.1250vw; */
        width: max-content;
        bottom: 3.6458vw;
    }

    .ct_ai_container .ct_ai_video_box button.ct_btn_center img {
        width: 12.25vw;
    }

    /* #ct_ai_shortcuts.ct_ai_hidden { opacity: 1; top: 0; }  */
    #ct_ai_shortcuts {
        padding: 1.8229vw 1.8229vw 1.8229vw;
        border-radius: 0;
        left: 0;
        transform: none;
        background-color: #000;
        border: 0;
        border-bottom: 1px solid #E8E8E8;
        overflow-x: scroll;
        width: 100%;
        gap: 2.6042vw;
        cursor: grab;
        user-select: none;
        top: 0;
    }
    #ct_ai_shortcuts.ct_ai_hidden {
        opacity: 0;
        top: -2.5853vw;
    }
    #ct_ai_shortcuts.ct_ai_down {
        opacity: 1;
        top: 17.3147vw;
    }

    #ct_ai_shortcuts::-webkit-scrollbar {
        height: 0.5208vw;
    }

    #ct_ai_shortcuts::-webkit-scrollbar-thumb {
        background: #717171;
    }

    #ct_ai_shortcuts::-webkit-scrollbar-track {
        display: none;
    }

    #ct_ai_shortcuts li a {
        font-size: 3.9063vw;
        padding: 1.8229vw 3.9063vw;
        color: #fff;
        -webkit-user-drag: none;
    }

    #ct_ai_shortcuts li a.active {
        font-size: 3.9063vw;
        border-radius: 6.5104vw;
    }

    /*  #ct_ai_kv_01 */
    #ct_ai_kv {
        padding-bottom: 0;
    }
    #ct_ai_kv_01 .ct_ai_container_content {
        top: 10.4167vw;
    }

    #ct_ai_kv_01 .kv_bg_all {
        width: 100%;
        height: 90vh;
    }

    #ct_ai_kv_01 .kv_bg_all .ct_ai_mo {
        width: 100%;
        height: 100%;
    }

    #ct_ai_kv_01 .bg2 {
        top: 0;
    }

    #ct_ai_kv_01 .ct_ai_title_box {
        width: 48.9583vw;
        height: 8.3333vw;
    }

    #ct_ai_kv_01 p span {
        font-size: 3.9063vw;
    }

    #ct_ai_kv_01 h1 {
        padding-top: 6.5104vw;
        padding-bottom: 0.7813vw;
        font-size: 9.6354vw;
        line-height: 9.1146vw;
    }

    #ct_ai_kv_01 h1 span {
        font-size: 7.0313vw;
        line-height: 7.0313vw;
    }

    #ct_ai_kv_01 .video_box {
        width: 153.1992vw;
        top: 40vh;
        transform: translate(-50%, -50%);
    }

    #ct_ai_kv_01 .bg2 {
        transform: translateY(20%);
        opacity: 0;
    }

    #ct_ai_kv_01 .prod {
        width: 84.2448vw;
        height: auto;
        left: 50%;
        top: calc(100vh + 20vh);
        transform: translate(-50%, 0);
        opacity: 1;
        /* will-change: transform; */
    }

    #ct_ai_kv_01 .prod img {
        width: 100%;
        height: auto;
    }

    #ct_ai_kv_01 .scroll {
        top: 68vh;
        left: 50%;
        left: 43.8151vw;
    }

    #ct_ai_kv_01 .scroll img {
        width: 12.3698vw;
        height: auto;
    }

    /* #ct_ai_ht */
    #ct_ai_ht {
        /* padding-top: -10.8073vw;
        top: -10.8073vw; */
        background-color: #000;
        height: 100vh;
        width: 100%;
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #ct_ai_ht_01 .ct_ai_product img.prd4_mo {
        opacity: 0;
    }

    #ct_ai_ht_01 .ct_ai_container_content {
        top: 97.7865vw;
    }

    #ct_ai_ht_01 .tbox1 h2 {
        font-size: 7.5521vw;
        line-height: 8.4635vw;
    }

    #ct_ai_ht_01 .tbox1 p {
        text-align: left;
        font-size: 3.9063vw;
        line-height: 5.2083vw;
        padding-top: 4.6875vw;
    }

    #ct_ai_ht_01 .tbox2 .ct_ai_title_box {
        gap: 3.2552vw;
    }

    #ct_ai_ht_01 .tbox2 .ct_ai_title_box img {
        width: 13.0208vw;
        height: auto;
    }

    #ct_ai_ht_01 .tbox2 .ct_ai_title_box h2 {
        font-size: 8.8542vw;
    }

    #ct_ai_ht_01 .tbox2 .exp {
        text-align: left;
        font-size: 3.9063vw;
        font-weight: 500;
        line-height: 5.2083vw;
        padding-top: 4.6875vw;
    }

    /* #ct_ai_wm_01 */

    #ct_ai_wm_01 .ct_ai_container_content {
        top: 29.2969vw;
    }

    #ct_ai_wm_01 .ct_ai_wrapper_content {
        padding-right: 5.7292vw;
    }



    #ct_ai_wm_01 .ct_ai_wrapper_content h2 {
        font-size: 9.3750vw;
    }

    #ct_ai_wm_01 .ct_ai_wrapper_content h2 strong {
        font-size: 9.3750vw;
    }

    #ct_ai_wm_01 .ct_ai_icon {
        padding-top: 10.6771vw;
    }

    #ct_ai_wm_01 .ct_ai_icon img {
        width: 12.1146vw;
    }

    /* #ct_ai_wm_03 */
    #ct_ai_wm_03 .ct_ai_wrapper_content {
        padding-top: 22.0052vw;
        padding-bottom: 10.4167vw;
    }

    #ct_ai_wm_03 .ct_ai_video_box {
        border-radius: 2.3438vw;
        border-color: #333;
    }

    #ct_ai_wm_03 .textbox {
        padding-top: 7.2917vw;
    }

    #ct_ai_wm_03 .textbox h3 {
        font-size: 9.3750vw;
    }

    #ct_ai_wm_03 .textbox p.nm {
        padding-top: 5.2083vw;
        padding-bottom: 5.2083vw;
        font-size: 3.9063vw;
        line-height: 5.2083vw;
        text-align: left;
        font-weight: 500;
    }

    #ct_ai_wm_03 .textbox p.sm {
        font-size: 3.3854vw;
        line-height: 4.6875vw;
        text-align: left;
        font-weight: 500;
    }

    /* #ct_ai_pn */
    #ct_ai_pn .ct_ai_container_content {
        padding-top: 22.0052vw;
    }



    #ct_ai_pn .ct_ai_pn_box {
        border-radius: 2.3438vw;
    }

    #ct_ai_pn .ct_ai_pn_box .btn {
        left: 78.1375%;
        top: 34.725%;
        width: 19%;
    }

    #ct_ai_pn p.ct_ai_st {
        font-size: 3.3854vw;
        line-height: 4.6875vw;
        padding-top: 5.4688vw;
        font-weight: 500;
    }

    #ct_ai_pn p.ct_ai_st.m2 {
        margin-top: 0;
    }

    #ct_ai_pn .ct_ai_card_box {
        padding-top: 16.9271vw;
    }

    #ct_ai_pn .ct_ai_card_box ul {
        gap: initial;
    }

    #ct_ai_pn .ct_ai_card_box ul li {
        flex: 1 0 72.9167vw;
        padding: 5.2083vw 6.5104vw 11.7188vw;
        margin-right: 3.1250vw;
        border-radius: 2.3438vw;
        min-width: 78vw;
        height: 59.5052vw;
    }
    #ct_ai_pn .ct_ai_card_box .hidedown2 {
        transform: translateY(0);
        opacity: 1;
    }

    #ct_ai_pn .ct_ai_card_box ul li:last-of-type {
        margin-right: 0;
    }

    #ct_ai_pn .ct_ai_card_box ul li .imgbox {
        justify-content: start;
        height: 13.0208vw;
    }

    #ct_ai_pn .ct_ai_card_box ul li .imgbox img {
        margin: initial;
    }

    #ct_ai_pn .ct_ai_card_box ul li h4 {
        padding: 4.9479vw 0 2.0833vw;
        font-size: 5.8594vw;
        text-align: left;
    }

    #ct_ai_pn .ct_ai_card_box ul li p {
        font-size: 3.9063vw;
        line-height: 5.2083vw;
        text-align: left;
    }

    #ct_ai_pn .ct_ai_navi {
        display: flex;
        justify-content: center;
        gap: 3.9063vw;
        padding-top: 3.9063vw;
    }

    #ct_ai_pn .ct_ai_swiper_button_prev,
    .ct_ai_swiper_button_next {
        width: 6.2500vw;
        cursor: pointer;
    }
    .ct_ai_swiper_button_prev.swiper-button-disabled,
    .ct_ai_swiper_button_next.swiper-button-disabled{
        opacity: 0.3;
    }

    #ct_ai_pn .ct_ai_swiper_pagination {
        display: flex;
        align-items: center;
        gap: 3.9063vw;
    }

    #ct_ai_pn .ct_ai_swiper_pagination span {
        width: 2.0833vw;
        height: 2.0833vw;
        border: 2px solid #fff;
        border-radius: 100%;
        cursor: pointer;
    }

    #ct_ai_pn .ct_ai_swiper_pagination .swiper-pagination-bullet-active {
        background: #fff;
    }

    /* #ct_ai_dry_01 */
    #ct_ai_dry {
        padding-bottom: 0;
    }



    #ct_ai_dry_01 .ct_ai_container_content {
        top: 29.2969vw;
    }

    #ct_ai_dry_01 .ct_ai_wrapper_content {
        padding-left: 5.0781vw;
    }

    #ct_ai_dry_01 .ct_ai_wrapper_content h2 {
        font-size: 9.3750vw;
    }

    #ct_ai_dry_01 .ct_ai_wrapper_content h2 strong {
        font-size: 9.3750vw;
    }

    #ct_ai_dry_01 .ct_ai_icon {
        padding-top: 10.6771vw;
    }

    #ct_ai_dry_01 .ct_ai_icon img {
        width: 12.1146vw;
    }

    /* #ct_ai_dry_02 */


    #ct_ai_dry_02 .ct_ai_wrapper_content {
        padding-top: 22.0052vw;
        text-align: left;
    }


    #ct_ai_dry_02 .ct_ai_video_box {
        border: none;
        border-radius: 2.3438vw;
    }

    #ct_ai_dry_02 .textbox {
        padding-top: 7.2917vw;
    }

    #ct_ai_dry_02 .textbox h3 {
        font-size: 9.3750vw;
    }

    #ct_ai_dry_02 .textbox p.nm {
        padding-top: 5.2083vw;
        padding-bottom: 5.2083vw;
        font-size: 4.1667vw;
        line-height: 5.7292vw;
        text-align: left;
    }

    #ct_ai_dry_02 .textbox p.sm {
        font-size: 3.3854vw;
        line-height: 4.6875vw;
        font-weight: 500;
        text-align: left;
    }

    /* #ct_ai_dry_03 */
    #ct_ai_dry_03 {
        background: #6F6C67;
        padding-bottom: 11.7188vw;
    }

    #ct_ai_dry_03 .bgtop{
        position: absolute;
        left: 0;
        top: 0;
    }

    #ct_ai_dry_03 .bgtop .ct_ai_mo{
        opacity: 0;
    }

    #ct_ai_dry_03 .ct_ai_wrapper_absolute{
        position: relative;
    }

    #ct_ai_dry_03 .ct_ai_wrapper_content {
        padding-top: 22.0052vw;
        padding-bottom: 0
    }

    #ct_ai_dry_03 .ct_ai_video_box {
        border-radius: 2.3438vw;
    }


    #ct_ai_dry_03 .ct_ai_card_box ul {
        padding-top: 16.4063vw;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul {
        gap: initial;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li {
        flex: 1 0 72.9167vw;
        padding: 5.2083vw 6.5104vw 11.1979vw;
        margin-right: 3.1250vw;
        min-width: 78vw;
        height: 74.6094vw;
    }
    #ct_ai_dry_03 .ct_ai_card_box .hidedown2 {
        transform: translateY(0);
        opacity: 1;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li:last-of-type {
        margin-right: 0;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li .imgbox {
        justify-content: start;
        height: 13.0208vw;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li .imgbox img {
        margin: initial;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li h4 {
        padding: 4.9479vw 0 2.0833vw;
        font-size: 5.8594vw;
        text-align: left;
    }

    #ct_ai_dry_03 .ct_ai_card_box ul li p {
        font-size: 3.9063vw;
        line-height: 5.2083vw;
        text-align: left;
    }

    #ct_ai_dry_03 .ct_ai_navi {
        display: flex;
        justify-content: center;
        gap: 3.9063vw;
        padding-top: 3.9063vw;
        padding-bottom: 5.4688vw;
    }

    #ct_ai_dry_03 .ct_ai_swiper_button_prev,
    .ct_ai_swiper_button_next {
        width: 6.2500vw;
        cursor: pointer;
    }

    #ct_ai_dry_03 .ct_ai_swiper_pagination {
        display: flex;
        align-items: center;
        gap: 3.9063vw;
    }

    #ct_ai_dry_03 .ct_ai_swiper_pagination span {
        width: 2.0833vw;
        height: 2.0833vw;
        border: 2px solid #fff;
        border-radius: 100%;
        cursor: pointer;
    }

    #ct_ai_dry_03 .ct_ai_swiper_pagination .swiper-pagination-bullet-active {
        background: #fff;
    }

    #ct_ai_dry_03 .ct_ai_sub_desc {
        font-size: 3.3854vw;
        line-height: 4.6875vw;
        font-weight: 500;
        padding-top: 0;
    }


    #ct_ai_wm_01 .ct-ai-wrapper-emblem, #ct_ai_dry_01 .ct-ai-wrapper-emblem {
        gap: 2.2135vw;
    }

    #ct_ai_wm_01 .ct-ai-box-emblem, #ct_ai_dry_01 .ct-ai-box-emblem {
        width: 12.2396vw;
        height: 12.2396vw;
        padding: 0.9115vw;
    }

    #ct_ai_wm_01 .ct-ai-wrapper-emblem img.ai-text {
        width: 9.5078vw;
        height: auto;
    }
    #ct_ai_dry_01 .ct-ai-wrapper-emblem img.ai-text {
        width: 14.7279vw;
        height: auto;
    }

}