/******** 메인 비주얼 시작 *********/ .section1 {padding: 0 60px;} #main_visual_wrap{overflow:hidden; width:100%; height:790px; position:relative; z-index:9; backface-visibility:hidden; margin: 100px 0;} /* 비주얼높이값 이미지에맞게 수정 */ #main_visual_wrap .main_visual_slider {position: relative; width: 100%; height: 100%;} #main_visual_wrap .main_slider_item {overflow: hidden; position: relative; height:100% !important;} #main_visual_wrap .main_slider_item .slide_inner {position: absolute; width: 100%; height: 100%; left: 0; top: 0;} #main_visual_wrap .main-visual-con{z-index:1;} /* 메인 비주얼 :: 이미지 */ #main_visual_wrap .main_slider_item {position:relative;} #main_visual_wrap .main_slider_item .visual_bg {width:100%;height:100%; transform: scale(1.3,1.3); backface-visibility:hidden; transition:transform 7000ms ease-in-out;} #main_visual_wrap .main_slider_item .visual_bg1 {background: url('../../images/ko/main_visual1.jpg') no-repeat center / cover;} #main_visual_wrap .main_slider_item .visual_bg2 {background: url('../../images/ko/main_visual2.jpg') no-repeat center / cover;} #main_visual_wrap .main_slider_item .visual_bg3 {background: url('../../images/ko/main_visual3.jpg') no-repeat center / cover;} /* 메인 비주얼 :: 텍스트 */ #main_visual_wrap .main_slider_item .visual_txt{position:absolute; left:50%; transform: translateX(-50%); top:0; width:100%; height:100%;} #main_visual_wrap .main_slider_item .text {display:flex; align-items:center; justify-content: flex-start; height:100%; padding: 0 170px;} #main_visual_wrap .main_slider_item .text .text_inner {text-align: center;} #main_visual_wrap .main_slider_item .visual_txt .sub_title .f22, #main_visual_wrap .main_slider_item .visual_txt .main_title .f56 span, #main_visual_wrap .main_slider_item .visual_txt .explanation .f28, #main_visual_wrap .main_slider_item .visual_txt .visual_btn {opacity:0;} #main_visual_wrap .main_slider_item .visual_txt .sub_title {display:block; overflow: hidden; margin-bottom: 20px; text-align: left;} #main_visual_wrap .main_slider_item .visual_txt .sub_title .f22 {color:#fff; font-weight: 600;} #main_visual_wrap .main_slider_item .visual_txt .main_title .f56 {color:#fff; font-weight: 600; overflow: hidden; text-align: left;} #main_visual_wrap .main_slider_item .visual_txt .main_title .f56 span {display: block; word-break: keep-all;} #main_visual_wrap .main_slider_item .visual_txt .explanation {display:block; overflow: hidden; margin-top: 35px;} #main_visual_wrap .main_slider_item .visual_txt .explanation .f28 {color:#fff;} #main_visual_wrap .visual_txt .visual_btn {opacity:0; margin-top: 50px; text-align: center;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow {display: flex; justify-content: flex-start; align-items: center; transition: all 0.2s;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow:hover {transition: all 0.2s !important;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .icon {position: relative; display: flex; align-items: center; margin-left: 15px; transition: all 0.3s;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .arrow {display: inline-block; margin-left: 62px; margin-bottom: 8px;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .arrow span {position: relative; display: inline-block; width: 6px; height: 6px; transform: rotate(135deg);} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .arrow span::after {content: ''; position: absolute; width: 100%; height: 100%; border: 1px solid #fff; border-right: 0; border-bottom: 0;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .arrow span::before {content: ''; position: absolute; width: 65px; height: 1px; background: #fff; transform-origin: 0 100%; transform: rotate(45deg);} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .circle {display: inline-block; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #fff; position: absolute; right: -15px;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow .f22 {color:#fff; font-weight: 400;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow:hover .f22 { transition: all 0.8s;} #main_visual_wrap .visual_txt .visual_btn .btn_line_arrow:hover .icon {margin-left: 30px; transition: all 0.3s;} /* 메인 비주얼 :: 페이지네이션 */ #main_visual_wrap .visual_tab {position: absolute; right: 0; bottom: 0; background: #fff; width: 900px; height: 140px; z-index: 1;} #main_visual_wrap .visual_tab .visual_page {display: flex; align-items: center; width: 100%; height: 100%; position: static; padding: 0 50px;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet {flex: 1 1 33.3%; background: none; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; opacity: 1;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet span {margin-top: 25px;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet .f14 {text-align: left; color:#ccc;margin-bottom: 10px;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet .f16 {text-align: left; color:#ccc;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet-active .f14 {text-align: left; color:#000; font-weight: 600; } #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet-active .f16 {text-align: left; color:#000; font-weight: 600;} /* 메인 비주얼 :: active효과 */ #main_visual_wrap .main_slider_item.active-item .visual_bg {-webkit-transform: scale(1.1,1.1) rotate(0.002deg); transform: scale(1.1,1.1) rotate(0.002deg);} #main_visual_wrap .main_slider_item.active-item .sub_title .f22, #main_visual_wrap .main_slider_item.active-item .main_title .f56 span, #main_visual_wrap .main_slider_item.active-item .explanation .f28, #main_visual_wrap .main_slider_item.active-item .main-visual-txt3, #main_visual_wrap .main_slider_item.active-item .visual_btn {-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;} #main_visual_wrap .main_slider_item.active-item .visual_txt .sub_title .f22 {-webkit-animation-delay:0.1s; animation-delay:0.1s;} #main_visual_wrap .main_slider_item.active-item .visual_txt .main_title .f56:nth-child(1) span {-webkit-animation-delay:0.3s; animation-delay:0.3s;} #main_visual_wrap .main_slider_item.active-item .visual_txt .main_title .f56:nth-child(2) span {-webkit-animation-delay:0.4s; animation-delay:0.4s;} #main_visual_wrap .main_slider_item.active-item .visual_txt .explanation .f28 {-webkit-animation-delay:0.5s; animation-delay:0.5s;} #main_visual_wrap .main_slider_item.active-item .visual_txt .visual_btn {-webkit-animation-delay:0.8s; animation-delay:0.8s;} @keyframes text-active-animation { from {opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(50px); transform: translateY(50px); } to {opacity:1.0;filter:Alpha(opacity=100); -webkit-transform: translateY(0); transform: translateY(0);} } /******** 메인 비주얼 끝 *********/ .section2 {padding: 70px 0 110px;} .section2 .title {position: relative; margin-bottom: 25px;} .section2 .title .f140 {color:#f4f4f4; text-align: center;} .section2 .title .f30 {color:#000; font-weight: 600; position: absolute; left: 50%; transform: translateX(-50%); bottom: 32px; text-align: center; width: 100%;} .section2 .f18 {color:#666; text-align: center;} .section2 .f18 span {font-weight: 400; display: block; margin-bottom: 6px;} /* SERVICE */ .section3 { padding: 0;} .main_service_slider {position: relative;} .main_service_slider .main_service_item {padding: 160px 20px 170px; height: 100vh; background: #f9f9f9; display: flex; justify-content: center; align-items: center;} .main_service_slider .main_service_item.item2 .slide_inner {width: 100%;} .main_service_slider .main_service_item.item4 {justify-content: flex-start;} .main_service_slider .main_service_item.item4 .image {height: 100vh;} .main_service_slider .main_service_item.item5 {flex-flow: column;} .main_service_slider .main_service_item.item5 .image {width: 100%;} .main_service_slider .main_service_item .slide_inner {display: flex; justify-content: center; align-items: center; height: 100vh;} .main_service_slider .main_service_item.item1 .slide_inner, .main_service_slider .main_service_item.item3 .slide_inner {padding-top: 50px;} .main_service_slider .main_service_item .image {} .main_service_slider .main_service_item .image img {height: 100%;} .main_service_slider .main_service_item .txt_wrap {display: flex; flex-flow: column; position: relative;} .main_service_slider .main_service_item .txt_wrap .f50 {margin-bottom: 70px; font-weight: 700;} .main_service_slider .main_service_item .txt_wrap .f20 {margin-bottom: 35px;} .main_service_slider .main_service_item .txt_wrap .f20:last-child {margin-bottom: 0;} .main_service_slider .main_service_item .txt_wrap .f20 span {display: block; color:#444; word-break: keep-all;} .main_service_slider .main_service_item .numbering {display: flex; align-items: center; margin-bottom: 4px;} .main_service_slider .main_service_item .numbering .current {color:#000; font-weight: 800;} .main_service_slider .main_service_item .numbering .divider {color:#888; margin: 0 10px;} .main_service_slider .main_service_item .numbering .total_num {color:#888; font-weight: 400;} .main_service_slider .swiper-pagination {bottom: 34px !important;} .main_service_slider .swiper-pagination .swiper-pagination-bullet {width: 16px; height: 16px; border: 2px solid #000; background: transparent; opacity: 1;} .main_service_slider .swiper-pagination .swiper-pagination-bullet-active {background: #000;} .main_service_slider .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .main_service_slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 7px;} .main_service_slider .circle_text {display: inline-block; z-index: 1; border-radius: 50%; width: 130px; position: absolute; right: -70px; bottom: -150px;} .main_service_slider .circle_text .text {animation: rotate 10s linear infinite;} .main_service_slider .circle_text .arrow {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);} .main_service_slider .circle_text .arrow img {width: 56px;} @keyframes rotate { from {-webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} to { -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);} } .main_service_slider .item1 {} .main_service_slider .item1 .txt_wrap {margin-left: 90px;} .main_service_slider .item1 .circle_text {} .main_service_slider .item2 .txt_wrap {margin-left: 90px;} /*.main_service_slider .item2 {background: url('../../images/ko/service_img2.png') no-repeat center / cover;} .main_service_slider .item2 .con {display: flex; justify-content: center; width: 100%;} .main_service_slider .item2 .image {width: 50%;}*/ .main_service_slider .item3 {} .main_service_slider .item3 .txt_wrap {margin-right: 100px; align-items: flex-end;} .main_service_slider .item3 .txt_wrap .text {display: flex; flex-flow: column; align-items: flex-end;} .main_service_slider .item3 .txt_wrap .f50, .main_service_slider .item3 .txt_wrap .f20 {text-align: right;} .main_service_slider .item3 .item_wrap {display: flex;} .main_service_slider .item3 .item_wrap img {width: 100%;} .main_service_slider .item3 .item_wrap .item_detail {} .main_service_slider .item3 .item_wrap .item_thum {margin-left: 17px;} .main_service_slider .item3 .item_wrap .item_thum .item {width: 146px; height: 110px; margin-bottom: 15px; cursor: pointer; overflow: hidden; display: flex; justify-content: center; align-items: center;} .main_service_slider .item3 .item_wrap .item_thum .item:last-child {margin-bottom: 0;} .main_service_slider .item3 .item_wrap .item_thum .item img {width: 100%;} .main_service_slider .item3 .item_wrap .item_thum .item.active {} .main_service_slider .item3 .circle_text {margin-top: 80px;} .main_service_slider .item4 {padding: 0;} .main_service_slider .item4 .slide_inner {justify-content: flex-start;} .main_service_slider .item4 .txt_wrap {margin: 0 20px 0 80px;} .main_service_slider .item4 .circle_text {margin-top: 100px;} .main_service_slider .item5 {padding: 0;} .main_service_slider .item5 .top_img {width: 100%;} .main_service_slider .item5 .top_img img {width: 100%;} .main_service_slider .item5 .slide_inner {padding:100px 20px 140px;} .main_service_slider .item5 .slide_inner .image_wrap {position: relative;} .main_service_slider .item5 .txt_wrap {margin-right: 120px;} .main_service_slider .item5 .circle_text {right: -65px; top: -40px; bottom: auto;} .main_service_slider .item6 .txt_wrap {margin-right: 100px; align-items: flex-end;} .main_service_slider .item6 .txt_wrap .text {display: flex; flex-flow: column; align-items: flex-end;} .main_service_slider .item6 .txt_wrap .f50, .main_service_slider .item6 .txt_wrap .f20 {text-align: right;} .main_service_slider .item6 .circle_text {margin-top: 50px;} .main_service_slider .item6 .image_wrap {position: relative;} .main_service_slider .item6 .image_wrap .image {display: flex;} .main_service_slider .item6 .image_wrap .image.small {position: absolute; right: -163px; bottom: -150px;} .main_service_slider .item3 .circle_text, .main_service_slider .item4 .circle_text, .main_service_slider .item6 .circle_text {position: relative; right: auto; bottom: auto;} /* SERVICE */ /* SOLUTION */ .section4 {padding: 220px 0; width: 100%; max-width: 1460px; position: relative; margin: 0 auto;} .section4 .title {} .section4 .title .f120 {text-align: center;} .section4 .mobile {display: none;} .section4 .row {margin-top: 25%; position: relative; height:610px;} .section4 .img_wrap {display: flex; justify-content: space-between; align-items: flex-start; position: relative; } .section4 .right {margin-top: 100px;} .section4 .box {position: relative; display: none;} .section4 .box.active {display: block;} .section4 .box .image {width: 100%; max-width: 430px; display: flex;} .section4 .box .image img {width: 100%;} .section4 .box .txt {position: absolute; left: 0; bottom: 0; padding: 55px 35px; width: 100%;} .section4 .box .txt .f14 {font-weight: 800; color:rgb(255,255,255,0.5); margin-bottom: 10px; letter-spacing: 0;} .section4 .box .txt .f34 {font-weight: 800; color:#fff;} .section4 .box1_2 .txt {top: 50%; left: 50%; bottom: auto; transform: translate(-50%, -50%); padding: 0 10px;} .section4 .box .txt .f20 {font-weight: 800; color:#666; letter-spacing: 0; text-align: center;} .section4 .box .txt .f42 {font-weight: 800; text-align: center;} .section4 .box .more {font-weight: 800; position: absolute; left: 50%; transform: translateX(-50%); bottom: 40px;} .section4 .box .more .f14 {color:#000; font-weight: 800; position: relative;} .section4 .box .more .f14::after {content: ''; height: 2px; width: 100%; background: #000; position: absolute; bottom: -3px; left: 0;} .section4 .txt_box {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);} .section4 .txt_box .f64 {font-weight: 700; text-align: center; white-space: nowrap;} .section4 .txt_box .text {margin-top: 35px;} .section4 .txt_box .text .f20 {color:#444;} .section4 .txt_box .text .f20 span {display: block; text-align: center;} /* SOLUTION */ /* CASE STUDY */ .section5 {} .case_study_wrap {display: flex; background: url('../../images/ko/case_study_bg.jpg') no-repeat center / cover; padding-top: 50px;} .section5 .bt_bg {height: 320px; background: #fff; width: 100%;} .case_tab {order: 2; width: 12%; padding: 0 30px; position: relative;top: 220px; z-index: 999; height: 250px;} .case_tab .f14 {color:#3c3c3c; text-align: right; margin-bottom: 20px; cursor: pointer; transition: all 0.3s;} .case_tab .f14:hover {color:#fff; font-weight: 700; transition: all 0.3s;} .case_tab .f14 span {position: relative;} .case_tab .f14.active {color: #fff; font-weight: 700;} .case_tab .f14.active span::before {content: ''; display: inline-block; width: 4px; height: 4px; background: #fff; border-radius: 50%; position: absolute; left: -10px; top: 7px;} .case_con_wrap {order: 1; width: 88%; position: relative; bottom: -205px; z-index: 99;} .case_con_wrap .case_con {position: relative; display: none;} .case_con_wrap .case_con1 {display: block;} .case_con_wrap .case_con .title {position: absolute; top: 0; left: 10vw;} .case_con_wrap .case_con .title .f20 {color:#666; font-weight: 700;} .case_con_wrap .case_con .title .f56 {color:#fff; line-height: 56px;} .case_con_wrap .case_con .title .f56 span {display: block;} .case_con_wrap .case_con .case_slider {position: relative; overflow: hidden;} .case_con_wrap .case_con .case_slider .swiper-wrapper {align-items: flex-end; margin-right: 880px;} .case_con_wrap .case_slider .case_item {width: 570px !important; display: flex;justify-content: center; align-items: center;} .case_con_wrap .case_slider .case_item .image {position: relative;} .case_con_wrap .case_slider .case_item .image img {display: block; width: 100%; height: 100%; object-fit: cover;} .case_con_wrap .case_slider .case_item .item_txt {} .case_con_wrap .case_slider .case_item .item_txt .item_title {display: none;} .case_con_wrap .case_slider .case_item .item_txt .item_title .year {} .case_con_wrap .case_slider .case_item .item_txt .item_title .f34 {} .case_con_wrap .case_slider .case_item .item_txt .item_more {margin-top: 14px;} .case_con_wrap .case_slider .case_item .item_txt .item_more .f12 {font-weight: 700; color:#000;} .case_con_wrap .case_slider .case_item.swiper-slide-active {width: 850px !important; margin-bottom: 35px;} .case_con_wrap .case_slider .swiper-slide-active .image .dim {background: linear-gradient(to bottom, transparent, transparent, #222); position: absolute; width: 100%; height: 100%; top: 0; left: 0;} .case_con_wrap .case_slider .swiper-slide-active .item_txt {position: absolute; left: 0; bottom: 70px; width: 100%; padding: 0 50px 0 70px; text-align: left;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_title {display: inline-block; margin-bottom: 15px;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_title .year {color: rgb(255,255,255,0.5); font-weight: 800; margin-bottom: 5px;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_title .f34 {color:#fff; font-weight: 800;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_more {text-align: right;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_more .f12 {color:#fff; font-size: 14px; font-weight: 800; position: relative; text-align: right; display: inline-block;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_more .f12::after {content: ''; width: 100%; display: inline-block; height: 2px; background: #fff; position: absolute; bottom: -4px; left: 0;} .case_con_wrap .case_slider .case_item.swiper-slide-prev {display: none;} .case_con_wrap .case_slider .case_item.before {opacity: 0;} .case_con_wrap .btn {display: flex; position: absolute; right: -12%; bottom: 125px; align-items: flex-end;} .case_con_wrap .btn .case_btn {position: static; width: 80px; height: 80px; display: flex; justify-content: center; align-items: center;} .case_con_wrap .btn .swiper-button-next {background: #fff; position: relative; top: -80px; left: 0; transition: all 0.3s;} .case_con_wrap .btn .swiper-button-next:hover {background: #d3d3d3; transition: all 0.3s;} .case_con_wrap .btn .swiper-button-prev {background: #000; transition: all 0.3s;} .case_con_wrap .btn .swiper-button-prev:hover {background: #222; transition: all 0.3s;} .case_con_wrap .swiper-button-prev:after, .case_con_wrap .swiper-button-next:after {content: none;} .case_con_wrap .swiper-button-disabled {opacity: 1;} /* CASE STUDY */ /* INQUIRY, FAQ */ .section6 {} .inquiry_faq_wrap {width: 100%; max-width: 1492px; padding: 0 16px; margin: 80px auto 200px;} .section6 .title_wrap {} .section6 .title_wrap .title_box {display: none;} .section6 .title_wrap .title_box.active {display: inline-block;} .section6 .title_wrap .title_box .f74 {font-weight: 800;} .section6 .title_wrap .title_box .f74 span {display: block; text-transform: uppercase; margin-bottom: 14px; word-break: keep-all;} .section6 .title_wrap .title_box .f24 {margin-top: 35px; color:#444;} .section6 .tab {display: flex; justify-content: flex-end; align-items: center;} .section6 .tab .f24 {font-weight: 600; color:#000; transition: all 0.2s; cursor: pointer; width: 180px; height: 80px; border-radius: 50px; display: flex; justify-content: center; align-items: center;} .section6 .tab .f24:hover {font-weight: 800; transition: all 0.2s;} .section6 .tab .f24.active {font-weight: 700; color:#fff; background: #000; transition: all 0.3s;} .tab_con_wrap {margin-top: 50px;} .tab_con_wrap .tab_con {display: none; width: 100%;} .tab_con_wrap .tab_con.active {display: inline-block;} .inquiry_con .contactform .row {display: flex; flex-flow: wrap; justify-content: space-between;} .inquiry_con .contactform .row .item {flex: 1 1 calc(50% - 40px); margin: 0 40px 70px;} .inquiry_con .contactform .row .item.one {margin-right: 0;} .inquiry_con .contactform .f22 {font-weight: 700; position: relative; display: inline-block; margin-bottom: 10px;} .inquiry_con .contactform .row .item:nth-child(odd) {margin-left: 0;} .inquiry_con .contactform .row .item:nth-child(even) {margin-right: 0;} .inquiry_con .contactform .row .item:last-child {padding-right: 0;} .inquiry_con .contactform .item {width: 100%;} .inquiry_con .contactform .item .f22 .dot {display: inline-block; width: 6px; height: 6px; background: #000; border-radius: 50%; position: absolute; top: 5px; right: -15px;} .inquiry_con .contactform .item input {font-size: 20px; font-weight: 400; width: 100%; height: 60px; cursor: pointer;} .inquiry_con .contactform .item input::placeholder, .section6 .contactform textarea::placeholder {color:#999; font-weight: 400;} .inquiry_con .contactform .item input[type=radio] {width: 30px; height: 30px;} .inquiry_con .contactform textarea {font-size: 20px; font-weight: 400; resize: none; border: 1px solid #ddd; height: 140px; width: 100%; padding: 25px; margin-top: 10px;} .inquiry_con .contactform .email_wrap {display: flex; align-items: center;} .inquiry_con .contactform .email_wrap input {width: 47%;} .inquiry_con .contactform .email_wrap select {width: 47%; font-size: 20px;} .inquiry_con .contactform .email_wrap .f20 {width:6%; text-align: center; color:#222;} .inquiry_con .contactform .radio_box {margin-top: 15px;} .inquiry_con .contactform .radio_box label {margin-right: 100px;} .inquiry_con .contactform .radio_box .f20 {margin-left: 12px; font-weight: 500;} .inquiry_con .contactform button {background: #fff; border: 1px solid #000; width: 200px; height: 78px; margin: 0 auto; display: flex; justify-content: center; align-items: center; margin-top: 40px; border-radius: 50px;} .inquiry_con .contactform button .f18 {color:#000; font-weight: 700;} .faq_con {} .faq_con .faq_list {border-top: 1px solid #000;} .faq_con .faq_list li {border-bottom: 1px solid #eee;} .faq_con .faq_list li a {display: flex; justify-content: space-between; padding: 55px 80px; align-items: center;} .faq_con .faq_list li a .cate {color:#000; font-weight: 800; text-transform: uppercase} .faq_con .faq_list li a .txt {width: 65%;} .faq_con .faq_list li a .txt .title {color:#000; font-weight: 600; display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .faq_con .faq_list li a .txt .date {color:#777; display: flex; align-items: center; margin-top: 20px; font-weight: 500;} .faq_con .faq_list li a .txt .date .icon {margin-right: 6px; display: flex;} .faq_con .faq_list li a .arrow {width: 84px; height: 84px; border-radius: 50%; border: 1px solid #000; display: flex; justify-content: center; align-items: center; opacity: 0; transition: all 0.3s; flex-shrink: 0;} .faq_con .faq_list li a .arrow img {} .faq_con .faq_list li:hover a .arrow {opacity: 1; transform: translateX(20px); transition: all 0.3s;} /* INQUIRY, FAQ */ @media (max-width: 1920px) { .main_service_slider .item6 .image_wrap .image.small {right: -110px; bottom: -100px;} .section4 .row {margin-top: 18%;} } @media (max-width: 1850px) { .main_service_slider .item4 .txt_wrap {margin-left: 60px;} .main_service_slider .main_service_item.item4 .image {height: auto;} .main_service_slider .main_service_item .slide_inner {height: auto;} .main_service_slider .main_service_item.item4 {justify-content: center;} .main_service_slider .item4 .slide_inner {justify-content: center;} .main_service_slider .circle_text {right: 0;} } @media (max-width: 1750px) { #main_visual_wrap .main_slider_item .text {padding: 0 6vw;} .main_service_slider .main_service_item .txt_wrap .f50 {margin-bottom: 40px;} .main_service_slider .main_service_item .txt_wrap .f20 {margin-bottom: 20px;} .main_service_slider .main_service_item.item1 .image {width: 50%;} .main_service_slider .item3 .item_wrap {width: 50%;} .main_service_slider .item6 .image_wrap {width: 50%;} .case_con_wrap .case_slider .swiper-slide-active .item_txt {padding: 0 40px; bottom: 50px;} .case_con_wrap .case_con .title {left: 5vw;} .main_service_slider .main_service_item.item4 .image {width: 50%;} .main_service_slider .main_service_item .image img {height: auto; width: 100%;} .main_service_slider .item4 .txt_wrap {margin-left: 80px;} } @media (max-width: 1600px) { .section1 {padding: 0 16px;} #main_visual_wrap {height: 700px;} #main_visual_wrap .visual_tab {height: 100px;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet span {margin-top: 15px;} .main_service_slider .main_service_item .numbering .f18 {font-size: 16px;} .main_service_slider .main_service_item .txt_wrap .f50 {margin-bottom: 30px;} .main_service_slider .item4 .circle_text {margin-top: 40px;} .main_service_slider .item5 .slide_inner {padding: 60px 60px;} .main_service_slider .item5 .circle_text {right: -25px;} .main_service_slider .main_service_item.item4 .image {width: 40%;} .section4 .row {margin-top: 12%;} .case_tab {width: 16%; top: 80px;} .case_con_wrap {width: 84%; bottom: -150px;} .case_con_wrap .btn {right: -17%;} .case_con_wrap .case_con .title {left: 40px;} .case_con_wrap .case_slider .case_item.swiper-slide-active {width: 650px !important;} .case_con_wrap .case_con .case_slider .swiper-wrapper {margin-right: 680px;} .case_con_wrap .case_slider .case_item {width: 400px !important;} .case_study_wrap {padding-top: 0;} .case_con_wrap .btn {bottom: 70px;} .case_con_wrap .case_con .title .f56 {line-height: 50px;} } @media (max-width: 1440px) { #main_visual_wrap {height: 600px;} #main_visual_wrap .visual_tab {width: 80vw; height: 80px;} #main_visual_wrap .visual_tab .visual_page {padding: 0 20px;} #main_visual_wrap .main_slider_item .text .text_inner {margin-bottom: 50px;} .section4 .row .box .image {max-width: 380px;} .main_service_slider .main_service_item .txt_wrap .f50 {margin-bottom: 25px;} .main_service_slider .main_service_item .txt_wrap .f20 {font-size: 16px; line-height: 26px; margin-bottom: 16px;} .main_service_slider .item1 .txt_wrap {margin-left: 60px;} .main_service_slider .item1 .circle_text {right: 0; bottom: auto; top: 0;} .main_service_slider .item2 .txt_wrap {margin-left: 60px;} .main_service_slider .item2 .circle_text {right: 0; bottom: -80px;} .main_service_slider .item2 .txt_wrap {margin-top: 50px;} .main_service_slider .item2 .circle_text {position: relative; left: 0; bottom: 0; right: auto; margin-top: 30px;} .main_service_slider .item3 .txt_wrap {margin-right: 60px;} .main_service_slider .item3 .circle_text {margin-top: 50px;} .main_service_slider .item3 .item_wrap .item_thum .item {width: 120px; height: 80px; margin-bottom: 10px;} .main_service_slider .item4 .txt_wrap {margin-left: 60px;} .main_service_slider .item6 .image_wrap .image.small {width: 40%; right: -50px; bottom: -50px;} .main_service_slider .circle_text {width: 90px; } .main_service_slider .circle_text .text {object-fit: cover; width: 90px;} .main_service_slider .circle_text .arrow img {width: 28px;} .section2 {padding: 30px 0 110px;} .section2 .title .f30 {bottom: 26px;} .case_tab {width: 18%;} .case_con_wrap {width: 82%;} .case_con_wrap .case_con .title {top: 0;} .case_con_wrap .case_slider .case_item.swiper-slide-active {width: 550px !important;} .case_con_wrap .case_con .case_slider .swiper-wrapper {margin-right: 580px;} .case_con_wrap .case_slider .case_item {width: 300px !important;} .case_con_wrap .btn {bottom: 90px; right: -20%;} .case_con_wrap .btn .case_btn {width: 60px; height: 60px;} .case_con_wrap .btn .swiper-button-next {top: -60px;} .inquiry_faq_wrap {margin: 40px auto 160px;} .section6 .tab .f24 {height: 70px; font-size: 20px; line-height: 30px;} .section6 .title_wrap .title_box .f74 span {margin-bottom: 4px;} .inquiry_con .contactform .f22 {margin-bottom: 6px;} .inquiry_con .contactform .item input {font-size: 18px;} .inquiry_con .contactform .radio_box label {margin-right: 60px;} .inquiry_con .contactform .email_wrap select {font-size: 18px;} .inquiry_con .contactform textarea {font-size: 18px;} .tab_con_wrap {margin-top: 40px;} .faq_con .faq_list li a {padding: 45px 40px;} .faq_con .faq_list li a .txt .date {margin-top: 15px;} .faq_con .faq_list li a .arrow {width: 75px; height: 75px;} } @media (max-width: 1199px) { #main_visual_wrap {margin: 80px 0; height: 540px;} .section4 .row {margin-top: 120px;} .section4 .row .box .image {max-width: 320px;} .section4 .txt_box .text {margin-top: 20px;} .main_service_slider .main_service_item .numbering {margin-bottom: 0;} .main_service_slider .main_service_item .numbering .f18 {font-size: 14px; line-height: 24px;} .main_service_slider .main_service_item .numbering .divider {font-size: 12px; line-height: 22px;} .main_service_slider .main_service_item .txt_wrap .f50 {margin-bottom: 15px;} .main_service_slider .main_service_item .txt_wrap .f20 {line-height: 24px; margin-bottom: 12px;} .main_service_slider .swiper-pagination {bottom: 20px !important;} .main_service_slider .swiper-pagination .swiper-pagination-bullet {width: 10px; height: 10px; margin: 0 6px;} .main_service_slider .item3 .circle_text {margin-top: 40px;} .main_service_slider .item3 .item_wrap .item_thum .item {width: 90px; height: 60px; margin-bottom: 6px;} .main_service_slider .main_service_item.item4 .image {width: 50%;} .main_service_slider .item4 .circle_text {margin-top: 40px;} .main_service_slider .item5 .txt_wrap {margin-right: 60px;} .main_service_slider .item6 .txt_wrap {margin-right: 60px;} .section4 {padding: 140px 0;} .case_con_wrap .case_slider .swiper-slide-active .item_txt {padding: 0 30px; bottom: 40px;} .case_con_wrap .case_slider .case_item .item_txt .item_more {margin-top: 8px;} .case_con_wrap .case_slider .case_item.swiper-slide-active {margin-bottom: 28px; width: 480px !important;} .case_con_wrap .case_con .case_slider .swiper-wrapper {margin-right: 510px;} .case_con_wrap .case_con .title .f56 {line-height: 40px;} .case_tab {top: 30px;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_title .year {margin-bottom: 0;} } @media (max-width: 1024px) { #main_visual_wrap {height: 460px; margin: 70px 0;} #main_visual_wrap .visual_tab {background: rgb(255,255,255,0.9); width: 100%; height: 80px;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet span {margin-top: 0;} #main_visual_wrap .visual_tab .visual_page .swiper-pagination-bullet .f14 {margin-bottom: 4px;} #main_visual_wrap .main_slider_item .visual_txt .sub_title {margin-bottom: 14px;} .section4 .row {display: flex; height: auto;} .section4 .row .box {display: flex;} .section4 .txt_box .text {margin-top: 15px;} .section4 .row .right {margin-top: 0;} .section4 .txt_box {position: static; transform: none; order: 1;} .section4 .row .img_wrap {order: 2;} .main_service_slider .main_service_item.item1 .slide_inner, .main_service_slider .main_service_item.item3 .slide_inner {padding-top: 0;} .section4 {padding: 90px 0;} .section4 .row {justify-content: center; margin: 0 0 30px;} .section4 .row .img_wrap {display: none;} .section4 .mobile {display: block; padding: 0 16px;} .section4 .mobile .txt_box {margin-bottom: 30px;} .section4 .mobile .img_wrap {flex-flow: wrap;} .section4 .mobile .box {display: flex; flex: 1 1 33.3%;} .section4 .box .txt {padding: 30px 25px;} .section4 .box .txt .f14 {font-size: 14px; margin-bottom: 2px;} .case_study_wrap {flex-flow: column; padding: 80px 16px;} .case_con_wrap {bottom: auto; width: 100%; order: 2;} .case_con_wrap .btn {display: none;} .case_con_wrap .case_con .title {left: 16px;} .case_tab {width: 100%; padding: 0; display: flex; position: static; margin-bottom: 60px; height: auto;} .case_tab .f14 {margin: 0 20px; color:#666; font-weight: 500;} .case_con_wrap .case_con .title .f20 {margin-bottom: 4px;} .case_con_wrap .case_slider .case_item .item_txt .item_more .f12 {color:#fff;} .section5 .bt_bg {display: none;} .inquiry_faq_wrap {margin: 80px auto 90px;} .inquiry_con .contactform .f22 {margin-bottom: 0;} .inquiry_con .contactform .radio_box label {margin-bottom: 10px;} .inquiry_con .contactform .item input {font-size: 16px;} .inquiry_con .contactform .email_wrap select {font-size: 16px;} .inquiry_con .contactform .row .item {flex: 1 1 calc(50% - 20px); margin: 0 20px 70px;} .section6 .tab .f24 {height: 60px; font-size: 18px;} .section6 .title_wrap .title_box .f24 {margin-top: 25px;} .inquiry_con .contactform button {height: 64px;} .inquiry_con .contactform textarea {font-size: 16px; padding: 20px;} .inquiry_con .contactform .radio_box .f20 {font-size: 16px;} .faq_con .faq_list li a {padding: 35px 20px;} .faq_con .faq_list li a .txt .date {margin-top: 10px;} .faq_con .faq_list li a .arrow {width: 65px; height: 65px;} } @media (max-width: 959px) { } @media (max-width: 768px) { #main_visual_wrap {height: 400px;} #main_visual_wrap .visual_tab {display: none;} #main_visual_wrap .main_slider_item .text .text_inner {margin-bottom: 0;} #main_visual_wrap .main_slider_item.active-item .visual_txt .sub_title .f22 {font-size: 16px;} #main_visual_wrap .main_slider_item .visual_txt .sub_title {margin-bottom: 8px;} .main_service_slider .main_service_item {height: auto; padding: 40px 20px;} .main_service_slider .main_service_item .slide_inner {height: auto;} .main_service_slider .main_service_item.item1 .slide_inner, .main_service_slider .main_service_item.item3 .slide_inner {flex-flow: column;} .main_service_slider .main_service_item.item1 .image {width: 80%;} .main_service_slider .item1 .txt_wrap {margin-left: 0; margin-top: 40px;} .main_service_slider .item2 .txt_wrap {margin-left: 0; margin-top: 40px;} .main_service_slider .main_service_item .txt_wrap .f20 span {display: inline;} .main_service_slider .item1 .circle_text {position: relative; right: 0; margin-top: 30px;} .main_service_slider .item2 .circle_text {position: relative; right: 0; bottom: auto; margin-top: 30px;} /*.main_service_slider .item2 {background: url('../../images/ko/service_img2.png') no-repeat left center / cover;} .main_service_slider .item2 .image {display: none;}*/ .main_service_slider .item3 .txt_wrap {order: 2; margin-right: 0;} .main_service_slider .item3 .item_wrap {order: 1; width: 80%; margin-bottom: 40px;} .main_service_slider .main_service_item .slide_inner {flex-flow: column;} .main_service_slider .main_service_item.item4 .image {height: auto;} .main_service_slider .item4 .txt_wrap {margin-left: 0; margin-top: 40px;} .main_service_slider .main_service_item.item4 .image {width: 80%;} .main_service_slider .item5 .slide_inner {padding: 20px 0 0 0;} .main_service_slider .item5 .txt_wrap {margin-right: 0; margin-bottom: 40px;} .main_service_slider .item6 .circle_text {margin-top: 30px;} .main_service_slider .item6 .image_wrap {width: 80%; margin-top: 40px;} .main_service_slider .item6 .txt_wrap {margin-right: 0;} .main_service_slider .main_service_item .numbering .divider {margin: 0 6px;} .main_service_slider .main_service_item .numbering {margin-bottom: 2px;} .section2 {padding: 0 16px 90px;} .section2 .title .f30 {bottom: 22px;} .section2 .title {margin-bottom: 15px;} .section2 .title .f140 {white-space:nowrap; display: flex; justify-content: center;} .section2 .f18 span {display: inline;} .case_con_wrap .case_slider .case_item.swiper-slide-active {width: 380px !important;} .case_con_wrap .case_con .case_slider .swiper-wrapper {margin-right: 410px;} .case_con_wrap .case_slider .case_item {width: 260px !important;} .case_con_wrap .case_con .title {top: -20px;} .case_con_wrap .case_con .title .f56 {line-height: 30px;} .case_tab {overflow-x: scroll;} .case_tab .f14 {white-space:nowrap; margin: 0 15px;} .section6 .title_wrap .title_box .f24 {margin-top: 10px;} .section6 .tab {margin-top: 20px;} .section6 .tab .f24 {width: 150px;} .faq_con .faq_list li a {padding: 35px 0; justify-content: flex-start;} .faq_con .faq_list li a .cate {font-size: 15px; line-height: 25px; margin-right: 40px; width: 80px;} .faq_con .faq_list li a .arrow {display: none;} .faq_con .faq_list li:hover a .arrow {transform: none;} .faq_con .faq_list li a .txt {width: calc(100% - 140px);} } @media (max-width: 640px) { .case_con_wrap .case_con .title {position: static;} .case_con_wrap .case_slider .case_item, .case_con_wrap .case_slider .case_item.swiper-slide-active {width: 100% !important; margin-bottom: 0;} .case_con_wrap .case_con .case_slider .swiper-wrapper {margin-right: 0;} .case_con_wrap .case_con .title {margin-bottom: 20px;} .inquiry_con .contactform .row {flex-flow: column;} .inquiry_con .contactform .row .item {flex: 1 1 100%; margin: 0 0 60px;} .inquiry_con .contactform .radio_box label {margin-right: 40px;} .inquiry_con .contactform .item input[type=radio] {width: 24px; height: 24px;} .inquiry_con .contactform .radio_box .f20 {margin-left: 8px;} .faq_con .faq_list li a {padding: 25px 0; flex-flow: column; align-items: flex-start;} .faq_con .faq_list li a .cate {width: 100%; margin: 0 0 6px;} .faq_con .faq_list li a .txt {width: 100%;} .faq_con .faq_list li a .txt .date {margin-top: 8px;} } @media (max-width: 540px) { .main_service_slider .main_service_item.item1 .image, .main_service_slider .item3 .item_wrap, .main_service_slider .main_service_item.item4 .image {width: 100%;} .main_service_slider .item3 .item_wrap {flex-flow: column; } .main_service_slider .item3 .item_wrap .item_thum {margin-left: 0; display: flex;} .main_service_slider .item3 .item_wrap .item_thum .item {margin: 0 2px; width: auto; height: 50px;} .main_service_slider .item6 .image_wrap {width: 100%;} .main_service_slider .item6 .image_wrap .image {width: 80%;} .main_service_slider .item6 .image_wrap .image.small {right: 0;} .section4 .mobile .box {flex: 1 1 50%;} .section4 .box .txt {padding: 20px 15px;} .case_study_wrap {padding: 70px 16px 90px;} .case_tab {margin-bottom: 40px;} .case_con_wrap .case_slider .case_item .item_txt .item_more {display: none;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_more {display: block;} .case_con_wrap .case_slider .case_item .item_txt .item_more {margin-top: 0;} .case_con_wrap .case_slider .swiper-slide-active .item_txt {padding: 0 20px; bottom: 30px;} .case_con_wrap .case_slider .swiper-slide-active .item_txt .item_title {margin-bottom: 10px;} } @media (max-width: 479px) { #main_visual_wrap {height: 340px;} #main_visual_wrap .main_slider_item.active-item .visual_txt .sub_title .f22 {font-size: 14px;} .section4 .box .txt .f14 {font-weight: 700;} .section4 .txt_box .text {margin-top: 14px;} .case_con_wrap .case_slider .swiper-slide-active .item_txt {bottom: 30px;} .section6 .tab {justify-content: center; margin-top: 30px;} .section6 .tab .f24 {width: 50%;} .tab_con_wrap {margin-top: 30px;} } @media (max-width: 374px) { .section4 .box .txt .f34 {font-size: 16px; line-height: 24px;} .inquiry_con .contactform .radio_box label {margin-right: 30px;} }