
html {overflow-x:hidden; height:100%; /* scroll-behavior: smooth; */}
body {overflow-x:hidden; display:flex; flex-direction:column; color:#000; font-family: "Helvetica Neue", "Pretendard", "Noto Sans", sans-serif; }
* {font-family: "Helvetica Neue", "Pretendard", "Noto Sans", sans-serif; }
html.overflow-hidden,
body.overflow-hidden {overflow:hidden; }
header,footer {flex-shrink:0; }
main {flex-grow:1; }
.inner {padding:0 40px; }
.w1200 {width:1300px; max-width:100%; padding:0 25px; margin:0 auto; }
#wrap {padding-top:45px; }
.main #wrap {padding-top:0; }

@media all and (max-width:767px){
    .inner {padding:0 20px; }
    .w1200 {padding:0 20px; }
}


/* 헤더 */
header {z-index:100; position:fixed; top:0; left:0; width:100%; padding:10px 0; }
header.bg_on {background-color:rgba(255,255,255,0.5); backdrop-filter: blur(1px); }
header .inner {display:flex; align-items:center; justify-content:space-between; }
header h1 {z-index:20; position:relative; }
header h1 img {display:block; transition:all 0.5s; }
header .gnb {display:flex; align-items:center; }
header .gnb .mo_top {display:none; align-items:center; justify-content:space-between; height:53px; padding:20px 20px 15px; }
header .gnb ul {display:flex; align-items:center; gap:75px; }
header .gnb li.active {opacity:1; }
header .gnb li a {display:flex; align-items:center; gap:10px; font-size:14px; color:#000; transition:all 0.5s; }
header .gnb li a i {position:relative; flex-shrink:0; display:flex; align-items:center; gap:20px; height:18px; padding-bottom:2px; font-size:16px; font-style:normal; }
header .gnb li a i:after {content:']'; }
header .gnb li a i:before {content:''; opacity:0; position:absolute; left:calc(50% - 4px); top:calc(50% - 4px); width:10px; height:10px; background-color:#D0EFFF; border-radius:50%; }
header .gnb li.active a i:before {opacity:1; }
header .gnb li.insta {position:relative; }
header .gnb li.insta a {gap:5px; padding:5px 0;}
header .gnb li.insta img {transition:all 0.5s; }
header .gnb li.insta:hover .depth2 {display:block; }
header .gnb .depth2 {position:absolute; right:0; top:100%; display:none; width:150px; padding:5px; border:1px solid #111; text-align:right; border-radius:5px; z-index: 99;background: #fff;}
header .gnb .depth2 li a {display:flex; align-items:center; justify-content:space-between; padding:4px 0; font-size:13px; }
header .gnb .depth2 li a span {display:flex; align-items:center; gap:4px; }
header .gnb .depth2 li a:after {content:''; display:block; width:20px; height:20px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E"); background-position:center center; background-size:cover; }
header .ham_btn {z-index:20; position:relative; display:none; width:25px; height:23px; }

header.white_type h1 img {opacity:0; }
header.white_type h1:before {content:''; position:absolute; width:100%; height:100%; background:url('../img/logo_white.svg') no-repeat center center / 100% 100%; }
header.white_type .gnb li {opacity:1; }
header.white_type .gnb li a {color:#fff; }
header.white_type .gnb li.insta img {filter:invert(1); }
header.white_type .ham_btn.ham_icon {filter:invert(1);}
header.white_type .gnb .depth2 {border-color:#fff; }
header.white_type .gnb .depth2 li a:after {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");}

@media all and (max-width:840px){
    header .gnb ul {gap:50px; }
}

@media all and (max-width:767px){
    header {height:51px; padding:14px 0; }
    header.bg_on {backdrop-filter:unset;}
    header h1 img {height:22px; }
    header .gnb {z-index:30; position:fixed; right:100%; top:0; display:block; width:75%; height:100%; background-color:#ffffff; transition:all 0.4s; }
    header .gnb .mo_top {display:flex; }
    header .gnb .mo_top .logo img {height:22px; }
    header .gnb ul {flex-direction:column; gap:0; width:100%; padding:20px; margin-top:30px; height: calc(100vh - 83px); }
    header .gnb.active {right:25%; box-shadow:150px 0 100px rgba(0, 0, 0, 0.5); }
    header .gnb li {opacity:1; display:block; width:100%; }
    header .gnb li a {display:block; padding:23px 0; font-size:20px; font-weight:300;  }
    header .gnb li:last-of-type a {border-bottom:0 none; }
    header .gnb li a i {display:none; }
    header .gnb li.insta {margin-top:auto; }
    header .gnb li.insta > a {display:none; }
    header .gnb li.insta img {height:20px; }
    header .gnb li.insta .depth2 {position:static; display:block; width:100%; border:0 none; margin-top:0; padding:0; height:fit-content}
    header .gnb li.insta .depth2 li + li {margin-top:10px; }
    header .gnb li.insta .depth2 a {font-size:16px; }
    header .gnb .depth2 li a:after {display:none; }
    header.white_type .gnb li a {color:#000; }
    header.white_type .gnb li.insta img {filter:invert(0); }
    header .ham_btn {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }

}


/* 푸터 */
footer {padding:30px 0; }
footer .logo {padding-bottom:30px;}
footer .add p {font-size:14px; color:#000; line-height:1.7; }
footer .add p + p {margin-top:15px; }

@media all and (max-width:767px){
    footer .logo {padding-bottom:20px; }
    footer .add p {font-size:12px; }
    footer .add p + p {margin-top:10px; }
}

/* 탑버튼 */
.top_btn {z-index:80; position:fixed; right:40px; bottom:-80px; width:50px; height:50px; font-size:15px; color:#232730; transition:all 0.4s; cursor:pointer; background: #efefef;border-radius: 50%;}
.top_btn.on {bottom:40px; }
@media all and (max-width:767px){
    .top_btn {right:10px; width:55px; height:55px; font-size:13px; }
    .top_btn.on {bottom:20px; }
}

/* 메인 */
.main_visual {overflow:hidden; position:relative; width:100%; height:100dvh; }
.main_visual .swiper-slide {overflow:hidden; }
.main_visual .swiper-slide img {width:100%; height:100%; object-fit:cover; }
.main_visual .swiper-slide img.mo_img {display:none; }
.main_visual .arrow {z-index:10; position:absolute; bottom:40px; width:40px; height:40px; background-color:#232730; border-radius:50%; cursor:pointer; transition:all 0.5s; }
.main_visual .arrow img {display:block; max-width:55%; margin:0 auto; }
.main_visual .arrow.prev {left:40px; }
.main_visual .arrow.prev img {transform:rotate(180deg); }
.main_visual .arrow.next {right:40px; }
.main_visual .arrow.swiper-button-disabled {opacity:.4; }
.main_visual .pagination {z-index:10; position:absolute; left:0; top:auto; bottom:0; display:none; width:100%; height:10px; background-color:rgba(0,0,0,0.2); }
.main_visual .pagination span.swiper-pagination-progressbar-fill {background-color:#ffffff; }

.main_visual .txt_box {z-index:10; position:absolute; left:80px; top:50%; transform:translateY(-50%); }
.main_visual .txt_box .tit {font-size:63px; font-weight:300; letter-spacing:1px; transition:all 0.5s; }
.main_visual .txt_box .tit b {font-weight:600; }
.main_visual .txt_box .tit br.mo_ver {display:none; }
.main_visual .txt_box .desc {margin-top:70px; font-size:16px; color:#515151; font-weight:400; line-height:1.6; letter-spacing:-0.048px; transition:all 0.5s; }
.main_visual .txt_box.white_type .tit {color:#fff; }
.main_visual .txt_box.white_type .desc {color:#b1b1b1; }

@media all and (max-width:767px){

    .main_visual .swiper-slide img.pc_img {display:none; }
    .main_visual .swiper-slide img.mo_img {display:block; }

    .main_visual .arrow {display:none; width:30px; height:30px; }
    .main_visual .arrow img {width:80%; }
    .main_visual .arrow.prev {left:10px; }
    .main_visual .arrow.next {right:10px; }
    .main_visual .pagination {display:block; }

    .main_visual .txt_box {left:20px; top:33%; }
    .main_visual .txt_box .tit {font-size:37px !important; }
    .main_visual .txt_box .tit br.mo_ver {display:block; }
    .main_visual .txt_box .desc {display:none; }
}


/* contact */
.contact_cont {padding:80px 0; }

.contact_cont .contact_top {display: flex; gap:60px;}

.contact_top .title_wrap h3 {font-size: 32px;font-weight: 500;}
.contact_top .title_wrap p {margin-top: 20px;line-height: 140%;font-size: 14px;}

.contact_cont .contact_area {display:flex; align-items:center;flex:1;}
.contact_cont .contact_area .form_area {display:flex; flex-direction:column; gap:40px; width:100%; }
.contact_cont .contact_area .form_box .txt {margin-bottom:15px; font-size:14px;; font-weight:600; letter-spacing:-0.054px; }
.contact_cont .contact_area .select_box,
.contact_cont .contact_area .form_box input {width:100%; height:56px; padding:16px 20px;  border:1px solid rgba(0,0,0,0.1); font-size:16px; letter-spacing:-0.048px; backgtransition:all 0.3s; }
.contact_cont .contact_area .form_box input:focus { border:1px solid rgba(0,0,0,0.4); outline:none; }
/* .contact_cont .contact_area .form_box input + input {margin-top:10px; } */

.contact_cont .contact_area .form_box textarea {
    width:100%;
    height:180px; /* 높이 키움 */
    padding:16px 20px;
    border:1px solid rgba(0,0,0,0.1);
    font-size:16px;
    font-family:inherit;
    letter-spacing:-0.048px;
    transition:all 0.3s;
    resize:none; /* 크기 조정 막기 */
    line-height:1.6;
    box-sizing:border-box;
}

.contact_cont .contact_area .form_box textarea:focus {
    border:1px solid rgba(0,0,0,0.4);
    outline:none;
}

.contact_cont .contact_area .form_box textarea::placeholder {
    color:rgba(0,0,0,0.50);
}

.contact_cont .contact_area .form_box input + textarea,
.contact_cont .contact_area .form_box textarea + input,
.contact_cont .contact_area .form_box textarea + textarea {
    margin-top:10px;
}

.contact_cont .contact_area .form_box .form_double {display: flex;flex-wrap:wrap;gap:10px;margin-bottom: 10px;}
.contact_cont .contact_area .form_box .form_double > *  {width: calc( 50% - 5px );}

.marketing_select {display:flex; gap:10px; }
.marketing_select input {display:none; }
.marketing_select label {display:block; padding:16px; font-size:14px; font-weight:500; letter-spacing:-0.048px; color: #818181; background: #f2f2f2; transition:all 0.3s; cursor:pointer; }
.marketing_select input:checked + label {color:#fff; background-color:#14116E;}

.contact_cont .contact_area .select_box {position:relative; display:flex; align-items:center; gap:4px; flex-wrap:wrap; min-height:56px; height:auto; padding:10px 44px 10px 20px; cursor:pointer; }
.contact_cont .contact_area .select_box:before {content:''; position:absolute; right:20px; top:calc(50% - 12px); width:24px; height:24px; background:url('../img/select_arrow.svg') no-repeat center center; }

.contact_cont .contact_area .select_box .tag {display:flex; gap:4px; align-items:center; padding:10px 12px 9px 16px; font-size:14px; letter-spacing:-0.042px; border-radius: 50px; background: rgba(255, 255, 255, 0.20); }
.contact_cont .contact_area .select_box .tag img {display:block; }

.contact_cont .contact_area .inquiry_btn {width:100%; height:56px; font-size:16px; color:rgba(255,255,255,0.8); font-weight:700; letter-spacing:-0.048px; background: rgba(44, 41, 151, 0.70); cursor:pointer; transition:all 0.3s; }
.contact_cont .contact_area .inquiry_btn:hover {color:#fff; background: #2C2997;}

.contact_cont .policy_box {display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.contact_cont .policy_box .check_box input {display:none; }
.contact_cont .policy_box .check_box label {display:flex; align-items:center; gap:5px; font-size:16px; letter-spacing:-0.048px; cursor:pointer; }
.contact_cont .policy_box .check_box label:before{content:''; display:block; width:20px; height:20px; border:1px solid #111; border-radius:50%; }
.contact_cont .policy_box .check_box input:checked + label:before {background:url('../img/contact_check.svg') no-repeat center center; }
.contact_cont .policy_box button {display:flex; align-items:center; font-size:14px; color:rgba(0,0,0,0.6);  cursor:pointer; }
.contact_cont .policy_box button:after {content:''; display:block; width:20px; height:20px; background:url('../img/select_arrow.svg') no-repeat center center; transform:scale(0.8); opacity:0.6; }

.policy_modal .modal_body .tit {margin-bottom:20px; }
.policy_modal .policy_area {overflow-y:auto; width:100%; height:300px; color:#383838; font-size:14px; font-weight:500; line-height:1.6; letter-spacing:-0.042px;padding-right:12px;}
.policy_modal .policy_area::-webkit-scrollbar{width:4px;height:8px; background:#d9d9d9;}
.policy_modal .policy_area::-webkit-scrollbar-thumb{cursor:pointer;background:#bbb; border-radius:10px; }

@keyframes circle {
    0% {left:20px; }
    100% {left:100%; }
}


.modal {z-index:1000; position:fixed; left:0; top:0; opacity:0; visibility:hidden; display:flex; align-items:center; justify-content:center; width:100%; height:100%; background: rgba(30, 29, 42, 0.50); transition:all 0.3s; }
.modal.open {visibility:visible; opacity:1; }
.modal_wrap {width:600px; max-width:90%; height:auto; background-color:#fff;}
.modal_body {padding:40px; }
.modal_body .tit {display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.modal_body .tit h4 {font-size:20px; font-weight:700; color:#383838; letter-spacing:-0.06px; }
.modal_body .tit button {cursor:pointer; }

.modal_body .one_select {display:flex; flex-direction:column; gap:16px; }
.modal_body .one_select input {display:none; }
.modal_body .one_select label {display:flex; align-items:center; justify-content:center; height:50px; font-size:16px; font-weight:500; letter-spacing:-0.048px; color: rgba(20, 17, 110, 0.60); border-radius: 3px; border: 1px solid rgba(20, 17, 110, 0.30); background: rgba(20, 17, 110, 0.04); transition:all 0.3s; cursor:pointer; }
.modal_body .one_select input:checked + label {color:#fff; background: #14116E;}

.modal_wrap .confirm_btn {width:100%; height:56px; padding:16px 20px;  font-size:16px; font-weight:700; color:#fff; background-color:#2c2997; cursor:pointer; }


@media all and (max-width:1024px){
    .contact_cont {display:block; height:auto; }
    .contact_cont .left_box,
    .contact_cont .contact_area {width:100%; padding:120px 5%; }
    .contact_cont .left_box {gap:50px; }
}

@media all and (max-width:767px){
    .contact_cont .left_box,
    .contact_cont .contact_area {width:100%; padding: 30px 0 20px; }

    .contact_cont .tit_box .icon_area {width:135px; }
    .contact_cont .tit_box .icon_area svg {width:20px; height:20px; }
    .contact_cont .tit_box h3 {font-size:40px; }
    .contact_cont .tit_box p {width:440px; margin-top:25px; font-size:14px; }

    .contact_cont .info_box {gap:10px; }
    .contact_cont .info_box a, 
    .contact_cont .info_box p {font-size:12px; }

    .contact_cont .contact_area .form_box .txt {margin-bottom:10px; font-size:16px; }
    .contact_cont .contact_area .select_box, 
    .contact_cont .contact_area .form_box input {height:46px; padding:10px 15px; font-size:14px; }
    .contact_cont .contact_area .select_box {min-height:46px; height:auto; padding:10px 25px 10px 15px; }
    .contact_cont .contact_area .select_box:before {right:5px; }
    .contact_cont .contact_area .form_box textarea {font-size: 14px;}
    .contact_cont .policy_box .check_box label {font-size: 14px;}

    .contact_cont .contact_area .form_area {gap:35px; }

    .contact_cont .contact_area .select_box .tag {padding:7px 10px 7px 12px; font-size:12px; }

    @keyframes circle {
        0% {left:8px; }
        100% {left:100%; }
    }


    .modal_body {padding:20px; }
    .modal_body .tit {margin-bottom:30px; }
    .modal_body .marketing_select {gap:6px; }
    .modal_body .marketing_select label {padding:9px 16px; font-size:13px; }
    .modal_body .one_select {gap:6px; }
    .modal_body .one_select label {height:45px; font-size:14px; }
    .modal_wrap .confirm_btn {height:48px; }
}

.contact_cont .map_box {z-index:5; position:relative; }
.contact_cont .map_box #map {height:360px; margin-top: 60px;}
.contact_cont .txt_box div:first-child {margin-top: 60px;}
.contact_cont .txt_box div {margin-bottom: 20px;}
.contact_cont .txt_box h5 {font-size:14px; font-style:italic; color:#000; font-weight:400;margin-bottom: 10px;}
.contact_cont .txt_box p {font-size:15px; color:#000; font-weight:300; line-height:1.5;margin-top: 0;}
.contact_cont .txt_box a {display:flex; align-items:center; gap:5px; font-size:15px; color:#111; font-weight:300; margin-top: 4px; transition: all 0.3s;}
.contact_cont .txt_box a:after {content:''; width:24px; height:24px; background:url('../img/icon/link_arrow_dark.svg') no-repeat center center;}
.contact_cont .txt_box a:hover {gap:12px;}

@media all and (max-width:767px){
    .contact_cont {padding:30px 0; }
    .contact_cont .map_box #map {height:260px; }
    .contact_cont .txt_box {padding:20px 0 10px; }
    .contact_cont .contact_top {padding: 60px 20px;flex-direction: column;padding: 0;gap:0;}
    .contact_cont .contact_top .title_wrap h3 {font-size: 20px;font-weight: 500;}
    .contact_cont .txt_box div:first-child {margin-top: 0;}
}


/* about */
.about_con01 {padding:50px 40px 150px; }
.about_con01 .inner {padding:0; }
.about_con01 .img_box {width:100%; }
.about_con01 .img_box img {display:block; width:100%; }
.about_con01 .txt_box {display:grid; grid-template-columns:1fr 1.2fr; gap:100px; margin-top:50px; }
.about_con01 .txt_box .ko,
.about_con01 .txt_box .en {font-size:15px; line-height:1.5; letter-spacing:-0.45px; }
.about_con01 .txt_box .en {font-style:italic; font-weight:300; color: #B1B1B1;}

@media all and (max-width:767px){
    .about_con01 {padding:30px 20px 50px; }
    .about_con01 .txt_box {grid-template-columns:1fr; gap:15px; margin-top:20px; }
    .about_con01 .txt_box .ko, 
    .about_con01 .txt_box .en {font-size:14px; }
}


/* work */
.work_cont {padding:50px 0 0; }

.work_filter {z-index:10; position:relative; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 40px; margin-top: 30px;}
.work_filter .filter_box {display:flex; align-items:center; gap:10px 40px; flex-wrap:wrap; }
.work_filter .filter_box h5 {font-size:14px; font-weight:300; letter-spacing:-0.42px; }

.work_filter .filter_box .select_area {display:flex; align-items:center; gap:15px; flex-wrap:wrap;}
.work_filter .filter_box .select_area .selected {padding:10px 14px; font-size:14px; font-weight:300; color:#fff; cursor:pointer; border-radius:50px; background-color:#000; }
.work_filter .filter_box .select_area .select_box {display: flex; align-items:center; gap:4px;}
.work_filter .filter_box p input[type="radio"] {display:none; }
.work_filter .filter_box p input[type="radio"] + label {padding:10px 14px; font-size:14px; font-weight:300; color:#000; cursor:pointer; border-radius:50px; }
.work_filter .filter_box p input[type="radio"]:checked + label {color:#fff; background-color:#000; }

.work_filter .list_type {display:flex; align-items:center; gap:8px; }
.work_filter .list_type a {position:relative; padding:10px 14px; font-size:14px; font-weight:300; border-radius:50px; }
.work_filter .list_type a.active {color:#fff; background-color:#000; }

@media all and (min-width:768px){
    .work_filter .filter_box .select_area .select_box {display:flex !important; }
}
@media all and (max-width:767px){
    .work_filter {padding:10px 20px; }
    .work_filter .filter_box {gap:5px; }
    .work_filter .filter_box h5 {display:none; }

    .work_filter{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
    .work_filter::-webkit-scrollbar{display:none;}
    .filter_box{display:flex;flex-wrap:nowrap;width:max-content;min-width:100%}
    .filter_box > *{flex:0 0 auto;white-space:nowrap}

    /* .work_filter .filter_box .select_area .selected {display:block; } */
    /* .work_filter .filter_box .select_area .select_box {position:absolute; left:20px; top:100%; overflow-y:auto; display:none; width:calc(100% - 40px); max-height:50dvh; padding:10px; background-color:#fff; }
    .work_filter .filter_box .select_area .select_box p input[type="radio"] + label {display:block; padding:10px 0; text-align:center; }
    .work_filter .filter_box .select_area .select_box p input[type="radio"]:checked + label {color:#000; background-color:transparent; font-weight:500;} */

    .work_filter .list_type {gap:5px; }
    .work_filter .list_type a {padding-left:15px; font-size:14px; }
    .work_filter .list_type a:before {top:calc(50% - 4px); width:8px; height:8px; }
}

/* .cursor_img {position:fixed;opacity:0; width:150px;height:150px;user-select: none;pointer-events: none;-webkit-user-drag: none;z-index: 10000;cursor: none;background-image: url('../img/icon/cursor.png'); background-size:100% 100%; transition: opacity 0.2s ease;} */

@media all and (max-width:767px){
    .cursor_img {opacity:0 !important; }
}
.work_list {display:flex; flex-direction:column; align-items:flex-start; transform-origin:50% 350px; }
.work_item {display:block; width:982px; margin:0 auto; transition:all 0.6s; }
.work_item + .work_item {margin-top:30px; }
.work_item .swiper-slide {width:auto; }
.work_item .swiper-slide > div:not(.item_info) {cursor:pointer; }
.work_item .item_info {display:flex; flex-direction:column; justify-content:space-between; width:380px;}
.work_item .item_info .top_info {display:flex; align-items:flex-start; justify-content:space-between; flex-direction: column;}
.work_item .item_info .top_info .cate {font-size:14px; color:#000; font-weight:300;margin-bottom: 12px;}
.work_item .item_info .top_info .tit p {margin-bottom:10px; font-size:16px; color:#000; font-weight:300; }
.work_item .item_info .top_info .tit i {display:block; margin-bottom:18px; text-transform:uppercase; font-size:14px; color:#B1B1B1; font-weight:200; line-height:1.4; }
.work_item .item_info .bottom_info {position:absolute; bottom:0; left:-50px; visibility:hidden; opacity:0; z-index:-999; overflow-y:auto; width:100%; max-height:calc(100% - 125px); }
.work_item .item_info .bottom_info dl {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:5px 1px; }
.work_item .item_info .bottom_info dl dt {flex-shrink:0; font-size:13px; color:#000; font-weight:300; }
.work_item .item_info .bottom_info dl dd {font-size:13px; color:#000; font-weight:300; }
.work_item .img_box img {display:block; width:527px; height:100%; }
.work_item .txt_box {font-size:14px; line-height:1.4; font-weight:300; word-break:break-all; padding: 0 30px 0 0;word-break: keep-all;}
.work_item .txt_box pre {font-family:"Noto Sans", "Pretendard", sans-serif; white-space:break-spaces}

.work_item .swiper-slide {display:none; margin-right:20px; transition:all 0.6s; }
.work_item .swiper-slide:nth-of-type(1),
.work_item .swiper-slide:nth-of-type(2) {display:block; }

/* .work_item.active * {cursor:none; } */
.work_item.active {width:100%; padding:30px 0; }
.work_item.active .swiper-slide { display:block; }
.work_item.active .item_info {overflow-y:auto; height:100%; }
.work_item.active .item_info .bottom_info {left:0; visibility:visible; opacity:1; z-index:10; transition:all 0.5s; transition-delay:0.8s; }
.work_item.active .img_box img {width:auto; }

.work_mo_grid {display:none; grid-template-columns:repeat(1,1fr); gap:0; }
.work_mo_grid .work_box {float:none; width:100%; }
.work_mo_grid .work_box_mo {float:none; width:100%; }
.work_mo_grid .click_box {display:none; padding:35px 0; }
.work_mo_grid .click_box dl {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:5px 1px; }
.work_mo_grid .click_box dl dt {flex-shrink:0; font-size:14px; color:#000; font-weight:300; font-style:italic; }
.work_mo_grid .click_box dl dd {font-size:14px; color:#000; font-weight:300; }
.work_mo_grid .img_slide {position:relative; width:100%; padding-bottom:20px; }
.work_mo_grid .img_slide .img_box img {display:block; }
.work_mo_grid .img_slide .txt_box {padding-bottom:40px; font-size:14px; line-height:1.4; font-weight:300; word-break:break-all; }
.work_mo_grid .img_slide .txt_box pre {font-family:"Noto Sans", "Pretendard", sans-serif; white-space:break-spaces}
.work_mo_grid .img_slide .pager {position:absolute; left:0; top:auto; bottom:0; width:100%; height:2px; background-color:#4E6378; border-radius:5px; }
.work_mo_grid .img_slide .pager .swiper-pagination-progressbar-fill {background-color:#eee; border-radius:5px; }

@media all and (max-width:1024px){
    .work_item {width:670px; }
    .work_item .item_info {width:300px; }
    .work_item .img_box img {width:330px; }
}
@media all and (max-width:767px){
    .work_list.pc_ver {display:none; }
    .work_mo_grid {display:block; }
    .work_mo_grid .click_box .txt_box {padding:25px 0; }
    .work_mo_grid .txt_box {display: flex;justify-content: space-between;flex-direction: row-reverse;margin-bottom: 24px;}
}

#loadingContainer{
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #ffffffc1;
    z-index: 999;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transition: opacity 0.3s ease;
}

#loadingContainer.hide{
    opacity: 0;
    pointer-events: none;
}

/* grid */
.work_grid {display:grid; grid-template-columns:repeat(3,1fr); gap:20px; } 
.work_box {margin-bottom:50px; cursor:pointer; }
/* .grid_sizer,
.work_box {width:calc(33.33% - 14px); }
.work_box {float:left; margin-bottom:50px; cursor:pointer; } */

.work_box .txt_box .cate {font-size:14px; color:#000; font-weight:300;margin-top: 12px;}
.work_box .txt_box .tit {margin-top:12px; text-align:left; }
.work_box .txt_box .tit p {margin-bottom:10px; font-size:16px; color:#000; font-weight:400; }
.work_box .txt_box .tit i {display:block; font-size:14px; color:#B1B1B1; font-weight:200; line-height:1.4; text-transform:uppercase; }
.work_box .txt_box .tit i + i {margin-top:20px; }
.work_box .img_box {aspect-ratio: 1/1; background-color:#000; }
.work_box .img_box img {display:block; width:100%; height: 100%; object-fit: cover;}
/* 영상 전체 보이는 버전 */
.work_box .img_box video {display:block; width:100%; height: 100%; object-fit: contain;}
/* 영상 좌우 짤리는 버전 */
/* .work_box .img_box video {display:block; width:100%; height: 100%; object-fit: contain;} */

.work_box_mo .txt_box .cate {font-size:14px; color:#000; font-weight:300; }
.work_box_mo .txt_box .tit {margin-top:17px; text-align:left; }
.work_box_mo .txt_box .tit p {margin-bottom:10px; font-size:16px; color:#000; font-weight:400; }
.work_box_mo .txt_box .tit i {display:block; font-size:14px; color:#B1B1B1; font-weight:200; line-height:1.4; text-transform:uppercase; }
.work_box_mo .txt_box .tit i + i {margin-top:20px; }
.work_box_mo .img_box {margin-top:35px; }
.work_box_mo .img_box img {width:100%; }

.work_detail_modal {z-index:-9999; position:fixed; left:0; top:0; opacity:0; visibility:hidden; overflow-y:auto; overflow-x:hidden; width:100%; height:100%; padding:84px 40px 40px; background-color:#fff; }
.work_detail_modal.open {z-index:20; opacity:1; visibility:visible; transition:opacity 0.5s; }
.work_detail_modal .modal_close_btn {position:absolute; left:40px; top:72px; display:flex; align-items:center; gap:8px; font-size:16px; color:#9E9E9E; font-weight:300; }
.work_detail_modal .work_detail.mo_ver {display:none; }
.work_detail_modal .work_detail.pc_ver {display:flex; align-items:center; height:100%; padding-top:30px; }
.work_detail_modal .work_detail .work_item {display:block; padding:0; }
.work_detail_modal .work_detail .work_item .swiper-slide > div {height:calc(80dvh - 100px); }
.work_detail_modal .work_detail .img_box video {width:100%; height:100%; object-fit: cover;}
.work_detail_modal .work_mo_grid .click_box {display:block; }


@media all and (max-width:767px){
	.work_grid {grid-template-columns:repeat(2,1fr); gap:15px;}
	.work_box {margin-bottom:40px; }
    /* .grid_sizer,
    .work_box {width:calc(50% - 7.5px); }
    .work_box {margin-bottom:40px; } */

    .work_box .txt_box .tit {margin-top:15px; }
    .work_box .txt_box .tit p {margin-bottom:13px; }
    .work_box .img_box {margin-top:15px; }
    
    .work_box_mo .txt_box .tit {margin-top:15px; }
    .work_box_mo .txt_box .tit p {margin-bottom:13px; }

    .work_detail_modal {padding:20px; padding-top:70px; }
    .work_detail_modal.open {z-index:101; }
    .work_detail_modal .modal_close_btn {left:20px; top:20px; font-size:14px; }
    .work_detail_modal .modal_close_btn img {width:30px; }
    .work_detail_modal .work_detail.pc_ver {display:none; }
    .work_detail_modal .work_detail.mo_ver {display:block; }
    .work_detail_modal .work_detail video {height:auto; object-fit: contain;}
}


/* business */
.busi_banner {margin:80px 0 0; }
.busi_banner .txt_box {min-height:600px; padding:30px; font-size:15px; color:#fff; font-weight:300; line-height:1.5; background:url('../img/business_banner.png') no-repeat center center / cover; }
.busi_banner .txt_box b {font-weight:600; }

@media all and (max-width:767px){
    .busi_banner {margin:40px 0 0; }
    .busi_banner .txt_box {min-height:400px; padding:20px 40% 20px 20px; font-size:13px; }
}

.busi_con01 dl {padding:100px 0; }
.busi_con01 dl + dl {border-top:1px solid #EAEAEA; }
.busi_con01 dl dt {font-size:15px; line-height:1.5; }
.busi_con01 dl dt b {font-weight:700; }
.busi_con01 dl dt p {margin-top:25px; }
.busi_con01 dl dd {display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:40px; }
.busi_con01 dl dd img {display:block; }

@media all and (max-width:767px){
    .busi_con01 dl {padding:40px 0; }
    .busi_con01 dl dd {grid-template-columns:1fr; margin-top:20px; }
}

.business {padding: 80px 40px;}
.business .title_wrap h3 {font-size: 32px;font-weight: 500;}
.business .title_wrap p {margin-top: 20px;line-height: 140%;font-size: 14px;}
.business .title_wrap p:last-child {color: #B1B1B1;}

.business .busi_box {display: flex;justify-content: center;gap:60px;align-items: center;margin-top: 100px;}
.business .busi_box:nth-child(2) {justify-content: flex-start;padding-right: 4%;flex-direction: row-reverse;}
.business .busi_box:nth-child(3) {padding-left: 12%;}
.business .busi_box > * {max-width: 460px;}
.business .busi_box .busi_img {aspect-ratio: 1/1;}
.business .busi_box .busi_img img {width: 100%;height: 100%;object-fit: cover;}
.business .busi_box .busi_txt b {font-size: 18px;}
.business .busi_box .busi_txt p {font-size: 14px;margin-top: 20px;line-height: 150%;word-break: keep-all;}
.business .end h3 {font-size: 32px;font-weight: 500; margin-top: 80px;text-align: right;}

@media all and (max-width:767px){
    .business {padding: 60px 20px;}
    .business .title_wrap h3 {font-size: 20px;font-weight: 500;}
    .business .busi_box {margin-top: 60px;gap:20px;flex-direction: column;align-items: flex-start;}
    .business .busi_box:nth-child(2) {flex-direction: column;align-items: flex-end;padding-right: 0;}
    .business .busi_box:nth-child(3) {padding-left: 0;align-items: center;}
    .business .busi_box > * {max-width: 80%;}
    .business .end h3 {font-size: 20px;}
    
}
