/**********************************************************************************
	FONTS
**********************************************************************************/
/* @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=block'); */
@font-face {
    font-family: 'Pretendard';
    font-weight: 900;
    font-style: normal;
    src: url('../fonts/Pretendard-black.eot');
    src: url('../fonts/Pretendard-black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-Black.woff2') format('woff2'),
        url('../fonts/Pretendard-black.woff') format('woff'),
        url('../fonts/Pretendard-black.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-style: normal;
    src: url('../fonts/Pretendard-ExtraBold.eot');
    src: url('../fonts/Pretendard-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-ExtraBold.woff2') format('woff2'),
        url('../fonts/Pretendard-ExtraBold.woff') format('woff'),
        url('../fonts/Pretendard-ExtraBold.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-style: normal;
    src: url('../fonts/Pretendard-Bold.eot');
    src: url('../fonts/Pretendard-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-Bold.woff2') format('woff2'),
        url('../fonts/Pretendard-Bold.woff') format('woff'),
        url('../fonts/Pretendard-Bold.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-style: normal;
    src: url('../fonts/Pretendard-SemiBold.eot');
    src: url('../fonts/Pretendard-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-SemiBold.woff2') format('woff2'),
        url('../fonts/Pretendard-SemiBold.woff') format('woff'),
        url('../fonts/Pretendard-SemiBold.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-style: normal;
    src: url('../fonts/Pretendard-Medium.eot');
    src: url('../fonts/Pretendard-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-Medium.woff2') format('woff2'),
        url('../fonts/Pretendard-Medium.woff') format('woff'),
        url('../fonts/Pretendard-Medium.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-style: normal;
    src: url('../fonts/Pretendard-Regular.eot');
    src: url('../fonts/Pretendard-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Pretendard-Regular.woff2') format('woff2'),
        url('../fonts/Pretendard-Regular.woff') format('woff'),
        url('../fonts/Pretendard-Regular.ttf') format("truetype");
    font-display: swap;
    unicode-range: U+AC00-D7A3;
}

/* @font-face {
    font-family: 'PretendardJP';
    font-weight: 400;
    font-style: normal;
    src: url('../fonts/PretendardJP-Regular.eot');
    src: url('../fonts/PretendardJP-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PretendardJP-Regular.woff2') format('woff2'),
        url('../fonts/PretendardJP-Regular.woff') format('woff'),
        url('../fonts/PretendardJP-Regular.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'PretendardJP';
    font-weight: 500;
    font-style: normal;
    src: url('../fonts/PretendardJP-Medium.eot');
    src: url('../fonts/PretendardJP-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PretendardJP-Medium.woff2') format('woff2'),
        url('../fonts/PretendardJP-Medium.woff') format('woff'),
        url('../fonts/PretendardJP-Medium.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'PretendardJP';
    font-weight: 700;
    font-style: normal;
    src: url('../fonts/PretendardJP-Bold.eot');
    src: url('../fonts/PretendardJP-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PretendardJP-Bold.woff') format('woff'),
        url('../fonts/PretendardJP-Bold.ttf') format("truetype");
    font-display: swap;
} */
html, body {
	font-family: 'Pretendard', 'Outfit', AppleGothic, 'Dotum', sans-serif;
	color:#111;    
    overflow-x: hidden;
}
html.on, body.on { overflow: hidden; }
.kr { font-family: 'Pretendard', AppleGothic, 'Dotum', sans-serif!important; }
.en { font-family: 'Outfit', sans-serif!important; }
/*
	normalize / reset
*/
html { font-size: 112.5%; color: #191919; background-color: #fff; }
body { line-height: 1; position: relative; word-break: break-word; visibility: hidden; }
.wf-active body { visibility: visible; }
.wf-inactive body { visibility: visible; }

body * { box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; outline: 0; }
ol, ul, li { list-style: none; }
p, ul, li, ol, dl, dt, dd, figure { padding: 0; margin: 0; }
a { text-decoration: none; color: inherit; }
table { width: 100%; border-collapse: collapse; border-spacing: 0; }
img { vertical-align: middle; max-width: 100%; }
h1, h2, h3, h4, h5, h6 { font-family: inherit; color: inherit; margin: 0; word-break: keep-all; }
button, textarea, input, select { font-family: inherit; color: inherit; padding: 0; }
button { border: 0; }
/* only pc */
@media (min-width: 1181px) {
    :root { font-size: 62.5%; /* 10px */ }
}
@media (max-width: 767px) {
    html { font-size: 87.5%; }
}
/**********************************************************************************
	[media query examples]
	@media (max-width: 575px) { }
	@media (max-width: 767px) { }
	@media (max-width: 991px) { }
	@media (max-width: 1199px) { }

	--breakpoint-sm: 576px;
	--breakpoint-md: 768px;
	--breakpoint-lg: 992px;
	--breakpoint-xl: 1200px;
**********************************************************************************/
.clear:after { display: block; clear: both; content: ''; }
.container { width: 100%; max-width: 180rem; padding: 0 6rem; margin: 0 auto; position: relative; }
.hidden { overflow: hidden; }
@media (max-width: 1800px) {
	.container { width: 100%; padding: 0 calc(100vw * (60 / 1800)); }
}
@media (max-width: 1180px){
    .container { width: calc(100% - 100vw * (60 / 1180)*2); padding: 0; margin: 0 calc(100vw * (60 / 1180)); }       
}
@media (max-width: 767px){ 
    .container { width: calc(100% - 100vw * (40 / 767)*2); margin: 0 calc(100vw * (40 / 767)); }  
}

@media screen and (max-width: 600px) {
	#wpadminbar { position: fixed; }
}

/* Header */
header .header_btn_wrap { 
    position: relative; 
    z-index: 104; 
    width: 192px;
    height: 30px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
}
header .header_btn_wrap .language {  
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 15px;
    border: 1px solid #444;
    white-space: nowrap;
    cursor: pointer;
} 
header .header_btn_wrap .language.on li:nth-child(2) { display: block; }
header .header_btn_wrap .language:after { 
    content:"";
    background: url(../images/language_ic.svg)no-repeat center/contain;
    position: absolute;
    top: 10px;
    right: 14px;
    width: 10px;
    height: 10px;
    transform: rotate(180deg);
    z-index: -1;
} 
header .header_btn_wrap .language li:nth-child(2) { 
    display: none; 
    border-top: 1px solid #EAEAEA;
}
header .header_btn_wrap .language li .text {  
    display: block;
    color: #111;
    font-family: 'Outfit', sans-serif;
    font-size: 16px;
    padding: 6px 39px 6px 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1; 
    text-transform: uppercase;
} 
header .nav-icon {  
    position: relative; 
    display: block;
    width: 16px;
    cursor: pointer;    
}
header .nav-icon::before {
    content: "Menu";
    white-space: nowrap;
    width: fit-content;
    padding-right: 2rem;
    position: absolute;
    top: 50%;
    right: 0.8rem;
    transform: translateY(-50%);
    color: #111;
    font-family: 'Outfit', sans-serif;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.16px;
    text-transform: uppercase;
}
header .nav-icon span { display: block; width: 100%; height: 2px; background: #111; transition: 0.25s margin 0.25s, 0.25s transform; }
header .nav-icon span:nth-child(1) { margin-bottom: 3px; }
header .nav-icon span:nth-child(3) { margin-top: 3px; }
header .nav-icon.active span { transition: 0.25s margin, 0.25s transform 0.25s; }
header .nav-icon.active span:nth-child(1) { transform: rotate(45deg); }
header .nav-icon.active span:nth-child(2) { transform: rotate(45deg); display: none; }
header .nav-icon.active span:nth-child(3) { margin-top: -5px; transform: rotate(135deg); }
header .nav-icon.active::before { content: "close"; }
.headerArea { width: 100%; height: 98px; position: fixed; top: 0; left: 0; z-index: 99; display: flex; flex-wrap: nowrap; align-items: center; transition: all .2s; }
.headerArea .container { height: 100%; }
.headerArea .wrap { width: 100%; height: 100%; text-align: center; position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; }
.headerArea .logo { position: relative; z-index: 105; width: 23rem; height: 4.3rem; }
.headerArea .logo a { display: block; width: 100%; }
.headerArea .logo img { width: 100%; }

.headerArea.up { top: -100px; }
.headerArea.up.active { top:0 }

/* bg-white */
.headerArea.down { background-color: #fff; border-bottom: 1px solid #EDEDED; }

/* gnb */
.headerArea .wrap .nav { 
    position: relative;
    z-index: 104;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
}
.headerArea .gnb { 
    position: fixed;
    right: 0;
    top: -100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    padding: 16rem 16rem 4rem;
    background: #fff;
    color: #111;
    z-index: 101;
    transition: top .3s;
    text-align: left;
}
.headerArea.active .gnb { top: 0; }
.headerArea .gnb .nav_scroll { position: relative; max-width: 168rem; margin: 0 auto; width: 100%; height: 100%; }
.headerArea .gnb .nav_scroll ol {  
    opacity: 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    justify-content: space-between;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;    
    transition: opacity 1s;
}
.headerArea.active .gnb .nav_scroll ol { opacity: 1; }
.headerArea .gnb .nav_scroll ol li * { 
    font-size: 16px;
    font-style: normal;
    line-height: 1;
    font-family: 'Outfit', sans-serif; 
}
.headerArea .gnb .nav_scroll ol li.office {  }
.headerArea .gnb .nav_scroll ol li.office span {  
    display: block;
    margin-bottom: 10px;
    color: #999;
    text-transform: uppercase;
}
.headerArea .gnb .nav_scroll ol li.office p { font-weight: 400; }
.headerArea .gnb .nav_scroll ol li.copyright {  }
.headerArea .gnb .nav_scroll ol li.copyright p { text-transform: capitalize; }
.headerArea .gnb .nav_scroll ol li.copyright p span { text-transform: none; padding-right: 2px; }
.headerArea .gnb .navbar { margin-left: 370px; }
.headerArea .navbar>li>a {  
    color: #111;
    font-size: 5.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.headerArea .navbar li a { 
    overflow: hidden;
    height: 7.6rem;
    text-align: left;
    display: inline-block;
    cursor: pointer;
    transition: opacity .3s;
}
.headerArea .navbar li a.on { opacity: 1; }
.headerArea .navbar li a.off { opacity: .2; }
.headerArea .navbar li a { opacity: .2; padding-bottom: 2.8rem; }
.headerArea .navbar li:last-child a { padding-bottom: 0; }
.headerArea .navbar li a span { display: inline-block; }
.headerArea .navbar>li.current-menu-ancestor>a { opacity: 1; }
.headerArea .navbar>li { font-family: 'Outfit', sans-serif; }
.headerArea .navbar>li.over>a span { opacity: 1; }
.headerArea .navbar>li.current-page-ancestor>a span { opacity: 1; }
.headerArea .navbar>li:last-child { margin-bottom: 0; }
.gnb_dim {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    height: 100dvh;
    background: rgba(0, 0, 0, 0.6);
    z-index: 103;
}

.headerArea .navbar > li.current-page-parent > a ,
.headerArea .navbar > li.current-menu-item > a ,
.headerArea .navbar > li.current-page-ancestor > a {
    opacity: 1;
}
.headerArea .navbar > li.current-page-parent > a.off ,
.headerArea .navbar > li.current-menu-item > a.off ,
.headerArea .navbar > li.current-page-ancestor > a.off {
    opacity: .2;
}
@media (max-width: 1800px) {
    .headerArea .gnb { padding: 16rem calc(100vw * (60 / 1800)) 4rem; }
    .headerArea .gnb .navbar { margin-left: calc(100vw * (370 / 1800)); }
}
@media (min-width: 1181px) {
    .headerArea .navbar>li.over>a span { opacity: 1!important; }
    .headerArea .navbar li a span:hover{ opacity: 1!important; }
}
@media (max-width: 1180px) {
    .headerArea { height: calc(100vw * (98 / 1180)); }
    .headerArea .logo { width: calc(100vw * (230 / 1180)); height: calc(100vw * (43 / 1180)); z-index: 105; }         
    header .nav-icon { width: calc(100vw * (16 / 1180)); }
    header .nav-icon span { width: calc(100vw * (16 / 1180)); height: 2px; }
    header .nav-icon span:nth-child(1) { margin-bottom: calc(100vw * (3 / 1180)); }
    header .nav-icon span:nth-child(3) { margin-top: calc(100vw * (3 / 1180)); }
    header .nav-icon.active span:nth-child(1) { margin-bottom: -2px; }
    header .nav-icon.active span:nth-child(3) { margin-top: -2px; }
    header .nav-icon::before {
        padding-right: calc(100vw*(20 / 1180));
        right: calc(100vw * (8 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
    .headerArea.up { top: calc(100vw * (-100 / 1180)); }  

    /* gnb */
    header .header_btn_wrap { width: calc(100vw * (192 / 1180)); height: calc(100vw * (30 / 1180)); }
    .headerArea .wrap .nav {  width: calc(100% - calc(100vw * (422 / 1180))); }  
    .headerArea .navbar>li>a { font-size: calc(100vw * (64 / 1180)); }
    .headerArea .navbar li a { height: calc(100vw * (64 / 1180)); }
    .headerArea .navbar>li { margin-bottom: calc(100vw * (36 / 1180)); }
    .headerArea .gnb { 
        width: 100%;
        height: 100%;
        padding: 0;
    }
    .headerArea .gnb .nav_scroll {   
        margin: calc(100vw*(98 / 1180)) 0 calc(100vw*(40 / 1180));
        padding: calc(100vw*(62 / 1180)) calc(100vw*(60 / 1180)) 0 calc(100vw*(160 / 1180));
        overflow: hidden;   
    }
    .headerArea .gnb .navbar { margin-left: 0; height: calc(100% - calc(100vw*(100 / 1180))); overflow-y: scroll;}
    .headerArea .gnb .nav_scroll ol { padding: 0 calc(100vw*(60 / 1180)); }
    header .header_btn_wrap .language { border-radius: calc(100vw*(15 / 1180)); } 
    header .header_btn_wrap .language:after {       
        top: calc(100vw*(10 / 1180));
        right: calc(100vw*(14 / 1180));
        width: calc(100vw*(10 / 1180));
        height: calc(100vw*(10 / 1180));
    }
    header .header_btn_wrap .language li .text {         
        font-size: calc(100vw*(16 / 1180));
        padding: calc(100vw*(6 / 1180)) calc(100vw*(39 / 1180)) calc(100vw*(6 / 1180)) calc(100vw*(14 / 1180));        
    } 
}
@media (max-width: 767px){
    .headerArea { top: 0; height: calc(100vw * (140 / 767)); }
    .headerArea .logo { width: calc(100vw * (268 / 767)); height: calc(100vw * (50 / 767)); } 
    header .nav-icon { width: calc(100vw * (22 / 767));  margin-top: 0; }
    header .nav-icon.active { margin-top: 0; }
    header .nav-icon::before {
        padding-right: calc(100vw*(20 / 767));
        right: calc(100vw*(16 / 767));
        font-size: calc(100vw*(28 / 767));
    }
    header .nav-icon::after {
        width: calc(100vw*(52 / 767));
        height: calc(100vw*(52 / 767));
    }
    header .nav-icon span { width: calc(100vw * (22 / 767)); height: 1px; margin-left: auto; margin-right: auto; }
    header .nav-icon span:nth-child(1) { margin-bottom: calc(100vw * (4 / 767)); }
    header .nav-icon span:nth-child(3) { margin-top: calc(100vw * (4 / 767)); }
    header .nav-icon.active span:nth-child(1) { margin-bottom: 2px; }
    header .nav-icon.active span:nth-child(3) { margin-top: -3px; }    
    .headerArea.up { top: calc(100vw * (-150 / 767)); }  
    .gnb .bottom { padding-bottom: calc(100vw * (80 / 767)); }

    .headerArea .wrap .nav { 
        width: calc(100% - calc(100vw * (536 / 767)));
    }   
    .headerArea .navbar { margin-top: 0; }
    .headerArea .gnb .navbar { height: calc(100% - calc(100vw*(160 / 767))); }
    .headerArea .navbar>li.active>a span { opacity: 1!important; }
    .headerArea .navbar>li>a { font-size: calc(100vw * (64 / 767)); }
    .headerArea .navbar li a { height: calc(100vw * (64 / 767)); }
    .headerArea .navbar>li { margin-bottom: calc(100vw * (38 / 767)); }       
    .headerArea .gnb { 
        padding: calc(100vw * (140 / 767)) calc(100vw * (40 / 767)) calc(100vw * (50 / 767));
    }
    .headerArea .nav_scroll {  
        margin: 0 ;
        padding: calc(100vw*(110 / 767)) 0;
    }
    .headerArea .gnb .nav_scroll { margin: 0; padding: calc(100vw*(80 / 767)) 0 0; }
    .headerArea .gnb .nav_scroll ol { padding: 0; flex-wrap: wrap; gap: calc(100vw*(70 / 767)); }
    .headerArea .gnb .nav_scroll ol li * { font-size: calc(100vw*(24 / 767)); }
    .headerArea .gnb .nav_scroll ol li.office span { margin-bottom: calc(100vw*(18 / 767)); }
    header .header_btn_wrap { width: calc(100vw*(268 / 767)); height: calc(100vw*(48 / 767)); } 
    header .header_btn_wrap .language { 
        top: calc(100vw*(5 / 767));
        border-radius: calc(100vw*(24 / 767)); 
    } 
    header .header_btn_wrap .language:after {       
        top: calc(100vw*(12 / 767));
        right: calc(100vw*(22 / 767));
        width: calc(100vw*(16 / 767));
        height: calc(100vw*(16 / 767));
    }
    header .header_btn_wrap .language li .text {         
        font-size: calc(100vw*(26 / 767));
        padding: calc(100vw*(6 / 767)) calc(100vw*(62 / 767)) calc(100vw*(6 / 767)) calc(100vw*(22 / 767));        
    } 
}   

/* Pagination */
.pagination .nav-links { text-align: center; margin-top: 6rem; }
.pagination .screen-reader-text { display: none; }
.pagination .page-numbers {
    display:inline-block;
    width: 5rem;
    height: 5rem;
    font-size: 2rem;
    line-height: 5rem;
    vertical-align:top;
    text-align:center;
    margin: 0 0.4rem;
	color:#000;
    cursor: pointer;
    font-weight: 500;
 }

.pagination .page-numbers.prev, .pagination .page-numbers.next { background: url(../images/pagination.svg)no-repeat center; background-size: contain; }
.pagination .page-numbers.prev { margin-right: 3rem; transform: rotate(180deg); }
.pagination .page-numbers.next { margin-left: 3rem; }
.pagination .page-numbers.prev.disabled, .pagination .page-numbers.next.disabled { opacity: .2; cursor: auto; pointer-events: none; }
.pagination .page-numbers.current { color: #fff; background-color: #191919; }
@media (max-width: 1180px) {
    .pagination .nav-links { margin-top: calc(100vw * (60 / 1180)); }
    .pagination .page-numbers { width: calc(100vw * (50 / 1180)); height: calc(100vw * (50 / 1180)); font-size: calc(100vw * (16 / 1180)); line-height: calc(100vw * (50 / 1180)); margin: 0 calc(100vw * (4 / 1180)); }
    .pagination .page-numbers.prev { margin-right: calc(100vw * (30 / 1180)); }
    .pagination .page-numbers.next { margin-left: calc(100vw * (30 / 1180)); }
}
@media (max-width: 767px) {
    .pagination .nav-links { margin-top: calc(100vw * (60 / 767)); }
    .pagination .page-numbers { width: calc(100vw * (78 / 767)); height: calc(100vw * (78 / 767)); font-size: calc(100vw * (30 / 767)); line-height: calc(100vw * (78 / 767)); margin: 0 calc(100vw * (6 / 767)); }
    .pagination .page-numbers.prev { margin-right: calc(100vw * (45 / 767)); }
    .pagination .page-numbers.next { margin-left: calc(100vw * (45 / 767)); }
}

/* footer */
footer { background-color: #fff; }
.footer { margin: 11rem 0 8.8rem; }
.footer .marquee { overflow: hidden; padding-bottom: 17.2rem; }
.footer .marquee p {  
    color: #111;
    padding-right:13rem;
    font-family: 'Outfit', sans-serif;
    font-size: 22rem;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 220px */
    text-transform: uppercase;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 13rem;
}
.footer .marquee p span { display: block; }
.footer .flex { display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; }
.footer .flex span.s_title {  
    display: block;
    margin-bottom: 3rem;
    font-family: 'Outfit', sans-serif;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1; 
    text-transform: uppercase;
}
.footer .flex p {  
    font-size: 3.5rem;
    font-weight: 400;
    line-height: 1;
}
.footer .flex p a { text-decoration: none; }
.footer .address { margin-bottom: 6.1rem; }
.footer .address a { 
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
}
.footer .address a>span { display: inline-flex; gap: 12px; }
.footer .address a>span::after { width: calc(100% - 50px); }
.footer .address a .ic { 
    margin: 0; 
    display: inline-block; 
    background: url(../images/address_ic.svg) no-repeat center/ contain;
    width: 3.8rem;
    height: 3.8rem;
}
.footer .contact_us p { 
    margin-bottom: 1.4rem; 
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 1.4rem;
}
.footer .contact_us p:last-child { margin-bottom: 0; }
.footer .contact_us p * { display: block; }
.footer .contact_us b {  
    font-family: 'Outfit', sans-serif;
    font-size: 4rem;
    font-weight: 400;
    line-height: 1; 
}
.footer .contact_us a { font-family: 'Outfit', sans-serif; }
.footer .footer_menu li {  
    margin-bottom: 1.4rem;
    font-family: 'Outfit', sans-serif;
    font-size: 3.5rem;
    font-weight: 400;
    line-height: 1; 
}
.footer .footer_menu li:last-child { margin-bottom: 0; }
.footer .footer_menu_none { display: none; }
.footer .footer_menu li a { transition: opacity .3s; }
.footer .footer_menu li a.on { opacity: 1; }
.footer .footer_menu li a.off { opacity: .2; }

.footer_logo { padding-top: 12.1rem; }
.footer_logo a { display: inline-block; width: 3.8rem; height: 3.8rem; }
.footer_logo img { width: 100%;; height: 100%; object-fit: contain; }
.footer_logo p {  
    margin-top: 1.8rem;
    font-family: 'Outfit', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.4;
}
@media (max-width: 1180px){
    .footer { margin: calc(100vw * (110 / 1180)) 0 calc(100vw * (88 / 1180)); }
    .footer .marquee { padding-bottom: calc(100vw * (127 / 1180)); }
    .footer .marquee p { padding-right: calc(100vw * (80 / 1180)); font-size: calc(100vw * (135 / 1180)); gap: calc(100vw * (80 / 1180)); }
    .footer .flex span.s_title {  
        margin-bottom: calc(100vw * (30 / 1180));
        font-size: calc(100vw * (20 / 1180));
    }
    .footer .flex p { font-size: calc(100vw * (39 / 1180)); }
    .footer .address { margin-bottom: calc(100vw * (61 / 1180)); }
    .footer .address a { gap: calc(100vw * (12 / 1180)); }
    .footer .address a>span { gap: calc(100vw * (12 / 1180)); }
    .footer .address a .ic {       
        width: calc(100vw * (38 / 1180));
        height: calc(100vw * (38 / 1180));
    }
    .footer .contact_us p { 
        margin-bottom: calc(100vw * (14 / 1180)); 
        gap: calc(100vw * (14 / 1180));
    }
    .footer .contact_us b {  
        font-size: calc(100vw * (40 / 1180));
    }
    .footer .footer_menu li {  
        margin-bottom: calc(100vw * (14 / 1180));
        font-size: calc(100vw * (40 / 1180));
    }
    .footer_logo { padding-top: calc(100vw * (80 / 1180)); }
    .footer_logo a { width: calc(100vw * (38 / 1180)); height: calc(100vw * (38 / 1180)); }
    .footer_logo p {  
        margin-top: calc(100vw * (18 / 1180));
        font-size: calc(100vw * (16 / 1180));
    }

    /* 2024-05-29 수정 */
    .footer .address a>span {
        display: inline-block;
    }
    .footer .address a .ic {
        position: relative;
        top: calc(100vw * (7 / 1180));
        left: calc(100vw * (12 / 1180));
    }
}
@media (max-width: 767px){
    .footer { margin: calc(100vw * (110 / 767)) 0 calc(100vw * (85 / 767)); }

    .footer .marquee { padding-bottom: calc(100vw * (127 / 767)); }
    .footer .marquee p { padding-right: calc(100vw * (60 / 767));  font-size: calc(100vw * (135 / 767)); gap: calc(100vw * (60 / 767)); }
    .footer .flex span.s_title {  
        margin-bottom: calc(100vw * (30 / 767));
        font-size: calc(100vw * (24 / 767));
    }
    .footer .flex p { font-size: calc(100vw * (38 / 767)); }
    .footer .address { margin-bottom:calc(100vw * (62 / 767)); }
    .footer .address a { display: inline-block; line-height: 1.2; }
    .footer .address a>span { display: inline-block; }
    .footer .address a .ic {       
        width: calc(100vw*(38 / 767));
        height: calc(100vw*(38 / 767));
        position: relative;
        top: calc(100vw*(6 / 767));
        left: calc(100vw*(10 / 767));
    }
    .footer .contact_us p { 
        margin-bottom: calc(100vw * (14 / 767)); 
        gap: calc(100vw * (14 / 767));
    }
    .footer .contact_us b {  
        width: calc(100vw * (28 / 767));
        font-size: calc(100vw * (38 / 767));
    }
    .footer .flex p a { width:calc(100% - calc(100vw * (28 / 767))); }
    .footer .flex li:last-child { display: none; }
    .footer_logo { padding-top: calc(100vw * (150 / 767)); }
    .footer_logo a { width: calc(100vw * (60 / 767)); height: calc(100vw * (60 / 767)); }
    .footer_logo p {  
        margin-top: calc(100vw * (28 / 767));
        font-size: calc(100vw * (22 / 767));
    }

    /* 2024-05-29 수정 */
    .footer .contact_us p:nth-child(2) a span {
        display: inline-block;
    }
}

/* 서브공통 */
.sub { margin-top: 9.8rem; padding-top: 20.4rem; }
.mo { display: none; }
.tab { display: none; }
.sub section:last-child { padding-bottom: 11rem; }
.title_box { margin-bottom: 8.4rem; }
.visual .title_box { margin-bottom: 24rem; }
.title_box .line { display: block; width: 5.4rem; height: 4px; margin-bottom: 2.8rem; background: #111; }
.title_box .title {  
    margin-bottom: 16rem;
    font-size: 18rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1; 
    text-transform: capitalize;
    overflow: hidden;
}
.title_box .title span { display: inline-block; }
.title_box p {  
    max-width: 125rem;  
    font-size: 2rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1.6;  
}
.title_box p b {   
    display: block; 
    font-size: 4.4rem;
    margin-bottom: 3.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.4; 
    word-break: keep-all;
}
.title_box .s_title { 
    font-size: 6.4rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; 
    text-transform: capitalize; 
    overflow: hidden;
}
.title_box .s_title span { display: inline-block; }

.split_text .title_box .s_title { font-family: 'Outfit', sans-serif; }
.split_text .play { position: relative; padding: 15.4rem 0 20rem; }
.split_text .play::before { 
    content: "";
    width: 100vw;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
}
.split_text .play>.line {  
    display: block;
    width: 1px;
    height: 31px;
    margin: 0 auto 4.8rem;   
    background-color: #111; 
}
.split_text .play em {      
    display: block;
    text-align: center;
    margin-bottom: 6.2rem;
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.24px;
    text-transform: uppercase;
    font-style: normal;
}
.split_text .play .text {  
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    font-size: 3.8rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1.6;
}
/* .split_text .play .text .char { 
    font-kerning: none; 
    opacity: 0.3;
    transition: opacity 1s;
}
.split_text .play .text .char.visible { opacity: 1; } */
.split_text .play .text .word { 
    font-kerning: none; 
    opacity: 0.3;
    transition: opacity 1s;
}
.split_text .play .text .word.visible { opacity: 1; }
.wide_box { padding-bottom: 24rem; }
.wide_box .title_box>span { display: block; margin-top: 3rem; color: #9D9D9D; font-size: 1.8rem; font-weight: 400; line-height: 1; }
.wide_box ol { display: flex; flex-wrap: wrap; }
.wide_box ol li { 
    width: 50%; 
    background-color: #111; 
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.wide_box ol li:nth-child(1),
.wide_box ol li:nth-child(2) { border-bottom: 2px solid #fff; }

.wide_box ol li img { width: 100%; height: 100%; object-fit: cover; transition: all 1s; }
/* .wide_box ol li.scale img {
    -ms-transform: scale(1.15) rotate(0.002deg);
    -o-transform: scale(1.15) rotate(0.002deg);
    -moz-transform: scale(1.15) rotate(0.002deg);
    -webkit-transform: scale(1.15) rotate(0.002deg);
    transform: scale(1.15) rotate(0.002deg);
} */
/* .wide_box ol li.scale:hover img {
    -ms-transform: scale(1.15) rotate(0.002deg);
    -o-transform: scale(1.15) rotate(0.002deg);
    -moz-transform: scale(1.15) rotate(0.002deg);
    -webkit-transform: scale(1.15) rotate(0.002deg);
    transform: scale(1.15) rotate(0.002deg);
} */
.wide_box ol li .percent { 
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 2px;
}
.wide_box ol li .percent span {  
    display: block;
    color: #FFF;
    font-size: 14.4rem;
    font-weight: 600;
    line-height: 1;
    font-family: 'Outfit', sans-serif;
}
.wide_box ol li .percent_box p {  
    margin-top: 3rem;
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-weight: 300;
    line-height: 1.4; 
}
.wide_box ol li .percent_box p b { display: block; font-weight: 700; }

@media (max-width: 1180px){
    .sub { margin-top: calc(100vw * (98 / 1180)); padding-top: calc(100vw * (204 / 1180)); }
    .tab { display: block; }
    .sub section:last-child { padding-bottom: calc(100vw * (100 / 1180)); }
    .scroll {
        width: 100vw; 
        overflow-x: scroll;
        margin-left: calc(100vw * (-50 / 1180));
        margin-right: calc(100vw * (-50 / 1180));  
        -ms-overflow-style: none; /* IE and Edge */ 
        scrollbar-width: none; /* Firefox */ 
    } 
    .scroll::-webkit-scrollbar { 
        display: none; /* Chrome, Safari, Opera*/ 
    }
    .scroll>ul { white-space: nowrap; padding: 0 calc(100vw * (50 / 1180)); display: inline-flex; }

    .title_box { margin-bottom: calc(100vw * (84 / 1180)); }
    .visual .title_box { margin-bottom: calc(100vw * (240 / 1180)); }
    .title_box .line { width: calc(100vw * (54 / 1180)); height: 4px; margin-bottom: calc(100vw * (22 / 1180)); }
    .title_box .title {  
        margin-bottom: calc(100vw * (160 / 1180));
        font-size: calc(100vw * (140 / 1180));
    }
    .title_box p {  
        max-width: 100%;  
        font-size: calc(100vw * (20 / 1180));
    }
    .title_box p b {   
        margin-bottom: calc(100vw * (32 / 1180));
        font-size: calc(100vw * (44 / 1180)); 
    }
    .title_box .s_title { font-size: calc(100vw * (64 / 1180)); }

    .split_text .play { padding: calc(100vw * (154 / 1180)) 0; }
    .split_text .play>.line {  
        height: calc(100vw * (31 / 1180));
        margin: 0 auto calc(100vw * (46 / 1180));   
    }
    .split_text .play em {              
        margin-bottom: calc(100vw * (62 / 1180));
        font-size: calc(100vw * (24 / 1180));
    }
    .split_text .play .text {  
        max-width: 960px;
        font-size: calc(100vw * (38 / 1180));
    }

    .wide_box { padding-bottom: calc(100vw * (240 / 1180)); }
    .wide_box .title_box>span { margin-top: calc(100vw * (30 / 1180)); font-size: calc(100vw * (18 / 1180)); }
    .wide_box ol li .percent span { font-size: calc(100vw * (100 / 1180)); }
    .wide_box ol li .percent_box p {  
        margin-top: calc(100vw * (20 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }

    .scale_img { position: relative; box-sizing: content-box; padding-bottom:0; }
    .scale_img::after {
        display: none;
        content: "";
        background: url(../images/scale_ic.svg)no-repeat center;
        width: calc(100vw * (25 / 1180));
        height: calc(100vw * (25 / 1180));
        background-size: contain;
        position: absolute;
        bottom: 0;
        right: 0;
    }
}
@media (min-width: 768px){
    .wide_box ol li:nth-child(1),
    .wide_box ol li:nth-child(3) { border-right: 2px solid #fff; }
}
@media (max-width: 767px){
    .sub { margin-top: calc(100vw * (140 / 767)); padding-top: calc(100vw * (204 / 767)); }    
    .pc { display: none; }
    .mo { display: block; }
    .tab { display: none; } 
    .sub section:last-child { padding-bottom: calc(100vw * (40 / 767)); }
    .scroll { margin-left: calc(100vw * (-40 / 767)); margin-right: calc(100vw * (-40 / 767)); } 

    .title_box { margin-bottom: calc(100vw * (54 / 767)); }
    .visual .title_box { margin-bottom: calc(100vw * (200 / 767)); }
    .title_box .line { width: calc(100vw * (54 / 767)); height: 2.5px; margin-bottom: calc(100vw * (20 / 767)); }
    .title_box .title {  
        margin-bottom: calc(100vw * (160 / 767));
        font-size: calc(100vw * (95 / 767));
    }
    .title_box p {  
        max-width: 100%;  
        font-size: calc(100vw * (26 / 767));
    }
    .title_box p b {   
        margin-bottom: calc(100vw * (32 / 767));
        font-size: calc(100vw * (42 / 767)); 
    }
    .title_box .s_title { font-size: calc(100vw * (54 / 767)); }

    .split_text .play { padding: calc(100vw * (100 / 767)) 0; }
    .split_text .play>.line {  
        height: calc(100vw * (31 / 767));
        margin: 0 auto calc(100vw * (32 / 767));   
    }
    .split_text .play em {              
        margin-bottom: calc(100vw * (72 / 767));
        font-size: calc(100vw * (24 / 767));
    }
    .split_text .play .text {  
        max-width: 100%;
        font-size: calc(100vw * (27 / 767));
    }
    /* .split_text .play .text .line { margin-bottom: calc(100vw * (60 / 767)); }
    .split_text .play .text .line:last-child { margin-bottom: 0; } */
    .wide_box { padding-bottom: calc(100vw * (200 / 767)); }
    .wide_box .title_box>span { margin-top: calc(100vw * (24 / 767)); font-size: calc(100vw * (20 / 767)); }
    .wide_box ol { position: relative; padding-bottom: calc(100vw*(660 / 750)); }
    .wide_box ol li { width: 100%; height: calc(100vw * (660 / 750)); }    
    .wide_box ol #counter2 { position: absolute; bottom: 0; }
    .wide_box ol li .percent span { font-size: calc(100vw * (140 / 767)); }
    .wide_box ol li .percent_box p {  
        margin-top: calc(100vw * (20 / 767));
        font-size: calc(100vw * (24 / 767));
    }
    .scale_img { padding-bottom: 0; }
    .scale_img::after { display: none; width: calc(100vw * (33 / 767)); height: calc(100vw * (33 / 767)); }
}

/* 팝업 */
.pop_wrap { display: none; position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 100%; background: rgba(0,0,0,.75); }
.pop { display: none; position: relative; top: 50%; transform: translateY(-50%); width: 634px; margin: 0 auto; padding: 74px 77px; background: #fff; }
.pop .close { 
    position: absolute;
    filter: invert(1);
    top: 2rem;
    right: 2rem;
    width: 2.4em;
    height: 2.4rem;
    background: url(../images/ic_x.svg)no-repeat;
    background-size: contain;
    cursor: pointer;
    z-index: 1; 
}
.pop .pop_content { text-align: center; }
.pop .pop_content h2 { 
    margin-bottom: 1.6rem; 
    color: #191919;
    text-align: center;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.5;
 }
.pop .pop_content p {
    color: #565656;
    text-align: center;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.5; 
}
.pop .pop_btn { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 4.8rem; gap:1.8rem; }
.pop .pop_btn .btn { 
    width: auto;
    height: 5rem;
    padding: 1.6rem 4rem;
    display: flex; 
    align-items: center; 
    justify-content: center; 
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.5;
    border-radius: 2px;
 }
.pop .pop_btn .btn_color { background: #191919; color: #fff; border:none; }
.pop .pop_btn .btn_light { background: #fff; color: #191919; border: 1px solid #191919;  }
.open_pop { cursor: pointer; }

.pop-company img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 1180px){
    .pop { width: calc(100vw * (700 / 1180)); padding: calc(100vw * (85 / 1180)) calc(100vw * (105 / 1180)); }
    .pop .close { top: calc(100vw * (20 / 1180)); right: calc(100vw * (20 / 1180)); width: calc(100vw * (24 / 1180)); height: calc(100vw * (24 / 1180)); }
    .pop .pop_content h2 { margin-bottom: calc(100vw * (16 / 1180)); font-size: calc(100vw * (24 / 1180)); }    
    .pop .pop_content p { font-size: calc(100vw * (18 / 1180)); line-height: 1.6; }
    .pop .pop_btn { margin-top: calc(100vw * (48 / 1180)); gap: calc(100vw * (16 / 1180)); }
    .pop .pop_btn .btn { 
        height: calc(100vw * (50 / 1180));
        padding: 0 calc(100vw * (36 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
}
@media (max-width: 767px){
    .pop { width: calc(100vw * (650 / 767)); max-height: 90%; padding: calc(100vw * (100 / 767)) calc(100vw * (85 / 767)); }
    .pop .close { top: calc(100vw * (24 / 767)); right: calc(100vw * (24 / 767)); width: calc(100vw * (48 / 767)); height: calc(100vw * (48 / 767)); }
    .pop .pop_content h2 { margin-bottom: calc(100vw * (24 / 767)); font-size: calc(100vw * (44 / 767)); }    
    .pop .pop_content p { font-size: calc(100vw * (32 / 767)); }
    .pop .pop_btn { margin-top: calc(100vw * (52 / 767)); }
    .pop .pop_btn { margin-top: calc(100vw * (48 / 767)); gap: calc(100vw * (20 / 767)); }
    .pop .pop_btn .btn { 
        width: 100%;
        height: calc(100vw * (96 / 767));
        padding: 0;
        font-size: calc(100vw * (28 / 767));
    }
}

/* top 버튼 */
body.hidden .btn_top { display: none; }
.btn_top { 
    position: fixed; 
    bottom: 8.8rem; 
    right: calc(100vw*(111 / 1920));
    z-index: 99;
    pointer-events: none;
    width: 5.4rem;
    height: 5.4rem;
    opacity: 0;
    transition: all .2s;  
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    
 }
.btn_top.up { bottom: 8.8rem; pointer-events: all; opacity: 1; }
.btn_top.hidden { pointer-events: none; opacity: 0; }
.btn_top p { width: fit-content; height: 100%; cursor: pointer; }
.btn_top p img { width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 1800px) {  
    .btn_top {  left: auto; transform: translateX(0); right: calc(100vw * (60 / 1800)); }
}
@media (max-width: 1180px) {  
    .btn_top { 
        bottom: calc(100vw * (8 / 1180)); 
        right: calc(100vw * (60 / 1180)); 
        width: calc(100vw * (54 / 1180));
        height: calc(100vw * (54 / 1180));
    }
    .btn_top.up { bottom: calc(100vw * (88 / 1180)); }
}
@media (max-width: 767px) {  
    .btn_top { 
        bottom: calc(100vw * (85 / 767)); 
        right: calc(100vw * (40 / 767)); 
        width: calc(100vw * (94 / 767));
        height: calc(100vw * (94 / 767));
    }
    .btn_top.up { bottom: calc(100vw * (85 / 767)); }    
}

/* 404 */
.error_box { 
    height: 100vh;
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
}
.error_box .inner {     
    height: fit-content;
    width: fit-content;
}
.error_box .inner .line {  
    display: block;
    width: 5.4rem;
    height: 4px;
    background: #111;
    margin: 0 auto 2.8rem;
}
.error_box .inner strong {  
    display: block;
    font-family: 'Outfit', sans-serif;
    font-size: 5.6rem;
    font-weight: 600;
    line-height: 1; 
    text-align: center;
}
.error_box .inner p {  
    margin-top: 3.2rem;
    text-align: center;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
}
.error_box .inner .btn_wrap { margin-top: 6.4rem; }
.error_box .inner .btn_wrap div { 
    width:100%;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}
.error_box .inner .btn_wrap a {  
    display: flex;
    width: 20rem;
    height: 6rem;
    justify-content: center;
    align-items: center;   
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid #111; 
}
.error_box .inner .btn_wrap a.prev { color: #111; }
.error_box .inner .btn_wrap a.home { background-color: #111; color: #fff; }
@media (max-width: 1180px) {   
    .error_box .inner .line {  
        width: calc(100vw * (54 / 1180));
        height: 4px;
        margin: 0 auto calc(100vw * (28 / 1180));
    }
    .error_box .inner strong {  
        font-size: calc(100vw * (56 / 1180));
    }
    .error_box .inner p {  
        margin-top: calc(100vw * (32 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
    .error_box .inner .btn_wrap { margin-top: calc(100vw * (64 / 1180)); }
    .error_box .inner .btn_wrap div { gap: calc(100vw * (16 / 1180)); }
    .error_box .inner .btn_wrap a {  
        width: calc(100vw * (200 / 1180));
        height: calc(100vw * (60 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
}
@media (max-width: 767px) { 
    .error_box .inner .line {  
        width: calc(100vw * (54 / 767));
        height: 4px;
        margin: 0 auto calc(100vw * (28 / 767));
    }
    .error_box .inner strong {  
        font-size: calc(100vw * (60 / 767));
    }
    .error_box .inner p {  
        margin-top: calc(100vw * (32 / 767));
        font-size: calc(100vw * (28 / 767));
    }
    .error_box .inner .btn_wrap { margin-top: calc(100vw * (68 / 767)); }
    .error_box .inner .btn_wrap div { display: block; }
    .error_box .inner .btn_wrap a.prev { margin-bottom: calc(100vw * (16 / 767)); }
    .error_box .inner .btn_wrap a {  
        margin: 0 auto;
        width: calc(100vw * (300 / 767));
        height: calc(100vw * (74 / 767));
        font-size: calc(100vw * (26 / 767));
    } 
}

/* 게시물이 없는 경우 */
.no_posts {  
    display: none;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 600px;   
    border-top: 2px solid #111;
}
/* brain 240526 */
.no_posts.on { display: flex; }
.no_posts p { 
    position: relative; 
    padding-top: 94px; 
    text-align: center;
    font-size: 3.2rem;
    font-weight: 400;
    line-height: 1; 
}
.no_posts p::before {  
    content: "";
    background: url(../images/no_posts_ic.svg)no-repeat center/contain;
    width: 5.8rem;
    height: 5.8rem;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
@media (max-width: 1180px) { 
    .no_posts { height: calc(100vw * (600 / 1180)); }
    .no_posts p { padding-top: calc(100vw * (94 / 1180)); font-size: calc(100vw * (32 / 1180)); }
    .no_posts p::before { width: calc(100vw * (58 / 1180)); height: calc(100vw * (58 / 1180)); }
}
@media (max-width: 767px) { 
    .no_posts { height: calc(100vw * (600 / 1180)); }
    .no_posts p { padding-top: calc(100vw * (94 / 1180)); font-size: calc(100vw * (32 / 1180)); }
    .no_posts p::before { width: calc(100vw * (58 / 1180)); height: calc(100vw * (58 / 1180)); }
}

/* people, portfolio 공통 그리드 */
.grid_board .board.pc { display: block; }
.grid_board .board.mo { display: none; }
.grid_board .board ul { display: flex; flex-wrap: nowrap; gap: 4rem; margin-bottom: 4rem; }
.grid_board .board ul li.col-25 { 
    width: calc(100vw * (390 / 1920));    
    padding: 54px 42px;    
    transition: all .2s;
    position: relative;
    cursor: pointer;
}
.grid_board .board ul li.col-25::after {
    content:"";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #F8F8F8;
    z-index: -1;
    transition: all .5s; 
}
.grid_board .board ul li.col-50 { width: calc(100vw * (820 / 1920)); }
.grid_board .board ul li.col-50 img { width: 100%; height: 100%; object-fit: cover; transition: all 1s; }
.grid_board .board ul li.col-50 video { width: 100%; height: 100%; object-fit: cover; transition: all 1s; }
/* .grid_board .board ul li.col-50.active img, .grid_board .board ul li.col-50.active video {
    -ms-transform: scale(1.15) rotate(0.002deg);
    -o-transform: scale(1.15) rotate(0.002deg);
    -moz-transform: scale(1.15) rotate(0.002deg);
    -webkit-transform: scale(1.15) rotate(0.002deg);
    transform: scale(1.15) rotate(0.002deg);
} */
.grid_board .board ul li.col-50.active:hover img, .grid_board .board ul li.col-50.active:hover video {
    -ms-transform: scale(1.15) rotate(0.002deg);
    -o-transform: scale(1.15) rotate(0.002deg);
    -moz-transform: scale(1.15) rotate(0.002deg);
    -webkit-transform: scale(1.15) rotate(0.002deg);
    transform: scale(1.15) rotate(0.002deg);
}
.grid_board .board ul li.none {  
    width: calc(100vw * (390 / 1920));
    height: 100%;
    background: transparent;
}
.grid_board .board ul li .img { 
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.grid_board .board ul li .img img {
    width: 100%;
    height: 100%;
    background-size: cover;
}
.grid_board .board ul li .img video { width: 100%; height: 100%; object-fit: cover; }
.grid_board .board ul li span {  
    display: block;    
    color: #9D9D9D;
    font-size: 1.8rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1; 
    transition: all .2s;
}
.grid_board .board ul li strong {  
    display: block;
    margin-bottom: 2rem;
    font-size: 2.8rem;
    color: #111;    
    font-style: normal;
    font-weight: 600;
    line-height: 1; 
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all .2s; 
}
.grid_board .board ul li p {  
    margin-top: 8rem;
    color: #111;
    font-size: 2rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.6; 
    overflow: hidden;
    transition: all .2s;
    word-break: keep-all;
}
/* brain 251223 */
.grid_board .title_box {
    margin-bottom: 12rem;
}
.grid_board .category-wrap {
    margin-bottom: 24rem;
}
.grid_board .category-wrap .category-title {
    /* font-size: 4.4rem; */
    font-size: 6.4rem;
    margin-bottom: 3.2rem;
    font-style: normal;
    /* font-weight: 500; */
    font-weight: 400;
    line-height: 1.4;
    word-break: keep-all;
}
@media (min-width: 2000px) { 
    .grid_board .board ul li.col-25,.grid_board .board ul li.none { width: 390px; }
    .grid_board .board ul li.col-50 { width: 820px; }
}
@media (min-width: 1181px) { 
    .grid_board .board ul li.col-25:hover::after { background-color: #111; transform: translate(-50%, -50%) scale(0.92); }
    .grid_board .board ul li.col-25:hover strong { color:#fff }
    .grid_board .board ul li.col-25:hover span { color:#9D9D9D; }
    .grid_board .board ul li.col-25:hover p { color: #fff; }
}
@media (max-width: 1800px) { 
    .grid_board .board ul {          
        gap: calc(100vw * (40 / 1800));
        margin-bottom: calc(100vw * (40 / 1800));
    }
    .grid_board .board ul li.none { width: 25%; }
    .grid_board .board ul li.col-25 {  
        width: 25%;
        padding: calc(100vw * (54 / 1800)) calc(100vw * (42 / 1800));
    }
    .grid_board .board ul li.col-50 { width: calc(50% + calc(100vw*(40 / 1800))); }
    .grid_board .board ul li p { margin-top: calc(100vw * (80 / 1800)); height: calc(100vw * (230 / 1800)); }
    .grid_board .board ul li span {  
        font-size: calc(100vw * (18 / 1800));
    }
    .grid_board .board ul li strong {  
        margin-bottom: calc(100vw * (20 / 1800));
        font-size: calc(100vw * (28 / 1800)); 
    }
    .grid_board .board ul li p {  
        margin-top: calc(100vw * (80 / 1800));
        height: calc(100vw * (230 / 1800));
        font-size: calc(100vw * (20 / 1800));
    }
}
@media (max-width: 1180px) { 
    .grid_board .board.pc { display: none; }
    .grid_board .board.mo { display: block; }
    .grid_board .board ul { 
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: auto;
        gap: calc(100vw * (29 / 1180)); 
        margin-bottom: calc(100vw * (100 / 1180)); 
    }
    .grid_board .board ul li { padding: calc(100vw * (50 / 1180)) calc(100vw * (38 / 1180)); background: #F8F8F8; }
    .grid_board .board ul li span { font-size: calc(100vw * (18 / 1180)); }
    .grid_board .board ul li strong {  
        margin-bottom: calc(100vw * (20 / 1180));
        font-size: calc(100vw * (28 / 1180));
    }
    .grid_board .board ul li p {  
        margin-top: calc(100vw * (80 / 1180));
        height: calc(100vw * (250 / 1180));
        font-size: calc(100vw * (20 / 1180));
        overflow: hidden;
    }
    .grid_board .title_box {
        margin-bottom: calc(100vw * (80 / 1180));
    }
    .grid_board .category-wrap {
        margin-bottom: calc(100vw * (240 / 1180));
    }
    .grid_board .category-wrap .category-title {
        /* font-size: calc(100vw * (44 / 1180)); */
        font-size: calc(100vw * (64 / 1180));
        margin-bottom: calc(100vw * (32 / 1180));
    }
}
@media (max-width: 767px) {
    .grid_board .board ul { 
        grid-template-columns: repeat(1, 1fr);
        gap: calc(100vw * (24 / 767)); 
        margin-bottom: calc(100vw * (100 / 767)); 
    }
    .grid_board .board ul li { height: calc(100vw * (328 / 767)); min-height: calc(100vw * (328 / 767)); padding: calc(100vw * (54 / 767)) calc(100vw * (42 / 767)); }
    .grid_board .board ul li span { font-size: calc(100vw * (18 / 767)); }
    .grid_board .board ul li strong {  
        -webkit-line-clamp: 3;
        margin-bottom: calc(100vw * (20 / 767));
        font-size: calc(100vw * (32 / 767));
    }
    .grid_board .board ul li p {  
        margin-top: calc(100vw * (80 / 767));
        height: auto;
        font-size: calc(100vw * (24 / 767));
    }
}

/* btn hover */
.btn_hover>span { display: block; position: relative; }
.btn_hover>span:after {
    background: #000;
    animation: none;
    transform: scaleX(1);
    transform-origin: 0 0;
    bottom: -2px;
    content: "";
    height: 2px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    transition-duration: .5s;
    transition-property: transform;
    transition-timing-function: cubic-bezier(.215,.61,.355,1);
    will-change: transform;

}
@keyframes btnHover {
    0% {
        transform: scaleX(1);
        transform-origin: 100% 100%
    }

    49.9% {
        transform: scaleX(0);
        transform-origin: 100% 100%
    }

    50% {
        transform: scaleX(0);
        transform-origin: 0 0
    }

    to {
        transform: scaleX(1);
        transform-origin: 0 0
    }
}

.btn_hover2>span { display: block; position: relative; }
.btn_hover2>span:after {
    background: #000;
    animation: none;
    transform: scaleX(0);
    transform-origin: 0 0;
    bottom: -2px;
    content: "";
    height: 2px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    transition-duration: .5s;
    transition-property: transform;
    transition-timing-function: cubic-bezier(.215,.61,.355,1);
    will-change: transform;
}
@media (min-width: 1181px){
    .btn_hover:hover>span::after { 
        animation: btnHover .75s forwards; 
        transform: scaleX(1);
        transform-origin: 0 0;
    }
    .btn_hover2:hover>span::after { 
        transform: scaleX(1);
    }
}
@media (max-width: 767px){
    .btn_hover>span:after { bottom: -1px; height: 1px; }
}
/* 커서디자인 */
#cursor { display: none; }
@media (min-width: 1180px){
    #cursor {
        display: block;
        position: fixed;
        width: 20px;
        height: 20px;
        background: #fff;
        border-radius: 50%;
        mix-blend-mode: exclusion;
        pointer-events: none;
        z-index: 999999;
        transform: translate3d(calc(100vw* var(--cursor-x) - var(--size) / 2), calc(100vh* var(--cursor-y) - var(--size) / 2), 0);
        left: calc(var(--cursor-x) * 100vw);
        top: calc(var(--cursor-y) * 100vh);
        /* transition: transform 0.1s ease-out; 위치 변경에 애니메이션 효과 추가  */
        transition: transform 0.1s linear; 
    }
}
