/* BASIC css start */
/* 211115 morenvy ¿µ±¤ */

.header_bg_com {display:none;}
#mfooter {margin-top:0px !important;}


/* ¸ÞÀÎÀÌ¹ÌÁö ¿µ¿ª */
/* iOS only (¸ÞÀÎºñÁÖ¾ó 100vh ¾ÆÀÌÆù È£È¯ °ü·Ã) */ 
@supports (-webkit-touch-callout: none) {height: -webkit-fill-available;}

.swiper0 .swiper-slide {width:100%; height:calc(var(--vh, 1vh) * 100); position:relative;}
.swiper0 .swiper-slide-active .bg {transform: scale(1);}
.swiper0 .bg {transform: scale(1.12); transition: 5s ease;}
.swiper0 .bg01 {width:100%; height:100%;}
.swiper0 .bg02 {width:100%; height:100%;}
.swiper0 .bg03 {width:100%; height:100%;}
.swiper0 .bg04 {width:100%; height:100%;}
.swiper0 .main_bg_text {position:absolute; top:50%; left:24px; transform:translateY(-50%);}
.swiper0 .main_bg_text .t01 {margin:0 0 16px; font-size:38px; font-weight:700; color:#fff; line-height:1.2;}
.swiper0 .main_bg_text .t02 {font-size:16px; font-weight:400; color:#fff; line-height:24px;}
.swiper0 .swiper-button-next {width:auto; height:auto; margin:auto; padding:0px 65px 0px 0; top:auto; bottom:80px; right:24px; font-size:14px; font-weight:700; line-height: 24px; color:#fff; background:0; transition: padding .3s ease;}
.swiper0 .swiper-button-next:after {content:""; width:48px; height:1px; position:absolute; top:40%; right:0%; transform:translateY(-40%); opacity:0.6; background:#fff; transition: width .3s ease;}
.swiper0 .swiper-pagination0 {display: flex; align-items: center; width:auto !important; bottom:88px !important; left:calc(24px + 4px) !important; text-align:left;}
.swiper0 .swiper-pagination0 .swiper-pagination-bullet {width:4px; height:4px; margin-right:36px !important; background:#fff;-webkit-transition: opacity 0.3s;-moz-transition: opacity 0.3s;-ms-transition: opacity 0.3s;-o-transition: opacity 0.3s;transition: opacity 0.3s;}
.swiper0 .swiper-pagination0 .swiper-pagination-bullet:after {content:""; width:0px; height:0px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:50%; opacity:0;-webkit-transition: width 0.3s , height 0.3s;-moz-transition: width 0.3s , height 0.3s;-ms-transition: width 0.3s , height 0.3s;-o-transition: width 0.3s , height 0.3s;transition: width 0.3s , height 0.3s;}
.swiper0 .swiper-pagination0 .swiper-pagination-bullet-active {width:8px; height:8px; position:relative; background:#fff; opacity:1;}
.swiper0 .swiper-pagination0 .swiper-pagination-bullet-active:after {content:""; width:24px; height:24px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:50%; opacity:0.4;}

.swiper0 .swiper-slide-active .t01 {-webkit-animation-name: fadeInUp1; animation-name: fadeInUp1; -webkit-animation-duration:1.5s !important; animation-duration:1.5s !important;
-webkit-backface-visibility: hidden; backface-visibility: hidden;}
.swiper0 .swiper-slide-active .t02 {-webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; -webkit-animation-duration: 1.5s !important; animation-duration:1.5s !important;
-webkit-backface-visibility: hidden; backface-visibility: hidden;}

@-webkit-keyframes fadeInUp1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes fadeInUp2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    transform: translateY(-40px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}


/* °øÅëÅ¸ÀÌÆ² */
.main_title .t01 {margin:0 0 8px; font-size:28px; font-weight:700; color:#111111; line-height:32px;}
.main_title .t02 {font-size:16px; font-weight:400; color:#6a6a6a; line-height:24px;}


/* section01 (WORKS)*/
.section01 {margin:56px 0 64px; position:relative;}
.section01_title { margin-left:24px; padding:0 0 40px; position:relative;}
.section01_title .t01 {letter-spacing:-0.020em;}
.section01_title img {height:96px; position:absolute; top:-8px; right:16px;}


.section01 .swiper1 {padding:0 0 60px 24px; }
.section01 .swiper1 .wrap_works .work_thumb .thumb {position:relative; font-size:0;}
.section01 .swiper1 .wrap_works .work_thumb .thumb01 img {width:100%;}
.section01 .swiper1 .wrap_works .work_thumb .thumb .work_t01 {display:inline-block; padding:13px 0 0; font-size:16px; font-weight:500; color:#1a1a1a; line-height:24px;}
.section01 .swiper1 .wrap_works .work_thumb .thumb .work_bt {letter-spacing:-0.040em; display:flex; align-items:center; justify-content:center; opacity:0; width:96px; height:96px; 
margin:-12px 0 0; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(0.2); font-size:12px; font-weight:700; color:#1a1a1a; line-height:16px; text-align:center; background:rgba(255,255,255,0.8); border-radius:50%;-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s;  transition: all 0.5s;}
.section01 .swiper1 .swiper-slide-active .wrap_works .work_thumb .thumb .work_bt {opacity:1;top:50%;transform:translate(-50%,-50%) scale(1);}
.section01 .swiper1 .swiper-slide {}
.section01 .swiper-button-prev {width:24px; height:24px; margin:0; position:static; background:url('/design/kcca/mobile_modernstudio/arrow_l.svg') no-repeat center; background-size: 8px;}
.section01 .swiper-button-next {width:24px; height:24px; margin:0; position:static; background:url('/design/kcca/mobile_modernstudio/arrow_r.svg') no-repeat center; background-size: 8px;}
.section01 .swiper-pagination {display:inline-block; position:static; padding:0 8px; font-size:14px; color:#9a9a9a; line-height: 24px;}
.section01 .swiper-pagination .swiper-pagination-current {display:inline-block; color:#111111; padding:0 8px 0 0; line-height: 24px;}
.section01 .swiper-pagination .swiper-pagination-total {display:inline-block;}
.section01 .swiper-pagination .count {display:inline-block; color:#111111; line-height: 24px;}
.section01 .swiper-pagination .count02 {display:inline-block; padding:0 0 0 8px; line-height: 24px;}
.section01 .wrap_swiper_bt {display:flex; align-items:center; position:absolute; bottom:0; left:24px;}


/* section02 (100% ¹è³Ê) */
.swiper2 .swiper-slide {width:100%; height:720px; position:relative;}
.swiper2 .swiper-slide img {width:100%;}
.swiper2 .bg01 {width:100%; height:100%;}
.swiper2 .bg02 {width:100%; height:100%;}
.swiper2 .main_bg_text {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center;}
.swiper2 .main_bg_text .t01 {margin:0 0 16px; font-size:32px; font-weight:700; color:#fff; line-height:40px; white-space:nowrap;}
.swiper2 .main_bg_text .t02 {font-size:16px; font-weight:500; color:#fff; line-height:24px; white-space:nowrap;}
.swiper2 .swiper-button-next {width:auto; height:auto; margin:auto; padding:0px 65px 0px 0; top:auto; bottom:80px; right:24px; font-size:14px; font-weight:700; line-height: 24px; color:#fff; background:0; transition: padding .3s ease;}
.swiper2 .swiper-button-next:after {content:""; width:48px; height:1px; position:absolute; top:40%; right:0%; transform:translateY(-40%); opacity:0.6; background:#fff; transition: width .3s ease;}
.swiper2 .swiper-pagination2 {display: flex; align-items: center; width:auto !important; bottom:88px !important; left:calc(24px + 4px) !important; text-align:left;}
.swiper2 .swiper-pagination2 .swiper-pagination-bullet {width:4px; height:4px; margin-right:36px !important; background:#fff;-webkit-transition: opacity 0.3s;-moz-transition: opacity 0.3s;-ms-transition: opacity 0.3s;-o-transition: opacity 0.3s;transition: opacity 0.3s;}
.swiper2 .swiper-pagination2 .swiper-pagination-bullet:after {content:""; width:0px; height:0px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:50%; opacity:0;-webkit-transition: width 0.3s , height 0.3s;-moz-transition: width 0.3s , height 0.3s;-ms-transition: width 0.3s , height 0.3s;-o-transition: width 0.3s , height 0.3s;transition: width 0.3s , height 0.3s;}
.swiper2 .swiper-pagination2 .swiper-pagination-bullet-active {width:8px; height:8px; position:relative; background:#fff; opacity:1;}
.swiper2 .swiper-pagination2 .swiper-pagination-bullet-active:after {content:""; width:24px; height:24px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:50%; opacity:0.4;}

.swiper2 .swiper-slide-active .t01 {-webkit-animation-name: fadeInUp1; animation-name: fadeInUp1; -webkit-animation-duration:1.5s !important; animation-duration:1.5s !important;
-webkit-backface-visibility: hidden; backface-visibility: hidden;}
.swiper2 .swiper-slide-active .t02 {-webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; -webkit-animation-duration: 1.5s !important; animation-duration:1.5s !important;
-webkit-backface-visibility: hidden; backface-visibility: hidden;}



/* section04 (NEW)*/
.section04 {width:100%; position:relative; padding:56px 0 64px;}
.section04:after {content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,10px); width:92%; height:1px; background:#E1E1E1;}
.section04 .section04_title {padding:0 0 40px; text-align:center;}
.section04 .swiper4 {width:100%; margin:0 auto;}
.section04 .swiper4 .thumb {width:100%; font-size:0;}
.section04 .swiper4 .thumb a {display:block; width:100%; padding:40px 0; text-align:center; box-sizing:border-box;}
.section04 .swiper4 .thumb a img {height:88px;}
.section04 .swiper4 .thumb .clients_t {padding:24px 20px 0; text-align:center;}
.section04 .swiper4 .thumb .clients_t01 {font-size:14px; color:#6a6a6a; line-height: 20px; }
.section04 .swiper4 .thumb .clients_t02 {padding:24px 0 0; font-size:14px; font-weight:500; color:#1a1a1a; line-height: 20px;}
.section04 .swiper4 .thumb .clients_t03 {padding:4px 0 0; font-size:12px; color:#9a9a9a; line-height: 16px; letter-spacing: -0.02em;}
.section04 .swiper-button-prev {width:24px; height:24px; margin:0; position:static; background:url('/design/kcca/mobile_modernstudio/arrow_l.svg') no-repeat center; background-size: 8px;}
.section04 .swiper-button-next {width:24px; height:24px; margin:0; position:static; background:url('/design/kcca/mobile_modernstudio/arrow_r.svg') no-repeat center; background-size: 8px;}
.section04 .swiper-pagination {display:inline-block; position:static; padding:0 8px; font-size:14px; color:#9a9a9a; line-height: 24px;}
.section04 .swiper-pagination .swiper-pagination-current {display:inline-block; color:#111111; padding:0 8px 0 0; line-height: 24px;}
.section04 .swiper-pagination .swiper-pagination-total {display:inline-block;}
.section04 .swiper-pagination .count {display:inline-block; color:#111111; line-height: 24px;}
.section04 .swiper-pagination .count02 {display:inline-block; padding:0 0 0 8px; line-height: 24px;}
.section04 .wrap_swiper_bt {display:inline-flex; align-items:center; padding:40px 0 0; position:relative; bottom:0; left:50%; transform:translateX(-50%);}


/* section05 (È¸»ç·Î°í) */
.section05 .inner {width:100%; margin:0px auto; padding:76px 0;}
.section05 .inner ul {font-size:0;}
.section05 .inner ul li {display:inline-block;  text-align:center;}
.section05 .inner ul li .company_logo {display:flex; align-items:center; justify-content:center; width:100%; height:80px; border-right:1px solid #E8E8E8;}
.section05 .inner ul li:last-child .company_logo {border:none;}
.section05 .inner ul li .company_logo img {height:20px;}
.section05 .inner ul li .company_logo04 img {height:28px;}


/* section06 (ºñµð¿À¹è³Ê) */
.section06 {}
.section06 .inner {display: flex;flex-wrap: wrap;align-items: center;}
.section06 .video {position:relative; width:100%; height:360px;}
.section06 .video .thumbnail{position: relative;width: 100%;height:100%;}
.section06 .video .thumbnail:before{display:block; content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.3);opacity:0; transition:0.3s;}
.section06 .video.on .thumbnail:before{opacity:1; transition:0.5s 0.4s;}
.section06 .video .thumbnail span{width: 100%;height: 100%;display: block;}
.section06 .video .btn_g {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);display:block; cursor: pointer;}
.section06 .video .btn_g button {display:block; overflow:inherit; border: 0; background:transparent;}
.section06 .video .btn_g button img {display:block;}

.section06 .right_txt {display: flex; align-items: center; width:100%; height:100%; background:#F6F6F6;}
.section06 .right_txt .wrap_t {width:100%; margin:0 0px 0 24px; padding:48px 0 72px;}
.section06 .right_txt .wrap_t .t01 {font-size:28px; font-weight:700; line-height:32px; color:#1a1a1a; white-space:nowrap;}
.section06 .right_txt .wrap_t .t02 {margin:16px 0 0; font-size:14px; line-height:20px; color:#6a6a6a;}
.section06 .right_txt .wrap_t .t03 {display:inline-flex; align-items: center; margin:48px 0 0; font-size:16px; font-weight:500; color:#1a1a1a; line-height: 24px;}
.section06 .right_txt .wrap_t .t03 img {width:18px; margin-left:18px;}


/* video popup */
#bg {position:fixed;left:0;top:0;width:100%;height:100%;background: rgba(0,0,0,0.5);display:none;z-index:2001;}
#video-popup {display:none;position:fixed;top:50%;left:50%;max-width: 1400px;width: 93%;z-index:20000;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
#video-popup .inner {position:relative;width: 100%;height: 0;padding-top: 56%;}
#video-popup .close {display:block; width:100%; height:100%; z-index:-1; background:transparent; border:none;}
#video-popup iframe {position: absolute;width: 100%;height: 100%;top: 0;left: 0;}
#video-popup .popup-close {position: absolute;right: 0;top: -50px; z-index:-1; cursor: pointer;width: 35px;height: 35px;}
#video-popup .popup-close:before,
#video-popup .popup-close:after {display:block;content:"";position: absolute;top: 17px; right:0px; z-index:-1; width: 30px; height: 2px; background: #fff;transform: rotate(45deg);}
#video-popup .popup-close:after {transform: rotate(-45deg);}
/* popup */
#layer-popup {display:none;position:fixed;top:50%;left:50%;z-index:2000;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
#layer-popup .popup-close {position:relative; text-align:right; cursor:pointer; z-index:1000; top:60px; right:30px;}
#layer-popup .inner {width:1200px; margin:0 auto; height:695px;  padding:100px 75px; background:#fff; box-sizing: border-box;}
#layer-popup .inner h1 {text-align:left;font-size:30px;font-weight:500;color:#362e2b;line-height:28px}
#layer-popup .inner pre {width:100%; margin:0 auto; height:432px;white-space:pre-wrap;overflow-y:scroll;box-sizing:border-box;border-top:1px solid #cfcdcd;border-bottom:1px solid #cfcdcd;background:#f5f5f5;font-family:'Josefin Sans', 'Pretendard', sans-serif;font-size:17px;color:#362e2b;padding:50px 30px;margin-top:28px}
#layer-popup .sub_tit {font-weight:500;font-size:20px}
#layer-popup .inner pre table td,#text-popup .inner pre table th {border:1px solid #000;padding:2px}
#layer-popup.find .inner {width:650px;height:468px;padding:184px 0 0;background:#fff url(../img/page/find_idpw_popup.jpg) no-repeat center top}
#layer-popup.find .inner .pop_title {text-align:center; font-size:26px;font-weight:500;color:#362e2b}


/* section07 (Æ÷Æ®Æú¸®¿À) */
.section07 {width:100%; margin:0px auto; padding:56px 0 0;}
.section07 .section07_title {margin:0 0 40px; text-align:center;}
.section07 .inner {font-size:0; overflow:hidden;}
.section07 .inner .por_thumb {display:inline-block; width:100%; position:relative;}
.section07 .inner .por_thumb .thumb {display:inline-block; width:100%; background:#000;}
.section07 .inner .por_thumb .thumb img {width:100%; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s;  transition: all 0.3s;}
.section07 .inner .por_thumb .inner_t {display:flex; width:100%; height:100%; position:absolute; top:0; left:0;}
.section07 .inner .por_thumb .inner_t .por_bg {width:100%; height:100%; position:absolute; z-index:1;}
.section07 .inner .por_thumb .inner_t .wrap_t {opacity:0; display:inline; position:absolute; top:80px; padding:0px 40px; transform:translateY(60px); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s;  transition: all 0.3s;}
.section07 .inner .por_thumb .inner_t .wrap_t .t01 {font-size:24px; font-weight:700; color:#fff; line-height: 32px;}
.section07 .inner .por_thumb .inner_t .wrap_t .t02 {margin:16px 0 0; font-size:16px; line-height:24px; color:#fff;}
.section07 .inner .por_thumb .inner_t .t03 {opacity:0; display:inline-flex; align-items: center; position:absolute; bottom:80px; left:40px; font-size:16px; font-weight:500; color:#fff; line-height: 24px;transform:translateY(60px); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s;  transition: all 0.3s;}
.section07 .inner .por_thumb .inner_t .t03 img {width:18px; margin-left:18px;}
.section07 .inner .por_thumb.por_act .thumb img {opacity:0.4;}
.section07 .inner .por_thumb.por_act .inner_t .wrap_t {opacity:1; transform:translateY(0); z-index:2;}
.section07 .inner .por_thumb.por_act .inner_t .t03 {opacity:1; transform:translateY(0); z-index:2;}



/* section08 (´º½º) */
.section08 {padding:56px 0 72px;background: #f6f6f6;}
.section08 .section08_title {margin: 0px 24px;}
.section08 .wrap_notice {padding:40px 0 0; position:relative;margin:0px 24px; }
.section08 .wrap_notice .nt_info {display: flex; justify-content: space-between; flex-direction: column; padding:24px 0; border-bottom:1px solid #e8e8e8; box-sizing:border-box;}
.section08 .wrap_notice .nt_info:hover {background:#fbfbfb;}
.section08 .wrap_notice ul li:first-child .nt_info { border-top:1px solid #e8e8e8;}
.section08 .wrap_notice .nt_info .nt_name {font-size:14px; color:#3a3a3a; line-height: 20px;}
.section08 .wrap_notice .nt_info .nt_name {  display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; text-overflow: ellipsis;}


.section08 .wrap_notice .nt_info .nt_name b {font-weight:400 !important;}
.section08 .wrap_notice .nt_info .nt_name font {color:#1a1a1a !important;}

.section08 .wrap_notice .nt_info .nt_count {display:inline-block; padding:4px 0 0; font-size:12px; color:#9a9a9a; line-height: 16px;font-family: 'Montserrat', sans-serif;}
.section08 .notice_more {display:flex; align-items: center; padding:48px 0 0; font-size:16px; font-weight:500; color:#1a1a1a; line-height:24px;}
.section08 .notice_more img {width:18px; margin-left:18px;}

/* BASIC css end */

