.scroll-down {animation: heartbeat 1.5s ease-in-out infinite both; opacity: 0; width: 145px; height: auto;}
.mo_br {display: none;}
.mo_img {display: none;}
.mo_vod {display: none;}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}

/* 반응형 */
@media screen and (max-width: 1536px){
  .sec-scroll ul {padding-left: 20px;}
  .sec-scroll .container:before {width: calc(100% - 20px);;}
}

@media screen and (max-width: 1500px) {
  .sec-scroll ul li {width: calc(100% / 4); padding: 0 !important;}
}

@media screen and (max-width: 1430px){

  .container {max-width: 100%; padding: 0 20px;}

  header nav ul {gap: 50px;}
  
  .intro-top span {font-size: 120px;}
  .intro-top span:nth-child(6) {margin-left: 20px;}
  .intro-top span:nth-child(7) {margin-right: 20px;}
  .intro.start .intro-bottom .ist img {width: 350px; margin-top: 30px;}

  .rolling-banner {width: 2116px;}

  .sec-tit .tit {font-size: 50px;}
  .sec1 .sec-tit .sub {margin-top: 50px; font-size: 18px;}

  .view-more {height: 100px;}
  .view-more a {gap: 30px; font-size: 18px;}
  .view-more a img {width: 15.3px;}

  .sec3 {padding: 100px 0;}
  .sec3-tit .sub {font-size: 150px;}
  .sec3-tit .sec3_logo {width: 100px;}
  .sec3-tit .sec3_logo:before {height: 130px;}

  .sec3 .sec-tit {margin: 100px 0;}
  .sec3 .sec-tit .tit {margin-bottom: 50px; font-size: 40px;}
  .sec-tit .sub {font-size: 18px;}

  .sec-scroll ul li .child-box .tit {margin-bottom: 10px; font-size: 18px;}
  .sec-scroll ul li .child-box .sub {font-size: 14px;}

  .sec4 {padding: 100px 0;}
  .sec4 .sec4-btn {width: 500px;}
  .sec4 .sec4-btn a {font-size: 22px;}

  .sec-map {padding: 100px 0;}
  .sec-map .map-area {min-width: auto; width: 100%;}
  .sec-map .map-tit .tit {margin-bottom: 50px; font-size: 40px;}
  .sec-map .map-area .tit {margin-bottom: 15px; font-size: 24px;}
  .sec-map .d-flex {gap: 20px;}
  .sec-map .list-box {gap: 50px; margin-top: -100px; white-space: nowrap;}
  .sec-map .list-box dl dt {font-size: 18px;}
  .sec-map .list-box dl dd {font-size: 16px; letter-spacing: -0.05em;}
  .sec-map .list-box dl dd a {font-size: 16px; letter-spacing: -0.05em;}

  footer {padding: 100px 0 30px;}
  footer .address {margin-bottom: 10px; font-size: 15px;}
  footer .copyright {font-size: 12px;}

  /* about */
  .sec5 {padding: 100px 0;}
  .sec5 .sec5_txt .txt {width: 100%; font-size: 26px;}
  .toggle-box {padding-top: 100px;}
  .toggle-box .toggle-tit {margin-bottom: 50px; font-size: 34px;}
  .toggle-box .toggle-item ul {gap: 25px;}
  .toggle-box .toggle-item ul li .toggle-top {padding-left: 20px;}
  .toggle-box .toggle-item ul li .toggle-top .d-flex {gap: 10px;}
  .toggle-box .toggle-item ul li .toggle-top .number {font-size: 18px;}
  .toggle-box .toggle-item ul li .toggle-top .tit {font-size: 18px;}
  .toggle-box .toggle-item ul li .toggle-top .icon {height: 80px;}
  .toggle-box .toggle-item ul li .toggle-top .icon img {width: auto; height: 100%;}
  .toggle-box .toggle-item ul li .toggle-bottom .img-box {width: 400px;}

  /* header.open nav.on ul */
  header.open nav.on ul li a {font-size: 80px;}

  /* work */
  .sec7 {padding-top: 291px;}
  .sec7 .sec7-tit .tit {font-size: 50px;}
  .sec7 .sec7-tit .download-btn {width: 250px; height: 75px; font-size: 18px;}
  .sec7 .list-tab {margin-bottom: 50px;}
  .sec7 .list-tab ul {gap: 15px;}
  .sec7 .list-tab ul li p {padding: 25px 35px; font-size: 16px;}
  .sec7 .img-list ul li .child-box .txt-box .tit {font-size: 26px;}
  .sec7 .img-list ul li .child-box .txt-box .more {gap: 50px;}
  .sec7 .img-list ul li .child-box .txt-box .more img {width: 20px;}
  .sec7 .img-list ul li .child-box .txt-box .more {font-size: 20px;}

  /* work_view */
  .sec7-tit2 .tit {margin-bottom: 30px; font-size: 50px;}
  .sec7-tit2 .label {width: 150px; height: 80px; font-size: 18px;}
  .content-item .tit-date .tit {font-size: 24px;}
  .content-item .tit-date .date {font-size: 26px;}
  .content-item .tit-date .description {font-size: 18px;}
  .content-item .tit-date {gap: 20px;}
  .view-more2_tit {margin-top: 100px; font-size: 18px;}
  .view-more2_tit {margin-top: 50px; font-size: 15px;}
  .view-more {height: 60px;}

  /* contact */
  .sec_contact {padding: 280px 0 50px;}
  .sec_contact .contact-tit .tit {font-size: 40px;}
  .sec_contact .contact-tit {margin-bottom: 30px;}
  .sec_contact .form-area {padding: 20px;}
  .sec_contact .form-area .input-box .tit {font-size: 24px;}
  .sec_contact .form-area .input-box input {font-size: 18px;}
  .sec_contact .form-area form {gap: 20px;}
  .sec_contact .form-area .input-box {gap: 10px;}
  .sec_contact .form-area .input-box textarea {height: 360px; font-size: 18px;}
  .sec_contact .form-area .submit-btn {height: 100px; margin: 0;}


  .go_top {bottom: 30px; right: 30px;}
  .go_top > a {width: 40px; margin-bottom: 10px;;}
  .go_top .q_menu button {min-width: 40px; width: 40px;}
  .go_top .q_menu {width: 40px;}
  .go_top .q_menu .menu-link {gap: 10px;}
  .go_top .q_menu .menu-link a {width: 30px; height: 30px; font-size: 12px;}

  #bo_w {padding: 291px 0 100px;}
}

