@charset "UTF-8";
/*
##Screen = 1281px에서 1400px 사이
*/
@media (min-width: 1281px) and (max-width: 1400px) {
  /* 1번째 페이지 : 메인 배너 슬라이드 */
  .main_page1 > .slides .slide .text > .page-title {
    font-size: 8rem;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap {
    width: 50px;
    height: 50px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap > span,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap > span {
    width: 18px;
    height: 3px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(1) {
    transform: translate(12px, 16px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(2) {
    transform: translate(12px, 27px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(1) {
    transform: translate(15px, 17px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(2) {
    transform: translate(15px, 28px) rotate(-45deg);
  }
  /* 2번째 페이지 : 회사소개*/
  .main_page2 .container > .wrap > .text_rotate {
    top: 5%;
    left: 5%;
  }
  .main_page2 .container > .wrap > .main2_img {
    height: 450px;
    top: calc(50% - 225px);
  }
  .main_page2 .container > .wrap > .main2_img:before {
    font-size: 4rem;
  }
  .main_page2 .container > .wrap > .text_box {
    width: 70%;
  }
  .main_page2 .container > .wrap > .text_box > .inner {
    margin-top: 1rem;
  }
  /* 3번째 페이지 : 서비스 */
  .main_page3 .container > .left > .inner {
    height: 80%;
  }
  .main_page3 .container > .left > .inner > .frame {
    top: 10%;
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.top {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.mid {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.bottom {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right > .inner {
    height: 60%;
  }
  .main_page3 .container > .right > .inner > .cont > .top {
    padding-top: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .top > .page3-title {
    font-size: 3.2rem;
    font-weight: bold;
    color: #dc6868;
  }
  .main_page3 .container > .right > .inner > .cont > .mid {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    position: relative;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab > li {
    font-size: 1.8rem;
    cursor: pointer;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab_line {
    display: block;
    width: 39px;
    height: 4px;
    border-radius: 2px;
    background: #dc6868;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: calc(50% + 14px);
  }
  .main_page3 .container > .right > .inner > .cont > .bottom {
    padding-top: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap {
    padding-bottom: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p {
    line-height: 2.4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p:not(:nth-child(1)) {
    display: none;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap {
    margin-top: 2rem;
    width: 100%;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap > button {
    display: block;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
  }
  .main_page5 .container .wrap > ul {
    width: calc(100% - 200px);
  }
  .main_page5 .container .wrap > ul > li {
    width: 260px;
    height: 360px;
    border-radius: 20px;
  }
  .main_page5 .container .wrap > ul > li > .wrap {
    border-radius: 20px;
    filter: grayscale(0);
  }
  .main_page5 .container .wrap > ul > li > .wrap > .cont {
    height: 130px;
    border-radius: 0 0 20px 20px;
  }
  .main_page5 .container .wrap > ul > li > .wrap > .cont > .text > button {
    padding: 7px 15px !important;
    margin-top: 10px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.2rem;
  }
  .main_page5 .container .wrap > ul > li:before {
    font-size: 3.2rem;
    color: #dc6868;
    font-weight: bold;
    font-family: "Laila", sans-serif;
    top: -8%;
  }
  .main_page5 .container .wrap > ul > li:hover > .wrap {
    filter: grayscale(0);
  }
  .main_page5 .container .wrap > ul > li:hover:before {
    color: #dc6868;
  }
}
/*
##Device = Laptops, Desktops
##Screen = B/w 1025px to 1280px
##Device = 랩탑, 데스크탑
##Screen = 1025px에서 1280px 사이
*/
@media (min-width: 1025px) and (max-width: 1280px) {
  /* 페이지 인디케이터 */
  .indi_group {
    display: none;
  }
  /* 1번째 페이지 : 메인 배너 슬라이드 */
  .main_page1 > .slides .slide .text {
    left: 150px;
  }
  .main_page1 > .slides .slide .text > p {
    font-size: 1.6rem;
  }
  .main_page1 > .slides .slide .text > h4 {
    font-size: 1.6rem;
  }
  .main_page1 > .slides .slide .text > .page-title {
    font-size: 8rem;
  }
  .main_page1 > .bottom_group > .right {
    flex: 3;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap {
    width: 50px;
    height: 50px;
    border: 3px solid #fff;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap > span,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap > span {
    width: 18px;
    height: 3px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(1) {
    transform: translate(12px, 16px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(2) {
    transform: translate(12px, 27px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(1) {
    transform: translate(15px, 17px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(2) {
    transform: translate(15px, 28px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .progress > .bar {
    height: 8px;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .current {
    font-size: 3rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .slash {
    font-size: 1.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .total {
    margin-left: 0.5rem;
    font-size: 1.8rem;
  }
  /* 2번째 페이지 : 회사소개*/
  .main_page2 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page2 .container > .wrap {
    height: calc(100% - 200px);
  }
  .main_page2 .container > .wrap > .text_rotate {
    width: 230px;
    height: 230px;
    top: 0;
    left: 5%;
  }
  .main_page2 .container > .wrap > .text_rotate > span {
    font-size: 3.6rem;
    font-weight: 700;
    transform-origin: center center;
    text-shadow: 1px 1px 0 #A7A7A7, -1px -1px 0 #A7A7A7, -1px 0px 0 #A7A7A7, 0px -1px 0 #A7A7A7, 0px 1px 0 #A7A7A7, 1px 0px 0 #A7A7A7, 1px -1px 0 #A7A7A7, -1px 1px 0 #A7A7A7;
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(1) {
    transform: rotate(-95deg) translate(-100px, -37px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(2) {
    transform: rotate(-76deg) translate(-63px, -10px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(3) {
    transform: rotate(-56deg) translate(-14px, 5px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(4) {
    transform: rotate(-26deg) translate(35px, -6px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(5) {
    transform: rotate(-14deg) translate(84px, -19px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(6) {
    transform: rotate(14deg) translate(122px, -70px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(7) {
    font-size: 3.4rem;
    transform: rotate(47deg) translate(123px, -145px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(8) {
    transform: rotate(75deg) translate(87px, -205px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(9) {
    transform: rotate(84deg) translate(95px, -223px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(10) {
    transform: rotate(100deg) translate(77px, -249px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(11) {
    transform: rotate(125deg) translate(11px, -267px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(12) {
    transform: rotate(144deg) translate(-27px, -265px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(13) {
    transform: rotate(167deg) translate(-76px, -240px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(14) {
    transform: rotate(190deg) translate(-111px, -201px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(15) {
    transform: rotate(221deg) translate(-150px, -130px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(16) {
    font-size: 3.4rem;
    transform: rotate(235deg) translate(-123px, -98px);
  }
  .main_page2 .container > .wrap > .main2_img {
    height: 450px;
    top: calc(50% - 225px);
  }
  .main_page2 .container > .wrap > .main2_img:before {
    font-size: 4rem;
  }
  .main_page2 .container > .wrap > .text_box {
    width: 70%;
    bottom: 0;
  }
  .main_page2 .container > .wrap > .text_box > .inner {
    margin-top: 1rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
  /* 3번째 페이지 : 서비스 */
  .main_page3 .container > .left > .inner {
    height: 70%;
  }
  .main_page3 .container > .left > .inner > .frame {
    top: 20%;
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.top {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.mid {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 50%;
    height: 100%;
  }
  .main_page3 .container > .right div.bottom {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right > .inner {
    width: 100%;
    height: 60%;
  }
  .main_page3 .container > .right > .inner > .cont > .top {
    padding-top: 4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .top > .page3-title {
    line-height: 4.5rem;
    font-size: 2.8rem;
    font-weight: bold;
    color: #dc6868;
  }
  .main_page3 .container > .right > .inner > .cont > .mid {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    position: relative;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab > li {
    font-size: 1.8rem;
    cursor: pointer;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab_line {
    display: block;
    width: 39px;
    height: 4px;
    border-radius: 2px;
    background: #dc6868;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: calc(50% + 14px);
  }
  .main_page3 .container > .right > .inner > .cont > .bottom {
    padding-top: 4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap {
    padding-bottom: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p {
    line-height: 2.6rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p:not(:nth-child(1)) {
    display: none;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap {
    margin-top: 2rem;
    width: 100%;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap > button {
    display: block;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
  }
  /* 4번째 페이지 : 포트폴리오*/
  .main_page4 .container > .left > .inner {
    width: calc(100% - 160px);
  }
  .main_page4 .container > .left > .inner > .page4-title {
    line-height: 5.8rem;
    font-size: 3.6rem;
  }
  .main_page4 .container > .left > .inner > p {
    font-size: 1.6rem;
    line-height: 2.6rem;
    padding-bottom: 4rem;
  }
  .main_page4 .container > .left > .inner > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
    padding: 7px 15px;
  }
  .main_page4 .container > .left > .inner > .arrow {
    height: 40px;
  }
  .main_page4 .container > .left > .inner > .arrow > li {
    width: 80px;
  }
  .main_page4 .container > .right {
    width: 60%;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide {
    position: relative;
    overflow: hidden;
    height: 600px;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text {
    padding-top: 3rem;
    padding-bottom: 3rem;
    padding-left: 2rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > h3 {
    font-size: 4.8rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > p {
    font-size: 2rem;
  }
  /* 5번째 페이지 : 알씨스토리 */
  .main_page5 .container > .wrap > ul {
    width: calc(100% - 120px);
  }
  .main_page5 .container > .wrap > ul > li {
    width: 230px;
    height: 330px;
    border-radius: 20px;
  }
  .main_page5 .container > .wrap > ul > li > .wrap {
    border-radius: 20px;
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont {
    height: 130px;
    border-radius: 0 0 20px 20px;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button {
    padding: 7px 15px !important;
    margin-top: 10px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.2rem;
  }
  .main_page5 .container > .wrap > ul > li:before {
    font-size: 3rem;
    color: #dc6868;
    font-weight: bold;
    font-family: "Laila", sans-serif;
    top: -8%;
  }
  .main_page5 .container > .wrap > ul > li:hover > .wrap {
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li:hover:before {
    color: #dc6868;
  }
}
/*
##Device = Tablets, Ipads (portrait),
##Screen = B/w 768px to 1024px
##Device = 태블릿, 아이패드(세로),
##Screen = 768px에서 1024px 사이
*/
@media (min-width: 768px) and (max-width: 1024px) {
  /* 페이지 인디케이터 */
  .indi_group {
    display: none;
  }
  /* 1번째 페이지 : 메인 배너 슬라이드 */
  .main_page1 > .slides .slide .text {
    left: 150px;
  }
  .main_page1 > .slides .slide .text > p {
    font-size: 1.8rem;
  }
  .main_page1 > .slides .slide .text > h4 {
    font-size: 1.8rem;
    font-weight: 500;
    padding-top: 20px;
  }
  .main_page1 > .slides .slide .text > .page-title {
    font-size: 8rem;
  }
  .main_page1 > .bottom_group {
    width: calc(100% - 140px);
    height: 80px;
    position: absolute;
    left: 120px;
  }
  .main_page1 > .bottom_group > .left {
    display: none;
    flex: 0;
  }
  .main_page1 > .bottom_group > .right > .arrow {
    flex: 1;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap {
    width: 50px;
    height: 50px;
    border: 3px solid #fff;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap > span,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap > span {
    width: 18px;
    height: 3px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(1) {
    transform: translate(12px, 15px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(2) {
    transform: translate(12px, 26px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(1) {
    transform: translate(15px, 16px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(2) {
    transform: translate(15px, 27px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .progress {
    visibility: hidden;
    flex: 2.5;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap {
    height: calc(100% - 40px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .current {
    font-size: 3rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .slash {
    font-size: 1.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .total {
    font-size: 1.8rem;
  }
  /* 2번째 페이지 : 회사소개*/
  .main_page2 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page2 .container > .wrap {
    height: calc(100% - 200px);
  }
  .main_page2 .container > .wrap > .text_rotate {
    width: 230px;
    height: 230px;
    top: 0;
    left: 0;
  }
  .main_page2 .container > .wrap > .text_rotate > span {
    font-size: 3.6rem;
    font-weight: 700;
    transform-origin: center center;
    text-shadow: 1px 1px 0 #A7A7A7, -1px -1px 0 #A7A7A7, -1px 0px 0 #A7A7A7, 0px -1px 0 #A7A7A7, 0px 1px 0 #A7A7A7, 1px 0px 0 #A7A7A7, 1px -1px 0 #A7A7A7, -1px 1px 0 #A7A7A7;
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(1) {
    transform: rotate(-95deg) translate(-100px, -37px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(2) {
    transform: rotate(-76deg) translate(-63px, -10px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(3) {
    transform: rotate(-56deg) translate(-14px, 5px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(4) {
    transform: rotate(-26deg) translate(35px, -6px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(5) {
    transform: rotate(-14deg) translate(84px, -19px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(6) {
    transform: rotate(14deg) translate(122px, -70px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(7) {
    font-size: 3.4rem;
    transform: rotate(47deg) translate(123px, -145px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(8) {
    transform: rotate(75deg) translate(87px, -205px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(9) {
    transform: rotate(84deg) translate(95px, -223px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(10) {
    transform: rotate(100deg) translate(77px, -249px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(11) {
    transform: rotate(125deg) translate(11px, -267px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(12) {
    transform: rotate(144deg) translate(-27px, -265px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(13) {
    transform: rotate(167deg) translate(-76px, -240px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(14) {
    transform: rotate(190deg) translate(-111px, -201px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(15) {
    transform: rotate(221deg) translate(-150px, -130px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(16) {
    font-size: 3.4rem;
    transform: rotate(235deg) translate(-123px, -98px);
  }
  .main_page2 .container > .wrap > .main2_img {
    height: 450px;
    top: calc(50% - 225px);
  }
  .main_page2 .container > .wrap > .main2_img:before {
    font-size: 3.6rem;
  }
  .main_page2 .container > .wrap > .text_box {
    width: 80%;
    bottom: 0;
  }
  .main_page2 .container > .wrap > .text_box > .inner {
    padding: 0 6rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner button {
    margin-top: 16px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
  }
  /* 3번째 페이지 : 서비스 */
  .main_page3 .container {
    background: linear-gradient(0deg, #fff 30%, #FFEBE1 30%, #FFEBE1 70%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column-reverse;
  }
  .main_page3 .container > .left {
    width: 100%;
    height: auto;
  }
  .main_page3 .container > .left > .inner {
    margin: 5% auto;
  }
  .main_page3 .container > .left > .inner > .frame {
    background-position: center center;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img {
    padding-top: 75.25%;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img > .img_wrap {
    top: 6%;
    width: 82%;
    height: 65%;
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.top {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.mid {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.bottom {
    width: calc(100% - 100px);
  }
  .main_page3 .container > .right > .inner {
    width: 90%;
    height: auto;
  }
  .main_page3 .container > .right > .inner > .cont > .top > .page3-title {
    line-height: 4.8rem;
    font-size: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom {
    padding-top: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap {
    padding-bottom: 1rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
  }
  /* 4번째 페이지 : 포트폴리오*/
  .main_page4 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .main_page4 .container > .left {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner {
    width: calc(100% - 60px);
    height: 300px;
  }
  .main_page4 .container > .left > .inner > .page4-title {
    line-height: 5rem;
    font-size: 3.2rem;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .main_page4 .container > .left > .inner > p {
    font-size: 1.6rem;
    line-height: 2.8rem;
    padding-bottom: 3rem;
  }
  .main_page4 .container > .left > .inner > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
    padding: 7px 15px;
  }
  .main_page4 .container > .left > .inner > .arrow {
    width: 100%;
    height: 34px;
    position: absolute;
    bottom: 10%;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner > .arrow > li {
    width: 80px;
  }
  .main_page4 .container > .left > .inner > .arrow > li.left_arrow > img {
    left: 0;
  }
  .main_page4 .container > .left > .inner > .arrow > li.right_arrow > img {
    left: 0;
  }
  .main_page4 .container > .right {
    width: calc(100% - 60px);
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide {
    height: 400px;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text {
    padding-top: 2rem;
    padding-bottom: 2rem;
    padding-left: 2rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > h3 {
    font-size: 3.6rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > p {
    padding-top: 8px;
    font-size: 1.8rem;
  }
  /* 5번째 페이지 : 알씨스토리 */
  .main_page5 .container > .wrap > ul {
    width: calc(100% - 60px);
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
  }
  .main_page5 .container > .wrap > ul > li {
    width: calc(100% - 60px);
    height: 200px;
    margin: 20px;
    border-radius: 20px;
  }
  .main_page5 .container > .wrap > ul > li > .wrap {
    width: 100%;
    height: 100%;
    position: relative;
    border-radius: 20px;
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont {
    width: 50%;
    height: 100%;
    left: 50%;
    border-radius: 0 20px 20px 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text {
    width: calc(100% - 40px);
    margin: 20px auto;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > p {
    color: #A7A7A7;
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button {
    padding: 7px 15px !important;
    margin-top: 20px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button > a {
    color: #dc6868;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button:hover {
    color: #fff;
    background: #dc6868;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button:hover > a {
    color: #fff;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(1) > .wrap {
    background-size: 50% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(2) > .wrap {
    background-size: 50% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(3) > .wrap {
    background-size: 50% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:before {
    width: auto;
    text-align: left;
    font-size: 3rem;
    color: #dc6868;
    font-weight: bold;
    font-family: "Laila", sans-serif;
    z-index: 1;
    transform: translate(10%, 70%);
  }
  .main_page5 .container > .wrap > ul > li:hover > .wrap {
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li:hover:before {
    color: #dc6868;
  }
}
/*
##Device = Low Resolution Tablets, Mobiles (Landscape)
##Screen = B/w 481px to 767px
##Device = 저해상도 태블릿, 모바일(가로)
##Screen = 481px에서 767px 사이
*/
@media (min-width: 481px) and (max-width: 767px) {
  /* 페이지 인디케이터 */
  .indi_group {
    display: none;
  }
  /* 1번째 페이지 : 메인 배너 슬라이드 */
  .main_page1 > .slides .slide .text {
    left: 0;
    right: 0;
    text-align: center;
  }
  .main_page1 > .slides .slide .text > p {
    font-size: 1.6rem;
    padding-bottom: 1rem;
  }
  .main_page1 > .slides .slide .text > h4 {
    font-size: 1.6rem;
    padding-top: 1rem;
  }
  .main_page1 > .slides .slide .text > .page-title {
    font-size: 6rem;
    line-height: 80px;
  }
  .main_page1 > .slides .slide .text.title_active {
    opacity: 1;
    transform: translate(0, -50%);
  }
  .main_page1 > .bottom_group {
    width: 100%;
    height: 80px;
    left: 0;
    padding-left: 30px;
    padding-right: 30px;
  }
  .main_page1 > .bottom_group > .left {
    display: none;
    flex: 0;
  }
  .main_page1 > .bottom_group > .right > .arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap {
    width: 40px;
    height: 40px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap > span,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap > span {
    width: 14px;
    height: 3px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(1) {
    transform: translate(9px, 11px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(2) {
    transform: translate(9px, 20px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(1) {
    transform: translate(12px, 11px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(2) {
    transform: translate(12px, 20px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .progress {
    visibility: hidden;
    flex: 2.5;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap {
    height: calc(100% - 35px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .current {
    font-size: 2.8rem;
    line-height: 3.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .slash {
    font-size: 1.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .total {
    font-size: 1.8rem;
  }
  /* 2번째 페이지 : 회사소개*/
  .main_page2 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page2 .container > .wrap {
    height: calc(100% - 50px);
  }
  .main_page2 .container > .wrap > .text_rotate {
    width: 150px;
    height: 150px;
  }
  .main_page2 .container > .wrap > .text_rotate > span {
    font-size: 2rem;
    font-weight: 700;
    transform-origin: center center;
    text-shadow: 1px 1px 0 #A7A7A7, -1px -1px 0 #A7A7A7, -1px 0px 0 #A7A7A7, 0px -1px 0 #A7A7A7, 0px 1px 0 #A7A7A7, 1px 0px 0 #A7A7A7, 1px -1px 0 #A7A7A7, -1px 1px 0 #A7A7A7;
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(1) {
    transform: rotate(-73deg) translate(-36px, -4px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(2) {
    transform: rotate(-60deg) translate(-6px, 3px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(3) {
    transform: rotate(-38deg) translate(26px, 3px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(4) {
    transform: rotate(-18deg) translate(56px, -8px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(5) {
    transform: rotate(11deg) translate(78px, -40px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(6) {
    transform: rotate(35deg) translate(92px, -76px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(7) {
    font-size: 2.4rem;
    transform: rotate(79deg) translate(45px, -137px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(8) {
    transform: rotate(92deg) translate(50px, -158px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(9) {
    transform: rotate(114deg) translate(19px, -172px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(10) {
    transform: rotate(134deg) translate(-11px, -176px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(11) {
    transform: rotate(148deg) translate(-22px, -173px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(12) {
    transform: rotate(177deg) translate(-72px, -150px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(13) {
    transform: rotate(200deg) translate(-93px, -120px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(14) {
    transform: rotate(219deg) translate(-98px, -91px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(15) {
    transform: rotate(236deg) translate(-90px, -64px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(16) {
    font-size: 2.4rem;
    transform: rotate(259deg) translate(-69px, -30px);
  }
  .main_page2 .container > .wrap > .main2_img:before {
    font-size: 2.4rem;
    left: 0;
  }
  .main_page2 .container > .wrap > .text_box {
    width: 80%;
  }
  .main_page2 .container > .wrap > .text_box > .inner {
    margin-top: 1rem;
    padding: 0 6rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner p {
    font-size: 1.4rem;
    line-height: 2.3rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner button {
    margin-top: 16px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
  }
  /* 3번째 페이지 : 서비스 */
  .main_page3 .container {
    background: linear-gradient(0deg, #fff 30%, #FFEBE1 30%, #FFEBE1 70%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column-reverse;
  }
  .main_page3 .container > .left {
    width: 100%;
    height: auto;
  }
  .main_page3 .container > .left > .inner {
    margin: 7% auto;
  }
  .main_page3 .container > .left > .inner > .frame {
    background-position: center center;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img {
    padding-top: 80.25%;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img > .img_wrap {
    top: 5%;
    width: 88%;
    height: 65%;
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.top {
    width: calc(100% - 40px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.mid {
    width: calc(100% - 40px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.bottom {
    width: calc(100% - 40px);
  }
  .main_page3 .container > .right > .inner {
    height: 100%;
    margin: 0 auto;
  }
  .main_page3 .container > .right > .inner > .cont > .top {
    padding-top: 4rem;
    padding-bottom: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .top > .page3-title {
    line-height: 4.5rem;
    font-size: 2.8rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab > li {
    font-size: 1.6rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab_line {
    width: 34px;
    top: calc(50% + 10px);
  }
  .main_page3 .container > .right > .inner > .cont > .bottom {
    padding-top: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap {
    padding-bottom: 1rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p {
    line-height: 2.6rem;
    font-size: 1.6rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap {
    margin-top: 1.2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
  }
  /* 4번째 페이지 : 포트폴리오*/
  .main_page4 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .main_page4 .container > .left {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner {
    width: calc(100% - 60px);
    height: 350px;
  }
  .main_page4 .container > .left > .inner > .page4-title {
    line-height: 4.5rem;
    font-size: 2.8rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .main_page4 .container > .left > .inner > p {
    font-size: 1.6rem;
    line-height: 2.8rem;
    padding-bottom: 3rem;
  }
  .main_page4 .container > .left > .inner > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.6rem;
    padding: 7px 15px;
  }
  .main_page4 .container > .left > .inner > .arrow {
    width: 100%;
    height: 34px;
    position: absolute;
    bottom: 10%;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner > .arrow > li {
    width: 65px;
  }
  .main_page4 .container > .left > .inner > .arrow > li.left_arrow > img {
    left: 0;
  }
  .main_page4 .container > .left > .inner > .arrow > li.right_arrow > img {
    left: 0;
  }
  .main_page4 .container > .right {
    width: calc(100% - 60px);
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide {
    height: 450px;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    padding-left: 2rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > h3 {
    font-size: 3rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > p {
    padding-top: 8px;
    font-size: 1.4rem;
  }
  /* 5번째 페이지 : 알씨스토리 */
  .main_page5 .container > .wrap > ul {
    width: calc(100% - 60px);
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
  }
  .main_page5 .container > .wrap > ul > li {
    width: calc(100% - 60px);
    height: 200px;
    margin: 20px;
    border-radius: 20px;
  }
  .main_page5 .container > .wrap > ul > li > .wrap {
    width: 100%;
    height: 100%;
    position: relative;
    border-radius: 20px;
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont {
    width: 50%;
    height: 100%;
    left: 50%;
    border-radius: 0 20px 20px 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text {
    width: calc(100% - 40px);
    margin: 20px auto;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > p {
    color: #A7A7A7;
    font-size: 1.4rem;
    line-height: 2.3rem;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button {
    padding: 7px 15px !important;
    margin-top: 20px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.2rem;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button > a {
    color: #dc6868;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button:hover {
    color: #fff;
    background: #dc6868;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button:hover > a {
    color: #fff;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(1) > .wrap {
    background-size: 55% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(2) > .wrap {
    background-size: 55% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:nth-child(3) > .wrap {
    background-size: 55% auto;
    background-position: -4% 25%;
  }
  .main_page5 .container > .wrap > ul > li:before {
    width: auto;
    font-size: 2.6rem;
    color: #dc6868;
    font-weight: bold;
    font-family: "Laila", sans-serif;
    z-index: 1;
    transform: translate(10%, 70%);
  }
  .main_page5 .container > .wrap > ul > li:hover > .wrap {
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li:hover:before {
    color: #dc6868;
  }
}
/*
##Device = Most of the Smartphones Mobiles (Portrait)
##Screen = B/w 320px to 479px
##Device = 대부분의 스마트폰 모바일 기기(세로)
##Screen = 320px에서 479px 사이
*/
@media (max-width: 480px) {
  /* 페이지 인디케이터 */
  .indi_group {
    display: none;
  }
  /* 1번째 페이지 : 메인 배너 슬라이드 */
  .main_page1 > .slides .slide .text {
    left: 0;
    right: 0;
    text-align: center;
  }
  .main_page1 > .slides .slide .text > p {
    font-size: 1.4rem;
    padding-bottom: 1rem;
  }
  .main_page1 > .slides .slide .text > h4 {
    font-size: 1.4rem;
    padding-top: 1rem;
  }
  .main_page1 > .slides .slide .text > .page-title {
    font-size: 4rem;
    line-height: 50px;
  }
  .main_page1 > .slides .slide .text.title_active {
    opacity: 1;
    transform: translate(0, -50%);
  }
  .main_page1 > .bottom_group {
    width: 100%;
    height: 80px;
    left: 0;
    padding-left: 30px;
    padding-right: 30px;
  }
  .main_page1 > .bottom_group > .left {
    display: none;
    flex: 0;
  }
  .main_page1 > .bottom_group > .right {
    flex: 1;
  }
  .main_page1 > .bottom_group > .right > .arrow {
    flex: 1;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap {
    width: 38px;
    height: 38px;
    border: 2px solid #fff;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap > span,
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow > .wrap > span {
    width: 14px;
    height: 2px;
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(1) {
    transform: translate(9px, 12px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .left_arrow > .wrap span:nth-child(2) {
    transform: translate(9px, 21px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(1) {
    transform: translate(12px, 12px) rotate(45deg);
  }
  .main_page1 > .bottom_group > .right > .arrow > .right_arrow span:nth-child(2) {
    transform: translate(12px, 21px) rotate(-45deg);
  }
  .main_page1 > .bottom_group > .right > .progress {
    visibility: hidden;
    flex: 1.25;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap {
    height: calc(100% - 40px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .current {
    font-size: 2.8rem;
    line-height: 3.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .slash {
    font-size: 1.8rem;
  }
  .main_page1 > .bottom_group > .right > .slick-index > .wrap > .total {
    font-size: 1.8rem;
  }
  /* 2번째 페이지 : 회사소개*/
  .main_page2 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page2 .container > .wrap {
    height: calc(100% - 60px);
  }
  .main_page2 .container > .wrap > .text_rotate {
    width: 150px;
    height: 150px;
  }
  .main_page2 .container > .wrap > .text_rotate > span {
    font-size: 2rem;
    font-weight: 700;
    transform-origin: center center;
    text-shadow: 1px 1px 0 #A7A7A7, -1px -1px 0 #A7A7A7, -1px 0px 0 #A7A7A7, 0px -1px 0 #A7A7A7, 0px 1px 0 #A7A7A7, 1px 0px 0 #A7A7A7, 1px -1px 0 #A7A7A7, -1px 1px 0 #A7A7A7;
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(1) {
    transform: rotate(-73deg) translate(-36px, -4px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(2) {
    transform: rotate(-60deg) translate(-6px, 3px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(3) {
    transform: rotate(-38deg) translate(26px, 3px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(4) {
    transform: rotate(-18deg) translate(56px, -8px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(5) {
    transform: rotate(11deg) translate(78px, -40px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(6) {
    transform: rotate(35deg) translate(92px, -76px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(7) {
    font-size: 2.4rem;
    transform: rotate(79deg) translate(45px, -137px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(8) {
    transform: rotate(92deg) translate(50px, -158px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(9) {
    transform: rotate(114deg) translate(19px, -172px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(10) {
    transform: rotate(134deg) translate(-11px, -176px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(11) {
    transform: rotate(148deg) translate(-22px, -173px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(12) {
    transform: rotate(177deg) translate(-72px, -150px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(13) {
    transform: rotate(200deg) translate(-93px, -120px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(14) {
    transform: rotate(219deg) translate(-98px, -91px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(15) {
    transform: rotate(236deg) translate(-90px, -64px);
  }
  .main_page2 .container > .wrap > .text_rotate > span:nth-child(16) {
    font-size: 2.4rem;
    transform: rotate(259deg) translate(-69px, -30px);
  }
  .main_page2 .container > .wrap > .main2_img {
    height: 450px;
    top: calc(50% - 225px);
    background-position: right center;
  }
  .main_page2 .container > .wrap > .main2_img:before {
    font-size: 1.8rem;
    top: -10%;
    left: -5%;
  }
  .main_page2 .container > .wrap > .text_box {
    width: 80%;
    height: 260px;
  }
  .main_page2 .container > .wrap > .text_box > .inner {
    margin-top: 1rem;
    padding: 0 3rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner p {
    font-size: 1.4rem;
    line-height: 2.3rem;
  }
  .main_page2 .container > .wrap > .text_box > .inner button {
    margin-top: 16px;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
  }
  /* 3번째 페이지 : 서비스 */
  .main_page3 {
    height: 100%;
  }
  .main_page3 .container {
    background: linear-gradient(0deg, #fff 30%, #FFEBE1 30%, #FFEBE1 70%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column-reverse;
  }
  .main_page3 .container > .left {
    width: 100%;
    height: auto;
  }
  .main_page3 .container > .left > .inner {
    margin: 10% auto;
  }
  .main_page3 .container > .left > .inner > .frame {
    background-position: center center;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img {
    padding-top: 80.25%;
  }
  .main_page3 .container > .left > .inner > .frame > .computer_wrap > .back_img > .img_wrap {
    top: 5%;
    width: 88%;
    height: 65%;
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.top {
    width: calc(100% - 60px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.mid {
    width: calc(100% - 60px);
  }
  .main_page3 .container > .right {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
  .main_page3 .container > .right div.bottom {
    width: calc(100% - 60px);
  }
  .main_page3 .container > .right > .inner {
    width: 100%;
    height: auto;
  }
  .main_page3 .container > .right > .inner > .cont > .top {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .main_page3 .container > .right > .inner > .cont > .top > .page3-title {
    line-height: 3.8rem;
    font-size: 2.4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab > li {
    font-size: 1.4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .mid > .tab_line {
    width: 30px;
    top: calc(50% + 10px);
  }
  .main_page3 .container > .right > .inner > .cont > .bottom {
    padding-top: 2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap {
    padding-bottom: 1rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .text_group > .text_wrap > p {
    font-size: 1.4rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap {
    margin-top: 1.2rem;
  }
  .main_page3 .container > .right > .inner > .cont > .bottom > .wrap > .btn_wrap > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
    padding: 7px 15px;
  }
  /* 4번째 페이지 : 포트폴리오*/
  .main_page4 .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 50px;
  }
  .main_page4 .container > .left {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner {
    width: calc(100% - 60px);
    height: 300px;
  }
  .main_page4 .container > .left > .inner > .page4-title {
    line-height: 3.8rem;
    font-size: 2.4rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .main_page4 .container > .left > .inner > p {
    font-size: 1.4rem;
    line-height: 2.3rem;
    padding-bottom: 3rem;
  }
  .main_page4 .container > .left > .inner > button {
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.4rem;
    padding: 7px 15px;
  }
  .main_page4 .container > .left > .inner > .arrow {
    width: 100%;
    height: 30px;
    position: absolute;
    bottom: 10%;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
  }
  .main_page4 .container > .left > .inner > .arrow > li {
    width: 65px;
  }
  .main_page4 .container > .left > .inner > .arrow > li.left_arrow > img {
    left: 0;
  }
  .main_page4 .container > .left > .inner > .arrow > li.right_arrow > img {
    left: 0;
  }
  .main_page4 .container > .right {
    width: calc(100% - 60px);
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide {
    height: 300px;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    padding-left: 2rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > h3 {
    font-size: 3rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black > .text > p {
    padding-top: 8px;
    font-size: 1.4rem;
    line-height: 2.3rem;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black:before, .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black:after {
    content: "";
    display: none;
  }
  .main_page4 .container > .right > .swiper-container > .swiper-wrapper > .swiper-slide > a > .black:hover {
    border-bottom: none;
  }
  /* 5번째 페이지 : 알씨스토리 */
  .main_page5 .container > .wrap {
    width: calc(100% - 60px);
    padding: 0 20px;
    position: relative;
    overflow: hidden;
  }
  .main_page5 .container > .wrap > ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
  }
  .main_page5 .container > .wrap > ul > li {
    height: 320px;
    border-radius: 20px;
  }
  .main_page5 .container > .wrap > ul > li > .wrap {
    border-radius: 20px;
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont {
    width: 100%;
    height: 130px;
    border-radius: 0 0 20px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text {
    margin: 10px auto;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button {
    margin-top: 15px;
    padding: 7px 10px !important;
    border: 2px solid #dc6868;
    border-radius: 10px;
    padding: 10px 20px;
    transition: all 0.3s;
    cursor: pointer;
    color: #dc6868;
    background: transparent;
    font-weight: bold;
    font-size: 1.2rem;
  }
  .main_page5 .container > .wrap > ul > li > .wrap > .cont > .text > button > a {
    color: #dc6868;
  }
  .main_page5 .container > .wrap > ul > li:before {
    font-size: 2.4rem;
    color: #dc6868;
    font-weight: bold;
    font-family: "Laila", sans-serif;
  }
  .main_page5 .container > .wrap > ul > li:hover > .wrap {
    filter: grayscale(0);
  }
  .main_page5 .container > .wrap > ul > li:hover:before {
    color: #dc6868;
  }
}
/*
@media (hover: hover) {

  .main_page5 {
    .container {
      >.wrap {
        >ul {
          >li {
            >.wrap {
              filter: grayscale(1);
            }
            //각 box에 hover했을 때
            &:hover {
              >.wrap {
                filter: grayscale(0);
              }
            }
            &:hover:before {
              color: $pointColor;
            }
          }
        }
      }
    }
  }
}*//*# sourceMappingURL=mq_index.css.map */