.mo_btn {display: none;}
.on_br {display: none !important;}
@media screen and (max-width: 1340px){
  .container {max-width: 100%; padding: 0 20px; box-sizing: border-box;}
  section {padding: 80px 0;}

  .sec1 .img-box .txt-box .txt {font-size: 30px;}
  
  .animate_txt {margin-top: 80px;}
  .animate_txt .tit {margin-bottom: 30px; font-size: 24px;}
  .animate_txt .txt-item ul {gap: 20px;}
  .animate_txt .txt-item ul li {gap: 10px; font-size: 32px;}
  .animate_txt .txt-item ul li .txt_ld img {width: 45px;}

  .sec2 .txt-box {margin-top: 30px;}
  .sec2 .txt-box .tit {margin-bottom: 10px; font-size: 22px;}
  .sec2 .txt-box .txt {font-size: 32px;}

  .sec2 .sec2_ct {margin-top: 35px;}
  .sec2 .sec2_ct ul {margin: 0 -20px;}
  .sec2 .sec2_ct ul li {padding: 0 20px;}
  .sec2 .sec2_ct ul li .child-box .txt-box {margin-top: 15px;}
  .sec2 .sec2_ct ul li .child-box .txt-box p {font-size: 24px;}
  .sec2 .sec2_ct ul li .child-box .txt-box img {width: 35px;}
  
  .sec3 .txt-box {gap: 30px;}
  .sec3 .txt-box p {font-size: 34px;}

  .sec4 .tit-box .tit {font-size: 34px;}
  .sec4 .tit-box .sub {font-size: 24px;}

  footer .container {gap: 0;}
  footer .right-box .f-nav ul {gap: 40px; justify-content: flex-end;}
  footer .left-box .f_logo {margin-bottom: 50px;}
}

@media screen and (max-width: 1000px) {
  section {padding: 120px 0;}

  header {height: 60px;}
  header .logo {width: 160px;}
  header nav {position: fixed; top: 0; left: -300px; width: 300px; height: 100vh; background: var(--wt); transition: all .3s;}
  header.open nav {left: 0;}
  header nav ul {flex-flow: column; align-items: center; justify-content: center; gap: 20px; height: 100%;}
  header nav ul li a {color: var(--black_3);}
  header .hd_btn {position: fixed; bottom: 20px; right: 20px; display: flex; flex-flow: column; gap: 8px;}
  header .hd_btn button {width: 50px; height: auto; aspect-ratio: 1; padding: 0; line-height: 1.1; border-radius: 100%; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);}
  .on_br {display: block !important;}
  .mo_btn {display: block; width: 22px; height: auto;}

  .visual {padding: 50px 0;}
  
  .sec1 .img-box .txt-box .txt {font-size: 28px;}
  .animate_txt {margin-top: 40px;}
  .animate_txt .tit {margin-bottom: 20px; font-size: 22px;}
  .animate_txt .txt-item ul {gap: 6px;}
  .animate_txt .txt-item ul li {font-size: 20px; gap: 4px;}
  .animate_txt .txt-item ul li .txt_ld {width: 42px; height: 30px;}
  .animate_txt .txt-item ul li .txt_ld img {width: 30px;}

  .sec2 .txt-box .tit {font-size: 20px;}
  .sec2 .txt-box .txt {font-size: 26px;}

  .sec2 .sec2_ct ul {margin: 0 -10px;}
  .sec2 .sec2_ct ul li {padding: 0 10px;}
  .sec2 .sec2_ct ul li .child-box .txt-box p {font-size: 18px;}
  .sec2 .sec2_ct ul li .child-box .txt-box img {width: 30px;}

  .sec3 .txt-box {gap: 15px;}
  .sec3 .txt-box p {font-size: 26px;}

  .sec4 .tit-box .tit {margin-bottom: 15px; font-size: 28px; word-break: keep-all;}
  .sec4 .tit-box .sub {font-size: 18px;}

  footer {padding: 50px 0;}
  footer .container {flex-flow: column-reverse; gap: 32px;}
  footer .right-box .f-nav ul {justify-content: flex-start; flex-flow: column; gap: 15px;}
  footer .right-box .f-nav ul li .nav_link {flex-flow: row; flex-wrap: wrap; gap: 5px 16px; margin-top: 7px;}

  footer .left-box .f_logo {width: 160px; margin-bottom: 12px;}
  footer .left-box .address p {font-size: 14px; word-break: keep-all;}
  footer .left-box .copyright {font-size: 12px;}
}

@media screen and (max-width: 729px) {
  .sec2 .sec2_ct ul {flex-wrap: wrap; gap: 30px 0;}
  .sec2 .sec2_ct ul li {width: calc(100% / 2);}
}

@media screen and (max-width: 600px) {
  .sec4 .tit-box .tit br {display: none;}

  .sec2 .sec2_ct ul li .child-box .txt-box p {font-size: 15px;}

  .sec1 .img-box {height: 216px;}
  .sec1 .img-box img {height: 100%; object-fit: cover;}
  .sec1 .img-box .txt-box .txt {font-size: 20px;}

  .visual {display: flex; align-items: center; justify-content: center;}
  .visual .vod-box {height: 70%;}
}

@media screen and (max-width: 430px) {
  .sec2 .sec2_ct ul {gap: 10px 0; margin: 0 -5px;}
  .sec2 .sec2_ct ul li {width: calc(100% / 2); padding: 0 5px;}
  .sec2 .txt-box .txt {font-size: 20px;}
  .sec2 .sec2_ct ul li .child-box .txt-box {margin-top: 8px;}
  .sec2 .sec2_ct ul li .child-box .txt-box p {font-size: 14px;}
  .sec2 .sec2_ct ul li .child-box .txt-box img {position: absolute; top: 10px; left: 10px;}

  .visual .vod-box {height: 50%;}

  .sec2 .sec2_ct ul li:first-of-type {width: calc(100% / 1);}
  .sec2 .sec2_ct ul li .child-box .img-box img {height: calc(50vw - 20px); object-fit: contain; background: #eff5ff;}
}

@media screen and (max-width: 361px) {
  .sec1 .img-box .txt-box {padding: 0 10px;}
  .sec1 .img-box .txt-box .txt {font-size: 18px;}
}

@media screen and (max-width: 340px) {
  header nav {width: 270px;}
  .sec2 .sec2_ct ul li .child-box .txt-box p {font-size: 13px;}
}