@import url('https://fonts.cdnfonts.com/css/avantgarde-bk-bt-2');
@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'GowoonDodum';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunDodum-Regular.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Sweet';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Heavy.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}
/*    selector { cursor: none !important; }*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, button, time, mark, audio, video, a, textarea, input{font-family: 'Sweet';}
body{background: #FFFBF7 !important}
@font-face {
    font-family: 'GowoonDodum';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunDodum-Regular.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}

body{background: #F8F2EF}
#smoother-content{background: #F8F2EF}


.map {
    width: 100%;
    height: 100vh; /* 화면 전체 높이 */
    position: relative;
}



.wrapper {
    position: relative;
    height: 150vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation-fill-mode: forwards;
	margin-top: -230px
}
.aw_obj_wrap {
    width: 340px;
    height: 578px;
    z-index: 2;
    transform-style: preserve-3d;
    transform-origin: center center;
    transform: translateZ(-250px) ;
	perspective: 8000px
/*    transform: perspective(2000px) translateZ(-250px) ;*/
}

#main .card {
    position: absolute;
    width: 340px;
    height: 508px;
}


/* 왼쪽 그룹 (1~6번) */
#main .card.prev8 { transform: rotateY(-221.5403deg) translateZ(850px) translateY(-1200px);  opacity: 0;transition: 3s linear}
#main .card.prev7 { transform: rotateY(-193.8461deg) translateZ(850px) translateY(-1050px);  opacity: 0.2;transition: 3s linear}
#main .card.prev6 { transform: rotateY(-166.1538deg) translateZ(850px) translateY(-900px);  opacity: 0.3;transition: 3s linear}
#main .card.prev5 { transform: rotateY(-138.4615deg) translateZ(850px) translateY(-750px);  opacity: 0.7;transition: 3s linear}
#main .card.prev4 { transform: rotateY(-110.7692deg) translateZ(850px) translateY(-600px);  opacity: 1;transition: 3s linear}
#main .card.prev3 { transform: rotateY(-83.0769deg)  translateZ(850px) translateY(-450px);  opacity: 1;transition: 3s linear}
#main .card.prev2 { transform: rotateY(-55.3846deg)  translateZ(850px) translateY(-300px);  opacity: 1;transition: 3s linear}
#main .card.prev1 { transform: rotateY(-27.6923deg)  translateZ(850px) translateY(-150px);  opacity: 1;transition: 3s linear}
#main .card{opacity: 0}

/* 가운데 (7번) */
#main .card.on { transform: rotateY(0deg) translateZ(850px) translateY(0px); opacity: 1;transition: 3s linear}
/* 오른쪽 그룹 (8~13번) */
#main .card.next1  { transform: rotateY(27.6923deg)  translateZ(850px) translateY(150px);  opacity: 1;transition: 3s linear}
#main .card.next2  { transform: rotateY(55.3846deg)  translateZ(850px) translateY(300px);  opacity: 1;transition: 3s linear}
#main .card.next3 { transform: rotateY(83.0769deg)  translateZ(850px) translateY(450px);  opacity: 1;transition: 3s linear}
#main .card.next4 { transform: rotateY(110.7692deg) translateZ(850px) translateY(600px);  opacity: 1;transition: 3s linear}
#main .card.next5 { transform: rotateY(138.4615deg) translateZ(850px) translateY(750px);  opacity: 0.7;transition: 3s linear;mix-blend-mode: difference}
#main .card.next6 { transform: rotateY(166.1538deg) translateZ(850px) translateY(900px);  opacity: 0.3;transition: 3s linear}
#main .card.next7 { transform: rotateY(193.8461deg) translateZ(850px) translateY(1050px);  opacity: 0.2;transition: 3s linear}
#main .card.next8 { transform: rotateY(221.5403deg) translateZ(850px) translateY(1200px);  opacity: 0.0;transition: 3s linear}
#award .obg_w{opacity: 0;transition: 1.2s;transition-delay: 4s}
#award.on .obg_w{opacity: 1}
#award  .obj{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: absolute}
#award  .obj .video{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: #FFFBF7;opacity: 0}
#award  .obj .video video{height: 626px;mix-blend-mode: multiply}
#award  .obj img{opacity: 1;transition: 2s;transform: translateY(0);filter: blur(0px);width: 368px}

.award .img_w{padding: 20px;background: linear-gradient(-45deg,rgba(255,231,220,0),rgba(255,231,220,0.7));  backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 20px;position: relative}
.award .img_w .prize_list{position: absolute;top: 30px;left: 30px;}
.award .img_w .prize_list ul{display: flex;flex-direction: column;gap: 8px;}
.award .img_w .prize_list ul li{display: flex;gap: 4px;font-size: 16px;color: #FFFFFF;font-weight: 500;border: 1px solid #ffffff25;align-items: center;padding-left: 14px;padding-right: 28px;border-radius: 23px;background: rgba(0,0,0,0.20);backdrop-filter: blur(20px)}
.award .img_w .prize_list ul li i img{display: block}
.award .img_w .img{border-radius: 10px;overflow: hidden}
.award .img_w .img img{display: block;transition: 0.5s;width: 100%}
.award .img_w:hover .img img{transform: scale(1.05)}
.award .txt_wrap{padding-left: 20px;padding-top: 18px;}
.award .txt_wrap strong{display: block;font-family: "the-seasons", sans-serif;font-size: 28px;color: #51341B;line-height: 28px;margin-bottom: 10px;}
.object {
    font-size: 24px;
    color: white;
    font-weight: bold;
    text-align: center;
    position: absolute; /* 원 안에서 고정 */
}  
    
@keyframes ani444 {
    0%{ transform: rotateY(0deg);}
    100%{ transform: rotateY(360deg);}
}
    

#smoother-content{background: none}
#main{overflow: hidden;width: 100%;}
#cursor{position: fixed;z-index: 899;pointer-events: none;  pointer-events: none;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  transition: none !important; /* 반드시 제거 */
  animation: none !important;z-index: 999999}
#cursor i{display: block;position: absolute;transform: translate(-50%,-50%) scale(0.5);opacity: 0;transition: 0.3s}
#cursor i img{display: block}
#cursor i {transform: scale(0.5);opacity: 0;transition: 0.3s}
#cursor.act i {transform: translate(-65%,-65%) scale(1);opacity: 1}
#cursor span{display: block;top: 0;left: 0;transform: translate(-50%,-50%) scale(0.5);opacity: 0;transition: 0.3s;position: absolute}
#cursor.act2 span{transform: translate(-65%,-65%) scale(1);opacity: 1;}
#cursor div{transition: 0.0s}
#cursor img{display: block;top: 15px;left: 15px;position: relative}
#cursor > img{display: block;position: relative;z-index: 5}
.main_vis {position: relative;background: #FFFBF7;height: 100vh}
.main_vis .pin-spacer{pointer-events: none}
.main_vis .element div{border-radius: 0px;overflow: hidden}
.main_vis .element div img{display: block}
.main_vis .video_w{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);mix-blend-mode: multiply;;opacity: 0}
.main_vis .video_w video{width: 1000px}
.element_video{mix-blend-mode: multiply;}
.copy_title{position: absolute;width: 100%;height: 100%;top: 0;left: 0; z-index: 20;pointer-events: none}
.copy_title > div{width: 100%;height: 100%}
.copy_title strong{display: block;text-align: center;font-size: 200px;line-height: 1.2;color: #FF5700; font-family: "amandine", sans-serif;font-weight: 300;position: relative}
.copy_title strong i{position: absolute;top: 0;left: 34px;opacity: 0; overflow: hidden; display: block; width: calc(100% - 1px); }
.copy_title strong svg{  }
.copy_title .copy{display: flex;width: 1119.2px}
.copy_title .copy02{width: 953.2px}
.copy_title .copy03{width: 898.21px}
.copy_title .copy > div{overflow: hidden;width: 20%}
.copy_title .copy > div strong{transition: 1s;filter: blur(5px)}
.copy_title .copy01 > div strong{width: 1119.2px;}
.copy_title .copy02 > div strong{width: 953.2px;}
.copy_title .copy03 > div strong{width: 898.21px;}
.copy_title .copy > div.typo01 strong{transform: translateX(-20%)}
.copy_title .copy > div.typo02 strong{transform: translateX(-30%)}
.copy_title .copy > div.typo03 strong{transform: translateX(-60%)}
.copy_title .copy > div.typo04 strong{transform: translateX(-40%)}
.copy_title .copy > div.typo05 strong{transform: translateX(-60%)}
.copy_title .copy > div .ho{position: absolute;top: 0;left: 0;transition: 0.7s;opacity: 0;transition-delay: 5s}
.on .copy_title .copy > div .ho{opacity: 1}
.copy_title .copy01 {opacity: 0;transition: 0.3s}
.copy_title .copy01.on {opacity:1}
.copy_title .copy > div{transition: 1s}
.copy_title .copy.on > div.typo01 strong{transform: translateX(-0%)}
.copy_title .copy.on > div.typo02 strong{transform: translateX(-20%)}
.copy_title .copy.on > div.typo03 strong{transform: translateX(-40%)}
.copy_title .copy.on > div.typo04 strong{transform: translateX(-60%)}
.copy_title .copy.on > div.typo05 strong{transform: translateX(-80%)}
.copy_title .copy.on > div strong{filter: blur(0px)}
.copy_title .copy01{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);opacity: 0}
.copy_title .copy02{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);opacity: 0}
.copy_title .copy03{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);opacity: 0}
.copy_title .copy{transition: 0.8s}
.copy_title .copy.on{opacity: 1}
.copy_title .copy.on2{opacity: 0}
#contact .bg01, #contact .bg02{display: none}
.main_vis .element div{opacity: 0}
.main_vis.act .element div{opacity: 1;transition: 0.3s;transition-delay: 0.3s}
.main_vis .copy_title .copy01 > div:nth-child(3) {margin-left: -0.7px}
.main_vis .copy_title .copy02 > div:nth-child(4) {margin-left: -1px}

