@charset "UTF-8";
/* 모바일만 ~767px */
@media screen and (max-width: 767px) {
  .inner {
    width: 100% !important;
  }
  .text-pg h2 {
    color: #fff;
    font-size: 2.2em !important;
  }
  .sc1 > li {
    width: 48.5% !important;
    height: 170px !important;
  }
  .sc1 > li.middle {
    margin-right: 0 !important;
    width: 50% !important;
  }
  .sc1 > li.right {
    width: 100% !important;
    margin-top: 1.5%;
  }
  .content2 {
    padding: 0;
  }
  .content2 > ul .img {
    height: 300px !important;
  }
  .content3 h2 {
    padding: 50px 20px !important;
    font-size: 1.2em;
  }
  .content6 .fade {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .content6 .fade .guide {
    z-index: 2 !important;
  }
  .content6 .fade .txCenter {
    z-index: 2 !important;
  }
  .content6 .fade .opBg {
    opacity: 0 !important;
  }
  #mv-main-container .content6 .fade p {
    font-weight: 700;
  }
}
/* 태블릿부터 768px~ */
@media screen and (min-width: 768px) {
  #mv-main-container .main-img {
    height: 100vh !important;
  }
  #mv-main-container .top dt {
    font-size: 1.6em !important;
  }
  #mv-main-container .top dd {
    font-size: 1.1em !important;
  }
  #mv-main-container .content1 {
    margin-bottom: 150px;
  }
  #mv-main-container .content3 {
    margin-bottom: 200px;
  }
  #mv-main-container .content4 .imgArea {
    float: left !important;
  }
  #mv-main-container .content4 .imgArea img {
    width: 100%;
  }
  #mv-main-container .content5 {
    margin-top: 100px;
  }
  .content6 .fade > li {
    width: 50% !important;
    height: 500px !important;
    z-index: 1 !important;
    border-right: 1px solid #000 !important;
  }
  .content6 .fade > li:last-of-type {
    border: 0 !important;
  }
  .content6 .guide {
    background: none !important;
  }
  .content6 .txCenter {
    background: none !important;
  }
  .content6 .opBg {
    z-index: 1;
  }
  #mv-main-container .content7 .install {
    background-attachment: fixed;
  }
  #mv-main-container .content7 strong {
    font-size: 1.8em !important;
  }
}
/* 태블릿만 768px~1023px */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .inner {
    width: 100% !important;
  }
  .sc1 > li {
    width: 48.5% !important;
  }
  .sc1 > li.middle {
    margin-right: 0 !important;
    width: 50% !important;
  }
  .sc1 > li.right {
    width: 100% !important;
    margin-top: 1.5%;
  }
}
/* PC부터 1024px~ */
@media screen and (min-width: 1024px) {
  #mv-main-container .content4 .imgArea {
    width: 50%;
    color: #7d5ac2;
  }
  #mv-main-container .content4 .txtArea {
    float: right;
    width: 50%;
    padding-left: 50px;
    padding-top: 70px;
  }
  #mv-main-container .content4 .txtArea dl {
    text-align: left;
  }
  .content2 .txt {
    font-size: 1.2em;
  }
  .content3 .inner {
    max-width: 1600px;
  }
  .content6 .fade p {
    font-size: 1.2em !important;
  }
}
/* 작은 PC 1024px~1279px */
/* PC 1280px~ */
@media screen and (min-width: 1280px) {
  .content1 {
    max-width: 1400px;
    margin: 0 auto;
  }
  .content2 > ul {
    height: 800px;
  }
  .content2 > ul li {
    height: 400px;
  }
  .content2 > ul .txt {
    padding: 50px !important;
  }
  .content2 > ul .leftBox li {
    float: left;
    width: 50%;
  }
  .content2 > ul .rightBox li {
    float: right;
    width: 50%;
  }
  .content3 .slick-slide {
    margin: 0 30px !important;
  }
  .content3 .more {
    position: absolute;
    right: 4%;
    top: 70px;
  }
  .content5 .choice {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 30px;
    max-width: 1600px;
  }
  .content5 .choice .choiceBox {
    padding: 0 !important;
  }
  .content6 .fade > li {
    height: 1000px !important;
  }
}