@charset "utf-8";
@import url('plugin.css');

body::-webkit-scrollbar:not(.rmain2025){display:none}
body::-webkit-scrollbar:not(.remain2025){display:none}
*::selection{background-color:#00ffff; color:#000}
#wrap{position:fixed; width:100%; height:100%}
#wrap_works{position:relative; width:100%; height:100%}
#header{position:relative; width:100%; background-color:#fff; z-index: 500;}
#container{position:relative}
#footer{position:relative}
#contents{position:relative;}
.grid1{position:relative; padding-left:15px; padding-right:15px}
.grid2{position:relative; padding-left:15px;} 
.grid3{position:relative; padding-left:20px; padding-right:20px}
.m_dsp{display:none;}
#view_basic #wrap{position:relative; width:100%; height:100%}
/* ==========================================================================
   HEADER & SIDEBAR
   ========================================================================== */
#header .inner_header{position:relative; width:100%; height:168px; padding-top:15px; box-sizing:border-box}
#header .inner_header .half_grid{position:relative; float:left; width:50%; box-sizing:border-box;}
#header .inner_header .logo_idea img{height:78px}
#header .inner_header .logo_doit img{height:80px}
#header .main_nav{padding-top:15px; padding-bottom:14px; border-top:2px solid #0b0b0b; border-bottom:2px solid #0b0b0b; background-color:#fff; box-sizing:border-box; user-select:none}
#header .main_nav ul{float:left; width:50%; box-sizing:border-box; }
#header .main_nav.grid2 ul{width:calc(50% - 8px)}
#header .main_nav.grid2 ul.doit{width:calc(50% + 8px)}
#header .main_nav a{display:block; font-family:'Roboto', sans-serif; font-size:16px; font-weight:500; color:#ccc; line-height:21px; text-align:center; letter-spacing:0.25px; padding:1px 13px 0; border:2px solid transparent; box-sizing:border-box; border-radius:12px} 
#header .main_nav li{float:left; }
#header .main_nav .active a{color:#030000}
#header .main_nav .active .selected a{border-color:#231f20}
#header .main_nav ul.doit.active .selected a{color:#fff; background-color:#000}
#wrap_works #header.fixed{height:222px}
#wrap_works #header.fixed .main_nav {position:fixed; top:0; width:100%}
#view_basic #header{border-bottom:2px solid #0b0b0b;}
#view_basic #header .main_nav{display:none;}
#view_basic #wrap_works #header.fixed{height:auto}
#view_basic #wrap_works #header.fixed .main_nav{position:static; top:auto; width:auto}

/*MOBILE HEADER*/
#header .mobile_header{display:none; /*height:58px*/}
#header .mobile_header .m_row_header{position:fixed; width:100%; height:58px; padding-top:9px; border-bottom:1px solid #0b0b0b; background-color:#fff; box-sizing:border-box; z-index:500}
#header .mobile_header .m_row_header .logo_idea{float:left; padding-top:1px; cursor:pointer}
#header .mobile_header .m_row_header .logo_idea img{height:37px}
#header .mobile_header .m_row_header .logo_doit{float:right; cursor:pointer}
#header .mobile_header .m_row_header .logo_doit img{height:39px}
#header .m_detail_nav{display:none; padding-top:58px;}
#header .m_detail_nav .inner_sc{padding-top:11px; padding-bottom:9px; border-bottom:1px solid #0e0e0e; background-color:#fff; box-sizing:border-box;}
#header .m_detail_nav .item_nav{float:left; width:calc(50% - 1px); border:1px solid #222; margin-bottom:2px; margin-right:2px; box-sizing:border-box;}
#header .m_detail_nav .item_nav:nth-child(even){margin-right:0}
#header .m_detail_nav .item_nav a{display:block; font-family:'Roboto', sans-serif; font-size:16px; font-weight:bold; color:#000;line-height:27px; letter-spacing:0.25px; padding-left:8px; background-color:#fff; box-sizing:border-box;}
#header .m_detail_nav .item_nav.selected a{color:#fff; background-color:#000}

/* ==========================================================================
   2023 NEW HEADER & SIDEBAR
   ========================================================================== */
#header .main-nav{position: relative; display: flex; height: 66px; border-bottom:1px solid #0b0b0b; background-color:#fff; box-sizing:border-box; user-select:none; z-index: 500;}
#header .main-nav .nav-half{position: relative; display: flex; justify-content: space-between; align-items: center; width:50%; height: 100%; padding: 0 20px; box-sizing:border-box;}
#header .main-nav .nav-half .m-logo{display: none;}
#header .main-nav .nav-half .logo a{transition: .2s ease-in-out;}
#header .main-nav .nav-idea{border-right:1px solid #0e0e0e}
#header .main-nav .nav-idea .logo a{display: block; width: 108px; height: 36px; background: url('../images/common/logo_n_idea01.png') no-repeat 0 0; background-size: 100% auto;}
#header .main-nav .nav-idea .p-logo:hover a,
#header .main-nav .nav-idea .p-logo.selected a{background-image: url('../images/common/logo_n_idea0101.png');}
/* #header .main-nav .nav-doit{border-left:1px solid #0e0e0e} */
#header .main-nav .nav-doit .logo a{display: block; width: 121px; height: 36px; background: url('../images/common/logo_n_doit01.png') no-repeat 0 0; background-size: 100% auto;}
#header .main-nav .nav-doit .p-logo:hover a,
#header .main-nav .nav-doit .p-logo.selected a{background-image: url('../images/common/logo_n_doit0101.png');}
#header .nav-idea .m-logo.selected a{background-image: url('../images/common/logo_n_idea0101.png');}
#header .nav-doit .m-logo.selected a{background-image: url('../images/common/logo_n_doit0101.png');}
#header .active-idea .nav-idea .m-logo a{background-image: url('../images/common/logo_n_idea0101.png');}
#header .active-idea .nav-doit .m-logo.selected a{background-image: url('../images/common/logo_n_doit01.png');}
#header .active-doit .nav-doit .m-logo a{background-image: url('../images/common/logo_n_doit0101.png');}
#header .active-doit .nav-idea .m-logo.selected a{background-image: url('../images/common/logo_n_idea01.png');}
#header .main-nav .navigation{display: flex; align-items: center;}
.view-method{display: none; gap: 18px; margin-top: -3px;}
.view-method.on{display: flex;}
.view-method .btn-view-method{font-size: 0; display: block; width: 14px; height: 14px; cursor: pointer;}
.view-method .btn-view-method em{position: absolute;}
.view-method .btn-view-method.thumb{display: flex; flex-wrap: wrap; gap: 2px;}
.view-method .btn-view-method.thumb span{width: calc( (100% - 2px) / 2 ); height: 6px; background-color: #ccc; border-radius: 1px;}
.view-method .btn-view-method.thumb.on span{background-color: #000;}
.view-method .btn-view-method.title{display: flex; flex-direction: column; justify-content: space-between; padding: 1px 0;}
.view-method .btn-view-method.title span{display: block; width: 100%; height: 2px; background-color: #ccc;}
.view-method .btn-view-method.title.on span{background-color: #000;}
@media (max-width: 1023px){
    .navigation .view-method{display: none;}
}


#header .main-nav .navigation > ul{display: flex; padding-left: 11px; box-sizing: border-box; transition: .3s ease-in-out}


/*240710 수정백업
#header .main-nav .navigation{display: flex; align-items: center;}
#header .main-nav .navigation .btn-nav{width: 51px; height: 30px; background: url('../images/common/btn_nav01.png') no-repeat 0 center; background-size: 100% auto; cursor: pointer; transition: .1s ease-in-out .3s;}
#header .main-nav .navigation > ul{display: flex; padding-left: 0; box-sizing: border-box; opacity: 0; visibility: hidden; transition: .3s ease-in-out}
#header .main-nav .navigation:hover .btn-nav,
#header .main-nav .navigation.selected .btn-nav{background-image: url('../images/common/btn_nav0101.png')}
#header .main-nav .navigation:hover .btn-nav + ul,
#header .main-nav .navigation.selected .btn-nav + ul{padding-left: 11px; opacity: 1; visibility: visible}
/*240710 수정백업*/

#header .main-nav .navigation li{position: relative; margin: 0 3px;}
#header .main-nav .navigation li a{font-family:'Roboto', sans-serif; font-size:14px; font-weight: bold; color:#0b0b0b; line-height: 30px; letter-spacing: 0; padding: 0 5px; box-sizing:border-box; text-transform: uppercase;}
#header .main-nav .navigation li:last-child{margin-right:0}
#header .main-nav .navigation li:last-child a{padding-right:0}
#header .main-nav .navigation li:hover a,
#header .main-nav .navigation li.selected a{color: #00ffff;}
/*
#header .main-nav .navigation li.selected a::before,
#header .main-nav .navigation li.selected a::after{font-family: 'Anton', sans-serif; color: #00ffff;; vertical-align: top;}
#header .main-nav .navigation li.selected a::before{content: "( "; margin-right: 1px;}
#header .main-nav .navigation li.selected a::after{content: " )"; margin-left: 1px;}*/
#header .main-nav .navigation .detail-nav{display: flex; display: none; align-items: center; margin-left: 6px;}
.pg_doit_detail #header .main-nav .navigation .detail-nav{display: flex;}

#header .main-nav .navigation .detail-nav > div{margin: 0 7px;}
#header .main-nav .navigation .detail-nav a{position: relative; display: block; font-family:'Roboto', sans-serif; font-size: 12px; font-weight: 400; color:#000; line-height: 30px; letter-spacing: 0; box-sizing:border-box; text-transform: uppercase;}
#header .main-nav .navigation .detail-nav .selected a{color: #00ffff;}
#header .main-nav .navigation .detail-nav .selected a::after{content: ""; position: absolute; left: 0; bottom: 5px; display: block; width: 100%; height: 1px; background-color: #00ffff;}
#header .main-nav .navigation .mbtn-nav{display: none; width: 51px; height: 30px; background: url('../images/common/btn_nav01.png') no-repeat 0 center; background-size: 100% auto; cursor: pointer; transition: .1s ease-in-out .3s;}
#header .main-nav .navigation .mbtn-nav.selected{background-image: url('../images/common/btn_nav0101.png')}

#header .main-nav .navigation .detail-nav01{display: block; position: absolute; left: -10px; top: 47px; width: 162px; max-height: 0; transition: max-height .3s ease-in-out; overflow: hidden; z-index: 10;}
#header .main-nav .navigation .detail-nav01{display: none}
#header .main-nav .navigation .detail-nav01 .inner-nav{border: 1px solid #222; border-bottom:0; background-color: #fff;}
#header .main-nav .navigation .detail-nav01 .item-nav{border-bottom: 1px solid #222;}
#header .main-nav .navigation .detail-nav01 .item-nav a{position: relative; display: flex; align-items: center; font-family: 'Pretendard'; font-size: 14px; font-weight: bold; color:#222; height: 31px; padding: 0 15px; letter-spacing: 0; box-sizing:border-box; text-transform: capitalize;}
#header .main-nav .navigation .detail-nav01 .item-nav .txt-ko{display: none;}
#header .main-nav .navigation .detail-nav01 .item-nav:hover,
#header .main-nav .navigation .detail-nav01 .item-nav.selected{background-color: #00ffff;}
#header .main-nav .navigation .detail-nav01 .item-nav.selected .txt-en,
#header .main-nav .navigation .detail-nav01 .item-nav:hover .txt-en{display: none;}
#header .main-nav .navigation .detail-nav01 .item-nav.selected .txt-ko,
#header .main-nav .navigation .detail-nav01 .item-nav:hover .txt-ko{display: inline;}
#header .main-nav .item-works:hover .detail-nav01{max-height: 420px;}
/*Mobile Category*/
#header .mdetail-nav{display:none; padding-top: 0; z-index: 480;}
#header .mdetail-nav .control-list{display: flex; justify-content: space-between; align-items: center; height: 34px; border-bottom: 1px solid #222; padding: 0 20px;}
#header .mdetail-nav .control-list .title{font-size: 12px; font-weight: bold; color: #bbb; letter-spacing: 0;}
#header .mdetail-nav .control-list .right-set{display: flex; align-items: center; padding-right: 1px;}
#header .mdetail-nav .control-list .view-method{margin-top: 0}
#header .mdetail-nav .control-list .view-method em{font-size: 0}
#header .mdetail-nav .control-list .btn-toggle{border-left: 1px solid #ddd; padding-left: 14px; margin-left: 23px;}
#header .mdetail-nav .control-list .btn-toggle > span{display: block; width: 22px; height: 16px; font-size: 0; background: url('../images/common/arw4.png') no-repeat center / 15px auto;}

#header .mdetail-nav .inner_sc{display: none; padding-top:11px; padding-bottom:9px; border-bottom:1px solid #0e0e0e; background-color:#fff; box-sizing:border-box;}
#header .mdetail-nav .inner_sc.on{display: block;}
#header .mdetail-nav .item_nav{float:left; width:calc(50% - 1px); border:1px solid #222; margin-bottom:2px; margin-right:2px; box-sizing:border-box;}
#header .mdetail-nav .item_nav:nth-child(even){margin-right:0}
#header .mdetail-nav .item_nav a{display:block; font-family:'Roboto', sans-serif; font-size:16px; font-weight:bold; color:#000;line-height:27px; letter-spacing:0.25px; padding-left:8px; background-color:#fff; box-sizing:border-box;}
#header .mdetail-nav .item_nav.selected a{color:#fff; background-color:#000}

.overlay_menu{display:none; position:fixed; top:-100%; width:100%; height:100%; z-index: 490; overflow:hidden; transition: .6s top ease-out}
.overlay_menu.on{top: 66px}
.overlay_menu .inner_sc{position:relative; display: flex; flex-wrap: wrap; height:calc(100% - 66px);}
.overlay_menu .item_nav{height:50%; padding:0 15px; border-bottom:1px solid #010101; box-sizing:border-box;}
.overlay_menu .item_nav .inner_sc1{height:100%; text-align: center}
.overlay_menu .item_nav .inner_sc1 > a{display: inline-flex; flex-wrap:wrap; justify-content:center; align-items: center; height: 100%}
.overlay_menu .item_nav .inner_sc1 .item_figure{position:relative; display:flex; flex-wrap:wrap; width:100%; flex-direction: column;}
.overlay_menu .item_nav .inner_sc1 .item_figure img{width:100%}
.overlay_menu .item_nav .inner_sc1 .item_figure .title{position:absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size:40px; font-weight:100; color:#fff; line-height: 48px; text-align:center;  text-transform:uppercase; }
.overlay_menu .item_nav .inner_sc1 .item_figure .title .pos01{position: relative; top: -5px;}
.overlay_menu .nav_idea .item_nav{width: 50%;}
.overlay_menu .nav_idea .item_nav:nth-child(odd){border-right: 1px solid #010101;}
.overlay_menu .nav_doit .item_nav{width: 100%;}
.overlay_menu .item_nav:hover{background-color: #00ffff;}
.overlay_menu .item_nav:hover .inner_sc1 .item_figure .title{color: #00ffff;}


/*모바일 네비게이션 수정 250612*/
.overlay_menu {
    .nav_idea,
    .nav_doit{display: none}
    .inner-sec{position:relative; height:calc(100% - 66px); background-color: #fff}
    .inner-sec .btn-x{position: absolute; top: 30px; right: 30px;}
    .inner-sec .btn-x img{width: 40px;}
    .nav-mobile{display: flex; flex-direction: column; justify-content: flex-end; height: 100%;}
    .item-nav{border-top: 1px solid #000;}
    .item-nav:hover,
    .selected{background-color: var(--point-color01);}
    .item-nav.item-nav a{display: flex; align-items: center; height: 62px; padding-left: 20px; padding-top: 3px; font-family:'Roboto', sans-serif; font-size: 43px; font-weight: bold; color: #000; text-transform: uppercase;}
    .nav-doit{
        background-color: #000;
        .item-nav{border-color: #fff;}
        .item-nav a{color: #fff;}
        .item-nav:hover,
        .selected{color: #000; border-color: #000;}
        .item-nav:hover a,
        .selected a{color: #000;}
        .selected + .item-nav{border-color: #000;}
    }
}



/* ==========================================================================
   MAIN GRID
   ========================================================================== */
.main_grid{height: calc(var(--vh, 1vh) * 100);}
.main_grid .half_grid{position:relative; float:left; width:50%; height:calc(100% - 66px); box-sizing:border-box; overflow-y:auto}  /*반응형시 .res1:상하(높이 고정) .res2:상하로 떨어짐, .res3:하단(우측) 사라짐*/ 
/*.main_grid.cnt .half_grid{height:auto}*/
.main_grid.cnt .half_grid:nth-child(1),
.main_grid.cnt .half_grid:nth-child(2){border:0}

#left_panel::-webkit-scrollbar{display: none}
#right_panel::-webkit-scrollbar{display: none}
/*.main_grid .half_grid::-webkit-scrollbar{display: none}*/
/*스크롤 커스텀*/
.main_grid .half_grid{overflow-y: auto; overflow-y: overlay;}
.main_grid .half_grid::-webkit-scrollbar{width: 12px;}
.main_grid .half_grid::-webkit-scrollbar-track{background: transparent; border-radius:3px;}
.main_grid .half_grid::-webkit-scrollbar-thumb{border: 0px solid transparent; /*background-color: transparent;*/ background-clip: padding-box; border-radius: 18px; background-color: #00ffff;}
.main_grid .half_grid:hover::-webkit-scrollbar-thumb{background-color: #00ffff;}
.main_grid .half_grid.no-scroll::-webkit-scrollbar{display: none}

.main_grid .half_grid:nth-child(1){border-right:1px solid #0e0e0e}
/* .main_grid .half_grid:nth-child(2){border-left:1px solid #0e0e0e} */
.main_grid .sc_intro{height:calc(100% - 58px)}
.main_grid .bottom_grid{padding-top:14px; padding-bottom:14px; border-top:1px solid #010101; border-bottom:1px solid #010101}
.main_grid .bottom_grid .sns_set a{margin-right:11px}
.main_grid .bottom_grid .sns_set img{width:26px}
.main_grid .bottom_grid .copyright{float:left; font-family:'Roboto', sans-serif; font-size:16px; font-weight:400; color:#030000; line-height:26px}
.main_grid .bottom_left .sns_set{display:none;}
.main_grid .bottom_right .copyright{display:none; float:right;}

.main_grid1{height: calc(var(--vh, 1vh) * 100);}
.main_grid1 .wide_grid{position:relative; width:100%; height:calc(100% - 66px); box-sizing:border-box; overflow-y:auto;}
.main_grid1 .footer_intro > div{float:left; width:50%; box-sizing:border-box;}
.main_grid1 .footer_intro > div:nth-child(1){border-right:1px solid #0e0e0e}
.main_grid1 .footer_intro > div:nth-child(2){border-left:1px solid #0e0e0e}
.main_grid1 .bottom_grid{padding-top:14px; padding-bottom:14px; border-top:2px solid #010101; border-bottom:2px solid #010101}
.main_grid1 .bottom_grid .sns_set a{margin-right:11px}
.main_grid1 .bottom_grid .sns_set img{width:26px}
.main_grid1 .bottom_grid .copyright{float:left; font-family:'Roboto', sans-serif; font-size:16px; font-weight:400; color:#030000; line-height:26px}
.main_grid1 .bottom_left .sns_set{display:none;}
.main_grid1 .bottom_right .copyright{display:none; float:right;}

/*Splitter*/
.splitter{display: flex;}
#left_panel,
#right_panel{float: none; min-width: 400px; border: 0;}

#separator {
	cursor: col-resize;
	border-left: 1px solid #0b0b0b;
	border-right: 1px solid #0b0b0b;
    background: #fff url('../images/common/line01.png') no-repeat center calc(50% - 33px);
    width: 12px;
    height: 100%;
    /* Prevent the browser's built-in drag from interfering */
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#separator:hover{background-color: #00ffff;}


.btn-talk{position: fixed; right: 46px; bottom: 25px; width: 54px; height: 54px; font-size: 0; color: #fff; background: #fff url('../images/common/ico_bubble0101.png') no-repeat center; background-size: 25px auto; border-radius: 50%; box-shadow: 2px 2px 3px 3px rgba(0,0,0,.09); cursor: pointer; z-index: 101; transition: .2s ease-in-out;}
.btn-talk:hover{background-color: #00ffff;}

/* ==========================================================================
   변형 타입
   ========================================================================== */
.basic_type1 #wrap{position:relative; width:100%; height:auto}
.basic_type1 #header{position:fixed; z-index: 500;}
.basic_type1 #container{padding-top: 66px}
.basic_type1 #contents{height: calc(100vh - 66px); overflow-y: auto;}
.basic_type1 .main_grid.auto{height:auto}
.basic_type1 .main_grid.auto .half_grid{height:auto}
.basic_type1.scroll #contents::-webkit-scrollbar{width:20px;}
.basic_type1.scroll #contents::-webkit-scrollbar-track{background: transparent; border-radius:3px;}
.basic_type1.scroll #contents::-webkit-scrollbar-thumb{border: 6px solid transparent; /*background-color: transparent;*/ background-color: #00ffff; background-clip: padding-box; border-radius: 18px;}
.basic_type1.scroll #contents:hover::-webkit-scrollbar-thumb{background-color: #00ffff;}
.basic_type1.no-scroll #contents::-webkit-scrollbar{display: none}

/* ==========================================================================
   INTRO
   ========================================================================== */

.swiper-slide{-webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -webkit-perspective: 2000px;}
#main_visual{position:relative; width: 100%; background: #010101; overflow:hidden}
#main_visual,
#main_visual .mvis,
#main_visual .swiper-wrapper{height: 100%;}
#main_visual .vis{width:100%; height:100%;}
#main_visual .vis .bg{width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover; /*animation: move1 13s ease-in-out forwards; transform-origin:center;*/}
#main_visual .vis01 .bg{background-image:url('../images/main/mvis_p01.jpg?240611');}
#main_visual .vis02 .bg{background-image:url('../images/main/mvis_p02.jpg?240611');}
#main_visual .vis03 .bg{background-image:url('../images/main/mvis_p03.jpg?240611');}
#main_visual .vis04 .bg{background-image:url('../images/main/mvis_p04.jpg?240611');}
#main_visual .vis05 .bg{background-image:url('../images/main/mvis_p05.jpg?240611');}
#main_visual .vis06 .bg{background-image:url('../images/main/mvis_p06.jpg');}
#main_visual .vis07 .bg{background-image:url('../images/main/mvis_p07.jpg');}
#main_visual .vis08 .bg{background-image:url('../images/main/mvis_p08.jpg');}
#main_visual .vis09 .bg{background-image:url('../images/main/mvis_p09.jpg');}
#main_visual .vis10 .bg{background-image:url('../images/main/mvis_p10.jpg');}

#main_visual .rvis01 .bg{background-image:url('../images/main/mvis_r01.jpg');}
#main_visual .rvis02 .bg{background-image:url('../images/main/mvis_r02.jpg');}
#main_visual .rvis03 .bg{background-image:url('../images/main/mvis_r03.jpg');}
#main_visual .rvis04 .bg{background-image:url('../images/main/mvis_r04.jpg');}
#main_visual .rvis05 .bg{background-image:url('../images/main/mvis_r05.jpg');}

/*애니메이션 Move*/
@keyframes move1
{  
    from {transform:scale(1)}  
    to {transform:scale(1.15)}
}
@keyframes move2
{  
    from {transform:scale(1.15)}  
    to {transform:scale(1)}
}

/* Pager */
#main_visual .mvis.swiper-container-horizontal>.swiper-pagination-bullets{bottom: 19px;}
#main_visual .mvis.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 3px}
#main_visual .mvis .swiper-pagination-bullet{position: relative; width: 20px; height: 20px; border:1px solid transparent; background-color:transparent; opacity:1; outline:none;}
#main_visual .mvis .swiper-pagination-bullet::after{content: ""; display: block; position: absolute; left: calc(50% - 3px); top: calc(50% - 3px); width: 6px; height: 6px; background-color: #fff; border-radius: 3px;}
#main_visual .mvis .swiper-pagination-bullet-active{border-color: #fff;}
#main_visual .mvis .swiper-pagination-bullet:hover,
#main_visual .mvis .swiper-pagination-bullet:focus{outline:none}


/* ==========================================================================
   Renewal Main 2025
   ========================================================================== */
:root {
    --point-color01: #00ffff;
    --header-height: 66px;
    --cont-height: calc(100svh - var(--header-height));
    /*--cont-height: calc((var(--vh, 1vh) * 100) - var(--header-height));*/
}
.text-stroke {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000;
    &::selection{-webkit-text-fill-color: #000;}
    /* .text-stroke:hover{-webkit-text-fill-color: var(--point-color01)}
    .text-stroke.nhover:hover{-webkit-text-fill-color: transparent;}*/
}

.rmain2025{
    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    color: #000;
    overscroll-behavior : contain;
    & a:hover{color: inherit;}
    &::-webkit-scrollbar{width:6px;}
    &::-webkit-scrollbar-track{background: transparent; border-radius:3px;}
    &::-webkit-scrollbar-thumb{background: var(--point-color01); border-radius:3px;}
    & #wrap{position: relative;}
    & #header{position: fixed; width: 100%; z-index: 500;}
    & #container{padding-top: var(--header-height);}
    & .r-grid{position: relative; padding-left: 80px; padding-right: 80px;}
    & .inner-grid{position: relative;}
    & .bk-sec {
        color: #fff;
        background-color: #000;
        & .text-stroke{-webkit-text-stroke-color: #fff;}
        & .text-stroke::selection{-webkit-text-fill-color: #fff;}
        & .logo-set .b-logo{display: none;}
        & .logo-set .w-logo{display: inline;}
        & .tab-process{
            & .tabs01{
                &::before{background-color: #fff;}
                & .btn-tab{color: rgba(255,255,255,.2);}
                & .btn-tab.active{color: rgba(255,255,255,1);}
                & .btn-tab::after{border-color: #fff;}
            }
        }
    }
    & .common-height{height: var(--cont-height); min-height: 880px;}
    & .tit-sec01 {
        position: relative;
        font-size: 60px;
        font-weight: 700;
        line-height: 82px;
        word-break: keep-all;
        & .highlight{position: relative;}
        & .highlight::after{content: ""; display: block; position: absolute; left: 0; bottom: -8px; width: 100%; height: 44px; background-color: var(--point-color01); z-index: -1}
    }
    & .tit-sec02{font-size: 36px; font-weight: bold; line-height: 44px; text-transform: uppercase;}
    & .tit-sec03 {
        text-transform: uppercase;
        & .txt01{font-size: 36px; font-weight: bold; line-height: 1;}
        & .txt02{font-size: 18px; line-height: 30px;}
        & .txt03{font-size: 29px; line-height: 47px; color: rgba(255,255,255,.6); letter-spacing: -1px;}
    }
    & .tit-sec04 {
        text-transform: uppercase;
        & .txt01{font-size: 160px; font-weight: bold; line-height: 170px;}
    }
    & .tit-sec05 {
        text-transform: uppercase;
        & .txt01{font-size: 36px; font-weight: bold; line-height: 1;}
        & .txt02{font-size: 25px; line-height: 42px; color: rgba(255,255,255,.6); letter-spacing: -1px;}
        & .txt02 strong{font-weight: inherit; color: rgba(255,255,255,1);}
    }
    & .text-vis {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
    }
    & .text-vis01 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
        font-size: 44px;
        font-weight: bold;
        line-height: 66px;
        word-break: keep-all;
        & .text-stroke{font-weight: 800}
    }
    & .circle-set {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 535px;
        & .circle{display: flex; justify-content: center; align-items: center; width: 430px; border: 2px solid #fff; aspect-ratio: 1 / 1; text-align: center; white-space: nowrap; border-radius: 50%;}
        & .t-circle{font-weight: 400; color: #fff; background-color: transparent;}
        & .w-circle{font-weight: 700; color: #000; background-color: #fff;}
        & .cont-circle{animation: fadeEffect .5s ease-in-out;}
        /*& .txt-en{font-family:'Roboto', sans-serif; font-size: clamp(26px, 2.08335vw, 40px); line-height: clamp(42px, 2.96875vw, 57px); text-transform: uppercase;}*/
        /*& .txt-ko{font-size: clamp(18px, 1.66667vw, 32px); line-height: clamp(32px, 2.603vw, 50px); letter-spacing: -0.1px;}*/
        & .txt-en{font-family:'Roboto', sans-serif; font-size: 40px; line-height: 57px; text-transform: uppercase;}
        & .txt-ko{font-size: 32px; line-height: 50px; letter-spacing: -0.1px;}
        & .txt-h{display: none;}
        & .circle:hover .txt-d{display: none;}
        & .circle:hover .txt-h{display: block;}
        & .space-set{width: 140px;}
        & .arr-circle{position: relative; display: flex; justify-content: center; align-items: center; width: 200px; padding: 0 10px;}
        & .arr-circle::after{content: ""; display: block; position: absolute; top: 50%; width: calc(100% - 20px); height: 48px; translate: 0 -50%; background: url('../images/rmain2025/arr01.png') no-repeat right center / auto 23px, url('../images/rmain2025/dot01.png') repeat-x 16px center / auto 3px; z-index: -1}
        /*& .arrow{border: 2px dashed var(--point-color01);}*/
        & .color-circle{display: flex; justify-content: center; align-items: center; width: 48px; aspect-ratio: 1 / 1; background-color: var(--point-color01); border-radius: 50%; overflow: hidden;}
        & .txt-ccircle{font-family:'Roboto', sans-serif; font-size: 64px; font-weight: bold; color: #000; line-height: 1; text-align: center; text-transform: uppercase; white-space: nowrap; scale: .6; opacity: 0;}
        & .txt-ccircle img{width: 255px;}
    }
    & .circle-set01{
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        & .circle{display: flex; justify-content: center; align-items: center; width: 420px; aspect-ratio: 1 / 1; text-align: center; white-space: nowrap; font-weight: 700; color: #000; background-color: #fff; border-radius: 50%;}
        & .txt-en{font-family:'Roboto', sans-serif; font-size: 40px; color: #000; line-height: 57px; text-align: center; text-transform: uppercase;}
        & .making{translate: -37% 0}
        & .caring{translate: 37% 0}
        /*& .making{translate: 50% 0}*/
        /*& .caring{translate: -50% 0}*/
        & .ico-plus{position: absolute}
        & .ico-plus img{width: 32px;}
        & .hidden-text{position: absolute; opacity: 0;}
    }
    & #main_visual {
        height: var(--cont-height);
        & .mvis::after{content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0.5) 82%, rgba(0, 0, 0, 0.6) 100%); z-index: 10}
        & .static-text{position: absolute; top: 92px; color: #fff; z-index: 50;}
        & .tit-sec01 p{opacity: 0;}
        & .tit-sec01 p:first-child{animation: fadeUp 1s ease-out forwards .3s;}
        & .tit-sec01 p:nth-child(2){animation: fadeUp 1s ease-out forwards .6s;}
        & .tit-sec01 p:nth-child(3){animation: fadeUp 1s ease-out forwards .9s;}
    }
    @media (width <= 1620px) {
        & .circle-set{
            & .circle{width: 320px;}
            & .txt-en{font-size: 35px; line-height: 47px;}
            & .txt-ko{font-size: 26px; line-height: 43px;}
            & .arr-circle{width: 160px;}
            & .arr-circle::after{height: 42px;}
            & .color-circle{width: 42px;}
            & .txt-ccircle{font-size: 56px;}
            & .txt-ccircle img{width: 238px;}
        }
    }
    @media (width <= 1540px) {
        & .text-vis01{font-size: 40px; line-height: 60px;}
    }
    @media (width <= 1420px) {
        & .r-grid{padding-left: 40px; padding-right: 40px;}
        & .tit-sec01{font-size: 54px; line-height: 76px;}
        & .tit-sec01 .highlight::after{bottom: -7px; height: 40px;}
        & .tit-sec02{font-size: 32px; line-height: 42px;}
        & .tit-sec03 .txt01,
        & .tit-sec05 .txt01{font-size: 32px; line-height: 42px;}
        & .tit-sec03 .txt02{font-size: 17px; line-height: 28px;}
        & .tit-sec03 .txt02 .dspn{display: none}
        & .tit-sec03 .txt03{font-size: 24px; line-height: 40px;}
        & .tit-sec04 .txt01{font-size: 150px; line-height: 160px;}
        & .text-vis01{font-size: 38px; line-height: 58px;}
        & .common-height{min-height: 800px;}
        & #main_visual{
            & .static-text{top: 48px;}
        }
    }
    @media (width <= 1280px) {
        & .tit-sec01{font-size: 48px; line-height: 65px;}
        & .tit-sec01 .highlight::after{bottom: -2px; height: 32px;}
        & .tit-sec02{font-size: 30px; line-height: 40px;}
        & .tit-sec04 .txt01{font-size: 146px; line-height: 158px;}
        & .tit-sec05 .txt02{font-size: 23px; line-height: 38px;}

        & .text-vis01{font-size: 34px; line-height: 53px;}
        & .common-height{min-height: 760px;}
        & .circle-set {
            & .circle{width: 320px;}
            & .txt-en{font-size: 35px; line-height: 47px;}
            & .txt-ko{font-size: 26px; line-height: 43px;}
            & .arr-circle{width: 160px;}
            & .arr-circle::after{height: 42px;}
            & .color-circle{width: 42px;}
            & .txt-ccircle{font-size: 56px;}
            & .txt-ccircle img{width: 238px;}
        }
        & .circle-set01{
            height: 514px;
            & .circle{width: 360px;}
        }
        & #main_visual{
            & .static-text{top: 26px;}
        }
    }
    @media (width <= 1200px) {
        & .tit-sec01{font-size: 40px; line-height: 56px;}
        & .tit-sec01 .highlight::after{bottom: -6px; height: 32px;}
        & .tit-sec02{font-size: 28px; line-height: 38px;}
        & .tit-sec03 .txt01{font-size: 28px; line-height: 38px;}
        & .tit-sec03 .txt02{font-size: 16px; line-height: 27px;}
        & .tit-sec03 .txt03{font-size: 20px; line-height: 33px;}
        & .tit-sec04 .txt01{font-size: 130px; line-height: 145px;}
        & .tit-sec05 {
            & .txt01{font-size: 28px; line-height: 38px;}
            & .txt02{font-size: 20px; line-height: 35px;}
        }
        & .text-vis01{font-size: 30px; line-height: 48px;}
        & .common-height{min-height: 0;}
        & .circle-set{height: 400px;}
        & .circle-set01{
            height: 460px;
            & .circle{width: 300px;}
            & .txt-en{font-size: 32px; line-height: 42px;}
        }
    }
    @media (width <= 1023px) {
        &::-webkit-scrollbar{display: none;}
        & #container{padding-top: 0;}
        & .tit-sec01{font-size: 36px; line-height: 50px;}
        & .tit-sec01 .highlight::after{bottom: -5px; height: 28px;}
        & .tit-sec02{font-size: 27px; line-height: 37px;}
        & .tit-sec04 .txt01{font-size: 90px; line-height: 103px;}
        & .tit-sec05 {
            & .txt01{font-size: 26px;}
            & .txt02{font-size: 18px; line-height: 31px;}
        }
        & .text-vis{grid-template-columns: 1fr; gap: 20px;}
        & .text-vis01{grid-template-columns: 1fr; gap: 20px;}
        & .bk-sec {
            & .tab-process{
                & .tabs01{
                    & .btn-tab::before{background-color: #fff;}
                }
            }
        }
        & .circle-set {
            height: 380px;
            & .circle{width: 280px;}
            & .space-set{width: 100px;}
            & .txt-en{font-size: 29px; line-height: 42px;}
            & .txt-ko{font-size: 23px; line-height: 34px;}
            & .arr-circle{width: 130px;}
            & .arr-circle::after{height: 32px;}
            & .color-circle{width: 32px;}
            & .txt-ccircle{font-size: 47px;}
            & .txt-ccircle img{width: 210px;}
        }
        & .circle-set01 {
            height: 440px;
            & .ico-plus img{width: 26px;}
            & .circle{width: 240px;}
            & .txt-en{font-size: 30px; line-height: 40px;}
        }
    }
    @media (width <= 767px) {
        & .r-grid{padding-left: 20px; padding-right: 20px;}
        & .tit-sec01{font-size: 27px; line-height: 40px;}
        & .tit-sec01 .highlight::after{bottom: -2px; height: 22px;}
        & .tit-sec02{font-size: 25px; line-height: 32px;}
        & .tit-sec03 .txt01{font-size: 23px; line-height: 32px;}
        & .tit-sec03 .txt02{font-size: 15px; line-height: 25px;}
        & .tit-sec03 .txt03{font-size: 17px; line-height: 28px;}
        & .tit-sec04 .txt01{font-size: 10vw; line-height: 1.3;}
        & .tit-sec05 {
            & .txt01{font-size: 23px; line-height: 32px;}
            & .txt02{font-size: 17px; line-height: 30px;}
        }
        & .text-vis{gap: 15px;}
        & .text-vis01{font-size: 28px; line-height: 42px;}
        & .circle-set {
            flex-direction: column;
            height: auto;
            padding-bottom: 60px;
            & .circle{width: 260px;}
            & .space-set{height: 40px;}
            & .arr-circle{height: 130px;}
            & .arr-circle::after{height: 28px; rotate: 90deg;}
            & .color-circle{width: 28px;}
            & .txt-ccircle{font-size: 42px;}
            & .txt-ccircle img{width: 196px;}
        }
        & .circle-set01{
            height: 480px;
            flex-direction: column;
            & .making{translate: 0 -15%;}
            & .caring{translate: 0 15%;}
            & .circle{width: 200px;}
            & .txt-en{font-size: 26px; line-height: 36px;}
            & .ico-plus img{width: 22px;}
        }
    }
    @media (width <= 599px) {
        & #main_visual {
            & .tit-sec01{font-size: 26px; line-height: 40px;}
        }
    }
}
.main-movie{
    position: relative;
    & .main-video{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
    & .m-video{display: none;}
    @media (width <= 550px) {
        & .pc-video{display: none;}
        & .m-video{display: block;}
    }
}

.rmain-sec01{
    & .tit-sec01{padding-top: 77px;}
    & .tit-sec01 p{opacity: 0;}
    & .tit-sec01 .highlight::after{width: 0; transition: .4s ease-in-out 1.7s}
    & .main-obj{position: absolute; right: 0; bottom: 60px; max-width: 1200px; opacity: 0;}
    &.active{
        & .tit-sec01 p:first-child{animation: fadeUp 1s ease-out forwards .3s;}
        & .tit-sec01 p:nth-child(2){animation: fadeUp 1s ease-out forwards .6s;}
        & .tit-sec01 .highlight::after{width: 100%;}
        & .main-obj{animation: fadeUp .8s ease-out forwards 1.1s;}
    }
    @media (width <= 1420px) {
        & .tit-sec01{padding-top: 36px;}
        & .main-obj{bottom: 40px; max-width: 1080px;}
    }
    @media (width <= 1280px) {
        & .tit-sec01{padding-top: 32px;}
        & .main-obj{max-width: 980px;}
    }
    @media (width <= 1023px) {
        & .common-height{padding-bottom: 40px;}
    }
    @media (width <= 767px) {
        & .common-height{height: 600px; padding-bottom: 30px;}
    }
    @media (width <= 599px) {
        & .common-height{height: 520px;}
    }
}

.rmain-sec02,
.rmain-sec0201{
    display: flex;
    align-items: center;
    & .col-txt{opacity: 0;}
    &.active{
        & .col-txt:first-child{animation: fadeUp .7s ease-out forwards;}
        & .col-txt:nth-child(2){animation: fadeUp .7s ease-out forwards .4s;}
    }
}
.rmain-sec03{
    overflow: hidden;
    & .tit-sec02{padding-top: 80px;}
    & .circle-set{margin-top: 80px;}
    @media (width <= 767px) {
        &.common-height{height: auto;}
    }
}
.rmain-sec0301{
    display: flex;
    /*display: none;*/
    justify-content: center;
    align-items: center;
    overflow: hidden;
    @media (width <= 767px) {
        &.common-height{height: auto;}
    }
}
.rmain-sec04{
    display: flex;
    align-items: center;
    & .tit-sec01 p{opacity: 0;}
    & .tit-sec01 .highlight::after{width: 0; transition: .6s ease-in-out 1.0s}
    &.active{
        & .tit-sec01 p:first-child{animation: fadeUp .7s ease-out forwards .3s;}
        & .tit-sec01 p:nth-child(2){animation: fadeUp .7s ease-out forwards .7s;}
        & .tit-sec01 .highlight::after{width: 100%;}
    }
    @media (width <= 767px) {
        & .tit-sec01{font-size: 26px; line-height: 40px; text-align: center}
    }
}
.tab-process{
    &.r-grid{padding-right: 0}
    & .tabs01{
        display: grid;
        grid-template-columns: repeat(10, 10%);
        padding-right: 80px;
        &::before{content: ""; position: absolute; top: 0; display: block; width: 100%; height: 2px; background-color: #000;}
        & .btn-tab{position: relative; display: flex; flex-direction: column; padding-top: 60px; padding-bottom: 60px; font-size: 22px; font-weight: bold; color: rgba(0,0,0,.2); line-height: 34px;}
        & .btn-tab::after{content: ""; position: absolute; left: 0; top: 0; translate: 0 -50%; width: 23px; height: 23px; border: 2px solid #000; background-color: #fff; border-radius: 50%;}
        & .btn-tab.active{color: rgba(0,0,0,1);}
        & .btn-tab.active::after{background-color: var(--point-color01);}
    }
    & .cont-area {
        padding-right: 80px;
        & .cont-tab{display: grid; grid-template-columns: repeat(2, 50%); padding: 120px 0 0;}
        & .text-container{padding-right: 80px;}
        & .tit-tab{font-size: 44px; font-weight: bold; line-height: 60px; word-break: keep-all}
        & .txt-set{font-size: 24px; line-height: 36px; word-break: keep-all; margin-top: 46px;}
        & .txt-set p:not(:last-child){margin-bottom: 36px}
        & .add-list{margin-top: 43px;}
        & .add-list > li{font-weight: bold;}
        & .add-list > li::before{content: "· ";}
        & .more-cont{display: none}
        & .more-text {font-size: 24px; font-weight: bold; margin-top: 53px;}
        & .more-text > span{text-decoration: underline; cursor: pointer;}
    }
    @media (width <= 1800px) {
        & .cont-area .txt-set p .dspn{display: none;}
    }
    @media (width <= 1620px) {
        & .cont-area .tit-tab .dspn{display: none;}
    }
    @media (width <= 1420px) {
        & .tabs01 {
            padding-right: 0;
            & .btn-tab{font-size: 19px; line-height: 30px; padding-top: 40px; padding-bottom: 40px;}
        }
        & .cont-area {
            padding-right: 40px;
            & .text-container{padding-right: 40px;}
            & .cont-tab{padding-top: 100px;}
            & .tit-tab{font-size: 40px; line-height: 54px;}
            & .txt-set{font-size: 21px; line-height: 32px; margin-top: 30px;}
        }
    }
    @media (width <= 1280px) {
        & .tabs01 {
            & .btn-tab{font-size: 18px; line-height: 30px; padding-top: 30px; padding-bottom: 30px;}
        }
    }
    @media (width <= 1200px) {
        & .tabs01 {
            & .btn-tab{font-size: 17px; line-height: 26px;}
        }
        & .cont-area {
            & .text-container{padding-right: 20px;}
            & .cont-tab{padding-top: 60px;}
            & .tit-tab{font-size: 34px; line-height: 48px;}
            & .txt-set{font-size: 18px; line-height: 28px; margin-top: 25px;}
            & .txt-set p:not(:last-child){margin-bottom: 28px;}
            & .more-text{font-size: 20px; margin-top: 40px;}
        }
    }
    @media (width <= 1023px) {
        & .tabs01 {
            grid-template-columns: repeat(5, 20%);
            &::before{display: none;}
            & .btn-tab::before{content: ""; position: absolute; top: 0; display: block; width: 100%; height: 2px; background-color: #000;}
            & .btn-tab::after{width: 18px; height: 18px;}
        }
        & .cont-area {
            & .text-container{padding-right: 0;}
            & .cont-tab{grid-template-columns: 1fr; gap: 40px; padding-top: 40px;}
            & .tit-tab{font-size: 30px; line-height: 43px;}
            & .txt-set{font-size: 17px; margin-top: 18px;}
            & .txt-set p:not(:last-child){margin-bottom: 28px;}
            & .add-list{margin-top: 30px;}
            & .more-text{font-size: 18px; margin-top: 30px;}
        }
    }
    @media (width <= 767px) {
        & .tabs01 {
            & .btn-tab{font-size: 12px; line-height: 18px; padding-top: 20px;}
        }
        & .cont-area {
            padding-right: 20px;
            & .cont-tab{padding-top: 30px;}
            & .tit-tab{font-size: 24px; line-height: 34px;}
            & .txt-set{font-size: 16px; line-height: 26px; margin-top: 12px;}
            & .txt-set p:not(:last-child){margin-bottom: 26px;}
            & .add-list{margin-top: 24px;}
            & .more-text{font-size: 17px; margin-top: 25px;}
        }
    }
}
.rmain-process {
    padding-top: 84px;
    padding-bottom: 88px;
    overflow: hidden;
    & .logo-set{align-items: center; margin-top: 170px;}
    & .logo01 img{width: 249px;}
    & .logo02 img{width: 281px;}
    & .logo-set .w-logo{display: none;}
    & .logo-set p{font-size: 16px; margin-top: 25px;}
    & .tab-process{margin-top: 72px;}
    @media (width <= 1200px) {
        & .logo-set{margin-top: 140px;}
        & .logo01 img{width: 224px;}
        & .logo02 img{width: 252px;}
        & .logo-set p{font-size: 14px;}
    }
    @media (width <= 1023px) {
        & .logo-set{grid-template-columns: repeat(2, 1fr); margin-top: 100px;}
        & .logo01 img{width: 196px;}
        & .logo02 img{width: 218px;}
        & .logo-set p{font-size: 13px; margin-top: 20px;}
    }
    @media (width <= 767px) {
        & .logo-set{margin-top: 80px;}
        & .logo-set .col-txt{width: 100%;}
        & .logo-set .col-txt:last-child{display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end;}
        & .logo01 img{width: 129px;}
        & .logo02 img{width: 145px;}
        & .logo-set p{font-size: 10px; margin-top: 15px;}
    }
}
.rmain-sec05{
    display: flex;
    align-items: center;
    @media (width >= 1421px) {
        & .tit-sec01{font-size: 70px; line-height: 100px;}
    }
    @media (width <= 767px) {
        justify-content: center;
        & .tit-sec01{font-size: 27px; line-height: 40px; text-align: center;}
    }
}
.rmain-sec06{
    padding-top: 84px;
    padding-bottom: 88px;
    & .circle{text-align: center; margin-top: 146px;}
    & .circle img{max-width: 860px;}
    @media (width <= 1280px) {
    }
    @media (width <= 1200px) {
        & .circle{margin-top: 100px;}
    }
    @media (width <= 1023px) {
        & .circle{margin-top: 80px;}
    }
    @media (width <= 767px) {
        & .circle{margin-top: 40px;}
    }
}
.rmain-sec07{
    padding-top: 84px;
    padding-bottom: 148px;
    & .cont-sec{display: grid; grid-template-columns: repeat(2, 50%); margin-top: 122px;}
    & .drawing{padding-right: 40px;}
    & .drawing img{max-width: 821px; width: 100%;}
    & .award-set{display: flex; align-items: center; gap: 70px;}
    & .award01{width: 98px;}
    & .award02{width: 95px;}
    & .award03{width: 95px;}
    & .award04{width: 82px;}
    & .award05{width: 81px;}
    & .list-award{font-size: 20px; color: #ccc; line-height: 42px; margin-top: 50px;}
    @media (width <= 1620px) {
        & .award-set{gap: 50px;}
        & .award01{width: 78px;}
        & .award02{width: 76px;}
        & .award03{width: 76px;}
        & .award04{width: 66px;}
        & .award05{width: 65px;}
    }
    @media (width <= 1420px) {
        & .award01{width: 66px;}
        & .award02{width: 65px;}
        & .award03{width: 65px;}
        & .award04{width: 56px;}
        & .award05{width: 55px;}
        & .list-award{font-size: 18px; line-height: 38px;}
    }
    @media (width <= 1280px) {
        & .cont-sec{margin-top: 100px;}
        & .award-set{gap: 40px;}
        & .list-award{font-size: 17px; line-height: 36px; margin-top: 40px;}
    }
    @media (width <= 1200px) {
        padding-top: 60px;
        padding-bottom: 100px;
        & .award-set{gap: 30px;}
        & .award01{width: 56px;}
        & .award02{width: 55px;}
        & .award03{width: 55px;}
        & .award04{width: 48px;}
        & .award05{width: 47px;}
        & .list-award{font-size: 16px; line-height: 34px; margin-top: 30px;}
    }
    @media (width <= 1023px) {
        padding-top: 40px;
        padding-bottom: 80px;
        &.common-height{height: auto;}
        & .cont-sec{grid-template-columns: 1fr; gap: 80px; justify-content: center; margin-top: 80px;}
        & .drawing{text-align: center; padding-right: 0;}
        & .drawing img{max-width: 600px;}
        & .award-set{justify-content: center;}
        & .list-award{text-align: center;}
    }
    @media (width <= 767px) {
        padding-top: 0;
        padding-bottom: 40px;
        & .cont-sec{margin-top: 40px;}
        & .award-set{gap: 24px;}
        & .award01{width: 41px;}
        & .award02{width: 40px;}
        & .award03{width: 40px;}
        & .award04{width: 34px;}
        & .award05{width: 34px;}
        & .list-award{font-size: 14px; line-height: 28px;}
        & .list-award > li:not(:last-child){margin-bottom: 10px;}
    }
}
.pin-spacer:has(.rmain-sec08){background-color: #000;}
.rmain-sec08{
    padding-top: 84px;
    padding-bottom: 88px;
    & .circle-set01{margin-top: 160px;}
    @media (width <= 1420px) {
        padding-bottom: 95px;
        &.common-height{height: auto;}
    }
    @media (width <= 1280px) {
    }
    @media (width <= 1200px) {
        & .circle-set01{margin-top: 120px;}
    }
    @media (width <= 1023px) {
        padding-bottom: 140px;
        & .circle-set01{margin-top: 70px;}
    }
    @media (width <= 767px) {
        padding-bottom: 20px;
        & .circle-set01{margin-top: 30px;}

    }
}
.rmain-sec09{
    padding-top: 100px;
    padding-bottom: 88px;
    & .cont-sec{display: flex; justify-content: center; gap: 220px;}
    & .tit-card{font-size: 32px; font-weight: bold; text-transform: uppercase; margin-bottom: 14px;}
    & .drawing img{max-width: 663px;}
    & .txt-set{font-size: 18px; line-height: 30px; margin-top: 35px;}
    @media (width <= 1700px) {
        & .cont-sec{gap: 80px;}
        & .card-container{flex: 1;}
    }
    @media (width <= 1420px) {
        & .tit-card{font-size: 30px;}
    }
    @media (width <= 1280px) {
        & .txt-set{font-size: 17px;}
    }
    @media (width <= 1200px) {
        padding-top: 0;
        & .cont-sec{gap: 40px;}
        & .tit-card{font-size: 30px;}
        & .txt-set{font-size: 17px; line-height: 28px; margin-top: 28px;}
    }
    @media (width <= 1023px) {
        &.common-height{height: auto;}
        & .cont-sec{flex-direction: column; gap: 40px;}
        & .drawing img{max-width: 100%;}
    }
    @media (width <= 767px) {
        padding-top: 0;
        & .tit-card{font-size: 24px;}
        & .txt-set{font-size: 16px; line-height: 26px;}
    }
}
.rmain-sec10{
    padding-top: 80px;
    padding-bottom: 140px;
    overflow: hidden;
    & .slider-container{margin-top: 38px;}
    & .swiper-container{overflow: visible;}
    & .thumb{display: block; width: 300px; aspect-ratio: 200 / 283;}
    @media (width <= 1420px) {
        & .thumb{width: 280px;}
    }
    @media (width <= 1280px) {
        & .thumb{width: 260px;}
    }
    @media (width <= 1200px) {
        & .thumb{width: 220px;}
    }
    @media (width <= 1023px) {
        & .thumb{width: 180px;}
    }
    @media (width <= 767px) {
        padding-bottom: 100px;
        & .thumb{width: 140px;}
    }
}
.rmain-sec11{
    padding-top: 80px;
    padding-bottom: 53px;
    & .swiper-slide{background-color: #000;}
    & .text-container{display: flex; flex-direction: column; justify-content: center; align-items: center; height: 360px; text-align: center;}
    & .comment{font-size: 36px; line-height: 50px; word-break: keep-all;}
    & .writer{font-size: 18px; margin-top: 40px;}
    @media (width <= 1200px) {
        & .comment{font-size: 32px; line-height: 43px;}
    }
    @media (width <= 1023px) {
        padding-top: 60px;
        padding-bottom: 20px;
        & .text-container{height: 300px;}
        & .comment{font-size: 30px; line-height: 40px;}
        & .writer{font-size: 17px; margin-top: 30px;}
    }
    @media (width <= 767px) {
        padding-top: 60px;
        padding-bottom: 20px;
        & .text-container{height: 300px;}
        & .comment{font-size: 24px; line-height: 34px;}
    }
}

.list-company {
    > ul{display: grid; grid-template-columns: repeat(3, 1fr); gap: 87px 65px;}
    & .thumb{aspect-ratio: 537 / 300; overflow: hidden;}
    & .thumb img{transition: .3s ease-in-out;}
    & .thumb:hover img{scale: 1.15;}
    & .info-com{display: flex; align-items: flex-end; gap: 14px; color: #fff; margin-top: 45px;}
    & .info-com .title{font-size: 32px; font-weight: bold;}
    & .info-com .txt-ko{position: relative; top: -3px; font-size: 18px; opacity: .7;}
    @media (width <= 1700px) {
        > ul{gap: 65px 40px;}
        & .info-com{margin-top: 36px;}
        & .info-com .title{font-size: 28px;}
        & .info-com .txt-ko{top: -2px; font-size: 17px;}
    }
    @media (width <= 1420px) {
        & .info-com{margin-top: 36px;}
        & .info-com .title{font-size: 26px;}
        & .info-com .txt-ko{top: -2px; font-size: 16px;}
    }
    @media (width <= 1200px) {
        > ul{gap: 55px 40px;}
        & .info-com{flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 25px;}
        & .info-com .title{font-size: 24px;}
        & .info-com .txt-ko{top: auto}
    }
    @media (width <= 1023px) {
        > ul {grid-template-columns: repeat(2, 1fr);}
    }
    @media (width <= 767px) {
        > ul {grid-template-columns: 1fr; gap: 65px;}
    }
}
.rmain-sec1101{
    padding-top: 83px;
    padding-bottom: 154px;
    & .list-company{margin-top: 128px;}
    @media (width <= 1660px) {
        & .tit-sec03 .txt02 .dspn{display: none}
    }
    @media (width <= 1420px) {
        padding-bottom: 100px;
        & .list-company{margin-top: 80px;}
        & .info-com{flex-direction: row;}
        & .info-com .title{font-size: 22px;}
        & .info-com .txt-ko{top: 5px; font-size: 15px;}
    }
}
.rmain-sec12{
    padding-top: 84px;
    padding-bottom: 148px;
    & .cont-sec{display: grid; grid-template-columns: repeat(2, 50%); align-items: center; gap: 40px; margin-top: 38px;}
    & .drawing img{max-width: 860px;}
    & .text-container p{font-size: 32px; text-transform: uppercase;}
    & .btn-request{margin-top: 19px;}
    & .btn-request > a{display: flex; justify-content: center; align-items: center; width: 260px; height: 62px; font-size: 24px; font-weight: bold; color: #fff; background-color: #000;}
    @media (width <= 1280px) {
        & .text-container p{font-size: 30px;}
        & .btn-request > a{font-size: 22px;}
    }
    @media (width <= 1200px) {
        & .cont-sec{margin-top: 25px;}
        & .text-container p{font-size: 26px;}
        & .btn-request > a{font-size: 20px;}
    }
    @media (width <= 1023px) {
        & .cont-sec{grid-template-columns: 1fr;}
        & .text-container{display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;}
    }
    @media (width <= 767px) {
        & .cont-sec{margin-top: 15px;}
        & .text-container{display: block;}
        & .text-container p{font-size: 24px;}
        & .btn-request{margin-top: 20px;}
        & .btn-request > a{width: 100%; height: 56px; font-size: 18px;}
    }
}

/* ==========================================================================
   Renewal 2025 - 재작업
   ========================================================================== */
.list-works {
    > ul{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 75px 40px;}
    & .card-item .thumb{position: relative; aspect-ratio: 172 / 100; overflow: hidden;}
    & .card-item .thumb img{transition: .3s ease-in-out;}
    & .card-item .thumb:hover img{scale: 1.1;}
    & .card-info{margin-top: 42px;}
    & .tit-set{display: flex; justify-content: space-between; align-items: center; gap: 40px;}
    & .tit-set .title{flex: 1; font-size: 36px; font-weight: 600;}
    & .tit-set .title{max-width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
    & .tag-set{display: flex; align-items: center; gap: 10px;}
    & .tag-set span{display: inline-flex; justify-content: center; align-items: center; font-size: 18px; color: #A8A8A8; min-width: 100px; height: 38px; padding: 0 13px; border: 1px solid #A8A8A8; border-radius: 10px; text-transform: capitalize;}
    & .desc{margin-top: 25px;}
    & .desc p{font-size: 22px; font-weight: 300; color: #A8A8A8; line-height: 36px; letter-spacing: -0.5px;}
    @media (width <= 1420px) {
        & .card-info{margin-top: 32px;}
        & .tit-set .title{font-size: 30px;}
        & .tag-set{gap: 8px;}
        & .tag-set span{font-size: 16px; min-width: 0; height: 36px; padding: 0 10px; border-radius: 8px;}
        & .desc p{font-size: 20px; line-height: 34px;}
    }
    @media (width <= 1200px) {
        & .card-info{margin-top: 32px;}
        & .tit-set .title{font-size: 28px;}
        & .tag-set{gap: 6px;}
        & .tag-set span{font-size: 15px; height: 36px; padding: 0 8px;}
    }
    @media (width <= 1023px) {
        > ul{gap: 60px 40px;}
        & .card-info{margin-top: 26px;}
        & .tit-set{flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 20px;}
        & .tit-set .title{font-size: 25px;}
        & .tag-set span{font-size: 13px; height: 28px; padding: 0 10px; border-radius: 6px;}
        & .desc{margin-top: 20px;}
        & .desc p{font-size: 17px; line-height: 30px;}
    }
    @media (width <= 767px) {
        > ul{grid-template-columns: minmax(0, 1fr); gap: 60px 40px;}
    }
}
/*Home*/
& .home-visual {
    padding-top: 62px;
    & .static-text {
        color: #fff;
        z-index: 50;
        & p{font-size: 150px; font-weight: bold; line-height: 160px; letter-spacing: 0; text-transform: uppercase; opacity: 0; animation: fadeUp 1s ease-out forwards .3s}
    }
    & .txt-ko{display: none; position: absolute; bottom: 60px; left: 80px; width: calc(100% - 160px); font-size: 26px; line-height: 38px; color: rgba(255,255,255,.6); word-break: keep-all; opacity: 0; animation: fadeUp 1s ease-out forwards 1.5s;}
    @media (width <= 1420px) {
        padding-top: 32px;
        & .static-text p {font-size: 136px; line-height: 144px;}
    }
    @media (width <= 1280px) {
        padding-top: 26px;
        & .static-text p{font-size: 120px; line-height: 124px;}
    }
    @media (width <= 1023px) {
        padding-top: 30px;
        padding-bottom: 26px;
        align-items: flex-start;
        & .static-text p{font-size: 86px; line-height: 90px;}
        & .txt-ko{display: block; right: 40px; font-size: 18px; line-height: 30px; width: calc(100% - 80px);}
    }
    @media (width <= 767px) {
        padding-top: 27px;
        & .static-text p{font-size: 12vw; line-height: 1.15;}
        & .txt-ko{left: 20px; bottom: 34px; font-size: 16px; line-height: 28px; width: calc(100% - 40px);}
    }
}
& .home-add-text{
    position: relative;
    padding-top: 80px;
    padding-bottom: 40px;
    & .txt-ko{font-size: 26px; line-height: 38px; color: rgba(255,255,255,.6); text-align: right;}
    @media (width <= 1420px) {
        & .txt-ko{font-size: 24px; line-height: 36px;}
    }
    @media (width <= 1280px) {
        & .txt-ko{font-size: 22px; line-height: 34px;}
    }
    @media (width <= 1023px) {
        display: none;
        & .txt-ko{font-size: 18px; line-height: 30px;}
    }
    @media (width <= 767px) {
        & .txt-ko{font-size: 16px; line-height: 28px;}
    }
}
.home-main-movie{
    position: relative;
    & .main-video{position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px 80px;}
    & .m-video{display: none;}
    @media (width <= 1280px) {
        & .main-video{padding: 40px;}
    }
    @media (width <= 1023px) {
        & .main-video{padding: 20px 0;}
    }
    @media (width <= 767px) {
        & .main-video{padding: 60px 0 0;}
    }
    @media (width <= 550px) {
        & .pc-video{display: none;}
        & .m-video{display: block;}
    }
}
.home-sec01{
    padding-top: 114px;
    padding-bottom: 140px;
    & .cate-wrap{margin-top: 270px;}
    & .list-cate span{font-size: 30px; color: rgba(255,255,255,.6); line-height: 48px;}
    & .list-cate span:not(:last-child)::after{content: " / ";}
    & .list-works{margin-top: 120px;}
    & .btn-more{text-align: center; margin-top: 140px;}
    & .btn-more a{font-size: 28px;}
    @media (width <= 1640px) {
        & .list-cate span{font-size: 28px; line-height: 45px;}
    }
    @media (width <= 1200px) {
        padding-top: 100px;
        padding-bottom: 100px;
        & .cate-wrap{margin-top: 180px;}
        & .list-cate span{font-size: 22px; line-height: 40px;}
        & .list-works{margin-top: 80px;}
        & .btn-more{margin-top: 100px;}
        & .btn-more a{font-size: 26px;}
    }
    @media (width <= 1023px) {
        padding-top: 80px;
        padding-bottom: 80px;
        & .cate-wrap{margin-top: 30px;}
        & .list-works{margin-top: 60px;}
        & .list-cate span{font-size: 20px; line-height: 38px;}
    }
    @media (width <= 767px) {
        padding-top: 100px;
        padding-bottom: 80px;
        & .cate-wrap{margin-top: 10px;}
        & .list-cate span{font-size: 17px; line-height: 34px;}
    }
}

.home-sec02 {
    padding-top: 150px;
    padding-bottom: 130px;
    & .contact-wrap{margin-top: 280px;}
    @media (width <= 1200px) {
        padding-top: 100px;
        padding-bottom: 100px;
    }
    @media (width <= 1023px) {
        padding-top: 80px;
        padding-bottom: 80px;
        & .contact-wrap{margin-top: 180px;}
    }
    @media (width <= 767px) {
        padding-top: 100px;
        padding-bottom: 80px;
        & .contact-wrap{margin-top: 10px;}
    }

}

/*About*/
.about-sec01{
    padding-top: 118px;
    padding-bottom: 102px;
    & .txt-set p:not(:last-child){margin-bottom: 42px;}
    @media (width <= 1740px) {
        & .tit-sec05 .txt02 .dspn {display: none;}
    }
    @media (width <= 1200px) {
        padding-top: 60px;
        padding-bottom: 80px;
    }
    @media (width <= 767px) {
        padding-bottom: 60px;
        & .txt-set p:not(:last-child){margin-bottom: 30px;}
    }
}
.about-visual {
    position: relative;
    & .vis-item{width: 100%; aspect-ratio: 178 / 100; overflow: hidden;}
}
.about-sec02{
    padding-top: 238px;
    padding-bottom: 100px;
    & .txt-wrapper:not(:last-child){margin-bottom: 40px;}
    & .txt-set .title{margin-bottom: 20px;}
    & .line-text{padding-left: 16px; text-indent: -16px;}
    & .line-text::before{content: "- ";}
    & ul > li:not(:last-child){margin-bottom: 15px;}

    @media (width <= 1280px) {
        padding-top: 140px;
        padding-bottom: 80px;
        & .line-text{padding-left: 15px; text-indent: -15px;}
    }
    @media (width <= 1200px) {
        & .line-text{padding-left: 13px; text-indent: -13px;}
    }
    @media (width <= 1023px) {
        padding-top: 100px;
        padding-bottom: 50px;
        & .text-vis{gap: 40px;}
        & .line-text{padding-left: 11px; text-indent: -11px;}
    }
    @media (width <= 767px) {
        padding-top: 80px;
    }
}
.about-sec03{
    padding-top: 128px;
    padding-bottom: 100px;
    & .list-works{margin-top: 108px;}
    & .list-works .card-item .thumb{aspect-ratio: 172 / 90;}
    @media (width <= 1280px) {
        padding-top: 100px;
        padding-bottom: 80px;
    }
    @media (width <= 1023px) {
        padding-top: 70px;
        padding-bottom: 60px;
        & .list-works {margin-top: 80px;}
    }
    @media (width <= 767px) {
        padding-top: 50px;
        & .list-works {margin-top: 60px;}
    }
}
.about-sec04 {
    padding-top: 143px;
    padding-bottom: 130px;
    & .award-set{display: flex; align-items: center; gap: 50px;}
    & .award01{width: 71px;}
    & .award02{width: 69px;}
    & .award03{width: 68px;}
    & .award04{width: 59px;}
    & .award05{width: 58px;}
    & .list-award{font-size: 20px; line-height: 42px; margin-top: 50px;}
    @media (width <= 1420px) {
        & .list-award{font-size: 18px; line-height: 38px;}
    }
    @media (width <= 1280px) {
        & .list-award{font-size: 17px; line-height: 36px; margin-top: 40px;}
    }
    @media (width <= 1200px) {
        padding-top: 120px;
        padding-bottom: 100px;
        & .award-set{gap: 30px;}
        & .award01{width: 64px;}
        & .award02{width: 63px;}
        & .award03{width: 62px;}
        & .award04{width: 54px;}
        & .award05{width: 53px;}
        & .list-award{font-size: 16px; line-height: 34px; margin-top: 30px;}
    }
    @media (width <= 1023px) {
        padding-top: 100px;
        padding-bottom: 80px;
        & .text-vis{gap: 80px;}
        & .award-set{justify-content: center;}
        & .list-award{text-align: center;}
    }
    @media (width <= 767px) {
        padding-top: 80px;
        & .award-set{gap: 22px;}
        & .award01{width: 49px;}
        & .award02{width: 49px;}
        & .award03{width: 49px;}
        & .award04{width: 42px;}
        & .award05{width: 42px;}
        & .list-award{font-size: 14px; line-height: 28px;}
        & .list-award > li:not(:last-child){margin-bottom: 10px;}
    }
}



/*Process*/
/*스크롤 텍스트 변화 섹션*/
.process-sec01 {
    margin-top: calc(var(--header-height) * -1 );
    padding-top: var(--header-height);
    & .tit-sec01{padding-top: 77px;}
    & .tit-sec01 p{opacity: 0;}
    & .tit-sec01 p{animation: fadeUp .8s ease-out forwards .3s;}
    & .main-obj{position: absolute; right: 0; bottom: 60px; max-width: 1200px; opacity: 0;}
    & .main-obj{animation: fadeUp .8s ease-out forwards .7s;}


    @media (width <= 1640px) {
        & .tit-sec01 {padding-top: 36px;}
        & .main-obj{bottom: 40px; max-width: 1080px;}
    }
    @media (width <= 1280px) {
        & .tit-sec01 {padding-top: 32px;}
        & .main-obj{max-width: 900px;}
    }
    @media (width <= 1023px) {
        & .common-height{padding-bottom: 40px;}
    }
    @media (width <= 767px) {
        & .tit-sec01 {padding-top: 24px; font-size: 36px; line-height: 50px;}
        & .common-height{padding-bottom: 30px;}
    }
}
.process-sec02 {
    padding-top: 180px;
    padding-bottom: 140px;
    overflow: hidden;
    & .logo-set{align-items: center; margin-top: 170px;}
    & .logo01 img{width: 249px;}
    & .logo02 img{width: 281px;}
    & .logo-set .w-logo{display: none;}
    & .logo-set p{font-size: 16px; margin-top: 25px;}
    & .tab-process{margin-top: 72px;}
    & .tit-sec03 .txt03{color: #000;}
        @media (width <= 1200px) {
        & .logo-set{margin-top: 140px;}
        & .logo01 img{width: 224px;}
        & .logo02 img{width: 252px;}
        & .logo-set p{font-size: 14px;}
    }
    @media (width <= 1023px) {
        padding-top: 100px;
        & .logo-set{grid-template-columns: repeat(2, 1fr); margin-top: 100px;}
        & .logo01 img{width: 196px;}
        & .logo02 img{width: 218px;}
        & .logo-set p{font-size: 13px; margin-top: 20px;}
    }
    @media (width <= 767px) {
        & .logo-set{margin-top: 80px;}
        & .logo-set .col-txt{width: 100%;}
        & .logo-set .col-txt:last-child{display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end;}
        & .logo01 img{width: 129px;}
        & .logo02 img{width: 145px;}
        & .logo-set p{font-size: 10px; margin-top: 15px;}
    }
}
.process-sec03 {
    padding-top: 135px;
    padding-bottom: 100px;
    & .circle{text-align: center; margin-top: 105px;}
    & .circle img{max-width: 1550px;}
    @media (width >= 1421px) {
        & .tit-sec01{font-size: 70px; line-height: 100px;}
    }
    @media (width <= 1200px) {
        & .circle{margin-top: 100px;}
    }
    @media (width <= 1023px) {
        & .circle{margin-top: 80px;}
    }
    @media (width <= 767px) {
        & .tit-sec01{font-size: 27px; line-height: 40px; text-align: center;}
        & .circle{margin-top: 40px;}
    }
}
.process-sec04 {
    padding-top: 140px;
    padding-bottom: 100px;
    & .card-wrap{margin-top: 100px;}
    & .cont-sec{display: flex; flex-direction: column; gap: 100px;}
    & .tit-card{font-size: 32px; font-weight: bold; text-transform: uppercase; margin-bottom: 36px;}
    & .drawing img{max-width: 100%;}
    & .txt-set{font-size: 26px; line-height: 48px; color: rgba(255,255,255,.6); word-break: break-all; margin-top: 35px;}
    @media (width <= 1700px) {
        & .cont-sec{gap: 80px;}
        & .card-container{flex: 1;}
    }
    @media (width <= 1420px) {
        & .tit-card{font-size: 30px;}
    }
    @media (width <= 1280px) {
        & .txt-set{font-size: 17px; line-height: 28px; margin-top: 28px;}
    }
    @media (width <= 1200px) {
        padding-top: 0;
        & .cont-sec{gap: 40px;}
        & .tit-card{font-size: 30px;}
    }
    @media (width <= 1023px) {
        &.common-height{height: auto;}
        & .cont-sec{flex-direction: column; gap: 40px;}
        & .drawing img{max-width: 100%;}
        & .tit-card{margin-bottom: 28px;}
    }
    @media (width <= 767px) {
        padding-bottom: 60px;
        & .tit-card{font-size: 24px; margin-bottom: 20px;}
        & .txt-set{font-size: 16px; line-height: 26px;}
    }
}
.process-sec05 {
    padding-top: 130px;
    padding-bottom: 130px;
    @media (width <= 1200px) {
        padding-top: 100px;
        padding-bottom: 100px;
    }
    @media (width <= 1023px) {
        padding-top: 80px;
        padding-bottom: 80px;
    }
    @media (width <= 767px) {
        padding-top: 60px;
        padding-bottom: 80px;
    }
}
.contact-wrap{
    & .txt-set p{font-size: 32px; line-height: 48px; word-break: break-all;}
    & .btn-contact{margin-top: 24px;}
    & .btn-contact a{font-size: 28px; text-transform: capitalize;}
    & .btn-contact a:hover{color: inherit;}
    @media (width <= 1420px) {
        & .txt-set p{font-size: 29px; line-height: 42px;}
        & .btn-contact a{font-size: 26px;}
    }
    @media (width <= 1200px) {
        & .txt-set p{font-size: 25px;}
        & .btn-contact a{font-size: 24px;}
    }
    @media (width <= 1023px) {
        & .btn-contact{margin-top: 18px;}
    }
    @media (width <= 767px) {
        & .txt-set p{font-size: 19px; line-height: 28px;}
        & .btn-contact{margin-top: 15px;}
        & .btn-contact a{font-size: 18px;}
    }
}
.renew-bottom {
    padding-top: 100px;
    padding-bottom: 120px;
    & .copyright{font-size: 20px; color: rgba(255,255,255,.5); text-align: center;}
    @media (width <= 1023px) {
        & .copyright{font-size: 18px;}
    }
    @media (width <= 767px) {
        padding-top: 80px;
        padding-bottom: 100px;
        & .copyright{font-size: 15px;}
    }
}

/* ==========================================================================
    MODAL
    ========================================================================== */
.hm-modal {
    --bs-modal-width: 500px;
    & .top-modal{padding: 27px 40px;}
    & .top-modal .tit-set .txt-en{font-family: 'Roboto', sans-serif; font-size: 11px; font-weight: bold; color: #bbb; letter-spacing: 0; text-transform: uppercase; margin-bottom: 6px;}
    & .top-modal .tit-set .title{font-size: 26px; font-weight: bold; color: #0e0e0e;}
    & .top-modal .btn-close img{width: 23px;}
    & .cont-modal{padding: 20px 40px; }
    & .cont-modal::-webkit-scrollbar{width: 14px;}
    & .cont-modal::-webkit-scrollbar-track{background: transparent;}
    & .cont-modal::-webkit-scrollbar-thumb{border: 4px solid transparent; background-color: #ccc; background-clip: padding-box;}
    & .term-box{font-size: 16px; font-weight: 400; color: #0e0e0e; line-height: 26px;}
    & .term-box .top{margin-bottom: 20px;}
    & .term-box .tit{color: #222;}
    & .term-box strong.tit{font-weight: 400}
    & .term-box .depth{margin: 20px 0;}
    &.privacy{--bs-modal-width: 820px;}
    &.privacy .cont-modal{padding: 32px 40px;}
    &.requested{--bs-modal-width: 360px; pointer-events: none;}
    &.requested .cont-modal{padding: 40px 20px; }
    &.requested .txt-set{text-align: center; padding-top: 127px; background:url('../images/common/obj_requested.svg') no-repeat center 0 / 119px auto;}
    &.requested .txt-set .title{font-size: 24px; font-weight: bold; color: #222;}
    &.requested .txt-set .txt-en{font-size: 11px; font-weight: 900; color: #D1D1D1; letter-spacing: 0; text-transform: uppercase; margin-top: 9px;}

    @media (width <= 767px) {
        & .top-modal{padding: 20px 20px;}
        & .top-modal .tit-set .title{font-size: 25px;}
        & .cont-modal{padding: 20px 20px;}
        &.privacy .cont-modal{padding: 28px 20px;}
    }
}