html{background:#F8F2EF }
#award .obj{top: 0}
.pin-spacer:nth-child(1){mix-blend-mode: darken;z-index: 10;top: 0;pointer-events: none}
#award .obj1{z-index: 0}
#main{background:#F8F2EF }
.obj2{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: absolute;z-index: 5}
.obj2 .video{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: #F8F2EF;opacity: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center}
.obj2 .video video{height: 626px;mix-blend-mode: multiply}

#award .award_wrap .award_list .obj{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: relative}
#award .award_wrap .award_list .obj{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: relative}
#award .award_wrap .award_list .obj .video{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: #F8F2EF;opacity: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center}
#award .award_wrap .award_list .obj .video video{height: 626px;mix-blend-mode: multiply}


/* new - 250924 */


.aw_content .award_title{z-index: 12;display: flex;justify-content: center;flex-direction: column;align-items: center;position: relative}
.aw_content .award_title .aw_list ul{display: flex;align-items: center;justify-content: flex-end;gap: 6px;}
/*.aw_content .award_title .aw_list ul li{opacity: 0;filter: blur(20px);transform: translateY(30px)}*/
.aw_content .award_title .aw_list ul li i{display: block;break-after: 6px;border: 1px solid #ffffff30;border-radius: 6px;background: rgba(255,255,255,0.7);backdrop-filter: blur(20px)}
.aw_content .award_title .aw_list ul li i img{display: block;width: 45px;}
/*background: linear-gradient(-45deg,rgba(255,231,220,0.5),rgba(255,231,220,0.9)); */
.aw_content .cir i svg{display: block;width: 230px;height: auto;}
.aw_content .cir div{width: 230px;height: 60px;background: linear-gradient(-45deg,rgba(255,231,220,0.5),rgba(255,231,220,0.9));border: 1px solid #fff;border-radius: 60px;display: flex;align-items: center;justify-content: center;gap: 10px;}
.aw_content .title {;position: relative;z-index: 5}
/*mix-blend-mode: difference*/
.aw_content .title strong *{font-family: inherit}
.aw_content .title strong{font-size: 80px;color: #51341B;font-family: "amandine", sans-serif;font-weight: 400;display: block;text-align: center;}
.aw_content .cir{display: flex;justify-content: center;position: relative;z-index: 5}
.aw_content .cir div strong{color: #51341B;font-size: 18px;font-family: "amandine", sans-serif;font-weight: 400;}
.aw_content .cir div span{display: block;line-height: 35px;width: 60px;text-align: center;background: #F37C07;border-radius: 17px;font-size: 20px;color: #FFFFFF;    font-family: "amandine", sans-serif;}
.aw_content .txt{position: absolute;right: 130px;top: -80px;z-index: 15;flex-direction: column;display: flex;gap: 8px}
.aw_content .info_s_text01{position: absolute;left: 70%;bottom: -80px;z-index: 15;}
/*.aw_content .txt{position: absolute;right: 130px;bottom: 120px;z-index: 15;flex-direction: column;display: flex;gap: 8px}*/
.aw_content .txt div{position: relative}
.aw_content .txt p{font-size: 14px;color: #51341B}
.aw_content .txt p.on{position: absolute;    background: linear-gradient(to right, #753C00, #753C00);
    color: #fff;
    clip-path: polygon(0% 0%, 0% 0%, 0 100%, 0% 100%);
    white-space: nowrap;top: 0;left: 0}



.aw_content{position: relative;position: relative}
.aw_content .bg01{position: absolute;width: 100%;height: 10%;background: linear-gradient(to top, #FFFBF700, #FFFBF7);position: absolute;top: 0;left: 0;z-index: 10}
.aw_content .bg02{position: absolute;width: 100%;height: 10%;background: linear-gradient(to bottom, #FFFBF700, #FFFBF7);position: absolute;bottom: 0;bottom: 0;z-index: 10}
.aw_content .video{mix-blend-mode: multiply;position: relative;z-index: 15}
.aw_content .video video{width: 700px;display: block;margin: 0 auto}
#logo img{width: 160px}
#aw #aw_w{height: 200vh;background-color: #000;}
/* .main_vis{display: none;} */
/* .vis_w_bg{display: none;} */
.vis_w_bg{display: flex;align-items: center;justify-content: center;position: fixed;}
.copy_title{z-index: 9999;}
.main_vis{z-index: 10}
.main_vis #container{position: relative;z-index: 10;}
.main_vis.main_vis01{position: absolute;width: 100%;height: 100vh;z-index:999;background: none}

#main #header #logo{opacity: 0}
/*.main_vis:after{content:'';display:block;position: absolute;width: 100%;height: 10%;background: linear-gradient(to bottom, #FFFBF700, #FFFBF7);position: absolute;bottom: 0;bottom: 0;z-index: 10;transition: 0.7s;transition-delay: 5s}*/

.main_vis .bg{opacity: 0;transition: 1.3s;transition-delay: 2.3s;overflow: hidden}
.main_vis.on .bg{opacity: 1}
.main_vis #container .element div img{width: 600px}
.main_vis .bg{position: absolute;width: 100%;height:100%;background: url(/img/main/vis_background.png);background-position: -45% 280%; top: 0;left: 0}

/*
.main_vis #container .element div{transition: transform 1.5s, opacity 1s}
.main_vis #container .element0 div{transform: translate(-40%,-50%) scale(0.8);opacity: 0}
.main_vis #container .element10 div{transform: translate(40%,-50%) scale(0.8);opacity: 0;transition-delay: 0.2s}
.main_vis #container .element20 div{transform: translate(-40%,50%) scale(0.8);opacity: 0;transition-delay: 0.4s}
.main_vis #container .element30 div{transform: translate(40%,50%) scale(0.8);opacity: 0;transition-delay: 0.6s}
.main_vis #container .element40 div{transform: translate(40%,-50%) scale(0.8);opacity: 0;transition-delay: 0.8s}
.main_vis #container .element50 div{transform: translate(-40%,50%) scale(0.8);opacity: 0;transition-delay: 0.5s}
.main_vis #container .element60 div{transform: translate(40%,50%) scale(0.8);opacity: 0;transition-delay: 0.7s}
.main_vis #container .element70 div{transform: translate(-40%,-50%) scale(0.8);opacity: 0;transition-delay: 0.9s}
.main_vis.act #container .element div{transform: translate(0%,0%) scale(1);opacity: 1}
*/
.main_vis .copy_title .copy > div{padding-bottom: 30px;;}
.main_vis .copy_title .copy01 > div{margin-left: -0.7px}
.main_vis .copy_text{display: flex;justify-content: center;font-size: 18px;color: #482513;position: absolute;top: 50%;transform: translateY(100px);width: 100%}
.main_vis .copy_text div{position: relative;}
.main_vis .copy_text div p{filter: blur(20px);opacity: 0;;letter-spacing: 0px;}
.main_vis .copy_text.on div p:nth-child(1){filter: blur(0);opacity: 1;letter-spacing: 0;transition: 1s}
.main_vis .copy_text div p:nth-child(2){position: absolute;top: 0;left: 0;background: linear-gradient(to right, #753C00, #753C00);color: #fff;clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);white-space: nowrap;filter: blur(0);opacity: 1;letter-spacing: 0;}
/*.main_vis .copy_text div p:nth-child(2){clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);transition-delay: 1.5s;}*/
.main_vis .element:nth-child(2){z-index: 15;}
    .copy_title strong i{    opacity: 0;
    transition: 0.3s;
    transition-delay: 2.3s;
}
.copy_title strong i svg{display: block}
.on .copy_title strong i{opacity: 1}

#project_list {padding-top: 100px;padding-bottom: 60px;background: #FFFBF7;position: relative;z-index: 15;margin-top: -1px}
#project_list .pro{padding: 0 60px;perspective: 4000px}
#project_list .pro > div{display: flex;justify-content: space-between;padding: 30px 0;border-bottom: 1px solid #C3B9B1;transform: rotateX(30deg) translateY(50%);opacity: 0}
#project_list .pro:last-child > div{border-bottom: none}
#project_list .pro > div .right > div{width: 1000px;display: block}
#project_list .pro > div .right video{width: calc(100% + 1px) !important;display: block}
#project_list .pro > div .right img{width: calc(100% ) !important;display: block}
#project_list .pro > div .left{display: flex;flex-direction: column;justify-content: space-between;height: 485px}
#project_list .pro > div .left > div{display: flex;justify-content: space-between;flex-direction: column;height: 100%;padding: 20px 0}
#project_list .pro > div .info p{display: flex;align-items: center;font-size: 18px;color: #482513;gap: 12px}
#project_list .pro > div .info p i{display: block;background: #A38F84;width: 1px;height: 14px;}
#project_list .pro > div .info strong{font-size: 70px;color: #482513;font-weight: 400;    font-family: "amandine", sans-serif;}
#project_list .pro > div .right {height: 505px;overflow: hidden;}
#project_list .pro > div .right .vi_img_w{position: relative;transition: 8s;}
#project_list .info_s_text{padding-left: 160px;margin-bottom: 60px;}
.info_s_text{z-index: 15;flex-direction: column;display: flex;gap: 6px;}
.info_s_text div{position: relative}
.info_s_text p{font-size: 14px;color: #51341B}
.info_s_text p.on{position: absolute;    background: linear-gradient(to right, #753C00, #753C00);
    color: #fff;
    clip-path: polygon(0% 0%, 0% 0%, 0 100%, 0% 100%);
    white-space: nowrap;top: 0;left: 0}



#beyond{background: #FFFBF7;padding: 0 60px;overflow: hidden}
#beyond .b_title{margin-bottom: 15px}
#beyond .b_title strong{font-size: 80px;color: #51341B;font-family: "amandine", sans-serif;font-weight: 400;display: block;margin-bottom: 50px}
#beyond .beyond_w{position: relative;width: 1367px;height: 832px;margin: 0 autol;}
#beyond .beyond_w .beyond{position: absolute;}
#beyond .beyond_w .beyond02{right: 34px;top: 0}
#beyond .beyond_w .beyond01{left: 174px;top: 62px;}
#beyond .beyond_w .beyond03{left: 0px;top: 355px;}
#beyond .beyond_w .beyond04{left: 382px;top: 355px;}
#beyond .beyond_w .beyond05{left: 611px;top: 283px;}
#beyond .beyond_w .beyond06{left: 797px;top: 328px;}
#beyond .beyond_w .beyond07{left: 1080px;top: 328px;}
#beyond .beyond_w .beyond08{left: 382px;top: 513px;}
#beyond .beyond_w .beyond09{left: 611px;top: 513px;}
#beyond .beyond_w .beyond10{left: 835px;top: 513px;}
#beyond .beyond_w .beyond11{left: 466px;top: 665px;}

#beyond_content{background: #FFFBF7}
#beyond_content .b_img_content{transform: scale(0.4)}
#beyond_content .b_img_content .img02{clip-path: polygon(0%  100%, 100% 100%, 100% 100%, 0% 100%);}
#beyond_content .b_img_content .img03{clip-path: polygon(0%  100%, 100% 100%, 100% 100%, 0% 100%);}
#beyond_content .b_img_content .img04{clip-path: polygon(0%  100%, 100% 100%, 100% 100%, 0% 100%);}
#beyond_content .b_img_content .img05{clip-path: polygon(0%  100%, 100% 100%, 100% 100%, 0% 100%);}
#beyond_content{position: relative;width: 100%;height: 100vh}
#beyond_content .b_title{position: absolute;top: 200px;left: 60px;z-index: 11}
#beyond_content .b_title strong{font-size: 80px;color: #51341B;font-family: "amandine", sans-serif;font-weight: 400;display: block;margin-bottom: 50px}

#beyond_content .b_img_content{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%)}
#beyond_content .b_img_content .img{position: absolute;top: 0;left: 0}
#beyond_content .b_img_content .img01{position: relative}

/*#beyond .beyond_w .beyond{transition: 1s}*/
/*#beyond.on .beyond_w .beyond{transform: scale(1) translate(0%,0% )}*/
#beyond .beyond_w .beyond01{transform: scale(2) translate(-150%,-100% )}
#beyond .beyond_w .beyond02{transform: scale(2) translate(200%,-200% )}
#beyond .beyond_w .beyond03{transform: scale(1.4) translate(-200%,200% )}
#beyond .beyond_w .beyond10{transform: scale(1.4) translate(200%,200% )}
#beyond .beyond_w .beyond04{transform: scale(2.5) translate(-200%,300% )}
#beyond .beyond_w .beyond05{transform: scale(3.2) translate(-200%,-200% )}
#beyond .beyond_w .beyond06{transform: scale(2.4) translate(200%,-200% )}
#beyond .beyond_w .beyond07{transform: scale(1.4) translate(250%,-200% )}
#beyond .beyond_w .beyond08{transform: scale(1.8) translate(-300%,200% )}
#beyond .beyond_w .beyond09{transform: scale(2.9) translate(300%,200% )}
#beyond .beyond_w .beyond11{transform: scale(1.4) translate(0%,200% )}
#beyond .beyond_w .beyond .w img{border-radius: 0px;display: block}
#beyond .beyond_w .beyond .w{    border: 1px solid #FFFFFF;
    border-radius: 12px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
	top: 0;left: 0}
#we_service{padding: 0 60px;padding-top: 200px;padding-bottom: 200px;background-color: #FF5700;}
#we_service .info_s_text{padding-left: 440px;padding-bottom: 255px}
#we_service .we_wrap{display: flex;flex-wrap: wrap;gap: 10px;padding: 0;perspective: 500px}
#we_service .we_wrap .icon{position: absolute;background: none;width: auto;height: auto;padding-top: 0;backdrop-filter: blur(0) !important;box-shadow: none !important}
#we_service .we_wrap .icon01{left: 15%;bottom: -100px}
#we_service .we_wrap .icon02{left: 66%;bottom: 270px;}
#we_service .we_wrap .icon03{left: 26%;top: 209px}
#we_service .we_wrap .icon04{top: 229px;right: 104px;}
#we_service .we_wrap > div{width: calc(16.66666% - 8.3333333px);background: rgba(255,255,255,0.2);padding-top: 16.3%;border-radius: 10px;position: relative; backdrop-filter:saturate(125%) blur(10px);will-change: transform; box-shadow: inset 0 0px 40px rgba(255, 255, 255, 0.2);}

#we_service .we_wrap{position: relative}
#we_service .we_wrap .info_s_text{position: absolute;background: none;padding: 0}
#we_service .we_wrap .info_s_text02{right: 0px;top: 0;width: calc(16.66666% - 8.3333333px);}
#we_service .we_wrap .info_s_text03{right: calc(33.33332%);;bottom: 0;width: calc(16.66666% - 8.3333333px);}

#we_service .we_wrap .info_s_text p{font-family: 'GowoonDodum';}
#we_service .we_wrap > div.info_s_text{filter: blur(0px);box-shadow: none}
#we_service .we_wrap > div.info_s_text p{color: #fff}
#we_service2{background: #FF5700;height: 2216px;position: relative}

#we_service2 .info_s_text{position: absolute;top: 50%;left: 50%}
#we_service2 .info_s_text01{margin-left: -366px;margin-top: -813px}
#we_service2 .info_s_text02{margin-left: 550px;margin-top: -93px}
#we_service2 .info_s_text03{margin-left: 358px;margin-top: 873px}
#we_service2 .info_s_text04{margin-left: -772px;margin-top: 743px}
#we_service2 .info_s_text p{color: #fff}
#we_service2 .icon{position: absolute;top: 50%;left: 50%}
#we_service2 .icon01{margin-top: -931px;margin-left: -41px}
#we_service2 .icon02{margin-top: -672px;margin-left: -487px}
#we_service2 .icon03{margin-top: -168px;margin-left: 708px}
#we_service2 .icon04{margin-top: 60px;margin-left: 125px}
#we_service2 .icon05{margin-top: 420px;margin-left: -675px}
#we_service2 .icon06{margin-top: 720px;margin-left: 114px}
#we_service2 .ser {position: absolute;top: 50%;left: 50%}
#we_service2 .ser .wr:after{content: '';display: block;width: 100%;height: 100%;background: url(/img/main/border.png);display: block;top: 0;left: 0;z-index: 15;position: absolute;background-size: 100% 100%;}
#we_service2 .ser .wr:hover:before{transform: translateX(100%)}
#we_service2 .ser .wr.wr_img .txt2 strong:hover em{transform: translateX(100%)}
#we_service2 .ser .wr{background: linear-gradient(-205deg, rgba(255,204,0,0.2), rgba(255,204,0,0));box-shadow: 0 20px 40px #ffffff50 inset;position: relative;padding-top: 100%;width: 300px;backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-radius: 10px;position: relative;overflow: hidden}
#we_service2 .ser .wr:before{content: '';display: block;position: absolute;top: 0;left: 0; width: 100%;height: 100%;background: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,0.5), rgba(255,255,255,0));transform: translateX(-100%);transition: 1s;mix-blend-mode: color-burn}
#we_service2 .ser .wr.wr_img .txt2 strong {overflow: hidden}
#we_service2 .ser .wr.wr_img .txt2 strong em{content: '';display: block;position: absolute;top: 0;left: 0; width: 100%;height: 100%;background: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,0.5), rgba(255,255,255,0));transform: translateX(-100%);transition: 1s;mix-blend-mode: color-burn}
/*#we_service2 .ser .wr.wr_img:before{content: '';display: block;width: 100%;height: 100%;    box-shadow: 0 40px 80px rgba(255,255,255,0.7) inset;position: absolute;top: 0;left: 0}*/
#we_service2 .ser .wr.wr_img .num{display: none;}
#we_service2 .ser .wr .num{position: absolute;top: 10px;left: 10px}
#we_service2 .ser .wr .num i{font-size: 12px;color: #FFFFFF}
#we_service2 .ser .wr .txt{position: absolute;top: 50%;left:0;width: 100%;transform: translateY(-50%);text-align: center;}
#we_service2 .ser .wr .txt2 strong{color: #FFFFFF;font-size: 20px;}
#we_service2 .ser .wr .txt strong{color: #FFFFFF;font-size: 18px}
#we_service2 .ser .wr.wr_img{padding-top: 0;border-radius: 10px;overflow: hidden}
#we_service2 .ser.ser04 .wr.wr_img .img{padding-top: 100%;width: 100%;position: relative}
#we_service2 .ser.ser04 .wr.wr_img .img .video{position: absolute;bottom: 0;left: -36%;height: 100%}
#we_service2 .ser.ser04 .wr.wr_img .img .video video{height: 100%}
#we_service2 .ser .wr.wr_img .img{padding-top: 100%;width: 100%;position: relative}
#we_service2 .ser .wr.wr_img .img .video{position: absolute;bottom: 0;left: -15%;height: 100%}
#we_service2 .ser .wr.wr_img .img .video video{height: 100%}
#we_service2 .ser .wr.wr_img:after{display: none}
#we_service2 .ser .wr.wr_img img{display: block}
#we_service2 .ser .wr.wr_img .img .video.video1{width: 100%;position: absolute;top: 0;left: 0}
#we_service2 .ser .wr.wr_img .video1 img{width: 100%}
#we_service2 .ser .wr .txt2{position: absolute;bottom: 0;left: 0;padding: 15px;background: #FF5700;;border-radius: 0 10px 0 0;padding-left: 0;padding-right: 0}
#we_service2 .ser .wr .txt2:before{content: '';display: block;width: 11px;height: 11px;background: url(/img/main/ser_dot.png);position: absolute;bottom: 0;right: -11px}
#we_service2 .ser .wr.wr_img .txt2{padding: 7px;padding-bottom: 0;padding-left: 0}
#we_service2 .ser .wr.wr_img .txt2 strong{display: block;padding: 0 30px;background: linear-gradient(-205deg, rgba(255, 204, 0, 0.2), rgba(255, 204, 0, 0));box-shadow: 0 10px 20px #ffffff50 inset;position: relative;backdrop-filter: blur(10px);border-radius: 10px;position: relative;line-height: 60px}
#we_service2 .ser .wr.wr_img .txt2 strong i{position: absolute;width: calc(100% - 20px);height: 1px;background: #fff;position: absolute;top: 0;left: 10px}
#we_service2 .ser .wr.wr_img .txt2 strong:before{content: '';display: block;width: 10px;height: 100%;background: url(/img/main/t_line1.png) no-repeat;top: 0;left: 0;position: absolute}
#we_service2 .ser .wr.wr_img .txt2 strong:after{content: '';display: block;width: 10px;height: 100%;background: url(/img/main/t_line2.png) no-repeat;top: 0;right: 0;position: absolute;}
#we_service2 .ser01{margin-left: -650px;margin-top: -892px;}
#we_service2 .ser02{margin-left: -440px;margin-top: -676px}
#we_service2 .ser03{margin-left: -900px;margin-top: -426px}
#we_service2 .ser04{margin-left: 350px;margin-top: -750px}
#we_service2 .ser05{margin-left: -300px;margin-top: 47px}
#we_service2 .ser06{margin-left: 410px;margin-top: 494px}
#we_service2 .ser07{margin-left: -777px;margin-top: 274px}
#we_service2 .ser08{margin-left: -470px;margin-top: 44px}
#we_service2 .ser09{margin-left: -20px;margin-top: -176px}
#we_service2 .ser10{margin-left: 310px;margin-top: 44px}
#we_service2 .ser11{margin-left: 180px;margin-top: -360px}
#we_service2 .ser12{margin-left: 700px;margin-top: 284px}
#we_service2 .ser01 .wr{width: 200px}
#we_service2 .ser02 .wr{width: 240px}
#we_service2 .ser03 .wr{width: 450px}
#we_service2 .ser04 .wr{width: 550px}
#we_service2 .ser05 .wr{width: 600px}
#we_service2 .ser06 .wr{width: 200px}
#we_service2 .ser07 .wr{width: 200px}
#we_service2 .ser08 .wr{width: 160px}
#we_service2 .ser09 .wr{width: 200px}
#we_service2 .ser10 .wr{width: 240px}
#we_service2 .ser11 .wr{width: 160px}
#we_service2 .ser12 .wr{width: 200px}

/* 그라데이션 테두리 */


/*
#we_service .we_wrap > div.ser01{background: #F85D16}
#we_service .we_wrap > div.ser02{background: #FD6B22}
#we_service .we_wrap > div.ser03{background: #FF7E35}
#we_service .we_wrap > div.ser04{background: #FF904F}
#we_service .we_wrap > div.ser05{background: #FB630E}
#we_service .we_wrap > div.ser06{background: #FE6A15}
#we_service .we_wrap > div.ser07{background: #FF8839}
#we_service .we_wrap > div.ser08{background: #FFB17D}
#we_service .we_wrap > div.ser09{background: #FF872D}
#we_service .we_wrap > div.ser10{background: #FF8C3F}
#we_service .we_wrap > div.ser11{background: #FFB180}
#we_service .we_wrap > div.ser12{background: #FEC29C}
*/

/*#we_service .we_wrap > div{background: rgba(246,86,11,0.9)}*/
/*#we_service .we_wrap > div.ser02{background: linear-gradient(-45deg, rgba(246,86,11,0.9), rgba(246,86,11,0.6))}*/
#we_service .we_wrap > div .txt{position: absolute;width: 100%;height: 100%;position: absolute;top: 0;left: 0;display: flex;justify-content: center;align-items: center;text-align: center;justify-content: center;flex-direction: column;gap: 8px;}
#we_service .we_wrap > div .txt em{color: #fff;font-size: 15px;    font-family: "amandine", sans-serif;}
#we_service .we_wrap > div .txt strong{font-size: 19.5px;color: #FFFFFF;line-height: 30px;font-weight: 500}
#we_service .we_wrap > div .num{position: absolute;top: 10px;left: 10px;}
#we_service .we_wrap > div .num i{color: #FFFFFF;font-size: 14px}
#we_service2 .ser{opacity: 1;perspective: 500px}
#we_service2 .ser02 .wr{transform: rotate3d(4, -4, -3, 45deg);}
#we_service2 .ser01 .wr{transform: rotate3d(24, 26, -23, 65deg);}
#we_service2 .ser03 .wr{transform: rotate3d(14, 126, -53, 35deg)}
#we_service2 .ser04 .wr{transform: rotate3d(10, -80, 53, 5deg)}
#we_service2 .ser05 .wr{transform: rotate3d(10, 10, -10, 25deg);}
#we_service2 .ser06 .wr{transform: rotate3d(50, -50, 30, 35deg);}
#we_service2 .ser07 .wr{transform:rotate3d(-50, -50, 30, 35deg);}
#we_service2 .ser08 .wr{transform: rotate3d(50, -50, -30, 35deg);}
#we_service2 .ser09 .wr{transform: rotate3d(50, -50, 30, 23deg);}
#we_service2 .ser10 .wr{transform: rotate3d(10, 10, -10, 25deg);}
#we_service2 .ser12 .wr{transform: rotate3d(10, 10, -10, 25deg);}
#we_service2 .ser11 .wr{transform: rotate3d(24, 26, -23, 65deg)}

#we_service2 .ser .wr{transition: 1s;opacity: 0}
#we_service2 .ser02 .wr{transition-delay: 0.2s}
#we_service2 .ser03 .wr{transition-delay: 0.4s}
#we_service2 .ser04 .wr{transition-delay: 0.6s}
#we_service2 .ser05 .wr{transition-delay: 0.8s}
#we_service2 .ser06 .wr{transition-delay: 1.0s}
#we_service2 .ser07 .wr{transition-delay: 1.2s}
#we_service2 .ser08 .wr{transition-delay: 1.4s}
#we_service2 .ser09 .wr{transition-delay: 1.8s}
#we_service2 .ser10 .wr{transition-delay: 2s}
#we_service2 .ser12 .wr{transition-delay: 2.2s}
#we_service2.on .ser .wr{opacity: 1;transform: rotate3d(0, 0, 0, 0deg)}

#we_service2 .info_s_text p.on{background: #fff;color: #FF5700}

#we_service .we_wrap > div.ser01{transform: rotateX(20deg) rotateY(10deg) translateX(-200px) translateY(-390px)}
#we_service .we_wrap > div.ser02{transform: rotateX(20deg) rotateY(10deg) translateX(0px) translateY(-390px)}
#we_service .we_wrap > div.ser03{transform: rotateX(20deg) rotateY(10deg) translateX(100px) translateY(-390px)}
#we_service .we_wrap > div.ser04{transform: rotateX(20deg) rotateY(-10deg) translateX(200px) translateY(-390px)}
#we_service .we_wrap > div.ser05{transform: rotateX(20deg) rotateY(10deg) translateX(-400px) translateY(-200px)}
#we_service .we_wrap > div.ser06{transform: rotateX(20deg) rotateY(10deg) translateX(-200px) translateY(-200px)}
#we_service .we_wrap > div.ser07{transform: rotateX(20deg) rotateY(-10deg) translateX(200px) translateY(-200px)}
#we_service .we_wrap > div.ser08{transform: rotateX(20deg) rotateY(-10deg) translateX(300px) translateY(-100px)}
#we_service .we_wrap > div.ser09{transform: rotateX(-20deg) rotateY(10deg) translateX(-300px) translateY(300px)}
#we_service .we_wrap > div.ser10{transform: rotateX(-20deg) rotateY(5deg) translateX(-150px) translateY(200px)}
#we_service .we_wrap > div.ser11{transform: rotateX(-20deg) rotateY(5deg) translateX(150px) translateY(200px)}
#we_service .we_wrap > div.ser12{transform: rotateX(-20deg) rotateY(5deg) translateX(300px) translateY(200px)}
#we_service .we_wrap > div.ser01{margin-right: calc(16.66666%);}
#we_service .we_wrap > div.ser04{margin-right: calc(16.66666%);}
#we_service .we_wrap > div.ser06{margin-right: calc(16.66666%);}
#we_service .we_wrap > div.ser07{margin-right: calc(16.66666%);}
#we_service .we_wrap > div.ser10{margin-right: calc(16.66666%);}
#we_service .we_wrap > div.ser09{margin-left: calc(16.66666%);}

/*#we_service .we_wrap > div.ser02{background: linear-gradient(-45deg, rgba(255,87,0,1), rgba(588,87,0,0.5))}*/
/* new - 250924 */

.l_logo{position: fixed;z-index: 99;top: 50%;transform: translateY(-50%);left: 30px;}
.quick{position: fixed;z-index: 99;bottom: 30px;right: 30px;display: flex;flex-direction: column;align-items: flex-end;gap: 33.33px}
.quick ul{display: flex;gap: 10px;}
.quick ul li a{display: flex;width: 200px;height: 60px;box-sizing: border-box;border-radius: 30px;}
.quick ul li a.phone{display: flex;align-items: center;border: 1px solid #FEB56D70;border-radius: 30px;padding-left: 10px;gap: 14px;    font-family: 'AvantGarde Bk BT', sans-serif;background: rgba(248,242,239,1);backdrop-filter: blur(20px)}
.quick ul li a.phone span{font-size: 17px;color: #4A3E25;}
.quick ul li a.contact{border-radius: 30px;overflow: hidden;position: relative}
.quick ul li a.contact:before{content: '';display: block;width: 200%;height: 100%;background: linear-gradient(to left, #FF9900, #E7420E, #FF9900);position: absolute;right: 0;top: 0;transition: 0.4s}
.quick ul li:hover a.contact:before{transform: translateX(50%)}
.quick ul li a.contact div{height: 100%;display: flex;width: 100%;align-items: center;padding: 0 30px;gap: 14px;justify-content: space-between;position: relative;z-index: 2}
.quick ul li a.contact div strong{font-size: 20px;color: #FFFFFF;    font-family: 'AvantGarde Bk BT', sans-serif;font-weight: 400}
.quick ul li a.contact div{height: 100%;display: flex;align-items: center;width: 100%;align-items: center;border-radius: 30px;padding: 0 30px}
.btn_top{ position: fixed; right: 35px; bottom: 210px; z-index: 99; display: none; }
.btn_top button{width: 40px;height: 40px;position: relative}
.btn_top button .bg{display: block;width: 50px;height: 50px;border-radius: 50%;border: 1px solid #C6BAB0;padding: 5px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);transition: 0.7s}
.btn_top button:hover .bg{width: 58px;height: 58px;}
.btn_top button .bg i{display: block;width: 100%;height: 100%;background: #FFFFFF;border-radius: 50%;box-shadow: 0 0 20px rgba(81,52,27,0.25)}
.btn_top button > div{width: 100%;height: 100%;overflow: hidden;position: relative;z-index: 5}
.btn_top button > div > div{display: flex;width: 100%;height: 100%;align-items: center;justify-content: center;transition: 0.7s}
.btn_top button:hover > div > div{transform: translateY(-100%)}
#scroll{position: fixed;height: 4px;width: 100%; bottom: 0;left: 0;z-index: 99;background: #E4E4E4}
#scroll .sandglass{position: absolute;bottom: 55px;left: 45px;}
#scroll .sandglass img{display: block}
#scroll .sandglass .sand{position: absolute;top: 0;left: 0}
#scroll .sandglass .sand_top{left: 14%;top: 10%;clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);}
#scroll .sandglass .sand_bottom{left: 14%;top: 54%;clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);}
#scroll i{position: absolute;top: 0;left: 0;position: absolute;top: 0;left: 0;width: 0%;height: 100%;background: linear-gradient(to right, #FFB300, #E7420E)}
#scroll span{position: absolute;bottom: 52px;left: 72.4px;font-size: 40px;color: #51341B;    font-family: "the-seasons", sans-serif;}
.main_visual{position: relative;display: flex;align-items: center;justify-content: center;z-index: 2}
.main_visual .vis_title{position: absolute;top: 0%;left: 0%;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;z-index: 10;flex-direction: column}
.main_visual .vis_title strong{font-size: 150px;color: #51341B;font-family: "the-seasons", sans-serif;font-family: "the-seasons", sans-serif;font-weight: 400;line-height: 1}
.main_visual .vis_title .tit_w01{margin-left: -130px}
.main_visual .vis_title .tit_w02{transform: translateX(216px)}
#main #top_1{padding:0 60px;padding-top: 270px; position: relative;}
#main #top_1 .shape{position: absolute}
#main #top_1 .shape01{top: 418px;left: 101px}
#main #top_1 .shape02{top: 620px;left: 50%;margin-left: 20px}
#main #top_1 .shape03{top: 182px;left: 50%;margin-left: 597px}
#main #top_1 .title{display: flex;align-items: flex-end;margin-bottom: 65px;gap: 50px;}
#main #top_1 .title strong{display: block;font-size: 100px;color: #51341B;line-height: 1.2;font-family: "the-seasons", sans-serif;font-weight: 400}
#main #top_1 .title strong *{font-family: inherit}
#main #top_1 .title strong i{font-size: 70px;font-family: inherit;color: inherit;}
#main #top_1 .title .txt{margin-top: 10px;padding-bottom: 20px;}
#main #top_1 .title .txt div{position: relative}
#main #top_1 .title .txt div .on{position: absolute;top: 0;left: 0;color: #51341B;clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);}
#main #top_1 .title .txt p{font-size: 20px;color: #C4B6AB;line-height: 1.5;font-weight: 500}
#main #top_1 .work_list2 ul{display: flex;flex-wrap: wrap;gap: 20px;perspective: 1200px;perspective-origin: bottom center}
#main #top_1 .work_list2 ul li{width: calc(33.33% - 13.33px);transform: rotateX(90deg) translateY(100%);opacity: 0;transition: 0.7s}
#main #top_1.on .work_list2 ul li{transform: rotateX(0deg);opacity: 1;}
#main #top_1.on .work_list2 ul li:nth-child(6), #main #top_1.on .work_list2 ul li:nth-child(4), #main #top_1.on .work_list2 ul li:nth-child(5){transition-delay: 0.3s}
#main #top_1.on .work_list2 ul li:nth-child(7), #main #top_1.on .work_list2 ul li:nth-child(8), #main #top_1.on .work_list2 ul li:nth-child(9){transition-delay: 0.6s}
#main #top_1.on .work_list2 ul li:nth-child(10), #main #top_1.on .work_list2 ul li:nth-child(11), #main #top_1.on .work_list2 ul li:nth-child(12){transition-delay: 0.9s}
#main #top_1 .work_list2 ul li .info{position: relative;z-index: 5;transition: 0.5s}
#main #top_1 .work_list2 ul li:hover .info{transform: translateY(-40px)}
#main #top_1 .work_list2 ul li .info_w{height: 180px;width: 100%;display: flex;align-items: flex-end;height: 180px;border-radius: 10px;border: 1px solid #fff;background: linear-gradient(-45deg, rgba(255,255,255,0), rgba(255,255,255,1));backdrop-filter: blur(20px);padding: 40px;position: relative;overflow: hidden}
#main #top_1 .work_list2 ul li .info_w:after{content: '';display: block;width: 100%;height: 311px;position: absolute;bottom: 0;background: url(/img/main/top1_bg.png) bottom center;left: 0;transform: translateY(100%);transition: 0.4s}
#main #top_1 .work_list2 ul li:hover .info_w:after{transform: translateY(0)}
#main #top_1 .work_list2 ul li .info_w .info strong{display: block;    font-family: "the-seasons", sans-serif;font-size: 26px;color: #51341B;margin-bottom: 4px;position: relative;transition: 0.5s}
#main #top_1 .work_list2 ul li:hover .info_w .info strong, #main #top_1 .work_list2 ul li:hover .info_w .info p{color: #fff}
#main #top_1 .work_list2 ul li .info_w i{display: block;width: 6px;height: 6px;position: absolute;border-radius: 50%;z-index: 2;transition: 0.5s}
#main #top_1 .work_list2 ul li .info_w i:after{content: '';display: block;width: 20px;height: 20px;border-radius: 50%;position: absolute;top: 50%;left: 50%;margin-top: -10px;margin-left: -10px; background: inherit;opacity: 1;animation: dot_cir 1s infinite linear;transform: scale(0)}
@keyframes dot_cir{
    0%{transform: scale(0);opacity: 1}
    100%{transform: scale(1);opacity: 0}
}
#main #top_1 .work_list2 ul li .info p{transition: 0.5s;color: #7B6450;font-size: 18px;font-weight: 300}
#main #top_1 .work_list2 ul li:hover .info_w i.b_dot{opacity: 0}
#main #top_1 .work_list2 ul li .info_w i.b_dot{left: 17px;top: 17px;background: #EC6D00}
#main #top_1 .work_list2 ul li .info_w i.a_dot{right: 17px;bottom: 17px;background: #fff;opacity: 0}
#main #top_1 .work_list2 ul li:hover .info_w i.a_dot{opacity: 1}
#main #unique{padding-top: 154px;position: relative;background: #FFFBF7}
#main #unique .gl_wrap01{left: 50%;margin-left: -677px;top: 0}
#main #unique .gl_wrap02{left: 50%;margin-left: 218px;top: 562px}
#main #unique .gl_wrap .gl_in .gl{position: relative}
#main #unique .gl_wrap01 .gl_in .gl01{top: 176px;}
#main #unique .gl_wrap01 .gl_in .gl02{top: 105px;}
#main #unique .gl_wrap01 .gl_in .gl04{top: 50px;}
#main #unique .gl_wrap01 .gl_in .gl05{top: 91px;}
#main #unique .gl_wrap01 .gl_in .gl01 i{height: 128px;}
#main #unique .gl_wrap01 .gl_in .gl02 i{height: 172px;}
#main #unique .gl_wrap01 .gl_in .gl03 i{height: 351px;}
#main #unique .gl_wrap01 .gl_in .gl04 i{height: 244px;}
#main #unique .gl_wrap01 .gl_in .gl05 i{height: 132px;}
#main #unique .gl_wrap02 .gl_in .gl01 i{height: 172px;}
#main #unique .gl_wrap02 .gl_in .gl02 i{height: 351px;}
#main #unique .gl_wrap02 .gl_in .gl03 i{height: 244px;}
#main #unique .gl_wrap02 .gl_in .gl01{top: 105px;}
#main #unique .gl_wrap02 .gl_in .gl03{top: 50px;}

#main #unique .gl_wrap03{bottom: -290px;left: -139px;z-index: 3}
#main #unique .gl_wrap03 .gl_in .gl01 i{height: 408px;}
#main #unique .gl_wrap03 .gl_in .gl02 i{height: 254px;}
#main #unique .gl_wrap03 .gl_in .gl03 i{height: 314px;}
#main #unique .gl_wrap03 .gl_in .gl04 i{height: 381px;}
#main #unique .gl_wrap03 .gl_in .gl05 i{height: 252px;}
#main #unique .gl_wrap03 .gl_in .gl06 i{height: 128px;}
#main #unique .gl_wrap03 .gl_in .gl02{top: 88px;}
#main #unique .gl_wrap03 .gl_in .gl03{top: 73px;}
#main #unique .gl_wrap03 .gl_in .gl04{top: 43px;}
#main #unique .gl_wrap03 .gl_in .gl05{top: 123px;}
#main #unique .gl_wrap03 .gl_in .gl06{top: 259px;}

#main #unique .gl_wrap04{top: -101px;right: 396px;z-index: 3}
#main #unique .gl_wrap04 .gl_in .gl01 i{height: 128px;}
#main #unique .gl_wrap04 .gl_in .gl02 i{height: 172px;}
#main #unique .gl_wrap04 .gl_in .gl03 i{height: 307px;}
#main #unique .gl_wrap04 .gl_in .gl04 i{height: 244px;}
#main #unique .gl_wrap04 .gl_in .gl05 i{height: 132px;}

#main #unique .gl_wrap04 .gl_in .gl01{top: 153px}
#main #unique .gl_wrap04 .gl_in .gl02{top: 82px}
#main #unique .gl_wrap04 .gl_in .gl04{top: 27px}
#main #unique .gl_wrap04 .gl_in .gl05{top: 68px}

#main #unique .gl_wrap05{bottom: -102px;margin-left: -344px;left: 50%; z-index: 3}
#main #unique .gl_wrap05 .gl_in .gl01 i{height: 292px;}
#main #unique .gl_wrap05 .gl_in .gl02 i{height: 183px;}
#main #unique .gl_wrap05 .gl_in .gl03 i{height: 244px;}
#main #unique .gl_wrap05 .gl_in .gl04 i{height: 132px;}
#main #unique .gl_wrap05 .gl_in .gl01 {top: 30px;}
#main #unique .gl_wrap05 .gl_in .gl02 {top: 106px;}
#main #unique .gl_wrap05 .gl_in .gl04 {top: 56px;}

#main #unique .gl_wrap06{bottom: -61px;margin-left: -203px;left: 50%; z-index: 3}
#main #unique .gl_wrap06 .gl_in .gl01 i{height: 123px;}
#main #unique .gl_wrap06 .gl_in .gl02 i{height: 244px;}
#main #unique .gl_wrap06 .gl_in .gl03 i{height: 132px;}
#main #unique .gl_wrap06 .gl_in .gl01{top: 46px}
#main #unique .gl_wrap06 .gl_in .gl03{top: 44px}


#main #unique .shape_bg {position: absolute}
#main #unique .shape_bg01{top: 418px;left: -157px;mix-blend-mode: darken}
#main #unique .shape_bg02{top: 624px;right: -40px}
#main #unique .uni_title{width: 1200px;margin: 0 auto;margin-bottom: 59px;position: relative;z-index: 2}
#main #unique .uni_title .tit01 strong{font-size: 150px;color: #51341B;    font-family: "amandine", sans-serif;font-weight: 400}
#main #unique .uni_title .tit02 {display: flex;justify-content: space-between;align-items: center;margin-top: -32px;margin-bottom: 160px;}
#main #unique .uni_title .tit02 strong{font-size: 90px;color: #51341B;font-family: "the-seasons", sans-serif;font-weight: 400}
#main #unique .uni_title .tit02 .line{position: relative;width: 246px;height: 1px;background: #E3D0C7}
#main #unique .uni_title .tit02 .line:before{content: '';display: block;width: 16px;height: 16px;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));  backdrop-filter: blur(20px);border-radius: 2px;left: -8px;top: 50%;margin-top: -8px;position: absolute}
#main #unique .uni_title .tit02 .line:after{content: '';display: block;width: 16px;height: 16px;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));  backdrop-filter: blur(20px);border-radius: 2px;right: -8px;top: 50%;margin-top: -8px;position: absolute}
#main #unique .uni_title .tit02 .line i{width: 4px;height: 4px;background: #E3D0C7;border-radius: 50%;display: block;position: absolute;z-index: 2}
#main #unique .uni_title .tit02 .line i:nth-child(1){top: 50%;margin-top: -2px; left: -1.5px;}
#main #unique .uni_title .tit02 .line i:nth-child(2){top: 50%;margin-top: -2px;right: -1.5px;}
#main #unique .uni_title .tit02 .line2{width: 122px;}
#main #unique .uni_title .tit02 .txt_b{display: flex;flex-direction: column-reverse;position: relative;top: 74px;}
#main #unique .uni_title .tit02 .txt_b p{display: block;font-size: 20px;line-height: 1.5;color: #51341B;font-weight: 500}
#main #unique .uni_title .tit02 .txt_b p b{color: #FF5700}
#main #unique .uni_title .tit02 .txt_b p span{font-weight: 600;position: relative}
#main #unique .uni_title .tit02 .txt_b p span i{position: absolute;height: 1.5px;background: #51341B;width: 0%;bottom: -1px;left: 0}
#main #unique .unique_list {padding-bottom: 622px;position: relative;display: flex;align-items: center;justify-content: center;z-index: 5}
#main #unique .unique_list .project_info{position: absolute;left: 50%;margin-left: 492px;background: linear-gradient(45deg, rgba(255,243,230,0.7), rgba(255,249,243,0.7));border-radius: 10px;backdrop-filter: blur(20px);width: 300px;padding: 40px; top: 400px;z-index: 15;border: 1px solid #FFCE8F}
#main #unique .unique_list .project_info ul li{padding: 28px 0;border-bottom: 1px dashed #51341B20}
#main #unique .unique_list .project_info ul li:last-child{border-bottom: none;padding-bottom: 0}
#main #unique .unique_list .project_info ul li:nth-child(1){padding-top: 0}
#main #unique .unique_list .project_info ul li span{display: block;color: #51341B;    font-family: 'AvantGarde Bk BT', sans-serif;display: block;margin-bottom: 6px;}
#main #unique .unique_list .project_info ul li p{font-size: 18px;color: #51341B; font-family: 'AvantGarde Bk BT', sans-serif;display: flex;align-items: center;gap: 8px;margin-bottom: 12px}
#main #unique .unique_list .project_info ul li p:last-child{margin-bottom: 0}
#main #unique .unique_list .project_info ul li p svg{display: block}
#main #unique .unique_list .monitor_w{position: absolute;width: 100%;height: 100vh;position: absolute;top: 0;left: 0;align-items: center;justify-content: center;display: flex;perspective: 400px}
#main #unique .unique_list .monitor_w .monitor_in{width: 1400px;height: 812px;padding: 10px;background: linear-gradient(to left, rgba(233,224,215,0.5), rgba(219,202,183,0.5), rgba(233,224,215,0.5));backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 10px}
#main #unique .unique_list .monitor_w .monitor{width: 100%;height: 100%;background: #000;position: relative;overflow: hidden;border-radius: 6px}
#main #unique .unique_list .monitor_w .monitor .moni_img:after{content: '';position: static}
#main #unique .unique_list .monitor_w .monitor .moni_img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);; opacity: 0}
#main #unique .unique_list .monitor_w .monitor .moni_img:before{content: '';display: block;width: 200%;height: 200%;background: #000;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)}
#main #unique .unique_list .monitor_w .monitor .moni_img img{display: block;position: relative;z-index: 15}
#main #unique .unique_list .monitor_w .monitor .moni_img video{width: 100%}
#main #unique .unique_list .monitor_w .monitor .moni_img01{opacity: 1}
#main #unique .unique_list .ring_content{position: relative}
#main #unique .unique_list .ring_content2{position: absolute}
#main #unique .unique_list .ring_content2 .ring_b{opacity: 0}

#main #unique .unique_list .ring_content .mem{position: absolute;z-index: 15;transform: translateY(30px);opacity: 0;transition: 0.7s;text-align: center}
#main #unique .unique_list .ring_content .mem.on{transform: translateY(0px);opacity: 1}
#main #unique .unique_list .ring_content .mem i{position: absolute;width: 100%;height: 100%;display: block;top: 0;left: 0;border-radius: 50%;border: 1.5px solid #EB490C;animation: 1s cir_wave infinite linear}
#main #unique .unique_list .ring_content .mem i:nth-child(2){animation-delay: 0.333s}
#main #unique .unique_list .ring_content .mem i:nth-child(3){animation-delay: 0.666s}
@keyframes cir_wave{
    0%{opacity: 1;transform: scale(1)}
    100%{opacity: 0;transform: scale(1.2)}
}
#main #unique .unique_list .ring_content .mem .mem_img{position: relative;display: inline-block}
#main #unique .unique_list .ring_content .mem .mem_img .img{width: 130px;background: #fff;border-radius: 50%;overflow: hidden;margin: 0 auto;border: 1.5px solid #EB490C;box-shadow: 0 0 40px #FF8800;position: relative}
#main #unique .unique_list .ring_content .mem .mem_img span{position: absolute;right: -8px;top: -8px;    font-family: "amandine", sans-serif;font-size: 20px;color: #EB490C;font-weight: 500}
#main #unique .unique_list .ring_content .mem .mem_img .img img{display: block;max-width: 100%}
#main #unique .unique_list .ring_content .mem .mem_info{padding-top: 25px}
#main #unique .unique_list .ring_content .mem .mem_info strong{display: block;font-size: 18px;color: #51341B;text-align: center;margin-bottom: 5px}
#main #unique .unique_list .ring_content .mem .mem_info p{display: block;font-size: 15px;color: #51341B;text-align: center}

#main #unique .unique_list .ring_content .mem01{left: 10%;top: 25%}
#main #unique .unique_list .ring_content .mem02{right: 10%;top: 35%}
#main #unique .unique_list .ring_content .mem03{left: 10%;top: 43%}
#main #unique .unique_list .ring_content .mem04{right: -5%;top: 60%}
#main #unique .unique_list .ring_content .mem05{left: -4%;top: 68%}
#main #unique .unique_list .ring_content .mem06{right: 20%;top: 83%}
#main #unique .unique_list .ring_content .mem07{left: 20%;top: 90%}
#main #unique .unique_list .ring_content .mem08{right: 25%;top: 100%;}
#main #unique .unique_list .ring_list{display: flex;flex-direction: column;gap: 600px;padding-top: 635px;}
#main #unique .unique_list .ring_list .ring_box{position: relative}
#main #unique .unique_list .ring_list .ring {width: 100%;display: flex;justify-content: center;position: relative}
#main #unique .unique_list .ring_list .ring_box .ring_f{position: absolute;bottom: -6px;left: 0}
#main #unique .unique_list .ring_list .desk_wrap{position: absolute;width: 100%;height: 100vh;display: flex;align-items: center;justify-content: center}
#main #unique .unique_list .ring_list .desk_wrap{position: absolute;width: 100%;height: 100vh;display: flex;align-items: center;justify-content: center}
#main #unique .info_s_text{position: absolute;right: 235px;bottom: 150px}

#main .gl_wrap{position: absolute}
#main .gl_wrap .gl_in{display: flex}
/*
#main .gl_wrap .gl_in .gl{animation: bar 3s infinite linear}
#main .gl_wrap .gl_in .gl02{animation-delay: 0.2s}
#main .gl_wrap .gl_in .gl03{animation-delay: 0.3s}
#main .gl_wrap .gl_in .gl05{animation-delay: 0.4s}
#main .gl_wrap .gl_in .gl06{animation-delay: 0.9s}
#main .gl_wrap .gl_in .gl07{animation-delay: 0.6s}
#main .gl_wrap .gl_in .gl08{animation-delay: 0.4s}
*/
@keyframes bar{
    0%{transform: scaleY(1)}
    50%{transform: scaleY(0.8)}
    100%{transform: scaleY(1)}
}
#main .gl_wrap .gl_in .gl i{display: block;backdrop-filter:blur(20px);width:  50px;height: 200px;border-radius: 6px;background: linear-gradient(to left,rgba(255,255,255,0),#ffffff);border: 1px solid #fff}
#contact{position: relative;padding-top: 100px;padding-bottom: 215px;background: #FFFBF7;overflow: hidden}
#contact .thd_logo{display: flex;align-items: center;justify-content: center;position: relative;z-index: 2;transition: 1s}
#contact .copy {position: absolute;top: 200px}
#contact .txt_w strong{font-size: 300px;color: #FCE6D0; font-family: "amandine", sans-serif;font-weight: 700;white-space: nowrap}
#contact .txt_w .txt strong{font-family: inherit}
#contact .txt_w .copy strong{
  animation: marquee-top 150s linear infinite;
    display: block;
    font-weight: 400;
}
@keyframes marquee-top {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

/*#contact .thd_logo .thd_w{position: relative;transform: translateY(0%)}*/
#contact .thd_logo .thd_w{position: relative;transform: translateY(100%)}
#contact .thd_logo .thd_w .img{position: absolute;top: 0;left: 0;mix-blend-mode: overlay}
#contact .logo_wave_content svg{opacity: 0}
#contact .logo_wave_content{position: relative;height: 422px;margin-top: -260px;z-index: 5}
#contact .logo_wave_content .logo_w{position: absolute;right: 0;bottom: 0;perspective: 200px}
#contact .logo_wave_content .logo_way{position: absolute;left: 50%;transform: translateX(-26%)}
#contact .logo_wave_content .logo_w div{;background: linear-gradient(-45deg, rgba(249,221,207,0.4), rgba(249,221,207,0.0));  transform: rotateY(-10deg);backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 10px}
#contact .logo_wave_content .logo_w div img{display: block;mix-blend-mode: multiply}
#contact .port{position: absolute;perspective: 400px}
#contact .port .port_w{padding: 10px;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));  backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 20px}
#contact .port .port_w .port_in{border-radius: 20px;overflow: hidden}
#contact .port .port_w .port_in img{display: block}
#contact .port.port01{top: 135px;left: 50%;margin-left: -696px;}
#contact .port.port02{top: 420px;left: 50%;margin-left: 337px;}
#contact .port.port03{bottom: 152px;left: 50%;margin-left: -394px;}

#contact .copy .copy01 strong{font-family: "the-seasons", sans-serif;font-weight: 300;font-size: 300px;color: #51341B;white-space: nowrap;line-height: 150px; animation: scroll 100s linear infinite;display: block}
#contact .txt_w .txt{display: flex;justify-content: center;align-items: center;gap: 6px;flex-direction: column;margin-top: 150px;position: relative;z-index: 5}
#contact .txt_w .txt .on{position: absolute;top: 0;left: 0;color: #51341B;clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);}
#contact .txt_w .txt div{position: relative}
#contact .txt_w .txt strong{color: #C4B6AB;font-size: 50px;font-weight: 700}
#contact .txt_w .btn_w{margin-top: 48px;position: relative}
#contact .txt_w .btn_w .water_drop{position: absolute;top: 70%;left: 50%;transform: translate(-50%,-50%);mix-blend-mode: overlay;mix-blend-mode: color-burn}
/*#contact .txt_w .btn_w .water_drop:after{content: '';display: block;width: 100%;height: 200px;background: linear-gradient(to top, rgba(255,255,255,0), rgba(255,255,255,1));position: absolute;top: 0;left: }*/
#contact .txt_w .btn_w a{display: flex;align-items: center;justify-content: center;width: 180px;height: 180px;border: 1px solid #FFFFFF;border-radius: 50%;position: relative;margin: 0 auto;overflow: hidden}
#contact .txt_w .btn_w a span{font-size: 20px;color: #FFFFFF;position: relative;z-index: 5;font-family: "amandine", sans-serif;}
#contact .txt_w .btn_w a i{position: absolute;height: 200%;width: 100%;background: linear-gradient(to top, #FFB300, #E7420E,  #FFB300);top: 0;transition: 0.5s;pointer-events: none}
#contact .txt_w .btn_w a:hover i{transform: translateY(-50%)}

#contact .gl_wrap01{bottom: 0;left: 0}
#contact .gl_wrap01 .gl_in{align-items: flex-end}
#contact .gl_wrap01 .gl_in .gl01 i{height: 166px}
#contact .gl_wrap01 .gl_in .gl02 i{height: 242px}
#contact .gl_wrap01 .gl_in .gl03 i{height: 180px}
#contact .gl_wrap01 .gl_in .gl04 i{height: 268px}
#contact .gl_wrap01 .gl_in .gl05 i{height: 357px}
#contact .gl_wrap01 .gl_in .gl06 i{height: 318px}
#contact .gl_wrap01 .gl_in .gl07 i{height: 229px}
#contact .gl_wrap01 .gl_in .gl08 i{height: 179px}
#contact .gl_wrap01 .gl_in .gl09 i{height: 50px}
#contact .gl_wrap01 .gl_in .gl10 i{height: 229px}
#contact .gl_wrap01 .gl_in .gl11 i{height: 190px}

#contact .gl_wrap04{right: 0;bottom: 0}
#contact .gl_wrap04 .gl_in{align-items: flex-end}
#contact .gl_wrap04 .gl_in .gl01 i{height: 166px}
#contact .gl_wrap04 .gl_in .gl02 i{height: 203px}
#contact .gl_wrap04 .gl_in .gl03 i{height: 115px}
#contact .gl_wrap04 .gl_in .gl04 i{height: 140px}
#contact .gl_wrap04 .gl_in .gl05 i{height: 219px}
#contact .gl_wrap04 .gl_in .gl06 i{height: 167px}
#contact .gl_wrap04 .gl_in .gl07 i{height: 229px}
#contact .gl_wrap04 .gl_in .gl08 i{height: 262px}
#contact .gl_wrap04 .gl_in .gl09 i{height: 181px}
#contact .gl_wrap04 .gl_in .gl10 i{height: 268px}
#contact .gl_wrap04 .gl_in .gl11 i{height: 219px}
#contact .gl_wrap04 .gl_in .gl12 i{height: 318px}
#contact .gl_wrap04 .gl_in .gl13 i{height: 229px}


#contact .gl_wrap02{top: 407px;left: 50%;margin-left: -416px;z-index: 2;}
#contact .gl_wrap02 .gl_in .gl01{position: relative;top: 30px;}
#contact .gl_wrap02 .gl_in .gl03{position: relative;top: 80px;}
#contact .gl_wrap02 .gl_in .gl04{position: relative;top: 54px;}
#contact .gl_wrap02 .gl_in .gl05{position: relative;top: 111px;}
#contact .gl_wrap02 .gl_in .gl01 i{height: 118px}
#contact .gl_wrap02 .gl_in .gl02 i{height: 268px}
#contact .gl_wrap02 .gl_in .gl03 i{height: 242px}
#contact .gl_wrap02 .gl_in .gl04 i{height: 228px}
#contact .gl_wrap02 .gl_in .gl05 i{height: 133px}


#contact .gl_wrap03{top: 0;left: 50%;margin-left: 96px;z-index: -1;}
#contact .gl_wrap03 .gl_in .gl01 i{height: 118px}
#contact .gl_wrap03 .gl_in .gl02 i{height: 460px}
#contact .gl_wrap03 .gl_in .gl03 i{height: 737px}
#contact .gl_wrap03 .gl_in .gl04 i{height: 546px}
#contact .gl_wrap03 .gl_in .gl05 i{height: 243px}

#contact .gl_wrap05{top: 243px;left: 50%;margin-left: 527px;z-index: 2;}
#contact .gl_wrap05 .gl_in .gl01 i{height: 203px}
#contact .gl_wrap05 .gl_in .gl02{position: relative;top: 30px;}
#contact .gl_wrap05 .gl_in .gl03{position: relative;top: 6px;}
#contact .gl_wrap05 .gl_in .gl04{position: relative;top: 85px;}
#contact .gl_wrap05 .gl_in .gl02 i{height: 268px}
#contact .gl_wrap05 .gl_in .gl03 i{height: 136px}
#contact .gl_wrap05 .gl_in .gl04 i{height: 121px}
#contact .bg01{height: 200px;width: 100%;top: 0;left: 0;position: absolute;z-index: 3;pointer-events: none;background: linear-gradient(to bottom, rgba(248,242,239,1), rgba(248,242,239,0))}
#contact .bg02{height: 300px;width: 100%;bottom: 0;left: 0;position: absolute;z-index: 3;pointer-events: none;background: linear-gradient(to top, rgba(248,242,239,1), rgba(248,242,239,0))}

 @keyframes scroll {
      0% {
        transform: translateX(0);
      }
      100% {
        transform: translateX(-100%);
      }
    }

#member{padding: 0 20px;}
#member .mem_content{background: #FFFFFF;border-radius: 60px;padding-top: 200px;overflow: hidden}
#member .mem_content .mem_title{display: flex;justify-content: space-between;align-items: flex-end;padding: 0 60px;padding-bottom: 45px;}
#member .mem_content .mem_title .tit_wrap{position: relative;}
#member .mem_content .mem_title .tit_wrap > div{position: absolute;font-size: 20px;color: #C4B6AB;font-weight: 500;left: 350px;top: 111px}
#member .mem_content .mem_title .tit_wrap strong{font-size: 150px;line-height: 1;color: #51341B;font-family: "the-seasons", sans-serif;font-weight: 400}
#member .mem_content .mem_title .tit_wrap strong *{color: inherit;font-size: inherit;font-family: inherit}
#member .mem_content .sl_w {height: 600px;position: relative}
#member .mem_content .sl_w .bg{position: absolute;left: 50%;bottom: 140px;margin-left: -300px;}

#member .mem_content .sl_w .bg{transform: translateY(100px);opacity: 0;transition: 1.5s}
#member.on .mem_content .sl_w .bg{transform: translateY(0);opacity: 1}
#member .mem_content .swiper{transform: translateY(100px);opacity: 0;transition: 1.5s}
#member.on .mem_content .swiper{transform: translateY(0);opacity: 1;transition-delay: 0.8s}
#member .mem_content .sl_w .bg img{display: block;animation: naming 5s infinite linear;transform-origin: top center}
@keyframes naming{
	0%{transform: rotate(0deg)}
	33%{transform: rotate(2deg)}
	66%{transform: rotate(-2deg)}
	100%{transform: rotate(0deg)}
}
#member .mem_content .sl_w .profile_w {transition: 1s}
#member .mem_content .sl_w .profile_w .profile{border-radius: 50%;overflow: hidden;width: 200px;margin: 0 auto;border: 3px solid #F8F2EF}
#member .mem_content .sl_w .swiper-slide-active .profile_w .profile{border-color: #F37C07}
#member .mem_content .sl_w .profile_w .profile img{display: block;}
#member .mem_content .sl_w .profile_w .year{background: linear-gradient(160deg, #FFFFFF, #FF9D3150);width: 130px;padding: 6px;margin: 0 auto;backdrop-filter: blur(20px);border-radius: 30px;margin-bottom: 10px;}
#member .mem_content .sl_w .profile_w .year span{display: block;text-align: center;line-height: 35px;background: #FEAB01;border-radius: 25px;font-size: 18px;color: #FFFFFF}
#member .mem_content .sl_w .swiper-slide-active .profile_w .year span{background: #F37C07}
#member .mem_content .sl_w .profile_w .year span i{font-weight: 600;color: inherit;}
#member .mem_content .sl_w .scale-100 .profile_w{padding-top: 0}
#member .mem_content .sl_w .scale-85 .profile_w{padding-top: 66px}
#member .mem_content .sl_w .scale-70 .profile_w{padding-top: 156px}
#member .mem_content .sl_w .scale-60 .profile_w{padding-top: 314px}
#member .mem_content .sl_w .profile_w{padding-top: 414px}
#main #top_1 .work_w{
  perspective: 800px;margin: auto 0;
}
.work_w:first-child .work_con {
  animation: boxFlip 4.5s infinite;
  animation-timing-function: cubic-bezier(0.29, 1.53, 0.33, 1.01);
}



#main #award{position: relative;background: #FFFBF7;padding-top: 190px;overflow: hidden}
#main #award:after{content: '';position: absolute;overflow: hidden;background: linear-gradient(to bottom, #FFFBF700, #FFFBF7);width: 100%;height: 300px;position: absolute;bottom: 0;left: 0;z-index: 15}
#award .bgimg{position: absolute;left: 50%;transform: translateX(-50%);top: 0}
#main #award .aw_t{width: 800px;height: 450px;background: url(/img/main/aw_img2-min2.png);background-size: auto 100%;position: relative;z-index: 8;margin: 0 auto}
#award .award_wrap{position: relative;perspective: 300px;padding-top: 0}

#award .award_wrap .bgimg{position: absolute;right: 50px;top: 0}
#award .award_wrap .bg{position: absolute;border-radius: 20px;width: 154px;height: 230px;left: 50%;perspective: 300px;transition: 1s;opacity: 0}
#award .award_wrap.on2 .bg{opacity: 1}
#award .award_wrap .bg i{display: block;width: 100%;height: 100%;padding: 10px;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));  backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 10px;}
#award .award_wrap .bg01{top: 50px;margin-left: -309px}
#award .award_wrap .bg02{top: 110px;margin-left: -523px}
#award .award_wrap .bg03{top: 170px;margin-left: -694px;}
#award .award_wrap .bg04{top: 170px;margin-left: -839px}
#award .award_wrap .bg05{top: 276px;margin-left: -930px;width: 214px;height: 320px}
#award .award_wrap .bg01 i{;transform: rotateY(10deg)}
#award .award_wrap .bg02 i{;transform: rotateY(15deg)}
#award .award_wrap .bg03 i{;transform: rotateY(20deg)}
#award .award_wrap .bg04 i{;transform: rotateY(60deg)}
#award .award_wrap .bg05 i{;transform: rotateY(86deg)}
#award .award_wrap .award_list{position: relative;height: 100vh;}
/*#award .award_wrap .award_list .obj{left: 50%;transform: translateX(-50%);position: absolute;top: 184px}*/
#award .award_wrap .award_list .obj{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: relative}
#award .award_wrap .award_list .obj{display: flex;width: 100%;height: 100vh;align-items: center;justify-content: center;position: relative}
#award .award_wrap .award_list .obj .video{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: #F8F2EF;opacity: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center}
#award .award_wrap .award_list .obj .video video{height: 626px;mix-blend-mode: multiply}
#award .award_wrap .award_list .aw_txt{opacity: 0}
/*#award .award_wrap .award_list .ob02{position: absolute;top: 0;left: 0}*/
#award .award_wrap .aw_wrap{position: absolute;left: 50%;}
#award .award_wrap .award .img_w{padding: 20px;background: linear-gradient(-45deg,rgba(255,231,220,0),rgba(255,231,220,0.7)) !important;  backdrop-filter: blur(20px);border: 1px solid #fff;border-radius: 20px;position: relative}
#award .award_wrap .award .img_w .prize_list{position: absolute;top: 30px;left: 30px;}
#award .award_wrap .award .img_w .prize_list ul{display: flex;flex-direction: column;gap: 8px;}
#award .award_wrap .award .img_w .prize_list ul li{display: flex;gap: 4px;font-size: 16px;color: #FFFFFF;font-weight: 500;border: 1px solid #ffffff25;align-items: center;padding-left: 14px;padding-right: 28px;border-radius: 23px;background: rgba(0,0,0,0.20);backdrop-filter: blur(20px)}
#award .award_wrap .award .img_w .prize_list ul li i img{display: block}
#award .award_wrap .award .img_w .img{border-radius: 10px;overflow: hidden}
#award .award_wrap .award .img_w .img img{display: block;transition: 1s;width: 100%}
#award .award_wrap .award .txt_wrap{padding-left: 20px;padding-top: 18px;}
#award .award_wrap .award .txt_wrap strong{display: block;font-family: "the-seasons", sans-serif;font-size: 28px;color: #51341B;line-height: 28px;margin-bottom: 10px;}
#award .award .txt_wrap p{font-size: 18px;color: #4A3E25;font-weight: 300}

#award .award_wrap .aw_wrap{margin-left: 819px;opacity: 0}
#award .award_wrap .aw_wrap0{top: 370px;margin-left: 690px;opacity: 0}
#award .award_wrap .aw_wrap .award{transform: rotateY(80deg);transition: 1s}
#award .award_wrap .aw_wrap0 .award{transform: rotateY(85deg)}
#award .award_wrap .aw_wrap .award .img_w .img img{width: 224px}
#award .award_wrap .aw_wrap .award .img_w .img img{width: 224px}
#award .award_wrap .aw_wrap3 .award .img_w .img img{width: 300px}
#award .award_wrap .aw_wrap{perspective: 1200px;}
#award .award_wrap .aw_wrap5{top: 20px;margin-left: -827px;opacity: 1;z-index: 1}
#award .award_wrap .aw_wrap4{top: 37px;margin-left: -574px;opacity: 1}
#award .award_wrap .aw_wrap3{top: 104px;margin-left: -170px;opacity: 1}
#award .award_wrap .aw_wrap2{top: 168px;margin-left: 254px;opacity: 1}
#award .award_wrap .aw_wrap1{top: 305px;margin-left: 579px;opacity: 1}
#award .award_wrap .aw_wrap1 .award {transform: rotateY(61deg) }
#award .award_wrap .aw_wrap2 .award {transform: rotateY(15deg)}
#award .award_wrap .aw_wrap2{perspective: 700px}
#award .award_wrap .aw_wrap3 .award {transform: rotateY(0deg)}
#award .award_wrap .aw_wrap3 .award{transform: rotateY(180deg) translateY(150%);transition: 2s}
#award.on2 .award_wrap .aw_wrap3 .award{transform: rotateY(0deg) translateY(00%)}
#award .award_wrap .aw_wrap4 .award {transform: rotateY(-12deg)}
#award .award_wrap .aw_wrap4{perspective: 700px;z-index: 2}
#award .award_wrap .aw_wrap5 .award {transform: rotateY(-59deg)}
#award .award_wrap .aw_wrap5 .award .img_w .img img{width: 210px}
#award .award_wrap .aw_wrap1 .award .img_w .img img{width: 210px}
#award .award_wrap .aw_wrap2 .award .img_w .img img{width: 280px}
#award .award_wrap .aw_wrap4 .award .img_w .img img{width: 280px}
#award .award_wrap .aw_wrap6 .award .img_w .img img{width: 200px}
#award .award_wrap .aw_wrap0 .award .img_w .img img{width: 200px}
#award .award_wrap .aw_wrap7 .award .img_w .img img{width: 200px}
#award .award_wrap .aw_wrap8 .award .img_w .img img{width: 180px}
#award .award_wrap .aw_wrap9 .award .img_w .img img{width: 170px}
#award .award_wrap .aw_wrap10 .award .img_w .img img{width: 160px}
#award .award_wrap .aw_wrap11 .award .img_w .img img{width: 160px}
#award .award_wrap .aw_wrap12 .award .img_w .img img{width: 160px}


#award .award_wrap .aw_wrap6{top: -70px;margin-left: -928px;opacity: 1;}
#award .award_wrap .aw_wrap7{top: -140px;margin-left: -882px;opacity: 1;}
#award .award_wrap .aw_wrap8 {top: -180px;margin-left: -770px;opacity: 1;}
#award .award_wrap .aw_wrap9 {top: -260px;margin-left: -579px;opacity: 1;}
#award .award_wrap .aw_wrap10{top: -320px;margin-left: -339px;;opacity: 1;}
#award .award_wrap .aw_wrap11{top: -390px;margin-left: -117px;;opacity: 1;}
#award .award_wrap .aw_wrap12{top: -460px;margin-left: 83px;;}

#award .award_wrap .aw_wrap6 .award {transform: rotateY(-85deg)}
#award .award_wrap .aw_wrap7 .award {transform: rotateY(-83deg);opacity: 0.75}
#award .award_wrap .aw_wrap8 .award {transform: rotateY(-124deg) ;opacity: 0.5}
#award .award_wrap .aw_wrap9 .award {transform: rotateY(-152deg);opacity: 0.25}
#award .award_wrap .aw_wrap10 .award {transform: rotateY(-175deg) ;opacity: 0.05}
#award .award_wrap .aw_wrap11 .award {transform: rotateY(-180deg);opacity: 0.03 }
#award .award_wrap .aw_wrap12 .award {transform: rotateY(-200deg);opacity: 0}


#award .award_wrap .aw_wrap{transition:1s;will-change: transform}
/*#award .award_wrap .award_list .obj img{opacity: 0;transition: 1s;transform: translateY(30px);filter: blur(20px);display: block}*/
#award .award_wrap.on .award_list .obj img{opacity: 1;transition: 2s;transform: translateY(0);filter: blur(0px);width: 368px}

#main #unique .uni_title strong *{font-family: inherit}
#main #unique .uni_title .tit02 .line{}

.vm_btn a{display: block;width: 220px;height: 60px;display: flex;align-items: center;justify-content: space-between;padding: 0 30px;border: 1px solid #51341B;border-radius: 30px;overflow: hidden}
.vm_btn a strong{font-size: 20px;color: #51341B;font-family: 'AvantGarde Bk BT', sans-serif;}
.vm_btn a .over{position: absolute;left: 0;transform: translateX(-100%);top: 50%;margin-top: -8px;}
#main #top_1 .work_list ul li{transform: translateX(30px);opacity: 0;transition: transform 1.2s, opacity 1.2s}
#main #top_1.on .work_list ul li{transform: translateX(0);opacity: 1;}
#main #top_1.on .work_list ul li:nth-child(1){transition-delay: 0.1s}
#main #top_1.on .work_list ul li:nth-child(2){transition-delay: 0.2s}
#main #top_1.on .work_list ul li:nth-child(3){transition-delay: 0.3s}
#main #top_1.on .work_list ul li:nth-child(4){transition-delay: 0.4s}
#main #top_1.on .work_list ul li:nth-child(5){transition-delay: 0.5s}
#main #top_1.on .work_list ul li:nth-child(6){transition-delay: 0.6s}
#main #top_1.on .work_list ul li:nth-child(7){transition-delay: 0.7s}
#main #top_1.on .work_list ul li:nth-child(8){transition-delay: 0.8s}
#main #top_1.on .work_list ul li:nth-child(9){transition-delay: 0.9s}
#main #top_1.on .work_list ul li:nth-child(10){transition-delay: 1.0s}
#main #top_1.on .work_list ul li:nth-child(11){transition-delay: 1.1s}
#main #top_1.on .work_list ul li:nth-child(12){transition-delay: 1.2s}
#main #top_1.on .work_list ul li:nth-child(13){transition-delay: 1.3s}

#main #top_1 .shape01{transform: translate(-30px,30px);opacity: 0}
#main #top_1.on .shape01{transform: translate(0px,0px);opacity: 1;transition: 1.2s;transition-delay: 1.3s}
#main #top_1 .shape02{transform: translate(30px,30px);opacity: 0}
#main #top_1.on .shape02{transform: translate(0px,0px);opacity: 1;transition: 1.2s;transition-delay: 1.6s}
#main #top_1 .shape03{transform: translate(30px,30px);opacity: 0}
#main #top_1.on .shape03{transform: translate(0px,0px);opacity: 1;transition: 1.2s;transition-delay: 1.9s}



#award .award_wrap .aw_wrap3{z-index: 10}
#award .award_wrap .aw_wrap2{top: 104px;margin-left: -170px;opacity: 0}
#award .award_wrap .aw_wrap4{top: 104px;margin-left: -170px;opacity: 0}
#award.on .award_wrap .aw_wrap2{top: 168px;margin-left: 254px;opacity: 1}
#award.on .award_wrap .aw_wrap4{top: 37px;margin-left: -574px;;opacity: 1}
#award .award_wrap .aw_wrap5{top: 37px;margin-left: -574px;;opacity: 1;transition-delay: 0.6s}
#award .award_wrap .aw_wrap1{top: 168px;margin-left: 254px;opacity: 0;transition-delay: 0.3s}
#award.on .award_wrap .aw_wrap1{top: 305px;margin-left: 579px;opacity: 1}

#award .award_wrap .aw_wrap2 .award{transform: rotate(0);z-index: 4}
#award .award_wrap .aw_wrap4 .award{transform: rotate(0);z-index: 4}
#award .award_wrap .aw_wrap1 .award{transform: rotateY(15deg);}
#award.on .award_wrap .aw_wrap1 .award{transform: rotateY(61deg);transition-delay: 0.3s}
#award.on .award_wrap .aw_wrap2 .award{transform: rotateY(15deg);}
#award.on .award_wrap .aw_wrap4 .award{transform: rotateY(-12deg);}
#award .award_wrap .aw_wrap5 .award{transform: rotateY(-12deg);transition-delay: 0.6s;opacity: 0}
#award.on .award_wrap .aw_wrap5 .award{transform: rotateY(-59deg);opacity: 1}

#award .award_wrap .aw_wrap6, #award .award_wrap .aw_wrap7, #award .award_wrap .aw_wrap8, #award .award_wrap .aw_wrap9, #award .award_wrap .aw_wrap10, #award .award_wrap .aw_wrap10{opacity: 0}
#award.on .award_wrap .aw_wrap6, #award.on .award_wrap .aw_wrap7, #award.on .award_wrap .aw_wrap8, #award.on .award_wrap .aw_wrap9, #award.on .award_wrap .aw_wrap10, #award.on .award_wrap .aw_wrap10{;opacity: 1;transition-delay: 1.2s}

#award.on .award_wrap .aw_wrap5 {top: 20px;margin-left: -827px;}


#main #unique .unique_list .ring_list, #main #unique .unique_list .ring_content2{pointer-events: none}





.main_visual{height: 100vh}


*,
*::after,
*::before {
  box-sizing: border-box;
}
body {
  --color-bg: #fff;
  color: var(--color-text);
  background-color: #fff;
}
main {
  position: relative;
  margin: 0 auto;
}
.grid {
  margin: 0 auto;
  max-width: 1360px;
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 30% 35% 35%;
  grid-auto-rows: auto;
  grid-gap: 5px;
}
.grid__cnt {
  position: relative;
}
.grid__cnt__bg {
  float: left;
  background-color: var(--item-bg);
}
.item-1 {
  grid-column: 1/2;
  grid-row: 1/3;
  height: 718px;
}
.item-2 {
  grid-column: 2/4;
  grid-row: 1/2;
  height: 430px;
}
.item-3 {
  grid-column: 2/3;
  grid-row: 2/3;
  height: 282px;
}
.item-4 {
  grid-column: 3/4;
  grid-row: 2/4;
  height: 544px;
}
.item-5 {
  grid-column: 1/3;
  grid-row: 3/4;
  height: 533px;width: 1201px
}
.grid__cnt__img {
  display: block;
  height: 100%;
  width: 100%;
}
.grid__cnt__img canvas {
  height: 100%;
}
.grid__cnt__img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.grid__cnt__img img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s;
}
.grid__cnt:hover .grid__cnt__img img:nth-child(2) {
  opacity: 1;
}
.js .grid__cnt__img img {
  display: none;
}

/* media query */
@media (max-width: 767px) {
  .grid {
    padding: 15px;
    display: block;
  }
  .grid__cnt__bg {
    margin-bottom: 20px;
    width: 100%;
  }
  .item-1,
  .item-4 {
    height: 400px;
  }
  .item-2 {
    height: 300px;
  }
}
.main_vis .bg video, #beyond_content .b_img_content .img img{width: 100vw}
#beyond_content .b_img_content{overflow: hidden}
#port_view .con08 .img_wrap > ul > li .bg img{max-width: 100%;width: 100%}
@media (max-width: 1920px) {
    #port_view .con08 .img_wrap > ul > li .bg img{max-width: 960px}
    .main_vis .bg video, #beyond_content .b_img_content .img img{width: 1920px}
}
@media (max-width: 1750px) {
        #we_service2 .we_wrap{transform: scale(0.9);height: 100%}
    #project_list .pro > div .right video{width: 100%}
    #beyond_content .b_img_content{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) scale(0.5)}
    #project_list .pro > div .left > div{padding: 0}
    #project_list .pro > div .info strong{font-size: 50px;}
    #project_list .pro > div .left{height: 400px}
    .main_visual .vis_title strong, #award .title strong, #main #unique .uni_title .tit01 strong, #member .mem_content .mem_title .tit_wrap strong{font-size: 125px}
    #main #top_1 .title strong{font-size: 80px;}
    #main #unique .uni_title .tit02 strong{font-size: 70px;}
    #main #unique .uni_title .tit02 .txt_b p{font-size: 17px;}
   
    #contact .copy .copy01 strong{font-size: 250px;line-height: 250px;}
	#header #menu_open > ul{gap: 30px;}
	#header #menu_open > ul > li > a{font-size: 70px}
    #footer .ft02 > div.f02{padding-left: 40px;}
    
    #main .gl_wrap .gl_in .gl i{width: 40px;}
    #footer .ft02 > div.f02 ul:before{left: -40px;}
    #main #unique .unique_list .project_info{margin-left: 0;left: auto;right: 20px;}
    #project_list .pro > div .right > div{width: 800px}
    #project_list .pro > div .right video{width: 800px}
    #we_service .we_wrap > div .txt strong{font-size: 16px;}
    #we_service .we_wrap > div .txt em{font-size: 14px}
    #contact .txt_w strong{font-size: 220px}
    #contact .thd_logo .thd_w img {width: 600px}
    #contact .txt_w .txt strong{font-size: 36px}
    .wrapper{height: 100vh}

}
@media (max-width: 1650px) {
    #project_list .pro{padding: 0 20px;}
}
@media (max-width: 1550px) {
    #main .card.prev8 { transform: rotateY(-221.5403deg) translateZ(600px) translateY(-1200px); transition: 3s linear}
    #main .card.prev7 { transform: rotateY(-193.8461deg) translateZ(600px) translateY(-1050px); transition: 3s linear}
    #main .card.prev6 { transform: rotateY(-166.1538deg) translateZ(600px) translateY(-900px); transition: 3s linear}
    #main .card.prev5 { transform: rotateY(-138.4615deg) translateZ(600px) translateY(-750px); transition: 3s linear}
    #main .card.prev4 { transform: rotateY(-110.7692deg) translateZ(600px) translateY(-600px); transition: 3s linear}
    #main .card.prev3 { transform: rotateY(-83.0769deg)  translateZ(600px) translateY(-450px); transition: 3s linear}
    #main .card.prev2 { transform: rotateY(-55.3846deg)  translateZ(600px) translateY(-300px); transition: 3s linear}
    #main .card.prev1 { transform: rotateY(-27.6923deg)  translateZ(600px) translateY(-150px); transition: 3s linear}
    #main .card{opacity: 0}

    /* 가운데 (7번) */
    #main .card.on { transform: rotateY(0deg) translateZ(600px) translateY(0px); opacity: 1;transition: 3s linear}
    /* 오른쪽 그룹 (8~13번) */
    #main .card.next1  { transform: rotateY(27.6923deg)  translateZ(600px) translateY(150px); transition: 3s linear}
    #main .card.next2  { transform: rotateY(55.3846deg)  translateZ(600px) translateY(300px); transition: 3s linear}
    #main .card.next3 { transform: rotateY(83.0769deg)  translateZ(600px) translateY(450px); transition: 3s linear}
    #main .card.next4 { transform: rotateY(110.7692deg) translateZ(600px) translateY(600px); transition: 3s linear}
    #main .card.next5 { transform: rotateY(138.4615deg) translateZ(600px) translateY(750px); transition: 3s linear;mix-blend-mode: difference}
    #main .card.next6 { transform: rotateY(166.1538deg) translateZ(600px) translateY(900px);transition: 3s linear}
    #main .card.next7 { transform: rotateY(193.8461deg) translateZ(600px) translateY(1050px);transition: 3s linear}
    #main .card.next8 { transform: rotateY(221.5403deg) translateZ(600px) translateY(1200px);transition: 3s linear}

    #we_service2 .we_wrap{transform: scale(0.7);height: 100%}
    #contact .logo_wave_content svg{width: 4500px;height: auto}
  #contact .logo_wave_content .logo_way{transform: translateX(-18%);}
    #contact .logo_wave_content .logo_w div img{width: 200px;display: block}
    #contact{padding-top: 0}
	#header .hd_inner{padding: 0 20px;}
	#header .hd_inner #gnb > ul{gap: 0 25px}
    .main_visual .vis_title strong, #award .title strong, #main #unique .uni_title .tit01 strong, #member .mem_content .mem_title .tit_wrap strong{font-size: 100px}

    #main #top_1 .title strong{font-size: 65px;}
    #main #unique .uni_title .tit02 .line{width: 160px;}
    #main #top_1 .work_list{width: 800px;}
    #main #top_1 .work_list .work_con > div.box_bottom p{font-size: 18px;}
    #main #top_1 .work_list .work_con > div.box_front p{font-size: 20px;}
    #main #top_1 .work_list .work_con{height: 80px;}
    #member .mem_content .mem_title .tit_wrap > div{left: 230px;top: 65px}
    #member .mem_content{padding-top: 130px;border-radius: 80px;}
    #member .mem_content .sl_w .profile_w .profile{width: 150px;}
    #member .mem_content .sl_w .profile_w .profile img{width: 150px;}
    #member .mem_content .sl_w .profile_w .year span{line-height: 32px;font-size: 16px}
    #member .mem_content .sl_w .bg img{width: 650px;}
    #member .mem_content .sl_w .bg {
        bottom: 70px;
        margin-left: -135px;
    }
    #member .mem_content .sl_w{height: 440px;}
    #contact .copy .copy01 strong{font-size: 200px;}
    #footer .ft02 > div.f02 ul li p{font-size: 14px;}
    #footer .ft02 > div.f02 ul li span{font-size: 23px;}
    #footer .ft02 > div.f02 ul:after{margin-left: -40px;}
    #footer .ft02 > div.f02{padding-bottom: 40px;}
    .award .img_w{padding: 10px}
    #main .card{width: 280px}
    .award .img_w .img img{width: 100%}
    #main .card{transform: rotateY(calc((360deg / 13) * var(--index)))translateZ(640px) translateY(calc(100px * var(--index)))}
    .item-5{width: 900px;height: 398px}
    #main #top_1 .work_list2 ul li:hover .info {transform: translateY(0px);}
    #project_list .pro > div .right > div{width: 650px}
    #project_list .pro > div .right video{width: 650px}
    #project_list .pro > div .info strong{font-size: 45px}
    #project_list .pro > div .info p{font-size: 16px;}
    #project_list .pro01 .left img{width: 160px}
    #project_list .pro02 .left img{width: 160px}
    #project_list .pro03 .left img{width: 180px}
    #project_list .pro > div .left{height: 328px}
    #we_service{padding: 150px 20px}
    
}
@media (max-width: 1260px) {
    .main_vis .bg video{height: 100vh}
    #contact .txt_w .txt strong{font-size: 24px}
    #beyond_content .b_title strong{margin-bottom: 30px;font-size: 70px}
    #beyond_content .b_title{left: 20px;top: 200px}
    #beyond_content .b_img_content img{width: 1260px}
    #we_service .info_s_text{padding-left: 20px;padding-bottom: 100px}
    #project_list .pro > div .info p{flex-wrap: wrap;gap: 5px 20px}
    #project_list .pro > div .info p i{height: 0;width: 100%}
/*    #main #unique, #main #top_1, #main #award{display: none}*/
    #main #unique .unique_list .monitor_w .monitor_in{width: 1000px;height: 650px}
    #main #top_1{padding-left: 20px;padding-right: 20px}
    #main #top_1 .work_list{width: 600px}
    
        #main #unique .uni_title{width: 100%}
    #footer .ft02 > div{width: 100%}
    #footer .ft02 > div{padding-bottom: 40px;margin-bottom: 40px;}
    #footer .ft02 > div.f01:after{width: 100%}
    #footer .ft02 > div.f02 .tag{display: none}
    #footer .ft02 > div.f02:after{width: 100%}
    #footer .ft03 .f02, #footer .ft03 .f01{padding-top: 0}
    .copy_title strong{font-size: 100px}
    .copy_title .copy01{width: 560px}
    .copy_title .copy01 > div strong{width: 560px}
    .copy_title strong{width: 476px}
   .copy_title .copy02{width: 476px}
   .copy_title .copy02 > div strong{width: 476px}
    .copy_title .copy03 img{width: 560px}
    .copy_title .copy03, .copy_title .copy03 > div strong{width: 560px}
    .copy_title strong i{left: 0}
    .aw_content .video video{width: 570px}
    .aw_content .title strong{font-size: 70px}
    .aw_content .award_title .aw_list ul li i img{width: 40px}
    .aw_content .cir div span{width: 50px;line-height: 25px;font-size: 16px}
    .aw_content .cir div strong{font-size: 16px}
    .main_vis .copy_text div p{font-size: 15px}
    #project_list .info_s_text{padding-left: 20px}
    #project_list .pro > div .right > div{width: 560px}
    #project_list .pro > div .right video{width: 560px}
    #project_list .pro > div .left{height: 296px}
    .info_s_text p{font-size: 11px}
    #main #unique .uni_title .tit01 strong{font-size: 80px}
    #main #unique .uni_title .tit02 strong{font-size: 55px}
    #main #unique .info_s_text{right: 20px;bottom: 30px}
    #we_service2 .ser03{margin-left: -650px}
    #we_service2 .ser04 {margin-left: 154px;}
    #we_service2 .ser12 {margin-left: 310px;margin-top: 294px;}
    #we_service2 .ser06 {margin-left: 310px;margin-top: 504px;}
    #we_service2{height: 1716px;}
    

}
@media (max-width: 1160px) {
    #we_service2{height: auto}
    #we_service2 .info_s_text03{margin-top: 0;top: auto;margin-left: 0;left: auto;right: 20px;bottom: -80px;}
    #we_service2 .info_s_text04{margin-top: 0;top: auto;margin-left: 0;left: auto;left: 20px;bottom: -80px;}
  #we_service2 .ser .wr.wr_img .num{display: block;}

    #we_service2 .ser .wr.wr_img .img{display: none}
    #we_service2 .ser .wr .txt2:before, #we_service2 .ser .wr.wr_img .txt2 strong:after, #we_service2 .ser .wr.wr_img .txt2 strong i, #we_service2 .ser .wr.wr_img .txt2 strong:before{display: none;}
    #main #top_1 .work_list2 ul li{width: calc(50% - 10px)}
	#header .hd_inner #gnb{display: none}
    #footer .ft02{flex-direction: column}
    
	#header .hd_inner{height: 80px;align-items: center}
    #we_service2 .ser11 {margin-left: -20px;}
        #we_service2 .info_s_text p{white-space: nowrap}
    #we_service2{padding: 150px 0}
    #we_service2 .ser{position: static;margin-left: 0 !important;margin-top: 0 !important}
    #we_service2 .we_wrap{transform: scale(1);display: flex;flex-wrap: wrap;gap: 15px;padding: 0 20px;}
    #we_service2 .ser .wr.wr_img img{display: none}
    #we_service2 .ser02 .wr{width: 100% !important}
    #we_service2 .ser .wr{width: 100% !important}
    #we_service2 .ser{width: calc(33.33% - 10px);}
    #we_service2 .ser .wr:after{opacity: 0}
    #we_service2 .ser .wr.wr_img{padding-top: 100%}
    #we_service2 .ser .wr.wr_img .txt2{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: none;width: 100%;bottom: auto}
    #we_service2 .ser .wr.wr_img .txt2 strong{background: none;backdrop-filter: none;box-shadow: none;background: none;padding: 0;font-size: 18px;text-align: center}
    #we_service2 .we_wrap{height: auto}

}
@media (max-width: 980px) {
    #footer .ft > div.right .w div:nth-child(2){padding-left: 20px}
	#scroll .sandglass{left: 10px;transform: scale(0.7);bottom: 41px}
	#scroll span{left: 30px}
  .wrapper{margin-top: -30px;}
  .aw_obj_wrap {
    width: 200px;
    height: 378px;}
  #main #award .aw_t{width: 400px;height: 225px;}
  #contact{padding: 120px 0;}
  #contact .logo_wave_content .logo_w div{border-radius: 5px;}
  #contact .logo_wave_content .logo_w div img{width: 120px;}
	#project_list .pro > div .right > div{width: 100%}
    #main .card.prev8 { transform: rotateY(-221.5403deg) translateZ(420px) translateY(-560px);  transition: 3s linear}
    #main .card.prev7 { transform: rotateY(-193.8461deg) translateZ(420px) translateY(-480px); ;transition: 3s linear}
    #main .card.prev6 { transform: rotateY(-166.1538deg) translateZ(420px) translateY(-420px); transition: 3s linear}
    #main .card.prev5 { transform: rotateY(-138.4615deg) translateZ(420px) translateY(-350px);  transition: 3s linear}
    #main .card.prev4 { transform: rotateY(-110.7692deg) translateZ(420px) translateY(-280px);  ;transition: 3s linear}
    #main .card.prev3 { transform: rotateY(-83.0769deg)  translateZ(420px) translateY(-210px);  ;transition: 3s linear}
    #main .card.prev2 { transform: rotateY(-55.3846deg)  translateZ(420px) translateY(-140px);  ;transition: 3s linear}
    #main .card.prev1 { transform: rotateY(-27.6923deg)  translateZ(420px) translateY(-70px);  ;transition: 3s linear}
    #main .card{opacity: 0}

    /* 가운데 (7번) */
    #main .card.on { transform: rotateY(0deg) translateZ(420px) translateY(0px); opacity: 1;transition: 3s linear}
    /* 오른쪽 그룹 (8~13번) */
    #main .card.next1  { transform: rotateY(27.6923deg)  translateZ(420px) translateY(70px)  ;transition: 3s linear}
    #main .card.next2  { transform: rotateY(55.3846deg)  translateZ(420px) translateY(140px);transition: 3s linear}
    #main .card.next3 { transform: rotateY(83.0769deg)  translateZ(420px) translateY(210px);transition: 3s linear}
    #main .card.next4 { transform: rotateY(110.7692deg) translateZ(420px) translateY(280px);transition: 3s linear}
    #main .card.next5 { transform: rotateY(138.4615deg) translateZ(420px) translateY(350px);transition: 3s linear;mix-blend-mode: difference}
    #main .card.next6 { transform: rotateY(166.1538deg) translateZ(420px) translateY(420px);transition: 3s linear}
    #main .card.next7 { transform: rotateY(193.8461deg) translateZ(420px) translateY(490px);transition: 3s linear}
    #main .card.next8 { transform: rotateY(221.5403deg) translateZ(420px) translateY(560px);transition: 3s linear}
    #we_service2 .info_s_text01{margin-left: 0;left: 20px;top: 40px;margin-top: 0}
    #we_service2 .ser .wr.wr_img .txt2 strong, #we_service2 .ser .wr .txt strong{font-size: 14px;word-break: keep-all;padding: 0 10px;line-height: 1.5;}
    #main #unique .unique_list .ring_content .mem{display: none}
    #we_service .we_wrap .info_s_text{display: none}
    #we_service .we_wrap > div.ser01{margin: 0 !important}
    #we_service .we_wrap > div{width: calc(50% - 5px)}
    #we_service .we_wrap > div{border-radius: 5px}
    #we_service .we_wrap > div .num{top: 5px;left: 5px}
    #we_service .we_wrap > div .num i{font-size: 11px}
    #we_service .we_wrap > div .txt strong{font-size: 14px;line-height: 1.5;word-break: keep-all}
    #we_service .we_wrap > div .txt em{display: none}
    #main #top_1 .work_list2 ul li .info_w i{width: 4px;height: 4px;}
    #main #top_1 .work_list2 ul li .info_w{height: 130px}
    #main #top_1 .work_list2 ul li .info p{font-size: 13px;}
    #main #top_1 .work_list2 ul li .info_w{padding: 20px;border-radius: 8px;}
    #main #top_1 .work_list2 ul li .info_w .info strong{font-size: 18px;line-height: 1.2}
    #main #top_1 .title{flex-direction: column;gap: 20px;justify-content: flex-start;align-items: flex-start}
    .item-5{width: 550px;height: 243px;}
    .obj2 .video video{height: 346px}
    #award .obj img{width: 200px}
    #main #unique .unique_list .project_info ul li span, #main #unique .unique_list .project_info ul li p{font-size: 14px;}
    #main #unique .unique_list .project_info{padding: 15px;border-radius: 7px;}
    #main #unique .unique_list .project_info ul li{padding: 10px 0}
    #footer .ft02 > div.f02{padding-left: 0}
    #footer .ft02 > div.f02 ul:before{display: none}
    #footer{padding: 20px;}
	#header .hd_inner .open_btn i{width: 40px;}
	#header .hd_inner, #header{height: 65px;}
	#header #menu_open .close{right: 20px;top: 20px;width: 45px;height: 45px;}
	#header #menu_open .close span{width: 16px;height: 16px;}
	#header #menu_open > ul > li > a{font-size: 45px}
	#header #menu_open > ul > li ul li a{font-size: 15px;}
    .aw_content .cir div span{width: 40px}
    .main_visual .vis_title strong, #award .title strong, #main #unique .uni_title .tit01 strong, #member .mem_content .mem_title .tit_wrap strong{font-size: 65px}
    .main_visual .vis_title .tit_w02 {transform: translateX(90px);}
    .main_visual .vis_title .tit_w01 {margin-left: -50px;}
    #award .award_title .aw_list ul li i img{width: 30px;}
    #award .cir div {width: 170px;height: 40px;   }
    #award .cir div strong{font-size: 14px}
    #award .cir div span{line-height: 27px;font-size: 15px}
    #award .cir i svg{width: 200px;height: auto}
    .aw_content .txt{right: 20px;bottom: auto;top: -80px}
    #award .award_wrap .award_list .obj img{width: 320px;}
    #award .award_wrap .bg{display: none}
    #award .award_wrap .award_list{height: 1000px}
    #award .award_wrap .award .img_w .img{width: 320px;}
    #award .award_wrap .award .img_w .img img{max-width: 100%}
    #award .award_wrap .aw_wrap4{margin-left: 205px;bottom: 185px;filter: blur(3px) grayscale(0.5)}
    #award .award_wrap .aw_wrap2{margin-left: -543px;bottom: 298px;filter: blur(3px) grayscale(0.5)}
    #award .award_wrap .award .img_w{padding: 6px;}
    #award .award_wrap .award .txt_wrap strong{font-size: 22px;}
    #award .award_wrap .award .txt_wrap p{font-size: 14px;}
    #award .award_wrap .aw_wrap3{margin-left: -167px}
    #main #unique .uni_title{width: 100%;padding: 0 20px;}
    #main #unique .uni_title .tit02 .line{width: 70px;}
    #main #unique .uni_title .tit02 .txt_b p{flex-shrink: 15px;}
    #main #unique .uni_title .tit02 .txt_b{top: 64px;}
    #main #unique .unique_list .monitor_w .monitor_in {width: 865px;height: 500px;padding: 15px;border-radius: 15px;}
    #main #unique .unique_list .monitor_w .monitor{border-radius: 12px}
    #main #unique .unique_list .ring_list .ring01 .ring_box img{width: 800px}
    #main #unique .unique_list .ring_list .ring02 .ring_box img{width: 600px}
    #main #unique .unique_list .ring_list .ring03 .ring_box img{width: 550px}
    #main #unique .unique_list .ring_list .ring04 .ring_box img{width: 420px}
    #main #unique .unique_list .ring_list .ring05 .ring_box img{width: 420px}
    #main #unique .unique_list .ring_list .ring06 .ring_box img{width: 320px}
    #main #unique .unique_list .ring_list{gap: 500px}
    #main #top_1{flex-direction: column;gap: 30px;padding: 0 20px;padding-top: 60px}
    #main #top_1 .work_list{width: 100%}
    #main #top_1 .title strong{font-size: 45px;}
    #main #top_1 .title .txt p{font-size: 15px;}
    #main #top_1 .title strong i{font-size: 24px}
    #main #top_1 .work_list .work_con{height:  50px}
    #main #top_1 .work_list .work_con > div.box_front p{font-size: 16px}
    #main #top_1 .work_list .work_con > div.box_bottom p{font-size: 15px;}
    #main #top_1 .work_list .work_con > div{padding-left: 20px;}
    #main #unique .shape_bg01 img{width: 500px}
    #main #award{padding-top: 140px}
    #award .award_title{margin-top: 0px}
   
    #member .mem_content{border-radius: 25px;}
    #member .mem_content .mem_title .tit_wrap > div {left: 150px;top: 35px;font-size: 14px;}
    #member .mem_content{padding-top: 80px;}
    #member .mem_content .sl_w .profile_w .profile img, #member .mem_content .sl_w .profile_w .profile{width: 120px;}
    #member .mem_content .sl_w .profile_w .year span{font-size: 13px}
    #member .mem_content .sl_w .profile_w .year{width: 100px;padding: 5px;margin-bottom: 8px}
    #member .mem_content .sl_w .bg img {width: 550px;}
    #member .mem_content .sl_w{height: 290px}
    #member .mem_content .sl_w .bg {bottom: 10px;margin-left: -205px;}
    #contact{padding: 130px 0}
    #contact .thd_logo .thd_w{transform: translateY(30%);}
    #contact .port.port01{margin-left: 0;left: 20px;top: 30px;}
    #contact .port.port01 img{width:  200px}
    #contact .port.port02 img{width:  160px}
    #contact .port.port03{display: none}
    #contact .port.port02{top: 520px;right: 20px;left: auto;margin-left: 0}
    #contact .port .port_w{border-radius: 10px;padding: 8px}
    #contact .port .port_w .port_in{border-radius: 8px;}
    #main .gl_wrap{transform: scale(0.7)}
    #contact .copy .copy01 strong{font-size: 130px;line-height: 130px}
    #contact .gl_wrap03{display: none}
    #contact .txt_w .txt strong{font-size: 22px;}
    #contact .txt_w .txt{margin-top: 20px;}
    #contact .txt_w .btn_w a{width: 140px;height: 140px;}
    #contact .txt_w .btn_w a span{font-size: 15px;}
    #main #unique .uni_title .tit02 strong{font-size: 50px;}
    #main #unique .uni_title .tit02{justify-content: flex-start;gap: 20px;}
    #main #unique .uni_title .tit02 .txt_b p{font-size: 15px;}
    #main #unique .uni_title .tit02 .txt_b{top: 43px;}
	.l_logo{left: 20px}
	.l_logo svg{width: 14px;height: auto}
	#scroll span{font-size: 18px}
	.quick ul li a.phone span{font-size: 13px;}
	.quick ul li a.contact div strong{font-size: 13px;}
	.quick ul li a.phone svg{width: 25px}
	.quick ul li a.phone{gap: 7px;}
	.quick ul li a{width: 144px;height: 40px;padding-left: 8px;}
	.quick ul li a.phone svg{display: block}
	.quick ul li a.contact a{width: auto}
	.quick ul li a.contact div svg{width: 10px;display: block}
	.quick ul li a.contact div{padding: 0 20px;}
	.quick ul li a.contact{padding-left: 0}
	.quick .chat img{width: 50px;}
	.btn_top button .bg{width: 40px;height: 40px;}
	.btn_top button svg{width: 10px;height: auto}
	.quick{right: 15px;gap: 8px;bottom: 15px}
    #main #unique .unique_list .monitor_w .monitor .moni_img{width: 100%}
    #main #unique .unique_list .monitor_w .monitor .moni_img img{width: 100%}
    #main #top_1 .shape01{left: 20px;top: 40px;}
    #main #top_1 .shape01 img{width: 70px;}
    #main #top_1 .shape03{display: none}
    #main #top_1 .shape02{top: 150px;right: -30px;left: auto;margin-left: 0;}
    #main #top_1 .shape02 img{width: 130px}
    #contact .txt_w .btn_w .water_drop video{width: 800px;height: auto}
    .main_visual .glass_wrap{transform: scale(0.7)}
   .main_visual .glass_wrap .glass_in .glass{width: 25px;}
    #award .award_wrap .award .img_w .prize_list ul li i img{width: 30px;}
    #award .award_wrap .award .img_w .prize_list ul li{font-size: 11px;padding-left: 8px;padding-right: 15px;}
    #award .award_wrap .award .img_w .prize_list {top: 15px;left: 12px;}
    #award .award_wrap .award .img_w{border-radius: 8px;}
    #award .award_wrap .award .img_w .img {border-radius: 5px;}
    #award .award_wrap .award .txt_wrap strong{line-height: 1.2}
    #award .award_wrap .award .txt_wrap{padding: 5px;}
    #footer .ft03 .f02 address{font-size: 10px}
    #footer .ft03 .f01 .map_in{height: 200px;border-radius: 8px;}
    #main .card {transform: rotateY(calc((360deg / 13) * var(--index))) translateZ(480px) translateY(calc(60px * var(--index)));width: 200px;}
    .award .txt_wrap strong{font-size: 18px;line-height: 1.2;margin-bottom: 7px}
    #award .award .txt_wrap p{font-size: 13px;}
    .award .img_w{border-radius: 10px}
    .award .img_w .prize_list{left: 20px;top: 20px;}
    .award .img_w .prize_list ul li{font-size: 11px}
    .award .img_w .prize_list ul li i img{width: 28px;}
    .award .img_w .prize_list ul li{padding-right: 10px;padding-left: 7px}
    .award .txt_wrap{padding: 10px;padding-right: 0}
    .award .img_w{padding: 6px;}
    #project_list .pro > div{padding: 15px 0}
    #project_list .pro > div .right{margin-top: 7px}
    .copy_title .copy03 img, .copy_title .copy03, .copy_title .copy03 > div strong{width: 350px}
    .main_vis .copy_text{transform: translateY(40px)}
    #we_service .we_wrap > div{padding-top: 100px}
        #we_service .we_wrap > div{margin: 0 !important}
    #we_service .we_wrap .icon02{display: none}
    #we_service .we_wrap .icon01 {left: -15%;bottom: -40px;}
    #beyond_content .b_img_content .img{width: 70vw;overflow: hidden}
    #beyond_content .b_title strong{font-size: 35px}
    #beyond_content .b_img_content .img02,
    #beyond_content .b_img_content .img03,
    #beyond_content .b_img_content .img04{height: 100%;width: 100%}
    #beyond_content .b_img_content .img02 div,
    #beyond_content .b_img_content .img03 div,
    #beyond_content .b_img_content .img04 div{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)}
    
    #project_list .pro > div .info p span{display: none}
    #project_list .pro > div .left{height: auto;}
    #project_list .pro > div{flex-wrap: wrap}
    #main #unique .uni_title .tit02 .line{display: none}
    .main_vis .bg{width: auto;top: 50%;left: 50%;transform: translate(-50%,-50%);}
    .copy_title strong i{top: 4px;}
	    #cursor > img{display: none}
	#main .card.prev8{opacity: 0;filter: blur(10px)}
	#main .card.prev7{opacity: 0.1;filter: blur(5px)}
	#main .card.prev6{opacity: 0.2;filter: blur(3px)}
	#main .card.prev5{opacity: 0.3;filter: blur(1px)}
	#main .card.prev4{opacity: 0.4}
	#main .card.prev3{opacity: 0.5}
	#main .card.prev2{opacity: 0.6}
	
	#main .card.next8{opacity: 0}
	#main .card.next7{opacity: 0.1;;filter: blur(10px)}
	#main .card.next6{opacity: 0.2;filter: blur(5px)}
	#main .card.next5{opacity: 0.3;filter: blur(3px)}
	#main .card.next4{opacity: 0.4;filter: blur(1px)}
	#main .card.next3{opacity: 0.5}
	#main .card.next2{opacity: 0.6}
	.aw_content .info_s_text01{left: 20px}
	
	.btn_top{ right: 20px; bottom: 120px; }

}
@media (max-width: 800px) {
    #we_service2 .info_s_text04{bottom: -50px}
    #we_service2 .info_s_text03 {bottom: -120px;right: 60px;}
	.wrapper{transform: scale(0.7)}
    #main #unique .unique_list .ring_list{gap: 420px}
    #main #unique .unique_list{padding-bottom: 150px}
  #project_list .pro > div .right{height: auto;padding-top: 50%;overflow: hidden;position: relative;}
  #project_list .pro > div .right > div, #project_list .pro > div .right .vi_img_w{position: absolute;top: 0;width: 100%;overflow: hidden;}
  #award .award_title .aw_list ul li{opacity: 1;transform: translateY(0);filter: blur(0);}
  #award .cir{margin-top: 10px;}
  #award .cir div{width: auto;height: 40px;padding: 0 5px;padding-left: 10px;}
  #award .cir{filter: blur(0px);opacity: 1;transform: translateY(0);}
  #award:after{content: '';display: block;height: 20%;bottom: 0%;left: 0;width: 100%;  background: linear-gradient(to top, #FFFBF7 20% ,  #FFFBF770 60% ,#FFFBF700);position: absolute;top: auto;z-index: 50;}
#project_list{margin-top: -5px;position: relative;z-index: 50;;}
  #project_list{padding-top: 0;}
  #project_list .info_s_text{z-index: 5;position: relative;}
  #award{display: block;}
  #main .card{width: 180px; transform: rotateY(calc((360deg / 13) * var(--index))) translateZ(400px) translateY(calc(80px * var(--index)));}
  .award .txt_wrap strong{font-size: 16px;}
  #award .award .txt_wrap p{font-size: 11px;}
    #contact .copy{top: 100px}
	#contact .logo_wave_content .logo_way{transform: translateX(-30%)}
    #contact .logo_wave_content svg{width: 1700px;height: auto}
    #contact .logo_wave_content .logo_w div img{width: 120px;display: block}
    #contact .logo_wave_content .logo_w div{border-radius: 5px}
    #contact .logo_wave_content {height: 192px;margin-top: -170px;}
    #contact{padding: 100px 0}
    #beyond_content .b_img_content .img{width: 120vw}
    #we_service{padding: 60px 20px;padding-top: 0}
    #we_service .info_s_text{padding-bottom: 40px}
    #project_list .pro > div .info p{gap: 5px 10px }
    #project_list .pro01 .left img, #project_list .pro02 .left img{width: 120px}
    #project_list .pro03 .left img{width: 160px;}
    #project_list .pro > div .info p span{display: none}
    #project_list .pro > div .left{height: auto;}
    #project_list .pro > div{flex-wrap: wrap}
    #main #unique .uni_title .tit02 .line{display: none}
    .award .img_w .img{border-radius: 8px;}
    #project_list .pro > div .right > div{width: 100%}
    #project_list .pro > div .right video{width: 100%}
    #project_list .pro > div .right{width: 100%;margin-top: 20px}
    #project_list .pro > div .info strong{font-size: 37px}
    #project_list .pro > div .info p{font-size: 14px}
    #we_service .we_wrap > div.ser01{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser02{transform: rotateX(0deg) rotateY(0deg) translateX(0px) translateY(0)}
    #we_service .we_wrap > div.ser03{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser04{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser05{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser06{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser07{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser08{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser09{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser10{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser11{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div.ser12{transform: rotateX(0deg) rotateY(0deg) translateX(0) translateY(0)}
    #we_service .we_wrap > div{opacity: 1}
    #contact .thd_logo .thd_w img{width: 400px}
    #contact .txt_w strong{font-size: 140px}
    #we_service2 .icon04{margin-left: 0px}
    #we_service2 .icon04 img{width: 200px}
    #we_service2 .icon01 {margin-top: -531px;margin-left: -41px;}
    #we_service2 .icon01 img{width: 60px}
    #we_service2 .icon06{margin-top: 490px}
    .wrapper{margin-top: -190px;}
}
@media (max-width: 660px) {
    .copy_title strong{font-size: 130px;}
    .copy_title strong{font-size: 60px;}
    #main #top_1 .work_list2 ul li .info_w {padding: 10px;}
    #main #top_1 .work_list2 ul{gap: 10px}
    #main #top_1 .work_list2 ul li{width: calc(50% - 5px)}
    .item-5{width: 250px;height: 110px;}
    #footer .ft03{flex-direction: row;gap: 20px;flex-wrap: wrap;padding-bottom: 60px;}
    #footer .ft03 > div{width: 100%}
    .main_visual .vis_title strong, #award .title strong, #main #unique .uni_title .tit01 strong, #member .mem_content .mem_title .tit_wrap strong{font-size: 50px;}
    #award .cir div strong{font-size: 13px;}

    #award .cir div span{line-height: 22px;font-size: 13px;padding: 0 6px}
    #award .cir i svg{width: 130px}

    #award .award_wrap .award .img_w .img{width: 250px}
    #award .award_wrap .aw_wrap3{margin-left: -125px}
    #award .award_wrap .aw_wrap4 .img_w .img{width: 200px}
    #award .award_wrap .aw_wrap2 .img_w .img{width: 200px}
    #award .award_wrap .aw_wrap4 {bottom: 90px;margin-left: 174px;}
    #award .award_wrap .aw_wrap3 {bottom: 53px;}
    #award .award_wrap .aw_wrap2 {margin-left: -373px;bottom: 90px;}
    #award .award_wrap .award_list{height: 660px}
    #award .award_wrap .award_list .obj{top: 0}
    #award .award_wrap .award_list .obj img{width: 210px;}
    #main #unique .unique_list .monitor_w .monitor_in {
        width: 550px;
        height: 350px;
        padding: 10px;
    }
    #main #unique .unique_list .ring_list{padding-top: 435px}
    #main #unique .unique_list .ring_list .ring01 .ring_box img{width: 600px}
    #main #unique .unique_list .ring_list .ring02 .ring_box img{width: 500px}
    #main #unique .unique_list .ring_list .ring03 .ring_box img {width: 420px;}
    #main #unique .unique_list .ring_list .ring04 .ring_box img {width: 320px;}
    #main #unique .unique_list .ring_list .ring05 .ring_box img {
        width: 280px;
    }
    #member .mem_content .mem_title .tit_wrap > div{position: static}
    #member .mem_content .mem_title{padding: 0 20px;}
  
    #footer .ft02 > div.f01 strong{font-size: 17px;line-height: 1}
    #footer .ft01 strong{font-size: 50px;}
    #footer .ft01 p{font-size: 12px;line-height: 1.5}
        #member .mem_content .mem_title{display: block}
    #member .mem_content .mem_title{position: relative;z-index: 5}
    .vm_btn a{width: 140px;height: 36px;}
    .vm_btn a strong{font-size: 13px}
    .vm_btn{margin-top: 10px;}
    .vm_btn a{padding: 0 15px}
    .vm_btn a svg{width: 10px;height: auto;display: block}
    #member .mem_content .sl_w{margin-top: 20px;}
        #member .mem_content .sl_w {
        height: 240px;
    }
        #member .mem_content .sl_w .bg {
        margin-left: -125px;bottom: 60px
    }
    #cursor > img{display: none;}
    #cursor img{width: 100px;}

}
@media (max-width: 560px) {
  .aw_content .txt{gap: 5px}
  .copy_title strong i{top: 0;}
        #main #top_1 .work_list2 ul li .info_w{height: 100%;padding-top: 45px}
    #main #top_1 .work_list2 ul li .info p{word-break: keep-all}

        #member .mem_content{padding-top: 40px;border-radius: 10px;}

    #footer .ft02 > div.f02 ul li span{font-size: 12px;}
    #footer .ft02 > div.f02 ul li p{font-size: 11px;line-height: 1.5}
    #award .award_wrap .award .txt_wrap p{font-size: 10px}

	#header #logo svg{width: 105px;;height: auto}
	#header .hd_inner .open_btn button{gap: 5px;}
    .main_visual .vis_title strong, #award .title strong, #main #unique .uni_title .tit01 strong, #member .mem_content .mem_title .tit_wrap strong{font-size: 40px;}
        .main_visual .vis_title .tit_w02 {
        transform: translateX(50px);
    }
    .main_visual .vis_title{gap: 10px}
    #award .award_wrap .award .img_w .img{width: 200px;}
    #award .award_wrap .aw_wrap3{margin-left: -100px;}
    #award .award_wrap .award .txt_wrap strong{font-size: 16px;margin-bottom: 5px}
    #award .award_wrap .award .txt_wrap p{font-size: 12px;}
    #award .award_wrap .aw_wrap4 {bottom: 20px;margin-left: 124px;}
    #award .award_wrap .aw_wrap2 {margin-left: -322px;bottom: 90px;}
    #award .award_wrap .award_list{height: 550px}
    #main #unique{padding-top: 60px;}
    #main #unique .uni_title .tit02{flex-wrap: wrap}
    #main #unique .uni_title .tit02 .txt_b{width: 100%}
    #main #unique .uni_title .tit02 strong{font-size: 30px;}
    #main #unique .uni_title .tit02 .txt_b{top: 0}
    #main #unique .uni_title .tit02{margin-top: 0}
    #main #unique .uni_title .tit02 .line{display: block}
    #main #unique .uni_title .tit02 .line:after{width: 8px;height: 8px;right: -4px;margin-top:  -4px;}
    #main #unique .uni_title .tit02 .line:before{width: 8px;height: 8px;left: -4px;margin-top: -4px;}
    #main #unique .uni_title .tit02 .txt_b{flex-direction: column}
    #main #unique .uni_title .tit02 .txt_b strong{margin-bottom: 10px;}
    #main #unique .uni_title .tit02{margin-bottom: 0}
    #main #unique .shape_bg01 {top: 258px;left: -257px;}
    #main #unique .shape_bg02 {
    top: 324px;
    right: -140px;
}
    #main #unique .shape_bg02 img{width: 400px;}
    #main #unique .unique_list{margin-top: -290px;}
    #footer .ft02 > div.f02 ul{gap: 25px 0;}
    #main #top_1 .work_list ul li:nth-child(1){padding-left: 20px}
    #main #top_1 .work_list ul li:nth-child(2){padding-left: 60px;}
    #main #top_1 .work_list ul li:nth-child(3){padding-left: 40px;}
    #main #top_1 .work_list ul li:nth-child(6){padding-left: 80px}
    #main #top_1 .work_list ul li:nth-child(7){padding-left: 55px;}
    #main #top_1 .work_list ul li:nth-child(8){padding-left: 65px;}
    #main #top_1 .work_list ul li:nth-child(9){padding-left: 40px;}
    #main #top_1 .work_list ul li:nth-child(10) {padding-left: 86px;}
    #main #top_1 .work_list .work_con > div.box_front p{font-size: 14px;}
    #main #top_1 .work_list .work_con > div.box_bottom p{font-size: 13px;}
    #main #top_1 .work_list .work_con{height: 40px}
    #main #top_1 .work_list .work_con > div.box_front, #main #top_1 .work_list .work_con > div.box_bottom{border-radius: 5px 0 0 5px}

    #footer .ft02 > div.f02 ul:after{margin-left: -15px}
    #footer .ft02 > div.f02, #footer .ft02 > div{margin-bottom: 20px;padding-bottom: 20px;}
    #footer .ft01{gap: 10px;margin-bottom: 15px;}
    #main #unique .unique_list .project_info{width: auto}
    #main #unique .unique_list .project_info ul li p svg{width: 16px;height: auto}
    .aw_obj_wrap{width: 200px}
    #main .card {transform: rotateY(calc((360deg / 13) * var(--index))) translateZ(370px) translateY(calc(70px * var(--index)));width: 170px}
    .award .txt_wrap strong{font-size: 15px;line-height: 1.2}
    .aw_obj_wrap{left: 50%;top: 50%;margin-top: -435px;margin-left: -105px}
    #award{padding-top: 0}
    #project_list .pro > div .info strong{font-size: 30px}
    .award .txt_wrap{padding: 5px;}
    #we_service2 .we_wrap{transform: scale(1);gap: 10px;}
    #we_service2 .ser{width: calc(50% - 5px);}
    #we_service2 .info_s_text03{margin-top: 0;top: auto;bottom: -80px;left: auto;margin-right: 0;margin-left: 0;right: 20px}
    #main #award .aw_t{width: 300px;height: 168.75px}
    #award .award_title .aw_list ul li{opacity: 1}
    #main #award{padding-top: 0}
      #main .card.prev8 { transform: rotateY(-221.5403deg) translateZ(350px) translateY(-560px);  transition: 3s linear}
    #main .card.prev7 { transform: rotateY(-193.8461deg) translateZ(350px) translateY(-480px); ;transition: 3s linear}
    #main .card.prev6 { transform: rotateY(-166.1538deg) translateZ(350px) translateY(-420px); transition: 3s linear}
    #main .card.prev5 { transform: rotateY(-138.4615deg) translateZ(350px) translateY(-350px);  transition: 3s linear}
    #main .card.prev4 { transform: rotateY(-110.7692deg) translateZ(350px) translateY(-280px);  ;transition: 3s linear}
    #main .card.prev3 { transform: rotateY(-83.0769deg)  translateZ(350px) translateY(-210px);  ;transition: 3s linear}
    #main .card.prev2 { transform: rotateY(-55.3846deg)  translateZ(350px) translateY(-140px);  ;transition: 3s linear}
    #main .card.prev1 { transform: rotateY(-27.6923deg)  translateZ(350px) translateY(-70px);  ;transition: 3s linear}
    #main .card{opacity: 0}

    /* 가운데 (7번) */
    #main #award{padding-top: 140px;}
    .wrapper{margin-top: 10px;}
    .aw_obj_wrap{margin-left: -10px;}
    .aw_content .txt p{font-size: 11px;}
    #main .card.on { transform: rotateY(0deg) translateZ(350px) translateY(0px); opacity: 1;transition: 3s linear}
    /* 오른쪽 그룹 (8~13번) */
    #main .card.next1  { transform: rotateY(27.6923deg)  translateZ(350px) translateY(70px)  ;transition: 3s linear}
    #main .card.next2  { transform: rotateY(55.3846deg)  translateZ(350px) translateY(140px);transition: 3s linear}
    #main .card.next3 { transform: rotateY(83.0769deg)  translateZ(350px) translateY(210px);transition: 3s linear}
    #main .card.next4 { transform: rotateY(110.7692deg) translateZ(350px) translateY(280px);transition: 3s linear}
    #main .card.next5 { transform: rotateY(138.4615deg) translateZ(350px) translateY(350px);transition: 3s linear;mix-blend-mode: difference}
    #main .card.next6 { transform: rotateY(166.1538deg) translateZ(350px) translateY(420px);transition: 3s linear}
    #main .card.next7 { transform: rotateY(193.8461deg) translateZ(350px) translateY(490px);transition: 3s linear}
    #main .card.next8 { transform: rotateY(221.5403deg) translateZ(350px) translateY(560px);transition: 3s linear}

}

@media (max-width: 500px) {
    #main #unique .unique_list .ring_list{gap: 500px}
  #main #unique .unique_list{margin-top: -200px;}
  #main #unique .unique_list .monitor_w .monitor_in{width: 330px;height: 220px;padding: 5px;}
    .copy_title .copy03 img, .copy_title .copy03, .copy_title .copy03 > div strong{width: 280px}
    #member .mem_content .sl_w .bg img{width: 350px}
    #member .mem_content .sl_w .bg{margin-left: -175px}
    #award .award_wrap .award .img_w .img{width: 170px}
    #award .award_wrap .aw_wrap3{margin-left: -85px}
    #award .award_wrap .aw_wrap2{margin-left: -295px}
    #main #unique .uni_title .tit02{gap: 10px}
    #main #unique .uni_title .tit02{margin-top: 10px;}
    #main #unique .shape_bg01 img {width: 320px;}
    #main #unique .shape_bg01{left: -125px}
    #main #unique .shape_bg02 img{width: 250px}
    #main #unique .shape_bg02{right: -90px}
  
        #member .mem_content .sl_w .profile_w .profile img, #member .mem_content .sl_w .profile_w .profile{width: 90px}
    #member .mem_content .sl_w .profile_w .year span{font-size: 11px;line-height: 24px;}
    #member .mem_content .sl_w .profile_w .year{width: 80px;}
    #member .mem_content .sl_w .bg{bottom: 100px}
    #contact .port.port01 img{width: 150px}
        #contact .port .port_w {
        border-radius: 6px;
        padding: 5px;
    }
    #contact {
        padding: 160px 0;
        padding-top: 30px;
    }
    #contact .copy .copy01 strong{font-size: 100px;line-height: 100px;}
    #contact .port.port02{top: 400px;}
    #contact .txt_w .btn_w a {width: 100px;height: 100px;}
    #contact .txt_w .btn_w{margin-top: 20px;}
    #footer .ft01 strong{font-size: 35px;}
    #footer .ft01 p{font-size: 11px;}
    #main #unique .unique_list .project_info ul li span, #main #unique .unique_list .project_info ul li p{font-size: 11px}
}