@import url("reset.css");
@import url("slick.css");

:root{
    --padding:20px;
    --header_h:80px;
    --width:1510px;
    --point-color-1:#df3d6e;
    --font:"VeraHumana95", serif;
    --font2:"VeraHumana95", serif;
}

@media screen and (max-width: 960px){
:root{
    --header_h:48px;
}
}

[data-delay] {position: relative; transition: opacity 1s ease, left 1s ease, right 1s ease, top 1s ease, bottom 1s ease; opacity:0;}
[data-direction="left"]{left:-40px;}
[data-direction="right"]{right:-40px;}
[data-direction="top"]{top:-40px;}
[data-direction="bottom"]{bottom:-40px;}
.section_on [data-delay]{opacity:1;}
.section_on [data-direction="left"]{left:0;}
.section_on [data-direction="right"]{right:0;}
.section_on [data-direction="top"]{top:0;}
.section_on [data-direction="bottom"]{bottom:0;}



/* header */
.header{position:fixed; left:0; top:0; padding:0 3%; width:100%; height:var(--header_h); z-index:1001111; display:flex; align-items: center; box-sizing:border-box;}
.header::before {
	content:''; display: block; z-index: -1;
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000; transition: transform 0.5s; transform: scaleY(0); transform-origin: center top;
}
.header .logo{max-width: 105px;}
.header .right_area{margin-left:auto; display:flex; align-items: center;}
.gnb>ul{display:flex; gap:45px;}
.gnb>ul>li>a{font-size:1.25rem; color:#fff; font-family:var(--font); font-weight:400; transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.language{position:relative; margin-left:50px;}
.language_open{position:relative; padding:0 35px 0 15px; height:48px; font-size:1rem; color:#fff; font-family:var(--font); font-weight:400;  border: 1px solid #fff; border-radius:2em; box-sizing:border-box;}
.language_open:before{position:absolute; right:14px; top:50%; width:6px; aspect-ratio:6/12; background-image:url(/asset/vendor/arrow.svg); background-size:contain; background-repeat:no-repeat; background-position:center; transform:translateY(-50%) rotate(90deg); display:block; content:"";}
.language_list{position:absolute; left:0; top:48px; padding-top:5px;  z-index:10; width:100%; display:none;}
.language_list ul{padding:10px 0;  width:100%; background-color:#fff; z-index:100;  border-radius:20px;}
.language_list ul li{text-align:center; }
.gnb_close,
.menu_btn{display:none;}

.header.black_theme,
.header.black_theme.scroll{background-color:#fff;}

.header.black_theme .logo a,
.header.black_theme.scroll .logo a {
    width: 105px;
    height: 25px;
    background: url(/asset/vendor/logo_bk.svg) no-repeat center center;
    background-size: contain;
    display: block;
}
.header.black_theme .logo img,
.header.black_theme.scroll .logo img{display:none;}
.header.black_theme .gnb>ul>li>a,
.header.black_theme.scroll .gnb>ul>li>a{color:#000;}
.header.black_theme .gnb.active>ul>li>a,
.header.black_theme.scroll .gnb.active>ul>li>a{color:#fff;}



.header.scroll::before{transform: scaleY(1);}

@media screen and (max-width: 960px){
.menu_btn{position:relative; display:block; width:40px; aspect-ratio: 1/1;}
.menu_btn span{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:80%; height:2px; background-color:#fff; display:block;  border-radius:2em; transition: all 0.3s ease-out; }
.menu_btn span:before{position:absolute; top:50%; left:50%; margin-top:-10px; transform:translateX(-50%); width:100%; height:2px; background-color:#fff; display:block;  border-radius:2em;z-index:10; content:"";}
.menu_btn span:after{position:absolute; top:50%; left:50%; margin-top:10px; transform:translateX(-50%); width:100%; height:2px; background-color:#fff; display:block;  border-radius:2em;z-index:10; content:"";}
.header.black_theme .menu_btn span:after,
.header.black_theme .menu_btn span:before,
.header.black_theme .menu_btn span{background-color:#000;}
.gnb{position:fixed; right:-110vw; top:0; padding:102px 30px 0; width:100vw; height:100vh; background-color:#000; z-index:100;  transition: all 0.3s ease-out;}
.gnb>ul{flex-direction: column; gap:20px;}
.gnb>ul>li{opacity:0; transform:translateY(30px); transition: transform 0.35s ease-out, opacity 0.35s ease-out;}
.gnb>ul>li>a{font-size:5vw; color:#fff; }
.gnb.active{right:0;}
.gnb.active>ul>li{opacity:1; transform:translateY(0);}
.gnb.active>ul>li:nth-child(1){transition-delay:0.2s;}
.gnb.active>ul>li:nth-child(2){transition-delay:0.4s;}
.gnb.active>ul>li:nth-child(3){transition-delay:0.6s;}
.gnb.active>ul>li:nth-child(4){transition-delay:0.8s;}
.gnb.active>ul>li:nth-child(5){transition-delay:1s;}
.gnb_close{position:absolute; right:30px; top:30px; width:40px; aspect-ratio: 1/1; background-color:transparent; border:none; cursor:pointer; display:block;}
.gnb_close:before{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(45deg); width:80%; height:2px; background-color:#fff; display:block;  border-radius:2em; transition: all 0.3s ease-out; content:"";}
.gnb_close:after{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(-45deg); width:80%; height:2px; background-color:#fff; display:block;  border-radius:2em; transition: all 0.3s ease-out; content:"";}
.language_open{margin:0 20px 0 0; height:36px; line-height:34px;}
}

@media screen and (max-width: 768px){
    .gnb>ul>li>a{font-size:8vw;}

}

.main-section-1{
	position:relative; min-height:100vh; padding-bottom: 1px; display:flex; align-items: center; box-sizing: content-box; overflow: hidden;
	background-color: #000;
}
.main-section-1 .bg {
	position: absolute;
	width: 100%; height: 100%;
	inset: 0;
	z-index: 0;
}

.main-section-1 .bg iframe {
	position: absolute;
	top: 50%;
	right: 0;
	/* left: 50%; */
	/* transform: translate(-50%, -50%); */
	transform: translateY(-50%);
	width: 100vw;
	height: 56.25vw;
	min-width: 177.77vh;
	min-height: 100vh;
	pointer-events: none;
}
.main-section-1 .cont{padding:0 3%; max-width:100%; width:100%; box-sizing:border-box; position: relative; z-index: 1;}
.main-section-1 .txt span{font-size:min(50px, 2vw); color:#fff; font-family:'Utah'; font-weight:300; line-height:2; opacity:0.5; display:block; }
.main-section-1 .txt strong{font-size:min(90px, 4.6875vw); color:#fff; font-family:var(--font2); font-weight:400; line-height:1; display:block; }
.main-section-1 .btm_txt{position:absolute; right:3%; bottom:70px;  font-size:1rem; color:#fff;  font-weight:400; line-height:1.75; opacity:0.5; letter-spacing:-0.04em;
    font-family: var(--font2);
}

.video_area{position:relative;  aspect-ratio: 16/9;}
.video_area:before{position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; display:block; content:"";}
.video_area iframe{position:absolute; top:0; left:0; z-index:1; width:100%; height:100%;}
/* .video_area.is-out:before{background-color:#000;} */
.main-section-2{background-color:#000;}


.main-section-3{padding:calc(60px*1.33) 0;box-sizing: border-box;}
/* .main-section-3:before{position:absolute; left:0; top:0; z-index:31;display:block; content:"";background-color: #fff;height: 2px;width: 100%;} */
.main-section-3 h1{padding:0 3%; margin-bottom:70px; font-size:3rem; font-family:var(--font2); font-weight:400; line-height:1.2; display:block; }
.main-section-3 ul{display:flex; flex-wrap:wrap; }
.main-section-3 ul li{width:50%; }
.main-section-3 ul li .video_area{position:relative;  width:100%;}
.main-section-3 ul li .video_area:before{
    content: '';
    display: block;
    /* padding-bottom: calc(540 / 960 * 100%); */
}
.main-section-3 ul li .video_area img{position:absolute; top:0; left:0; z-index:4; width:100%; height:100%; object-fit:cover;}
.main-section-3 ul li .video_area iframe{position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; object-fit: cover;}
.main-section-3 ul li .video_area.is-playing img{display:none;}
.main-section-3 ul li .txt_area{
    padding:35px 6.25% 50px;
    position: relative;
    z-index: 123123;
}
.main-section-3 ul li .txt_area .category{font-size:1rem; font-family: var(--font); font-weight:400; line-height:1.75; opacity:0.6; letter-spacing:-0.04em; display:block;}
.main-section-3 ul li .txt_area .name{
	font-size:2.2rem; font-family: var(--font);
	/* font-weight:700; */
}
.main-section-3 ul li .txt_area .txt{font-size:1.3rem; color:rgba(0, 0, 0, 0.7); font-family: var(--font);font-weight: 300;margin-top: -5px;}
.main-section-3 .view_more{padding:50px 3% 0; text-align:center;}
.main-section-3 .view_more a{width:400px; height:80px; line-height:80px; border: 1px solid #000; border-radius:2em; box-sizing:border-box; font-size:1.25rem; font-family:var(--font2); font-weight:400; letter-spacing:-0.04em; display:inline-block; box-sizing:border-; transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;}
.main-section-3 .view_more a:hover{background-color:#000; color:#fff; transform:translateY(-2px);}

.main-section-4{padding:calc(60px*1.33) 0; border-top: 1px solid #ddd; }
.main-section-4 .main_title{padding:0 3%; margin-bottom:calc(60px*1.33);  line-height:1.2; display:block; }
.main-section-4 .main_title h1{font-size:3.375rem; font-family:var(--font2);line-height:1;}
.main-section-4 .main_title p{margin-top:15px; font-size:1.6rem; font-weight:400; line-height:1.42; letter-spacing:-0.04em;font-family: var(--font);}
.main-section-4 .faq .question{margin:0 3%; padding:50px 0; display:flex; border-bottom:1px solid #ddd; align-items: center; transition: all 0.3s ease-out; cursor:pointer;}
.main-section-4 .faq .question .title{position:relative;  font-size:2.75rem; font-weight:400; line-height:1.2; display:block;font-family: var(--font); }
.main-section-4 .faq .question .title:after{position:absolute; right:0; top:50%; width:40px; aspect-ratio: 1/1; background:url(../img/arrow2.svg) no-repeat center center; display:block; content:""; background-size:100%; transform:translateY(-50%); opacity:0; visibility: hidden; transition: all 0.3s ease-out;}

.main-section-4 .faq .question .category{margin-left:auto; font-size:1.2rem; line-height:1.75; letter-spacing:-0.04em; display:block; color:#555; transition: all 0.3s ease-out;font-weight: 400;}
.main-section-4 .faq .answer{padding:50px 3%; border-bottom:1px solid #ddd; background-color:#eee;  display:none;}
.main-section-4 .faq .answer p{font-size:1.6rem; font-weight:400; line-height:calc(38/30); letter-spacing:-0.04em; color:#555555;font-family: var(--font);}
.main-section-4 .faq .answer p span{
    font-family: 'Pretandard';font-size: 1.1rem;display: block;
    line-height: 1.5;
    margin-top: 20px;
    word-break: keep-all;
}

.main-section-4 .faq .answer ._list{
    font-family: var(--font);
}
.main-section-4 .faq .answer ._list p{
    font-size: 1.5rem;
    color: #000;
    margin-top: 1.8rem;
    margin-bottom: 0.85em;
}
.main-section-4 .faq .answer ._list ul li{
    font-size: 1.25rem;
    display: flex;align-items: flex-start;gap: 4px;
    color: #444444;
}
.main-section-4 .faq .answer ._list ul li em{}




.main-section-4 .faq .on{background-color:#eee;}
.main-section-4 .faq .on .question{margin:0 5%; padding-bottom:24px; border-bottom:none;}
.main-section-4 .faq .on .question .title{width:100%;}
.main-section-4 .faq .on .question .title:after{opacity:1; visibility: visible; }
.main-section-4 .faq .on .category{display:none;}
.main-section-4 .faq .answer .answer_title{margin-bottom:20px; font-size:1.75rem;font-family: 'Pretandard'; font-weight:500; line-height:1.2; color:#222;}
.main-section-4 .faq .on .answer{padding:0 5% 60px; }

.main-section-5{padding:0 3% calc(60px*1.33); }
.main-section-5 h1{font-size:4.375rem; font-family:var(--font2); font-weight:400; line-height:1;}
.main-section-5 .main_title{margin-bottom:50px; display:flex; align-items: center; justify-content: space-between;}
.main-section-5 .more{margin-left:auto;}
.main-section-5 .more a{padding:9px 40px; font-size:1.25rem; font-family:var(--font2); font-weight:400; letter-spacing:-0.025em; display:inline-block; color:#000; border:1px solid rgba(0,0,0,0.5); border-radius:2em; transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;}
.main-section-5 .more a:hover{background-color:#000; color:#fff; border-color:#000; transform:translateY(-2px);}
.main_news_list{position:relative; transition: all 0.3s ease-out;}
.main_news_list.swiper{margin:0 -14px;}
.main_news_list .swiper-slide{box-sizing:border-box; padding:45px 30px; background-color:#000; }
.main_news_list .date{font-size:1rem; font-weight:500; color:#fff; letter-spacing:-0.04em; display:block; opacity:0.5;}
.main_news_list .tit{margin-top:12px; font-size:1.5rem; font-weight:500; color:#fff; letter-spacing:-0.04em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;}
.main_news_list .img_area{margin-top:35px; aspect-ratio: 370/260;}
.main_news_list .img_area img{width:100%; height:100%; object-fit:cover;}
.main-section-5 .control{margin-top:30px; position:relative; display:flex; gap:4px; }
.main-section-5 .control .arrow-prev,
.main-section-5 .control .arrow-next{width:16px; aspect-ratio: 1/1; background-color:transparent; background-repeat:no-repeat; background-position:center; background-size:contain; text-indent:-9999px; overflow:hidden; cursor:pointer;}
.main-section-5 .control .arrow-prev{background-image:url("/asset/vendor/main_rolling_prev.png");}
.main-section-5 .control .arrow-next{background-image:url("/asset/vendor/main_rolling_next.png");}

@media screen and (max-width: 820px){
	.main_news_list.swiper{margin:0;}
}

@media screen and (max-width: 768px){
    .main-section-1 .cont{padding:0 5%;}
    .main-section-1 .txt span{font-size:4.5vw;}
    .main-section-1 .txt strong{
        /* font-size:9.6vw; */
        font-size:6vw;
    }
    .main-section-1 .btm_txt{font-size:12px;}
    .main-section-3{padding:calc(60px*.53) 0; }
    .main-section-3 h1{margin-bottom:30px; font-size:clamp(32px , 32 / 500 * 100vw, 40px)}
    .main-section-3 ul li{width:100%;}
    .main-section-3 ul li .txt_area .name{font-size:1.5rem;}
    .main-section-3 .view_more a{width:100%; height:60px; line-height:60px; font-size:1rem;}
    .main-section-4{padding:calc(60px*.53) 0; }
    .main-section-4 .main_title{margin-bottom:50px; }
    .main-section-4 .main_title h1{
        font-size:8vw
    }
    .main-section-4 .main_title p{
        font-size: clamp(20px, 20 / 500 * 100vw, 24px);

    }
    .main-section-4 .faq .question{padding:30px 0;}
    .main-section-4 .faq .question .category{display:none;}
    .main-section-4 .faq .question .title{font-size:2rem; width:100%;}
    .main-section-4 .faq .answer .answer_title{font-size:1.25rem;}
    /* .main-section-4 .faq .answer p{font-size:1rem;} */
    .main-section-4 .faq .question .title:after{width:30px; opacity:1; visibility: visible; transform:translateY(-50%) rotate(180deg);}
    .main-section-4 .faq .on .question .title:after{transform:translateY(-50%) rotate(0deg);}
    .main-section-5{padding:35px 3%; overflow:hidden;}
    .main-section-5 h1{font-size:10vw;}
    .main-section-5 .more a{padding:4px 20px; font-size:1rem;}
    /* .main-section-4 .faq .on .answer{padding-top:20px;} */

    br._mob{display: none;}
}
@media screen and (max-width: 500px) {
    .main-section-3 h1{font-size:clamp(28px , 28 / 360 * 100vw, 32px)}
}

.footer{position:relative; padding:70px 3% 40px; background-color:#000; color:#fff;font-family: var(--font);}
.footer .sns{margin-left:auto; display:flex; gap:20px; align-items: center;
}
.footer .sns ul{display:flex; align-items: center;}
.footer .sns li{position:relative; padding:0 10px; }
/* .footer .sns li:before{position:absolute; left:0; top:45%; width:1px; height:14px; background-color:#fff; display:block; content:""; transform:translateY(-50%);} */
.footer .sns li:first-child:before{display:none;}
.footer .sns li:last-child{padding-right:0; }
.footer .sns li a{position:Relative; font-size:1.5rem; font-weight:400; letter-spacing:-0.04em; display:block; color:#fff;font-family: var(--font);display: flex;
    align-items: center;
    justify-content: center;}
.footer_txt{text-align:center; font-size:min(109px, 3.1vw); font-weight:400; line-height:1; display:block; color:#fff; }
.footer_txt .sub_txt{font-size:39px; }

.footer .tel{font-size:1.5rem; font-family:var(--font2); font-weight:400; letter-spacing:-0.025em; display:block; color:#fff;}
.footer .mail button{font-size:1.5rem; font-family:var(--font2); font-weight:400; letter-spacing:-0.025em; display:block; color:#fff; line-height:1;}
.footer .copyright{margin-top:40px; text-align:center; font-size:1rem; font-weight:400; letter-spacing:-0.04em; display:block; color:#fff; opacity:0.5;font-family: var(--font);}
.footer .info{position:relative; }
.footer .top_btn{
    width: 42px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font2);
    font-weight: 400;
    font-size: 1rem;
    letter-spacing: -0.025em;
    color: #000;
}
@media screen and (max-width: 1600px) {
    .footer_txt .sub_txt{font-size:32.5px; }

}
@media screen and (max-width: 1480px) {
    .footer_txt .sub_txt{font-size:30px; }

}
@media screen and (max-width: 1280px) {
    .footer_txt .sub_txt{font-size:26px; }

}
@media screen and (max-width: 1024px) {
    .footer{padding: 40px 3% 40px;}
    .footer_txt .sub_txt{font-size:20.5px; }

}
@media screen and (max-width: 960px){
.footer .d-flex{flex-direction: column; gap:20px; text-align:center;}
.footer .mail button{margin:0 auto;}
.footer .sns{margin-left:0; justify-content: center;}
.footer_txt{margin-top:20px; font-size: clamp(24px, 24 / 500 * 100vw , 40px);}
.footer_txt .sub_txt{font-size:26px; line-height: 20px; }
.footer_txt img{width:4vw;}

}
@media screen and (max-width: 820px){
    .footer .tel, .footer .mail button{font-size: clamp(18px , 18 / 500 * 100vw, 20px)}

}
@media screen and (max-width: 768px){
    .footer{padding:30px 3%; flex-direction: column;  gap:20px;}
    /* .footer .copyright{margin-top:30px;} */
    .footer .sns{width:100%;  gap:20px;}
    .footer .top_btn{font-size: 14px;}
    .footer_txt .sub_txt{font-size:24px; }

    /* .footer .mail button{font-size:3rem;} */
}
@media screen and (max-width: 500px){
    .footer_txt{font-size: clamp(18px , 18 / 360 * 100vw, 24px);}
    .footer_txt .sub_txt{font-size:15px; line-height: 15px; }
    .footer .tel, .footer .mail button{font-size: clamp(16px , 16 / 360 * 100vw, 18px)}
    .footer .copyright{font-size: clamp(14px , 14 / 360 * 100vw, 16px); }
    .footer .top_btn {font-size: 12px;width: 34px;}
}
@media screen and (max-width: 430px){
  .footer_txt{
    font-size: clamp(23px, 20 / 390 * 100vw, 24px);
  }
}
@media screen and (max-width: 360px){
    .footer .d-flex{gap: 12px;}
    .footer_txt{font-size: clamp(20px , 20 / 360 * 100vw, 32px); margin-top: 12px;}
    .footer_txt .sub_txt{font-size:13px; line-height: 20px; }
    .footer .tel, .footer .mail button{font-size: clamp(14px , 14 / 360 * 100vw, 16px)}
    .footer .copyright{font-size: clamp(12px , 12 / 360 * 100vw, 14px)}
    .footer .top_btn {font-size: 10px;}
}

.cont{margin:0 auto; max-width:var(--width); padding:0 var(--padding); box-sizing:border-box;}

/* work */
/* .sub_cont{padding-bottom:100px;} */
.sub_cont.bk{background-color:#121212;}
.sub_visual{padding:240px 7% 80px; background-color:#000;}
.sub_visual .page_title{margin-bottom:150px;}
.sub_visual .page_title h1{font-size:7.5rem; font-family:var(--font2); font-weight:400; line-height:1.2; display:block; color:#fff;}
.filter_area{display:Flex; align-items: center;}
.filter_area .filter{max-width:220px; width:100%; display:flex; flex-direction: column; gap:20px;font-family: var(--font);}
.filter_area .filter > div{position: relative;}
.filter_area .filter > div::after{
    position: absolute;
    color: #fff;
    content: "\e942";
    font-family: "xeicon";
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.filter_area .filter select{width:100%; height:40px; line-height:40px; border:none; border-bottom:1px solid #fff; font-size:1.375rem;  color:#fff; background:transparent;font-family: var(--font);}
.filter_area .filter select option{background-color:#000; border:1px solid #fff; color:#fff;}
.filter_area .right_txt{margin-left:auto; font-size:1.625rem;  color:#fff;font-family: var(--font);}
.filter_area .right_txt a{text-decoration: underline; color:#fff; vertical-align: top;font-family: var(--font) !important;}

.titleType_1{padding:36px 3%; background-color:#121212;}
.titleType_1 h2{font-size: 3.15rem; font-weight:400; line-height:1.2; display:block; color:#fff;font-family: var(--font);}

.work_list ul{display:flex; flex-wrap:wrap; gap:30px 0;}
.work_list ul li{width:50%; }
.work_list ul li .video_area{position:relative;  aspect-ratio: 16/9; background:url(/asset/vendor/no_image.png) no-repeat center center #626262;}
.work_list ul li .video_area img{position:absolute; top:0; left:0; z-index:4; width:100%; height:100%; object-fit:cover;background-color: #121212;}
.work_list ul li .video_area iframe{position:relative; top:0; left:0; z-index:1; width:100%; height:100%; object-fit: cover;}
.work_list ul li .video_area.is-playing img{display:none;}
.work_list ul li .txt_area{padding:35px 6.25% 50px; }
.work_list ul li .txt_area .category{font-size:1rem; font-family: var(--font); font-weight:400; line-height:1.75; opacity:0.6; letter-spacing:-0.04em; display:block; color:#fff;}
.work_list ul li .txt_area .name{
	font-size:2.2rem;
	/* font-weight:700; */
	color:#fff;
	font-family: var(--font);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.work_list ul li .txt_area .txt{
    font-size:1.3rem;
	color:rgba(255, 255, 255, 0.7); font-weight:300;margin-top: -5px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-family: var(--font);
}
.work_list ul li:nth-child(2n) .video_area{background:url(/asset/vendor/no_image.png) no-repeat center center #959595;}
.work_list ul li:nth-child(4n-1) .video_area{background:url(/asset/vendor/no_image.png) no-repeat center center #B1B1B1;}
.work_view_more{padding:50px 3% 0; text-align:center;}
.work_view_more a{width:400px; height:80px; line-height:80px; border: 1px solid #000; border-radius:2em; box-sizing:border-box; font-size:1.25rem; font-weight:400; letter-spacing:-0.04em; display:inline-block; box-sizing:border-; transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;}
.work_view_more a:hover{background-color:#000; color:#fff;}

.work_view_more{padding:50px 0 0; text-align:center;}
.work_view_more a{width:100%; height:unset; line-height:78px;box-sizing:border-box; font-family:var(--font2); font-weight:400; letter-spacing:-0.04em; display:inline-block; box-sizing:border-box; transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;color:#fff; letter-spacing:-0.04em; display:inline-block; font-size: 2.25rem;
border-radius: unset;border: unset; border-top:1px solid #fff;
padding: 2.8vw 0;
}
.work_view_cont{padding-top: var(--header_h);}
.work_view_cont{font-family: var(--font) !important;overflow: hidden;}
.work_view_cont .top_video_area{position:relative;}
/*
.work_view_cont .top_video_area iframe,
.work_view_cont .top_video_area img{position:absolute; left:0; top:0; z-index:1; width:100%; height:100%; object-fit:cover; display:block; object-fit: cover;}
.work_view_cont .top_video_area img{z-index:3;}
*/
.work_view_cont .top_video_area .img_area{position: relative;}
.work_view_cont .top_video_area .img_area::before{
    content: '';
    display: block;
    padding-bottom: calc(850/1920*100%);
}
.work_view_cont .top_video_area .img_area img{position: absolute; top:0; left:0; z-index:1; width:100%; height:100%; object-fit:cover; display:block; object-fit: cover;}
.work_view_cont .top_video_area .img_area .txtBx{position: absolute; bottom:5%; left:3%; z-index:41;color:#fff; font-size:90px; font-weight:400; line-height:1.2; display:block; font-family: var(--font2);mix-blend-mode: difference;}

.work_view_cont .top_video_area img{width:100%;}
.work_view_cont .top_video_area .video_area{aspect-ratio: 16/9;}
.work_view_cont .top_video_area .video_area iframe{width:100%; height:100%; display:block; }

.work_view_cont .middle_txt_area{padding:100px 3%; display:flex; gap:30px;}
.work_view_cont .middle_txt_area .left_area{width:50%;}
.work_view_cont .middle_txt_area .right_area{width:46%;}
.work_view_cont .middle_txt_area .right_area strong{font-size:1.875rem; font-weight:500; line-height:1.2; display:block; }
.work_view_cont .middle_txt_area .right_area p{margin-top:30px; font-size:1.1rem; color:#000; opacity:0.7; line-height:1.4;font-family: 'Pretandard';}
.work_view_cont .middle_txt_area .left_area .txt_1{font-size:2.5rem;  font-weight:500; line-height: 1; display:block; }
.work_view_cont .middle_txt_area .left_area .tag_list{margin:30px 0 40px; display:flex; gap:10px; flex-wrap:wrap;}
.work_view_cont .middle_txt_area .left_area .tag_list span{padding:0 20px; font-size:0.9375rem;  font-weight:400; line-height:1.75; letter-spacing:-0.04em; display:block; border: 1px solid #000;}
.work_view_cont .middle_txt_area .left_area .info ul{display:flex; }
.work_view_cont .middle_txt_area .left_area .info li{position:relative; padding:0 10px; }
.work_view_cont .middle_txt_area .left_area .info li:before{position:absolute; left:0; top:50%; width:1px; height:14px; background-color:#333; display:block; content:""; transform:translateY(-50%);}
.work_view_cont .middle_txt_area .left_area .info li:First-child:before{display:none;}
.work_view_cont .middle_txt_area .left_area .info li:First-child{padding-left:0;}
.work_view_cont .photo_list ul{padding:0 3% 60px; display:flex; flex-wrap:wrap; gap:20px;}
.work_view_cont .photo_list li{width:100%; position:relative;}
.work_view_cont .photo_list li .video_area{}
.work_view_cont .photo_list li .video_area iframe{width:100%; height:100%; display:block; }
.work_view_cont .photo_list li.half{width:calc(50% - 10px); }
.work_view_cont .photo_list li img{width:100%;}

.work_view_cont .photo_list .txtBx{
    padding:0 3% 100px; display:flex; justify-content: space-between; align-items: flex-start;
}
.work_view_cont .photo_list .txtBx .left h3{font-size:2.5rem; font-weight:500; line-height:1.2; display:block; font-family: var(--font); color:#000;}
.work_view_cont .photo_list .txtBx .right p{font-size:1.875rem; color:#000; line-height:calc(42/30); font-family: var(--font);text-align: right;}


.work_view_cont .instar_area{padding:95px 0; background-color:#000;position: relative;}
.work_view_cont .instar_area .cont{
    max-width: 1800px;
}
.work_view_cont .more_work{padding:100px 0 0;}
.work_view_cont .more_work h1{margin-bottom:30px; padding:0 3%; font-size: 3.15rem;  font-weight:400; line-height:1.2; display:block; font-family: var(--font);}
.work_view_cont .work_list ul li .txt_area .name{color:#000;font-family: var(--font);}
.work_view_cont .work_list ul li .txt_area .txt{
    color:rgba(0, 0, 0, 0.7);
    font-family: var(--font);
    font-weight: 300;
}
/* swiper */
/* .instar_area .instarBx{
    display: flex;
    align-items: center;
    justify-content: center;
} */
/* .instar_area .instarBx .instar{overflow: visible;} */
/* .instar_area .instarBx .instar .swiper-wrapper{
    justify-content: center;
} */
/* .instar_area .instarBx .instar{position: relative;} */
.instar_area .instarBx .inner {
    position: relative;
    display: flex;
    align-items: center;
	justify-content: center;
}
.instar_area .instarBx .instar .swiper-slide {
    width: 100%;
    position: relative;
}
.instar_area .instarBx .instar .swiper-slide .txtBx{opacity: 0;transition: opacity 0.5s ease;}
.instar_area .instarBx .instar .swiper-slide-active .txtBx{opacity: 1;}
.instar_area .instarBx .instar .imgBx{position: relative;width:100%;}
.instar_area .instarBx .instar .imgBx::before{
    content: '';
    display: block;
    padding-bottom: calc(5 / 4 * 100%);
}
.instar_area .instarBx .instar .imgBx img{
    position: absolute; top:0; left:0;
    width:100%; height:100%;
    object-fit:cover;
    border-radius: 20px;
    /* border: 1px solid red;box-sizing: border-box; */
}

.instar_area .instarBx .instar .txtBx{
    color: #fff;text-align: center;font-size: 18px;
    margin-top: calc(20 / 18 * 1em);
}
.instar_area .instarBx .instar .txtBx p{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: var(--font);
}
.controlBx{
    position: absolute;
    top: 50%;
	left: 50%;
    transform: translate(-50%,-50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(100%  + 120px);
    margin: 0 auto;
	z-index: 0;
}
.controlBx .prev, .controlBx .next{
    width: 40px;
    height: 40px;
    border: 1px solid #ffff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.controlBx i{font-size: 20px; color: #fff;}

/* back */
.instar_area .swiper-slide .back {
    position: absolute;
    left: 0; top: 0;
    width: 100%;height: 100%;
}

.instar_area .swiper-slide .back .bg {
    background-color: #000;
    opacity: 0.5;
    transform: scaleY(0);
    transform-origin: center calc(100% + 2px);
    transition: transform 0.8s;
    position: absolute;
    width: calc(100% + 4px); height: calc(100% + 4px);
    top: -2px; left: -2px;
}

.instar_area .swiper-slide .back .ico {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
}

.instar_area .swiper-slide .back .ico a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 0.5s 0.2s, transform 0.5s 0.2s;
}


/* hover */

.instar_area .instarBx .instar .swiper-slide .txtBx{opacity: 1;transition: opacity 0.5s ease;}
/* .instar_area .instarBx .instar .swiper-slide-active .txtBx{opacity: 1;} */
.instar_area .instarBx .instar .swiper-slide:hover .txtBx{opacity: 1;}
.instar_area .swiper-slide .imgBx:hover .back .bg{transform: scaleY(1);}
.instar_area .swiper-slide .imgBx:hover .back .ico a{transform: translateY(0); opacity: 1;}

@media screen and (max-width: 1900px) {
    .instar_area .instarBx .inner{display: block;}
	.work_view_cont .instar_area .cont{padding: 0 80px;}
}
@media screen and (max-width: 1440px) {
    .work_view_cont .middle_txt_area .right_area p{word-break: keep-all;}
    .work_view_cont .middle_txt_area .right_area p br{display: none;}

}

@media screen and (max-width: 1200px){
.work_view_cont .middle_txt_area{flex-direction: column; gap:60px;}
.work_view_cont .middle_txt_area .right_area p br{display: block;}
.work_view_cont .middle_txt_area .left_area{width:100%;}
.work_view_cont .middle_txt_area .right_area{width:100%;}

.work_list ul li .txt_area .txt{font-size:14px;}

}
@media screen and (max-width: 960px){
.filter_area{flex-direction: column; gap:40px; align-items: flex-start;}
.work_view_cont .photo_list ul{gap:10px;}
.work_view_cont .photo_list li.half{width: calc(50% - 5px);}
}
@media screen and (max-width: 820px) {
    .work_view_cont .middle_txt_area .right_area p br{display: none;}
	.work_list ul li .txt_area .txt{font-size:12px;}
	.work_view_cont .instar_area .cont .swiper{overflow: visible;}

	.controlBx{position: unset; width: 120px; transform: unset; margin-top: 40px;}
}
@media screen and (max-width: 768px){
.work_list ul li{width:100%;}
.work_list ul li .txt_area .name{font-size:1.8rem; margin-bottom: 10px;}

.work_view_more a{width:100%;line-height:60px; font-size:1.5rem;}
.sub_visual{padding:100px 3% 40px;}
.sub_visual .page_title h1{font-size:4.5rem;}
.sub_visual .page_title{margin-bottom:50px;}
.filter_area .filter{max-width:100%;}
.filter_area .right_txt{font-size: clamp(16px, 16 / 360 * 100vw, 20px); margin-left: 0;}
.titleType_1 h2{font-size:1.8rem;}
.work_list ul{gap:0;}
/* .work_view_more{padding:30px 3% 0;} */

.work_view_cont .middle_txt_area{padding:50px 3%; gap:30px;}
.work_view_cont .middle_txt_area .left_area .txt_1{font-size:1.8rem;}
/* .work_view_cont .middle_txt_area .right_area strong{font-size:1.5rem;} */
.work_view_cont .middle_txt_area .right_area p{font-size:1rem; margin-top:20px;}
.work_view_cont .photo_list ul{padding:0 3% 50px; gap:10px;}
.work_view_cont .instar_area{padding:50px 0; }
.work_view_cont .more_work{padding:50px 0 0;}
.work_view_cont .more_work h1{font-size:1.8rem;}


.instar_area .swiper-slide .imgBx .back .bg{display: none;}
.instar_area .swiper-slide .imgBx .back .ico a{width: 100%; height: 100%; transform: unset;}
.instar_area .swiper-slide .imgBx .back .ico a img{display: none;}


}
@media screen and (max-width: 500px){

}
@media screen and (max-width: 360px){
    .filter_area .right_txt{font-size: clamp(14px, 14 / 280 * 100vw, 16px);}

}











@media screen and (max-width: 1024px){
    .main-section-4 .faq .answer p {font-size: 1.6rem;}
    .main-section-4 .faq .answer p br{display: none;}
}
@media screen and (max-width: 820px){
    .main-section-4 .faq .answer p{
        font-size: 1.4rem;
    }

}
@media screen and (max-width: 500px){
    .main-section-4 .main_title h1{
        font-size: clamp(10vw, 10vw, 12vw);
    }

    .main-section-4 .main_title p br{display: none;}
    .main-section-4 .main_title p br._mob{display: block;}
    .main-section-4 .main_title p{
        font-size: clamp(18px, 18 / 360 * 100vw, 20px);
    }

    .controlBx{gap: 1em;}
}


/* css 추가 */

@media screen and (max-width: 1680px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(80px, 80 / 1440 * 100vw, 90px);
    }

}
@media screen and (max-width: 1440px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(70px, 70 / 1280 * 100vw, 80px);
    }

    .work_view_cont .middle_txt_area .left_area .txt_1, .work_view_cont .photo_list .txtBx .left h3{font-size: clamp(34px, 34 / 1280 * 100vw, 40px);}
    .work_view_cont .middle_txt_area .right_area strong, .work_view_cont .photo_list .txtBx .right p{font-size: clamp(24px, 24 / 1280 * 100vw, 30px);}
}

@media screen and (max-width: 1280px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(60px, 60 / 1024 * 100vw, 70px);
    }
}
@media screen and (max-width: 1200px){
    .work_view_cont .photo_list .txtBx {flex-direction: column;gap: 20px;}
    .work_view_cont .photo_list .txtBx .right p{text-align: left;}

}
@media screen and (max-width: 1024px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(50px, 50 / 820 * 100vw, 60px);
    }
    .work_view_cont .middle_txt_area .left_area .txt_1, .work_view_cont .photo_list .txtBx .left h3{
        font-size: clamp(30px, 30 / 820 * 100vw, 36px);
    }
    .work_view_cont .middle_txt_area .right_area strong, .work_view_cont .photo_list .txtBx .right p{font-size: clamp(22px, 22 / 820 * 100vw, 24px);}

    .work_list ul li .txt_area {padding: 25px 3% 50px;}


    .main-section-3 ul li .txt_area{padding:25px 3% 50px;}
    .main-section-3 ul li .txt_area .name{font-size: clamp(24px, 24 / 820 * 100vw, 30px);}
    .work_list ul li .txt_area .name{font-size: clamp(24px, 24 / 820 * 100vw, 30px);}
}
@media screen and (max-width: 820px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(40px, 40 / 500 * 100vw, 50px);
    }
    .work_view_cont .middle_txt_area .left_area .txt_1, .work_view_cont .photo_list .txtBx .left h3{
        font-size: clamp(26px, 26 / 500 * 100vw, 30px);
    }
    .work_view_cont .middle_txt_area .right_area strong, .work_view_cont .photo_list .txtBx .right p{font-size: clamp(20px, 20 / 500 * 100vw, 22px);}


    .main-section-3 ul li .txt_area .txt{margin-top: 2px;}
}
@media screen and (max-width: 500px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(35px, 35 / 360 * 100vw, 40px);
    }
    .work_view_cont .middle_txt_area .left_area .txt_1, .work_view_cont .photo_list .txtBx .left h3{
        font-size: clamp(22px, 22 / 360 * 100vw, 28px);
    }
    .work_view_cont .middle_txt_area .left_area .txt_1 br{display: none;}
    .work_view_cont .middle_txt_area .right_area strong, .work_view_cont .photo_list .txtBx .right p{font-size: calc(20/500*100vw); }
    .work_view_cont .photo_list .txtBx .right p br{display: none;}

    .instar_area .instarBx .instar .txtBx{
        font-size: clamp(16px, 16 / 360 * 100vw, 18px);
    }

    .work_view_cont .work_list ul li .txt_area .name{
        font-size: clamp(22px, 22 / 360 * 100vw, 25px);
    }
    .instar_area .instarBx .instar .swiper-slide {
        max-width: 100%;
    }

    .main-section-3 ul li .txt_area .txt{font-size: clamp(16px, 16 / 360 * 100vw, 18px);}
}
@media screen and (max-width: 360px){
    .work_view_cont .top_video_area .img_area .txtBx{
        font-size: clamp(28px, 28 / 280 * 100vw, 35px);
    }

    .main-section-3 ul li .txt_area .name{
        font-size: clamp(20px, 20 / 280 * 100vw, 20px);
    }
    .work_list ul li .txt_area .name{
        font-size: clamp(20px, 20 / 280 * 100vw, 20px);
    }
}