@media screen and (max-width: 900px) {

  #bo_v_con p {font-size: 15px !important;}
  #bo_v_con span {font-size: 15px !important;}
  #bo_v_con a {gap: 30px; font-size: 18px;}
  #bo_v_con p .view-more img {width: 15.3px;}

  .sec-scroll_bg {padding: 0 30px; box-sizing: border-box;}

  /* hover */
  .btn_hover:hover button {color: var(--pr) !important;}
  .btn_hover:hover a {color: var(--wt) !important;}
  .btn_hover:hover {color: var(--wt) !important;}
  .btn_hover:hover {background: var(--pr) !important;}
  .btn_hover:hover a {background: var(--pr) !important;}
  .btn_hover:hover .view-more2 {background: var(--pr) !important;}
  .btn_hover button:hover:before {display: none !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; display: block; width: 22%; height: 120px; padding: 41px 183px; box-sizing: border-box; background: url(./../img/hover_btn.png)no-repeat 50% 50%; background-size: 104% 102%; z-index: -1;}
  .btn_hover:hover a:before {display: none !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; display: block; width: 22%; height: 120px; padding: 41px 183px; box-sizing: border-box; background: url(./../img/hover_btn.png)no-repeat 50% 50%; background-size: 104% 102%; z-index: -1;}
  .btn_hover:hover:before {display: none !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; display: block; width: 22%; height: 120px; padding: 41px 183px; box-sizing: border-box; background: url(./../img/hover_btn.png)no-repeat 50% 50%; background-size: 104% 102%; z-index: -1;}
  .sec7 .list-tab ul li a:hover {background: var(--pr); color: var(--wt);}
  /* //hover */

  .go_top {display: none !important;}
  header {height: 75px;}
  header .container {height: 75px;}
  header .logo {min-width: 62px; width: 62px;}
  header .menu-btn {min-width: 30px; width: 30px; height: 12.5px;}
  header .menu-btn span {height: 1.5px;}
  header nav {position: absolute; top: -70px;}
  header nav {top: 0; left: -9999px;}

  .pc_vod {display: block;}
  .mo_vod {display: block; object-fit: cover !important;}
  .intro.start .intro-ct.open {width: 100%;}
  .intro.start .intro-bottom .txt-on {gap: 24px; height: 52px;}
  .intro-top span {font-size: 35px;}
  .intro.start .intro-bottom .txt-on span {font-size: 35px;}
  .intro.start .intro-bottom .txt-an img {width: 20px;}
  .intro.start .intro-ct .intro-bottom {justify-content: flex-start; margin: 0 auto; overflow: hidden;}
  .intro.start .intro-bottom .ist img {width: 110px !important;}
  .intro.start .intro-ct .intro-bottom .ist {font-size: 35px;}
  @keyframes wd2 {
    0% {width: 0%;}
    100% {width: 322px;}
  }

  @keyframes wd {
    0% {width: 0%;}
    100% {width: 242px;}
  }
  /* .intro.start .intro-bottom .ist img {display: none !important;} */
  .intro.start .intro-ct.open .intro-top {padding-left: 20px;}
  .intro.start .intro-ct.open .intro-top:before {width: 10px;}
  .intro.start .intro-ct.none .intro-bottom:before {width: 10px;}

  /* .sec1 */
  /* .sec1 {background: var(--black);} */
  .sec-tit .tit {font-size: 32px;}
  .sec1 .sec-tit .sub {width: 269px; font-size: 15px;}
  .mo_br {display: block;}
  .view-more {height: 75px;}
  .view-more a {gap: 43px; font-size: 20px;}
  .view-more a img {width: 12px;}

  .sec3 {padding: 200px 0 138px; padding-bottom: 0;}
  .sec3-tit .tit {position: relative; width: 321px; height: auto; margin: 0 auto;}
  .sec3-tit .tit img {width: 100%; height: auto;}
  .sec3-tit .tit img:last-child {position: absolute; top: 2px; left: 50%; transform: translateX(-50%); width: 100%; height: auto;}
  .sec3-tit .sub {font-size: 60px; letter-spacing: -2.4px;}
  .sec3-tit .sec3_logo:before {height: 76px;}
  .sec3-tit .sec3_logo {width: 30px;}
  .sec3 .sec-tit .tit {width: 300px; margin-bottom: 70px; color: var(--black);}
  .sec-tit .sub {font-size: 15px;}

  .sec-scroll {height: 100vh;}
  .sec-scroll ul {flex-flow: column; justify-content: center; align-items: center;}
  .sec-scroll ul li .child-box {padding-left: 0; text-align: center;}
  .sec-scroll ul li .child-box .tit {margin-bottom: 8px; font-size: 15px;}
  .sec-scroll ul li .child-box .sub {font-size: 12px;}
  .sec-scroll ul li:before {width: 6px; height: 6px; margin: 0 auto;}

  .sec-scroll ul {left: 0; padding: 0; top: 0; transform: initial;}
  .sec-scroll .container:before {top: auto; bottom: 0; height: 100%; background: #5c5c5c; z-index: -1;}
  .sec-scroll ul li:first-child {width: 108px; height: 108px;}
  .sec-scroll ul li:nth-child(2) {width: 223px; height: 223px; margin-top: -108px;}
  .sec-scroll ul li:nth-child(3) {width: 330px; height: 330px; margin-top: -224px;}
  .sec-scroll ul li:nth-child(2):before {margin-top: 108px;}
  .sec-scroll ul li:nth-child(3):before {margin-top: 224px;}
  /* .sec-scroll ul li:nth-child(3) .child-box {} */




  .sec-scroll ul li:not(:last-child) {display: flex; align-items: center; justify-content: flex-start; flex-flow: column;}
  .sec-scroll ul li.on:not(:last-child)::after {top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
  .sec-scroll .container:before {width: 0.1px; height: 100%; right: auto; left: 50%; transform: translateX(-50%);}
  @keyframes circleItem {
    0% {top: 60%; width: 100%; opacity: 0;}
    100% {top: 50%; width: 100%; opacity: 1;}
  }
  @keyframes circleItem2 {
    0% {top: 60%; width: 100%; opacity: 0;}
    100% {top: 50%; width: 100%; opacity: 1;}
  }
  @keyframes circleItem3 {
    0% {top: 60%; width: 100%; opacity: 0;}
    100% {top: 50%; width: 100%; opacity: 1;}
  }

  .sec4 {height: 100vh; padding: 0;}
  .sec4 .sec4-btn {width: 330px;}
  .sec4 .sec4-btn a {font-size: 20px;}

  .sec-map {}
  .sec-map .map-tit .tit {margin-bottom: 46px; font-size: 26.4px;}
  .sec-map .map-area .tit {margin-bottom: 16px; font-size: 19px;}

  .sec-map .d-flex {flex-flow: column;}
  .sec-map .map-area iframe {aspect-ratio: 16/9;}
  .sec-map .list-box {gap: 36px; width: 100%; height: auto; margin-top: 0;}
  .sec-map .list-box dl dd {width: 286px; word-break:keep-all; white-space: normal;}
  .sec-map .list-box dl dd br {display: none;}

  footer .address {font-size: 8px;}
  footer .copyright {font-size: 17px;}

  /* about */
  .sub-kv {height: calc(100vh - 75px); margin-top: 75px;}
  .sec3 {padding-top: 150px 0 138px;}
  .sec3.sec3_2 .sec-tit {margin-top: 0;}
  .sec3.sec3_2 .sec-tit .tit {width: 100%;}

  .sec5 .sec5_txt .img-box {display: flex; align-items: center; justify-content: flex-end; width: 330px; height: 420px; margin: 0 auto;}
  .sec5 .sec5_txt .img-box img {transform: rotate(90deg);}
  .sec5 .sec5_txt .txt {font-size: 20px;}
  .sec5 {padding: 60px 0;}
  .toggle-box {padding-top: 60px;}
  .toggle-box .toggle-tit {margin-bottom: 30px; font-size: 27px;}
  .toggle-box .toggle-item ul li .toggle-top .icon {height: 50px;}
  .toggle-box .toggle-item ul {gap: 30px;}
  .toggle-box .toggle-item ul li .toggle-top .number {font-size: 19px;}
  .toggle-box .toggle-item ul li .toggle-top {padding-left: 15px;}
  .toggle-box .toggle-item ul li .toggle-top .tit {font-size: 15px;}
  .toggle-box .toggle-item ul li .toggle-top .icon {width: auto;}
  .toggle-box .toggle-item ul li .toggle-bottom .bottom-item {padding: 30px 15px;}
  .toggle-box .toggle-item ul li .toggle-bottom dl {align-items: flex-start; flex-flow: column; gap: 5px;}
  .toggle-box .toggle-item ul li .toggle-bottom dl dt {font-size: 15px;}
  .toggle-box .toggle-item ul li .toggle-bottom dl dd {font-size: 14px;}
  .toggle-box .toggle-item ul li .toggle-bottom .img-box {display: none;}

  /* .sec6 */
  .sec6 {padding-top: 50px;}
  .sec6 .sec6-tit {padding-bottom: 50px;}
  .sec6 .sec6-tit .tit {font-size: 27px;}

  .sec6 .sec6_list ul {gap: 30px; width: auto; height: auto; margin: 0;}
  .sec6 .sec6_list ul li {width: 100%; height: auto; padding: 0;}
  .sec6 .sec6_list ul li .child-box .tit {font-size: 15px;}
  
  .pc_img {display: none !important;}
  .mo_img {display: block !important;}

  /* mo menu */
  header.open nav.on {width: calc(100% - 40px);}
  header.open nav.on ul {gap: 30px; width: 100%;}
  header.open nav.on ul li a {font-size: 80px;}
  header.open nav.on ul li a:after {width: 11px; height: 9px; margin-bottom: 8px;}

  .sec3.sec3_2 .sec-tit .tit {font-size: 32px;}

  /* work */
  .sec7 {padding-top: 126px;}
  .sec7 .sec7-tit {margin-bottom: 22px;}
  .sec7 .list-tab ul {gap: 10px; flex-wrap: wrap;}
  .sec7 .list-tab ul li p {padding: 11px 30px; font-size: 15px;}
  .sec7 .sec7-tit .tit {font-size: 26px;}
  .sec7 .sec7-tit .download-btn {width: auto; height: 35px; padding: 13px 20px 10px; font-size: 15px; box-sizing: border-box;}
  .sec7 .list-tab {margin-bottom: 13px;}
  .sec7 .img-list ul {gap: 10px 0; margin: 0 -5px;}
  .sec7 .img-list ul li {padding: 0 5px;}
  .sec7 .img-list ul li .child-box .txt-box {padding: 49px 0 57px;}
  .sec7 .img-list ul li .child-box .txt-box .sub {font-size: 15px;}
  .sec7 .img-list ul li .child-box .txt-box .tit {font-size: 16px;}
  .sec7 .img-list ul li .child-box .txt-box .more {gap: 43px; font-size: 17px;}
  .sec7 .img-list ul li .child-box .txt-box .more img {width: 12px; height: auto;}

  /* work_view */
  .content-item .tit-date .d-flex {flex-flow: column-reverse; align-items: flex-start; gap: 10px;}
  .sec7-tit2 .tit {margin-bottom: 22px; font-size: 26px;}
  .sec7-tit2 .label {width: 100px; height: 50px; font-size: 15px;}
  .sec7-tit2 {margin-bottom: 20px;}
  .content-item .tit-date .tit {font-size: 18px; line-height: 1.5; word-break: keep-all;}
  .content-item .tit-date .date {font-size: 20px;}
  .content-item .tit-date {gap: 10px;}
  .content-item .tit-date .description {font-size: 15px;}
  .content {margin-top: 50px;}
  .view-more2 {height: 50px;}

  /* contact */
  .sec_contact {padding: 150px 0 50px;}
  .sec_contact .contact-tit {margin-bottom: 50px;}
  .sec_contact .contact-tit .tit {font-size: 27px;}
  .sec_contact .form-area {padding: 20px 15px;}
  .sec_contact .form-area .input-box {gap: 8px;}
  .sec_contact .form-area .input-box .tit {font-size: 15px; line-height: 20px;}
  .sec_contact .form-area .input-box input {padding-bottom: 4px; font-size: 14px;}
  .sec_contact .form-area form {gap: 30px;}
  .sec_contact .form-area .input-box textarea {height: 286px;}
  .sec_contact .form-area .submit-btn {margin: 0 -15px -20px; height: 75px;}
  .sec_contact .form-area .submit-btn button {width: calc(100% + 30px); font-size: 20px;}
  .sec_contact .form-area .submit-btn button img {width: 12px; height: auto;}
  .sec_contact .form-area .submit-btn button {gap: 63px;}

  /*  */
  .sec7 .list-tab ul {gap: 5px;}
  .sec7 .list-tab ul li {}
  .sec7 .list-tab ul li a {display: flex; align-items: center; justify-content: center; width: auto; height: 35px; padding: 12px 20px 10px; font-size: 15px; line-height: 1;}

  .sec6 .sec6-slider .sec6-tit {margin-top: 0;}

  .view-more2 {}

  #bo_v_atc {padding-top: 126px;}

  #bo_gall #gall_ul li {width: calc(100% / 2);}

  #bo_w {padding: 126px 0 50px;}
  .sec_contact .form-area .submit-btn button {width: 100%;}

  
  .sec_contact .form-area .input-box textarea {height: 250px; font-size: 14px;}
  .intro.start .intro-ct.end .intro-bottom:before {height: 10px;}
  @keyframes rolling_bn {
    0%{transform: translateY(0); }
    100%{transform: translateY(-575px); }
  }
  .intro.start .intro-ct .intro-bottom {margin-top: 15px;}
  .intro.start .intro-bottom .ist img {margin-top: 0 !important;}

  .sec_contact .form-area .input-box textarea {padding: 0;}
  /* .intro.start .first-ct .bg1 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center; animation: bg1 1s .3s linear both; width: 50px; height: auto; aspect-ratio: 5/5; background: var(--pr); border-radius: 100%;} */

  #bo_w input:not([type="file"]) {padding-left: 0;}


    /* 추가 */
    /* .sec-scroll ul li:nth-child(3) {width: 98% !important;} */
    .sec-scroll ul li.on:not(:last-child)::after {top: 0 !important; transform: translateX(-50%) !important; margin-top: 2px !important;}
    .sec-scroll ul li:nth-child(4) {top: -9px;}

    .btn_hover button:hover:before {height: 0; padding: 37px 134px;}
    
    .intro-top span {letter-spacing: -1px;}
    .intro-top span:nth-child(6) {margin-left: 13px;}
    .intro-top span:nth-child(7) {margin-right: 13px;}

    .sec3-tit .sub {width: 168px;}
    footer .address img {width: 450px;}
    /* //추가 */
}

@media screen and (max-width: 504px) {
  .sub-kv .vod-box video {width: 300px; height: 300px;}

  /* work */
  .sec7 .sec7-tit {gap: 10px; flex-wrap: wrap;}
  .sec7 .img-list ul {margin: 0;}
  .sec7 .img-list ul li {width: 100%; height: auto; padding: 0;}

  #bo_gall #gall_ul li {width: calc(100% / 1);}

  .intro.start .intro-ct.none .intro-bottom:before {top: 69%; right: 0; transform: translateY(-50%);}

  /* footer .address {padding: 0 20px; box-sizing: border-box;} */
  footer .address img {width: 100%;}
}

@media screen and (max-width: 441px) {
  header.open nav.on ul li a {font-size: 60px;}

  .intro.start .first-ct {overflow: hidden;}

  .sec3-tit .tit {width: 100%;}

  .sec-scroll .container {overflow: hidden;}
  .sec-scroll ul li:first-child {}
  .sec-scroll ul li:nth-child(3) {width: 320px;}
  .sec4 .sec4-btn {width: 100%;}

  /* about */
  .sec5 .sec5_txt .img-box {width: 100%;}
  
}