@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: 50vh;
    transform: translate(-50%, -50%);
  }

  #ct_ai_kv_01 .bg2 {
    transform: translateY(20%);
    opacity: 0;
  }

  #ct_ai_kv_01 .stxt {
    text-align: center;
    font-size: 3.9063vw;
    font-weight: 600;
    line-height: 5.2083vw;
    font-style: italic;
    letter-spacing: -0.02em;
    color: #fff;
    left: 50%;
    top: 100vw;
    transform: translateX(-50%);
    opacity: 0;
    z-index: 1;
  }

  #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%;
    transform: translateX(-50%);
    /* left: 43.8151vw; */
  }

  #ct_ai_kv_01 .scroll img {
    width: 12.3698vw;
    height: auto;
  }

  @keyframes scrollmouse {
    0% {
      top: 68vh;
      /* transform: translateY(0); */
    }

    100% {
      top: calc(68vh - 20px);
      /* transform: translateY(20px); */
    }
  }

  /* #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.1250vw;
  }

  #ct_ai_ht_01 .tbox2 .ct_ai_title_box img {
    width: 8.8216vw;
    height: auto;
  }

  #ct_ai_ht_01 .tbox2 .ct_ai_title_box h2 {
    font-size: 8.8542vw;
    line-height: 7.5521vw;
  }

  #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: 71.0938vw;
  }

  #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;
  }

  #ct_ai_pn .area_img {
    height: 237.7343vw;
  }


  #ct_ai_milestones {
    padding-top: 8.2031vw;
    padding-bottom: 14.3229vw;
  }

  #ct_ai_milestones .textbox h3 {
    font-size: 7.5521vw;
    line-height: 8.4635vw;
  }

  #ct_ai_milestones .ct_ai_video_box {
    margin-top: 3.9063vw;
    margin-bottom: 3.9063vw;
  }

  #ct_ai_milestones .textbox .nm {
    text-align: left;
    font-size: 3.9063vw;
    line-height: 5.2083vw;
  }

}