/* Pretendard */
@font-face {font-family: 'Pretendard'; font-weight: 100; font-style: normal; src: url('/font/Pretendard-Thin.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 200; font-style: normal; src: url('/font/Pretendard-ExtraLight.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 300; font-style: normal; src: url('/font/Pretendard-Light.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 400; font-style: normal; src: url('/font/Pretendard-Regular.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 500; font-style: normal; src: url('/font/Pretendard-Medium.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 600; font-style: normal; src: url('/font/Pretendard-SemiBold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 700; font-style: normal; src: url('/font/Pretendard-Bold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 800; font-style: normal; src: url('/font/Pretendard-ExtraBold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 900; font-style: normal; src: url('/font/Pretendard-Black.woff') format('woff');}


:root {
    --filer-white : brightness(0) invert(1);
    --font-pre : 'Pretendard';
}

/* 공통 */
p, dd{word-break:keep-all;}
.pc{display:block !important;}
.mob{display:none !important;}
.inner{max-width: 102.5rem; margin:0 auto; width: 100%; padding: 0 1.25rem;}
.ta-c {text-align: center;}
.ta-l{text-align: left;}
.flex {display: flex; align-items: center;}
.flex-jc {display: flex; align-items: center; justify-content: center;}
.flex-jb {display: flex; align-items: center; justify-content: space-between;}

/* HEADER */
.header{position: fixed; top:0; z-index:1500; width:100%; height: 5rem; background: #fff; transition: transform 0.6s cubic-bezier(.65,.06,.19,.96), background 0.3s ease;}
.header .inner{height:100%; display:flex; align-items:center; justify-content:space-between;}
.header h1 a img{width: 9.375rem; display: block;}
.header .gnb{display: flex; align-items: center; gap: 2.5rem;}
.header .gnb > li{position:relative; height: 100%; display: flex; align-items: center;}
.header .gnb > li > a{font-size: 0.9375rem; font-weight: 200; display: block;}
.header .gnb > li:hover > a, .header .gnb > li > a.on{text-decoration: underline; text-underline-offset: 0.44rem;}
.header.hide{transform: translateY(-100%);}
.all_menu_mob{display: none !important;}
 
/* visual */
.visual{position: fixed; width: 100%; height: 100vh; overflow: hidden; top: 0;}
.visual .swiper{position:relative; height: 100%; overflow: hidden;}
.visual .swiper-wrapper{height: 100%;}
.visual .swiper-slide{height: 100%;}
.visual .swiper-slide a{display: block; height: 100%;}
.visual .swiper-slide .img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1;}
.visual .swiper-slide .img img{width: 100%; height: 100%; object-fit: cover;}
.visual .swiper-slide .txt{position: absolute; left: 0; right: 0; bottom: 4.81rem; color: #fff; z-index: 10;}
.visual .swiper-slide .txt span{font-size: 1.125rem; line-height: 1.75rem; font-weight: 200;}
.visual .swiper-slide .txt .tit{margin: 0.31rem 0 0.62rem; font-size: 2.25rem; letter-spacing: -0.0375rem; font-weight: 200;}
.visual .swiper-slide .txt p{font-size: 1rem; font-weight: 200;}
.visual .arrow{position: absolute; bottom: 3.13rem; right: 3.75rem; z-index: 10; display: flex; align-items: center; gap: 0.9375rem;}
.visual .arrow div{width: 0.6875rem; cursor: pointer;}
.visual .arrow div img{width: 100%;}

/* common */
#main .content{margin-top: 100vh; position: relative; z-index: 1; background: #fff;}
#main .content .inner{display: flex; flex-direction: column; gap: 9.375rem;}
#main .tit_wrap{margin-bottom: 2.5rem; display: flex; align-items: flex-end; justify-content: space-between;}
#main .tit_wrap h2{font-size: 2.125rem; font-weight: 200;}
#main .tit_wrap a{width: 2.5rem; display: inline-block; aspect-ratio: 1 / 1;}
#main .tit_wrap a img{width: 100%; display: block;}
.no_data{padding: 11.13rem 0; width: 100% !important; border-top: 1px solid #BEBEBE; text-align: center;}
.no_data .icon{display: inline-block; width: 2.375rem;}
.no_data p{margin-top: 1.75rem; font-size: 1rem; font-weight: 200;}

/* gallery list */
.gal_list{display: flex; flex-wrap: wrap;}
.gal_list li{transition: transform 4s cubic-bezier(.18,1,.21,1), opacity 2.5s cubic-bezier(.18,1,.21,1) !important;}
.gal_list li a{display: block;}
.gal_list li .img{margin-bottom: 0.94rem; display: block; position: relative;}
.gal_list li .img.closed::before{content: 'CLOSED'; display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: absolute; left: 0; top: 0; font-size: 1.25rem; color: #fff; font-weight: 200;}
.gal_list li .img img{width: 100%; height: 100%; object-fit: cover;}
.gal_list li .txt span{display: block; font-weight: 200;}
.gal_list.col3{gap: 4.375rem;}
.gal_list.col3 li{width: calc((100% - (4.375rem * 2)) / 3);}
.gal_list.col3 li .img{aspect-ratio: 4/3;}
.gal_list.col3 li .txt{display: flex; flex-direction: column; gap: 0.3125rem;}
.gal_list.col3 li .txt .tit{font-size: 1.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gal_list.col3 li .txt .name{font-size: 1rem;}
.gal_list.col3 li .txt .date{font-size: 1rem;}
.gal_list.col4{gap: 3.75rem;}
.gal_list.col4 li{width: calc((100% - (3.75rem * 3)) / 4);}
.gal_list.col4 li .img{aspect-ratio: 74/51;}
.gal_list.col4 li .txt{display: flex; align-items: flex-end; flex-wrap: wrap; gap: 0.3125rem 0.625rem;}
.gal_list.col4 li .en_name{font-size: 1.375rem; letter-spacing: -0.0625rem; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;}
.gal_list.col4 li .kr_name{font-size: 1rem; letter-spacing: -0.0375rem;}

/* sec1 */
#main .sec1{padding-top: 7.5rem;}
#main .sec1 .gal_list li:nth-child(n+16){display: none;}

/* sec2 */
#main .sec2{padding-top: 9.375rem; border-top: 1px solid #BEBEBE; display: flex; align-items: center; justify-content: space-between;}
#main .sec2 .txt_swiper{width: 35%;}
#main .sec2 .txt_swiper .swiper-slide{font-weight: 200; display: flex; flex-direction: column; align-items: flex-start; gap: 1.5625rem;}
#main .sec2 .txt_swiper .tit{font-size: 2rem; letter-spacing: -0.0875rem;}
#main .sec2 .txt_swiper .desc p{font-size: 1.25rem; letter-spacing: -0.0625rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#main .sec2 .txt_swiper .desc .stat{font-size: 1.25rem; letter-spacing: -0.0625rem; margin-top: 0.9375rem; display: block;}
#main .sec2 .txt_swiper .date{font-size: 1.125rem; letter-spacing: -0.0375rem;}
#main .sec2 .txt_swiper .arrow{margin-top: 4.375rem; display: flex; align-items: center; gap: 0.9375rem;}
#main .sec2 .txt_swiper .arrow div{width: 0.6875rem; cursor: pointer; transition: all 0.3s;}
#main .sec2 .txt_swiper .arrow div:hover{filter: brightness(0);}
#main .sec2 .img_swiper{width: 55.625%;}
#main .sec2 .img_swiper .swiper-slide a{display: block; aspect-ratio: 445/333;}
#main .sec2 .img_swiper .swiper-slide a img{width: 100%; height: 100%; object-fit: cover;}

/* footer */
.footer{background: #fff; padding: 3.10313rem 0 2.08438rem; margin-top: 9.375rem; position: relative; z-index: 1; border-top: 1px solid #BEBEBE; text-align: center; position: relative;}
.footer .ft_logo {width: 8.09875rem; margin: 0 auto;}
.footer .ft_logo img{width: 100%;}
.footer .ft_info{display: flex; align-items: center; justify-content: center; gap: 0.9375rem; margin-top: 1.5625rem;}
.footer .ft_info span{display: inline-block; font-size: 1rem; letter-spacing: -0.02813rem; line-height: 1.25; font-weight: 200;}
.footer .copy{margin-top: 0.31rem; font-size: 1rem; line-height: 1.25; color: #8E8E8E; font-weight: 200;}
.footer .bot{margin-top: 1.25rem; display: flex; align-items: center; justify-content: center; gap: 1.25rem;}
.footer .use{display: flex; align-items: center; justify-content: flex-end; gap: 1.25rem;}
.footer .use a{font-size: 0.875rem; font-weight: 300; letter-spacing: -0.02813rem; line-height: 1.28;}
.footer .use a span{color: #8E8E8E; font-weight: 200;}
.footer .use .line{width: 1px; height: 0.9375rem; background: #E3E3E3; display: inline-block;}
.footer .sns{display: flex;}
.footer .sns a img{width: 1.5625rem;}

/* quick btn */
.quick{position: absolute; right: 1.56rem; top: -3.06rem; z-index: 1000;}
.quick a img{width: 1.25rem;}




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

	/* gallery list */
	.gal_list.col3{gap: 3.125rem 2.34375rem;}
	.gal_list.col4{gap: 1.875rem;}
	.gal_list.col3 li{width: calc((100% - (2.34375rem * 2)) / 3);}
	.gal_list.col4 li{width: calc((100% - (1.875rem * 3)) / 4);}

	/* sec2 */
	#main .sec2 .txt_swiper{width: 40%;}
	#main .sec2 .img_swiper{width: 50%;}

}


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

	html{font-size: 90%;}

	/* gallery list */
	.gal_list.col4{gap: 3.125rem 2.34375rem;}
	.gal_list.col4 li{width: calc((100% - (2.34375rem * 2)) / 3);}

	/* sec2 */
	#main .sec2 .txt_swiper{width: 40%;}
	#main .sec2 .txt_swiper .arrow{margin-top: 3.375rem;}
	#main .sec2 .img_swiper{width: 50%;}

}



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

	/* 공통 */
	html{font-size: 100%;}
	body {-webkit-text-size-adjust:none;}
	.pc{display: none !important;}
	.mob{display: block !important;}
	.inner{max-width: 100%;}

	/* HEADER */
	.header{height: 4.375rem; transition: all 0.3s;}
	.header h1 a img{width: 7.5rem; transition: all 0.3s;}
	.header .gnb{display: none;}
	.all_menu_btn{width: 1.75rem; filter: invert(1);}
	.all_menu_btn img{transition: all 0.3s;}

	/* all menu */
	.all_menu_mob{background: #000; position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 10000; text-align: center;}
	.all_menu_mob.on{display: block !important;}
	.all_menu_mob img{width: 100%;}
	.all_menu_mob .close{position: absolute; right: 1.6rem; top: 1.6rem; width: 1rem; cursor: pointer;}
	.all_menu_mob .cont{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
	.all_menu_mob .logo{width: 6.25rem; margin: 0 auto;}
	.all_menu_mob .list{margin-top: 3.27rem;}
	.all_menu_mob .list li + li{margin-top: 1.75rem;}
	.all_menu_mob .list li a{color: rgba(255, 255, 255, 0.50); font-size: 1.25rem; font-weight: 200;}
	.all_menu_mob .list li a:hover{color: #FFF;}
	 
	/* visual */
	.visual{height: 37.5rem;}
	.visual .swiper-slide .txt{bottom: 4.81rem;}
	.visual .swiper-slide .txt span{font-size: 1rem; line-height: 1.5rem;}
	.visual .swiper-slide .txt .tit{margin: 0.31rem 0 0.62rem; font-size: 2.25rem; letter-spacing: -0.0375rem;}
	.visual .swiper-slide .txt p{font-size: 1rem;}
	.visual .arrow{bottom: 1.25rem; right: 1.25rem; gap: 0.80356rem;}
	.visual .arrow div{width: 0.58931rem;}

	/* common */
	#main .content{margin-top: 37.5rem;}
	#main .content .inner{gap: 3.75rem;}
	#main .tit_wrap{margin-bottom: 1.875rem;}
	#main .tit_wrap h2{font-size: 1.5rem;}
	#main .tit_wrap a{width: 1.5rem;}
	.no_data{padding: 6.13rem 0;}
	.no_data .icon{width: 1.875rem;}
	.no_data p{margin-top: 1.25rem;}

	/* gallery list */
	.gal_list.col3{gap: 1.875rem;}
	.gal_list.col3 li{width: 100%;}
	.gal_list.col3 li .txt{gap: 0.3125rem;}
	.gal_list.col3 li .txt .tit{font-size: 1.25rem;}
	.gal_list.col3 li .txt .name{font-size: 1rem;}
	.gal_list.col3 li .txt .date{font-size: 0.875rem;}
	.gal_list.col4{gap: 1.5rem 0.875rem;}
	.gal_list.col4 li{width: calc(50% - (0.875rem / 2));}
	.gal_list.col4 li .txt{gap: 0.3125rem 0.5rem;}
	.gal_list.col4 li .en_name{font-size: 1rem; letter-spacing: initial;}
	.gal_list.col4 li .kr_name{font-size: 0.875rem; letter-spacing: initial;}

	/* sec1 */
	#main .sec1{padding-top: 3.75rem;}
	#main .sec1 .gal_list li:nth-child(n+7){display: none;}
	#main .sec3 .gal_list li:nth-child(n+11),
	#main .sec4 .gal_list li:nth-child(n+11){display: none;}

	/* sec2 */
	#main .sec2{padding-top: 3.75rem; flex-direction: column; gap: 1.875rem;}
	#main .sec2 .swiper{width: 100% !important;}
	#main .sec2 .txt_swiper .swiper-slide{gap: 0;}
	#main .sec2 .txt_swiper .tit{font-size: 1.5rem; letter-spacing: initial; margin-bottom: 1.5rem;}
	#main .sec2 .txt_swiper .desc p{font-size: 1rem; letter-spacing: initial;}
	#main .sec2 .txt_swiper .desc .stat{font-size: 1rem; letter-spacing: initial; margin-top: 0.9375rem;}
	#main .sec2 .txt_swiper .date{font-size: 0.875rem; letter-spacing: initial; margin-top: 0.75rem;}
	#main .sec2 .txt_swiper .arrow{margin-top: 1.25rem; gap: 0.80356rem;}
	#main .sec2 .txt_swiper .arrow div{width: 0.6875rem;}

	/* footer */
	.footer{padding: 3.10313rem 0 2.08438rem; margin-top: 4.75rem; border-color: #E3E3E3;}
	.footer .ft_logo{width: 6.99438rem;}
	.footer .ft_info{gap: 0.25rem 0.5rem; margin-top: 1.5625rem; flex-wrap: wrap;}
	.footer .ft_info span:nth-of-type(1){width: 100%;}
	.footer .ft_info span{font-size: 0.8125rem; letter-spacing: initial;}
	.footer .copy{margin-top: 0.3125rem; font-size: 0.8125rem;}
	.footer .use a{font-size: 0.8125rem; letter-spacing: -0.02813rem;}

	/* quick btn */
	.quick{right: 1.25rem; top: -2.75rem;}
	.quick a img{width: 1.25rem;}

	

}