@charset "utf-8";
@import url("//cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css");

html.hidden {overflow:hidden; /*회원가입페이지 헤더 깨짐 대응*/ position:relative; visibility:visible; /* END) 회원가입페이지 헤더 깨짐 대응*/ }
html:has(.modal-video) {overflow:hidden;}
/*회원가입페이지 헤더 깨짐 대응*/
body.menu_opened {font-size:1.4rem;}
/* END) 회원가입페이지 헤더 깨짐 대응*/ 


#wrap:has(header.fixed-top) {padding-top:var(--hd-height);}
body.pgv_page #wrap:has(header.fixed-top) {padding-top:0;} /* 뷰페이지서만 */


/* ------------------------------------------------------- HEADER ------------------------------------------------------- */
header {}

#hd {position:relative; z-index:1000; margin:0 auto;width:100%;border-bottom:0px solid rgba(255,255,255,0);background:transparent; height:auto; transition: all 0.5s ease-in-out;} 
#hd:before, #hd:after {clear:both;content:'';display:block;}
#hd .sticky-header-wrapper {position:relative; }
#hd.fixed-top {position:fixed !important;top:0;left:0;right:0;animation:header_fix .3s ease-in-out forwards; background: rgba(0, 0, 0, 0.60); backdrop-filter: blur(7.5px); -webkit-backdrop-filter: blur(7.5px); } /* Header Fixed */
#hd.fixed-top.menu {animation:none } 
/* #hd.fixed-top .header_top .header_top_center { margin: 0; } */

#hd .top_sponsor { background:#000; padding:1.4rem 0; }
#hd .top_sponsor > div { display:flex; justify-content: space-between; align-items: center; }
#hd .top_sponsor .t_l, #hd .top_sponsor .t_r { display:flex;  align-items: center; }
#hd .top_sponsor .t_l  { gap:1rem; }
#hd .top_sponsor div .sponsor_left:after { content:''; display:inline-block; width:1px; height:18px; background:rgba(255,255,255,0.20); margin:0 2.5rem; vertical-align: middle; }
#hd .top_sponsor div .sponsor_right { display: flex; align-items: center; gap: 2rem; }
#hd .top_sponsor div .sponsor_right img {opacity:0.9;}
#hd .top_sponsor div .sponsor_right img.sp1 {height:16px;}
#hd .top_sponsor div .sponsor_right img.sp2 {height:14px;}
#hd .top_sponsor div .sponsor_right img.sp3 {height:18px;}
#hd .top_sponsor div .sponsor_right img.sp4 {height:20px;}

#hd .header_top{ background: #fff; padding: 1.4rem 0; }
#hd .header_top > div { display: flex; align-items: center; justify-content: space-between; }
#hd .family_site .family_site_btn{ display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding: 0 1rem; color: #FFF; z-index: 99999; position: relative; line-height: 100%; }
#hd .family_site .family_site_btn span {display:inline-block; margin-left:0rem;}

#hd .header_top .header_top_left { flex:1; }
#hd .header_top .header_top_center { flex:4; z-index: 99999; }
#hd .header_top .header_top_right { flex:1;}

#hd .header_top .logo {width:auto;}

#hd .family_site { position:relative; }
#hd .header_top_left .family_mo { display:none; }
#hd .family_site .family_swiper { height:1.1em; line-height:1.1em; overflow:hidden;}
#hd .family_site .family_swiper a {display:block;color:var(--biff-red); font-weight:600}

#hd .family_site:hover .family_site_list { opacity: 1; visibility: visible;}
#hd .family_site .family_site_list { position:absolute; top:0; left:0; width: 100%; padding: 3rem 0 1rem; background: #000; z-index: 200; opacity: 0; visibility: hidden; transition: opacity 0.4s ease, visibility 0.4s ease; }
#hd .family_site .family_site_list li { list-style: none; }
#hd .family_site .family_site_list li a { display:block; padding:1.2rem 2rem; color: #FFF;}
#hd .family_site .family_site_list li:hover { background:#000; }
#hd .family_site .family_site_list li:hover a { color: var(--biff-red);}

#hd .main_nav { position: relative; z-index: 100; }
#hd .main_nav .main_nav_center {}
#hd .main_nav .main_nav_center .gnb > nav > ul { display: flex; justify-content: space-between; max-width:65rem; margin:0 auto; padding:0 3rem;}
#hd .main_nav .main_nav_center .gnb > nav > ul > li {position:relative;}
#hd .main_nav .main_nav_center .gnb > nav > ul > li > a {font-size:1.8rem; padding-bottom:1em; letter-spacing: -0.054rem; font-weight: 700; color:#000;}
#hd .main_nav .main_nav_center .gnb > nav > ul > li.on > a { color:var(--biff-red);}
/* #hd .main_nav .main_nav_center .gnb > nav > ul > li.on > a::before { content:''; display: inline-block; width:6px; height:6px; background:var(--biff-red); border-radius:3rem; margin-right: 0.5rem; vertical-align: top; } */

#hd .header_top_right .util_list { display:flex; gap:2.5rem; align-items: center;  justify-content:flex-end;}
#hd .header_top_right .util_list .lang { z-index: 99999; transition: all 0.4s ease-in-out; }
#hd .header_top_right .util_list .login,
#hd .header_top_right .util_list .ticket,
#hd .header_top_right .util_list .search { z-index: 99999; }
#hd .header_top_right .util_list .lang a { color: #000; display: flex; align-items: center; gap: 0.5rem; font-size: 1.6rem; font-weight: 700; line-height: normal; }
#hd .header_top_right .util_list .lang:hover a { color: var(--biff-red); }
#hd .header_top_right .util_list .login a svg,
#hd .header_top_right .util_list .search a svg,
#hd .header_top_right .util_list .ticket a svg,
#hd .header_top_right .util_list .menu a svg { color: #000;  transition: color 0.3s ease; }
#hd .header_top_right .util_list .login a:hover svg,
#hd .header_top_right .util_list .ticket a:hover svg,
#hd .header_top_right .util_list .search a:hover svg,
#hd .header_top_right .util_list .menu a:hover svg { color: var(--biff-red); }
#hd .header_top_right .util_list .login > a > span {display:none;}

/* 사이트맵 열렸을때 */
#hd.menu .sticky-header-wrapper {z-index:10000; background:#000;}
#hd.menu .family_site .family_site_list {background:#000;}
#hd.menu .family_site .family_site_list li:hover {background:#222;}

/* 사이트맵 열렸을때 and 헤더픽스됐을때 */
#hd.menu.fixed-top {backdrop-filter:none; -webkit-backdrop-filter:none; transition:none;}
#hd.menu.fixed-top .sticky-header-wrapper .container-xxl:last-child {display:flex;}

/* 서브에서 헤더 */
#hd.sub {position:static; background:#000; transition:0.3s}
#hd.sub .full-width-line {border-top:1px solid rgba(255, 255, 255, 0.15);}
#hd.sub.fixed-top {background:rgba(0, 0, 0, 0.80)}
.fancybox-active #hd.sub {position:relative;}

/* 서브에서 헤더 간격 */
#hd.sub.fixed-top .header_top { border-bottom:1px solid rgba(0,0,0,0.1);}
#hd.sub .top_sponsor {position:relative; z-index:1;}
#hd.sub.fixed-top .top_sponsor > div > div {transform: scale(0.9) translateX(30px);}


@media (min-width: 1600px) {
  .container-sm, .container-md{max-width: 1192px; padding-right:1.5rem;padding-left:1.5rem;}
  .container, .container-lg {max-width: 1280px;padding-right:1.5rem;padding-left:1.5rem;}
  .container-xl {max-width: 1440px;padding-right:1.5rem;padding-left:1.5rem;}
  .container-xxl {max-width: 1780px;padding-right:1.5rem;padding-left:1.5rem;}
}

/* 모바일 메뉴 버튼 */
.btn_sm { position:relative;width:18px;height:16px;top:0px;right:0;bottom:0;margin:auto auto;display:inline-block;z-index:99999; }
.btn_sm:focus,
.btn_sm:visited {color:#111}
.btn_sm .inner {position:relative; display:inline-block; width:18px; height:16px; vertical-align:middle;}
.btn_sm .line {position:absolute;left:0;width:18px;height:2px; background-color:#000; transition:0.3s all ease-out;-webkit-transition:0.3s all ease-out;font-size:0;line-height:0; }
.btn_sm .tline{top:0;}
.btn_sm .mline{top: 50%; margin-top: -1px; }
.btn_sm .bline{bottom:0;}

.menu a:hover .line { background-color:var(--biff-red); }
.menu .active .line { background-color:var(--biff-red); }

/* Menu - close button */
.modal_open .btn_sm .tline,
.modal_open .btn_sm:focus .tline { top:7px; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.modal_open .btn_sm .mline { display:none; }
.modal_open .btn_sm .bline,
.modal_open .btn_sm:focus .bline { bottom:7px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

/* .modal_open .btn_sm .tline{top:18px; left:18px;}
.modal_open .btn_sm .mline{top:5px;left:5px; display: none;}
.modal_open .btn_sm .bline {top:0px; left:18px;} */

/* All Menu */
#menu { opacity: 0; visibility: hidden; /* 초기 상태에서 메뉴는 보이지 않음 */ z-index: -1; position: fixed; top: var(--hd-height); left: 0; bottom: 0; right: 0; margin: auto; transition: opacity 0.4s ease, visibility 0s linear 0.4s, z-index 0s linear 0.4s;  overflow-y: scroll; width: 100%; /* height: 100% */; background-color: #000;}
.menu #menu { opacity: 1; visibility: visible; /* 메뉴가 보이도록 설정 */ z-index: 9999; transition: opacity 0.4s ease, visibility 0s, z-index 0s; color: #fff;}

#menu::-webkit-scrollbar { width: 5px;}
#menu::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.2); border-radius: 10px; }
#menu::-webkit-scrollbar-thumb { background: #FFF; border-radius: 10px; }
#menu::-webkit-scrollbar-thumb:hover { background: var(--biff-red); }

#menu .allmenu .menu_top,
#menu .allmenu .m_family,
#menu .mo_sponsor { display:none; } /* 모바일에서만 보이게 */
#menu .allmenu { position: relative; max-width:calc(1600px + 10rem); padding: 8rem 2rem; margin:0 auto;}

#menu .menu_all > .depth1 { display:flex; flex-wrap: wrap; gap: 10rem 0;}
#menu .menu_all > .depth1 > li { flex:0 1 calc(25% - 10rem); box-sizing: border-box; margin:0 5rem; }
#menu .menu_all > .depth1 > li:nth-child(9) { flex: 1 1 calc(25% - 10rem); /* 동일한 너비 유지 */ }
#menu .menu_all > .depth1 > li > a { font-size:3.6rem; line-height: normal; letter-spacing: -0.015em; color:#fff; border-bottom:1px solid rgba(255, 255, 255, 0.20); padding-bottom:3rem; display: block; cursor:default;}
#menu .menu_all > .depth1 > li > a > span { font-weight: 700; }
#menu .menu_all > .depth1 > li > ul.depth2 { height: 24.7rem; overflow-y:scroll; margin-top: 3rem; }

#menu .menu_all > .depth1 > li > ul.depth2::-webkit-scrollbar { width: 3px; margin-top:5px; }
#menu .menu_all > .depth1 > li > ul.depth2::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.2); border-radius: 10px; }
#menu .menu_all > .depth1 > li > ul.depth2::-webkit-scrollbar-thumb { background: #FFF; border-radius: 10px; }
#menu .menu_all > .depth1 > li > ul.depth2::-webkit-scrollbar-thumb:hover { background: var(--biff-red); }

#menu .menu_all > .depth1 > li > ul.depth2 li a { font-size:1.8rem; color:#A3A3A3; line-height:100%; padding:1rem 0; display:block; }
#menu .menu_all > .depth1 > li > ul.depth2 li a span { font-weight:500; position:relative;}
#menu .menu_all > .depth1 > li > ul.depth2 li a:hover { color:#fff; }
#menu .menu_all > .depth1 > li > ul.depth2 li a:hover span { font-weight:700; }
/* #menu .menu_all > .depth1 > li > ul.depth2 li a:hover span:after { content:url('/kor/img/main/icon_gnb_arr.svg'); position: absolute; right: -30px; top: 50%; margin-top:-10px; } */

body.modal_open .quick_top, body.modal_open .btn_floating {display:none;}

/* #hd.vwpage.menu {opacity:1;} */

.top_sponsor .container-xxl {position:relative;}
.top_sponsor .f_link { }
.top_sponsor .f_link a {color:rgba(255, 255, 255, 0.7); letter-spacing:0.3px; transition:0.3s}
.top_sponsor .f_link a i {margin-left:5px;}
.top_sponsor .f_link a:hover {color:#fff;}

.top_sponsor .f_link a {display:inline-flex; align-items: center; position:relative;}
.top_sponsor .f_link a:before {content:''; display:block; width:1px; height:10px; background:rgba(255, 255, 255, 0.2); margin-right:9px; margin-left:5px;}

#hd.fixed-top .f_link a:not(.ticket){display:none;}

@media only screen and (max-width: 1600px) {
	#menu .allmenu {padding:6rem 0;}
	#menu .menu_all > .depth1 > li {flex: 0 1 calc(25% - 8rem); margin:0 4rem;}
	/* #hd.fixed-top .main_nav .main_nav_center .gnb > nav > ul {gap:2.8rem;} */
}

/* 픽스했을 때 헤더 */
@media only screen and (min-width: 1025px) and (max-width: 1360px) {
/* 	#hd.fixed-top .main_nav .main_nav_center .gnb > nav > ul {gap:2.5rem;}
	#hd.fixed-top h1 > a {display:block; width:104px; overflow:hidden;} */
	#hd .header_top .header_top_center .logo {width:auto;}
	#hd .header_top .header_top_center .logo img {width:27rem; max-width:none;}
/* 	#hd.fixed-top .main_nav .main_nav_center .gnb > nav > ul {justify-content: flex-start;}
	#hd.fixed-top .main_nav .main_nav_center .gnb > nav {}
	#hd.fixed-top .header_top_right .util_list {gap:2rem;} */
	#menu .menu_all > .depth1 > li > a {font-size:2.6rem;}
}
@media only screen and (max-width: 1360px) {
	#hd .header_top .header_top_left { flex:1; }
	#hd .header_top .header_top_center { flex:5; z-index: 99999; }
	#hd .main_nav .main_nav_center .gnb > nav > ul > li > a {font-size:1.5rem;}
	#hd .header_top .header_top_right { flex:1;}
}
/* 노트북 (max-width: 1200px) */
@media only screen and (max-width: 1200px) {
    /* 노트북용 스타일 */	
	#menu .menu_all > .depth1 > li {flex: 0 1 calc(25% - 4rem); margin:0 2rem;}
	#menu .menu_all > .depth1 > li > ul.depth2 li a {font-size:1.6rem; line-height:1.2;}
}
/* 태블릿 (max-width: 1024px) */
@media only screen and (max-width: 1024px) {
    /* 태블릿용 스타일 */
	#hd .top_sponsor { display:none; }
	#hd .header_top > div { justify-content: flex-start; }
	#hd .header_top { margin:0; }
	#hd .header_top .logo img { width:90%; }

	#hd .main_nav {display:none;}
	
	/* #menu{top:70px !important;} */
	#menu .allmenu {padding: 0 2rem 3rem 2rem; margin-top:7.5rem;}
	#menu .menu_all > .depth1 {display:block;}
	#menu .menu_all > .depth1 > li {display:block; width:100%; margin:0; border-bottom:1px solid rgba(255, 255, 255, 0.10);}
	#menu .menu_all > .depth1 > li > a {padding:2rem 0 ; font-size:2rem; border-bottom:none;}
	#menu .menu_all > .depth1 > li > ul.depth2 {display:none;}
	#menu .menu_all > .depth1 > li.on > a {color:var(--biff-red);}
	#menu .menu_all > .depth1 > li.on > ul.depth2 {display:flex; gap:0 1rem; padding-top:1.5rem; margin-top:0; margin-bottom:2rem;  overflow:hidden; height:auto; flex-wrap:wrap; border-top:1px dotted rgba(255, 525, 255, 0.1);}
	#menu .menu_all > .depth1 > li.on > ul.depth2 > li {width:calc(50% - 0.5rem);}
	#menu .menu_all > .depth1 > li > ul.depth2 li a span {font-weight:400; word-break:keep-all;}
	
	#hd .header_top .logo {width:auto;}
	#hd .header_top .logo img {width:22rem; max-width:none;}
	#hd .header_top_right {padding-right:4rem}
	#hd .header_top_right .util_list {gap:1.5rem;}
	#hd .header_top_right .util_list li:not(.menu) {display:none;}
	#hd .header_top_right .util_list li.menu {position:absolute; top:2.5rem; right:2.5rem;}
	#hd .header_top_right .util_list .lang {box-shadow:none; border:none; position:relative;}
	#hd .header_top_right .util_list .lang a {font-weight:400; padding:1rem 1.5rem;}
	#hd .header_top_right .util_list .login {position:relative;}
	#hd .header_top_right .util_list .login svg {opacity:0;}
	#hd .header_top_right .util_list .login a {display:block; padding:1rem 1.5rem 1rem 0;}
	#hd .header_top_right .util_list .lang:after,
	#hd .header_top_right .util_list .login:after {content:''; position:absolute; top:50%; right:0; width:1px; height:10px; margin-top:-5px; display:block; background:rgba(0, 0, 0, 0.15);}
	#hd .header_top_right .util_list .search svg {transform:scale(0.85)}
	#hd .family_site .family_site_btn {box-shadow:none; background:#111; padding: 1.2rem 2.2rem; border: 1px solid rgba(255, 255, 255, 0.20); }
		
	#hd.menu h1 > a {display:block; width:40px; overflow:hidden;}
	#hd.menu .header_top_right .util_list li:not(.menu) {display:block;}
	#hd.menu .header_top_right .util_list .login > a  {color:#fff;}
	#hd.menu .header_top_right .util_list .login > a > svg {display:none;}
	#hd.menu .header_top_right .util_list .login > a > span {display:block; }
	
	#menu .mo_sponsor {display:block; margin-top:1rem; padding:0 2rem; gap:1rem; margin-bottom:3rem;}
	#menu .mo_sponsor .sp1 {margin-bottom:1.5rem;}
	#menu .mo_sponsor .sp2 {display:flex; gap:2rem; }
	
	#hd.fixed-top .header_top {justify-content: flex-start;}
	
	/* 패밀리 사이트 */
	#hd.menu .header_top_left .family_mo { display:block; position:absolute; top:var(--hd-height); left:0; width:100%; padding:1.8rem 2rem 1rem; background:#000; }
	#hd .family_site {cursor:pointer;}
	#hd .family_site:hover .family_site_list { display:none; opacity:0; visibility:hidden;}
	#hd .family_site.on .family_site_list {display:block; opacity:1; visibility:visible; height:285px; overflow-y:auto; box-shadow:none; border: 1px solid rgba(255, 255, 255, 0.20); padding: 5.5rem 0 1.5rem; }
	
	#hd .family_site .family_site_list::-webkit-scrollbar { width: 3px; margin-top:5px; }
	#hd .family_site .family_site_list::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.2); border-radius: 10px; }
	#hd .family_site .family_site_list::-webkit-scrollbar-thumb { background: #FFF; border-radius: 10px; }
	#hd .family_site .family_site_list::-webkit-scrollbar-thumb:hover { background: var(--biff-red); }
	}


@media only screen and (max-width: 992px) {
}
/* 모바일 (max-width: 768px) */
@media only screen and (max-width: 768px) {
    /* 모바일용 스타일 */
}
	/* 모바일 (max-width: 480px) */
@media only screen and (max-width: 480px) {
    /* 작은 스마트폰용 스타일 */
	
	#menu .mo_sponsor {margin-top:2rem;}
	#menu .mo_sponsor .sp2 a:nth-child(1) img {height:13px;}
	#menu .mo_sponsor .sp2 a:nth-child(2) img {height:16px;}
	#menu .mo_sponsor .sp2 a:nth-child(3) img {height:18px;}
}

/* hover 2차메뉴 */
.nav_depth2_wrap {display:none; position:absolute; top:35px; padding: 0;margin:0 auto; left: 50%; right: auto; transform: translate(-50%,0); z-index:100; overflow:hidden; z-index:109999;}
.nav_depth2_wrap h2 {display:none;float:left;width:15%;font-size:38px;line-height:48px;font-weight:bold;letter-spacing:-1px;color:#5bc1c6;text-align:left;} 
.nav_depth2_wrap .btn_gnb_cls {position:absolute;bottom:0;right:0}

.gnb nav .depth2 { margin:0; border:solid 1px #212121; background:#0e0e0e; padding:25px 40px; min-width:22rem; }
.gnb nav .depth2.grid3 { display: grid;grid-template-columns: 1fr 1fr 1fr; gap: 10px; width: 700px; }
.gnb nav .depth2.grid2 { display: grid;grid-template-columns: 1fr 1fr; gap: 10px; width:460px;}

.gnb nav .depth2 > li { margin:0;padding:0; text-align:center;}
.gnb nav .depth2 > li:hover {border-color:#e81e2d;}
.gnb nav .depth2 > li > a {font-size:1.6rem;/*display:table-cell;*/display:inline-block;vertical-align:middle;padding:7px 0px;color:#fff;font-weight:500; white-space: nowrap;position:relative;}
.gnb nav .depth2 > li > a:hover,
.gnb nav .depth2 > li > a.on {cursor:pointer; color:var(--biff-red);}
.gnb nav .depth2 > li > a > .br {display:block;}

@media only screen and (min-width: 1025px) and (max-width: 1360px) {
	.gnb nav .depth2.grid3 {grid-template-columns: 1fr 1fr; width:45vw}
}


/********************************************** 상단 띠배너 **********************************************/
#topLineBnr {position: absolute;display:flex;align-items:center;height:4em;font-size:10px; background-color:var(--biff-red-v2);bottom: -4em;width: 100%;left: 0;right: 0;opacity: 1;transition: opacity 0.2s;}
#topLineBnr .topLineBnr_swiper {position:relative; display:flex; align-items:center; width:100%; height:100%; overflow:hidden;}
#topLineBnr .topLineBnr_swiper ul li {display:flex; width:100%;  height:100%; align-items:center;}
#topLineBnr .topLineBnr_swiper ul li a {display:block; width:100%; height:100%; align-content:center; line-height:1; text-align:center; color:#fff; font-size:1.5em; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
#topLineBnr .topLineBnr_swiper ul li a .xi-info {font-size:1.25em; vertical-align:text-bottom;}
#topLineBnr #topLineBnrClose {position:absolute; right:0; display: block; width: auto; height: 100%; aspect-ratio: 1 / 1; color: #fff; font-weight: bold; z-index:9;}

#hd.fixed-top #topLineBnr {/* display:none; */opacity: 0;height: 1px;}


@media screen and (max-width:920px) {
	#topLineBnr {font-size:1vw}
}
@media screen and (max-width:768px) {
	#topLineBnr {font-size:1.6vw}
}
@media screen and (max-width:540px) {
	#topLineBnr {font-size:2vw}
}


/* //------------------------------------------------------- //HEADER ------------------------------------------------------- */


/* sub navigation */
#snb {/* background:#161616; */text-align:right; /* background: linear-gradient(90deg, #ab000d 0%, #6f040b 100%);  */background: var(--biff-red-v2); }
#snb .snb_ul {padding:0.8rem 0; text-align: center;}
#snb .snb_ul li {padding:0px;}
#snb .snb_ul li a {display:inline-block;color:#fff;color:rgba(255,255,255,.8);font-size:16px;line-height:40px;padding:0 10px;letter-spacing:-0.5px}
#snb .snb_ul li.current a { color:#ffffff;font-weight:bold}
/*#snb #snbul2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(12.5%, auto));	}*/

@media (min-width:1600px) {
	#snb > .container-xxl {max-width:100%}
}

#snb::-webkit-scrollbar { height: 5px; }
#snb::-webkit-scrollbar-track { background: rgba(255, 255, 255,0.5); }
#snb::-webkit-scrollbar-thumb { background: #d10010; }
	
	@media (max-width:1280px) {
		.hd_menu {width:100%;padding-left:15px;padding-right:15px;}	
		/* #snb #snbul2 { display: block} */
	}
	
	@media (max-width:768px){
		
		#snb:before,
		#snb:after,
		#snb .snb_ul:before,
		#snb .snb_ul:after {clear:both;content:'';display:block;}
		
		#snb {overflow-x:scroll}
		#snb .snb_ul {display:table;overflow-x:scroll;padding-left:10px;padding-right:10px; padding-top:0; padding-bottom:0; }
		#snb .snb_ul li {display:table-cell;white-space:nowrap;float:none;padding:0px 5px}
		#snb .snb_ul li a {line-height:46px;font-size:14px;padding:0 10px;color:#ffffff;font-weight:bold;}
		#snb .snb_ul li.current a {position:relative;background:#ffffff;color:#1d1d1d;}
		#snb .snb_ul li.current a:after {content:'';display:inline-block;position:absolute;left:0;bottom:0;width:100%;height:3px;background:#ffffff}
		/* #snb #snbul2 { grid-template-columns: repeat(auto-fill, minmax(20%, auto));	} */

		#cont .con_tit_wrap .con_tit {font-size:24px;letter-spacing:-1px;}


	}

.sub_title_wrap {position:relative;padding:60px 0 50px 0  ;}
.sub_title_wrap:before,
.sub_title_wrap:after {clear:both;display:block;content:'';}
.sub_title_wrap h2.en {font-size:4.5rem;font-weight:700 !important;color:#111; text-align:center; letter-spacing:-2px;}
.sub_title_wrap h2.kor {font-size:38px;line-height:1.5;font-weight:bold;letter-spacing:-1.8px; }
body:has(li.current[data-menutxt="Juries"]) .sub_title_wrap,
body:has(li.current[data-menutxt="Award Winners"]) .sub_title_wrap {display:none;}

.d3tab_basic  {margin:0 0 30px;}
.d3tab_basic ul {text-align:center;}
.d3tab_basic li {padding:5px 3px; display:inline-block; margin:0 5px;}
.d3tab_basic li:before{ content: " ";  position: relative; width: 5px; height: 5px; display: inline-block; vertical-align: super; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; background-color:#aaa; }
.d3tab_basic li:first-child:before {content:"";display:none;}
.d3tab_basic li a {display:inline-block; font-weight:700; color:#aaa;font-size:2.2rem;line-height:1.5; padding: 10px 0 10px 18px; }
.d3tab_basic li.on a {color:#111;  }
body:has(li.current[data-menutxt="Juries"]) .d3tab_basic,
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic  {margin:25px 0;}


/* 수상작 및 수상자 페이지 3차 메뉴 드롭다운 처리 */
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic {margin: 0;text-align: center;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic button#now3depth {width:100%;padding: 1.5rem;text-align:center; color:#111; font-size:1.8rem;font-weight: 700; font-family:'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; letter-spacing: -0.025em; }
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic button#now3depth:after {content:"";display: inline-block;width: 1ex;height: 1ex;border-right:2px solid var(--biff-red);border-bottom:2px solid var(--biff-red);transform:rotate(45deg) translateY(-0.5ex);margin-left: 1ex; transition:all 0.5s;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul {position: absolute;left: 0;right: 0;display: flex; display:none; flex-direction: column;/* justify-content: center; */width: max-content;height: 58vh;margin: 1px auto;gap: 0;color: #fff;border-radius: 1em;border: 1px solid rgb(255 255 255 / 10%);background: linear-gradient(90deg, rgb(0 0 0 / 70%) 5.19%, rgb(0 0 0 / 70%) 105.41%);padding: 2em;backdrop-filter: blur(9px);box-shadow: -3px 5px 15px 0 rgb(0 0 0 / 27%);height: 1px;opacity: 0;font-size: 0;overflow-y: auto;z-index: 9;transition: opacity 0.5s;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul::-webkit-scrollbar{width:8px; /* 세로스크롤 넓이 */ height:8px; /* 가로스크롤 높이 */ background:transparent;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul::-webkit-scrollbar-track{width:8px; background:transparent;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul::-webkit-scrollbar-thumb{width:8px; background:rgba(255,255,255,0.2); border-radius:10px;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li:before {display:none;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li a {font-size:1.6rem; margin:0; padding-left: 0;font-weight: normal; color:rgba(255,255,255,0.5); transition:all 0.5s;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li a:hover   {text-decoration:underline;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li.on a {color:#ffb0b0; font-weight:bold;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic.opened button#now3depth:after { transform:rotate(-135deg) translateY(0); transition:all 0.5s;}
body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic.opened .depth3_ul  {display:flex; height:45vh; opacity:1; font-size:1em}



/* @media only all and (max-width:414px) { */
@media only all and (max-width:768px) {
	.d3tab_basic ul { overflow-x: scroll;/*  display: flex; */}
	.d3tab_basic li { white-space: nowrap; }	
	.d3tab_basic ul::-webkit-scrollbar { height:5px;}
	.d3tab_basic ul::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); border-radius: 4px; }
	.d3tab_basic ul::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.4); border-radius: 4px; }
	.d3tab_basic ul::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0.4); }
	
	
}

.loc_box { }
.loc_box .loc_bul { position: relative; width: 3px; height: 3px; display:  inline-block; margin: 0 7px; vertical-align: middle; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; background-color:#aaa; margin:20px 0;}

#bannerzone {border-top:solid 1px #cccccc50; padding:20px 0; margin:0; background:#f5f5f5; }
/*.logo_fixed { position: absolute; padding-left:30px }
.logo_scroll {padding: 0 30px 0 10%;}*/

#bannerzone .sponsor {position:relative;width:100%; margin:auto; padding:25px 0; }
#bannerzone .sponsor:after {display:block;content:'';clear:both;}
#bannerzone .sponsor ul {position:relative; }
#bannerzone .sponsor ul li { float:left; padding:0 20px; }
#bannerzone .sponsor ul li img { }



#scroller li { display:inline-block;}



/* ------------------------------------------------------- PAGE COMMON ------------------------------------------------------- */
header.fixed-top ~ main {padding-top:var(--hd-height);}
.page {min-height:90vh; min-height:calc(var(--vh, 1vh) * 90);}
body:has(#gnb li.on[data-menutxt="Selection"]) .page {min-height:auto;}
@media (max-width: 768px) {
	.page {min-height:100vh; min-height:calc(var(--vh, 1vh) * 100); }
}
/* ------------------------------------------------------- //PAGE COMMON ------------------------------------------------------- */


/* ------------------------------------------------------- FOOTER ------------------------------------------------------- */
#ft { background: #000; color: #fff; padding: 6rem 0; position: relative; }
#ft .ft_top { display: flex; justify-content: space-between; padding-bottom:4rem; }
#ft .ft_top .left ul li { display: inline-block; position:relative; }
#ft .ft_top .left ul li a { color: #999; font-size: 1.6rem; font-weight: 300; letter-spacing: -0.08rem; transition:all 0.3s ease; padding:0 1.5rem; }
#ft .ft_top .left ul li:hover a { color: #fff; }
#ft .ft_top .left ul li:first-child a {padding-left:0;}
#ft .ft_top .left ul li:before {content:'';position:absolute;top:5px;right:0;width:1px;height:14px;background:#444;}
#ft .ft_top .left ul li:last-child:before {content:none;}
#ft .ft_top .right .copyright { color: #999; font-size: 1.6rem; font-weight: 300; }

#ft .ft_bottom { display: flex; align-items: self-start; padding-top:4rem; gap:15rem; }
#ft .ft_bottom .left img {max-width:44rem}
#ft .ft_bottom .right {flex-shrink:0;}
#ft .ft_bottom address .add {display:block; font-size:1.6rem; padding-bottom:5px; color:#ddd; word-break:keep-all;}
#ft .ft_bottom address .add > span {color:#888; font-weight:500;}

#ft .ft_bottom address > span.cscenter { margin-bottom:1.5rem; display:flex; gap:5rem; }
#ft .ft_bottom address > span.cscenter a {color:var(--biff-red); font-size:2.4rem; font-weight:700;}
#ft .ft_bottom address > span.cscenter small b {color:rgba(255,255,255,0.4); font-weight: 500;}
#ft .ft_bottom address > span.cscenter small b:not(:first-child) {padding-left:1ex; margin-left:1ex; border-left:1px solid rgba(255,255,255,0.2);}

/* 노트북 (max-width: 1200px) */
@media only screen and (max-width: 1240px) {
	#ft .ft_bottom { flex-wrap:wrap; gap:5rem;}
	#ft .ft_bottom .right {flex-shrink:unset;}
}

/* 태블릿 (max-width: 1024px) */
@media only screen and (max-width: 1024px) {
    /* 태블릿용 스타일 */
	#ft .ft_bottom .left {  }
	#ft .ft_bottom .left img {max-width:80%;}
	#ft .ft_bottom address > span.cscenter { flex-direction: column; gap:2rem; }
}

@media only screen and (max-width: 992px) {
}

/* 모바일 (max-width: 768px) */
@media only screen and (max-width: 768px) {
    /* 모바일용 스타일 */
	#ft { padding: 4rem 0 6rem; }
	#ft .ft_top { padding-bottom: 3rem; }
	#ft .ft_bottom { padding-top: 3rem; }
	#ft .ft_bottom .left img {max-width:60%;}
	#ft .ft_bottom address .add {font-size:1.4rem;}
	#ft .ft_top .right { position: absolute; bottom: 2rem; }
}



	/* 모바일 (max-width: 480px) */
@media only screen and (max-width: 480px) {
    /* 작은 스마트폰용 스타일 */
	#ft { padding: 3rem 0 6rem; }
	#ft .ft_top { padding-bottom: 2.5rem; }
	#ft .ft_top .left {overflow-x:auto;}
	#ft .ft_top .left > ul {white-space:nowrap}
	#ft .ft_top .left ul li a { font-size: 1.4rem; padding:0 1rem; }
	#ft .ft_top .right .copyright { font-size: 1.4rem; }
	#ft .ft_bottom { padding-top: 2.5rem; }
	#ft .ft_bottom address > span { font-size: 1.4rem; }
	#ft .ft_bottom address > span > span {display:block;}
	
}
/* //------------------------------------------------------- //FOOTER ------------------------------------------------------- */


.fixed_button {position: fixed;right:24px;bottom:24px}


/* 드래그 블록 색상 */
::selection {background:#111;color:#FFF;text-shadow:none;}
::-moz-selection {background:#111;color:#FFF;text-shadow:none;}
::-webkit-selection {background:#111;color:#FFF;text-shadow:none;}

/* animate */
@keyframes header_fix{0%{opacity:0; transform:translateY(-0.1rem);}100%{opacity:1; transform:translateY(0);}}
@keyframes header_fix2{100%{opacity:1; }0%{opacity:0}}
@keyframes menu_on0{0%{opacity:0}100%{opacity:1}}
@keyframes menu_on1{0%{transform:translateY(50%) rotateX(90deg)}100%{transform:translateY(0) rotateX(0)}}



.quickmenu_wrap {position:fixed;right:0;bottom:0;z-index:9999999999999999999999999999999999999999999999999999;}
body.modal_open .quickmenu_wrap,
body.fancybox-active .quickmenu_wrap {z-index:0;}


.btn_floating {display:block;width:6rem;height:6rem;position:fixed;right:3rem;bottom:10rem;background:var(--biff-red);border-radius:50%;cursor:pointer;z-index:499; -webkit-transition:0.3s ease-in-out;transition:0.3s ease-in-out;}
.btn_floating button { display: block;position: absolute;left: 0;right: 0;height: 100%;width: 100%;top: 0;bottom: 0;text-align: center;color:#fff; border:none; background:none; font-weight:600; }
.btn_floating button .quick_plus {width:2.8rem;}
.btn_floating:hover{background: var(--biff-red); }
/* .btn_floating .quickmenu_control_txt {display: block;padding:0;font-size:14px; text-align: center;color: #fff;-webkit-transition: opacity 250ms;transition: opacity 250ms;} */
.btn_floating .quickmenu_control_icon .size-6 { display:none; width: 24px; height: 24px; margin:0 auto; color: #eee; left:0px;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
/* .btn_floating .quickmenu_control_icon span { position:relative; padding:0;} */
/* .btn_floating .quickmenu_control_txt:before {content:'';display:block; width:22px;height:22px;background:url(/kor/img/layout/ico_quickmenu_btn.png) no-repeat center center;} ~2023 까지 쓰던 아이콘 */

.btn_floating.active{background:#ccc;}
.btn_floating.active .quickmenu_control_icon .quick_plus {display:none;}
.btn_floating.active .quickmenu_control_icon .size-6 {  display:block; color: #333;}
.btn_floating.active .quickmenu_control_icon { -webkit-transition: none;transition: none;}
.btn_floating.active .quickmenu_control_icon { transform-origin: center;  -webkit-transition: transform 0.25s ease, opacity 0.2s ease; transition: transform 0.25s ease, opacity 0.2s ease; } 
/* .btn_floating.active .quickmenu_control_icon span { position:relative; padding:0;} */
/* .btn_floating.active .quickmenu_control_txt:before {content:'';display:block; width:108px;height:108px;background:url(/kor/img/layout/ico_quickmenu_close.png) no-repeat center center; } ~2023 까지 쓰던 아이콘  */

#quickmenu_box {position:fixed;width:240px;right:3rem;top:inherit;bottom:180px; overflow:hidden;opacity:0;visibility:hidden;-webkit-transition:color 300ms;transition:color 300ms; box-shadow:1px 1px 10px rgba(0,0,0,.4);}
#quickmenu_box.on {transform: matrix(1, 0, 0, 1, 0, 0); visibility: inherit; opacity: 1;}
#quickmenu > li {display:flex; align-items:center; background-color:#fff; padding:0 20px; height:57px; line-height:57px; border-bottom:1px solid #eee;}
#quickmenu > li:last-child{border-bottom:0;}
#quickmenu > li:hover{background:#eee;}
#quickmenu > li:before {content:'';display:inline-block;width:30px;height:30px;vertical-align:middle; background-repeat:no-repeat;background-position:0 50%;margin-right:10px; flex-shrink:0;}

/* #quickmenu > li.quick_soldout:before {background-image:url('/kor/img/layout/ico_quickmenu3.png');} */
#quickmenu > li.quick_schedule:before {background-image:url('/kor/img/layout/ico_quickmenu_schedule.svg'); background-size:27px auto;} 
#quickmenu > li.quick_ticketing:before {background-image:url('/kor/img/layout/ico_quickmenu_ticket.png');} 
#quickmenu > li.quick_online:before {background-image:url('/kor/img/layout/ico_quickmenu_online.png');}
#quickmenu > li.quick_check:before {background-image:url('/kor/img/layout/ico_quickmenu_check.png');}
#quickmenu > li.quick_tica:before {background-image:url('/kor/img/layout/ico_quickmenu_tica.png');}
#quickmenu > li.quick_faq:before {background-image:url('/kor/img/layout/ico_quickmenu_faq.png');}
#quickmenu > li.quick_chant:before {background-image:url('/kor/img/layout/ico_quickmenu_chant.png');}
#quickmenu > li.quick_kakao:before {background-image:url('/kor/img/layout/ico_quickmenu_kakao.png');}
#quickmenu > li.quick_onair:before {background-image:url('/kor/img/layout/ico_quickmenu_onair.png');}
#quickmenu > li.quick_rev:before {background-image:url('/kor/img/layout/ico_quickmenu_reserve.svg');}
#quickmenu > li.quick_sch:before {background-image:url('/kor/img/layout/ico_quickmenu_sch.svg');}
#quickmenu > li.quick_check2:before {background-image:url('/kor/img/layout/ico_quickmenu_check.svg?ver=1');}

#quickmenu > li.quick_check2 {display:none;}
#quickmenu > li.quick_ticketing.mo {display:none;}

#quickmenu > li a {display:block; width:100%; color:#111;font-size:15px;font-weight:700;letter-spacing:-0.5px; line-height:1;}

.quick_top { position: fixed; bottom: 3rem;  right: 3rem; z-index: 1000; }
.quick_top .top { display: flex; align-items: center; justify-content: center; width: 6rem; height: 6rem; background-color: #333; border-radius: 50%; border: none; cursor: pointer; text-decoration: none; }
.quick_top .top:hover { background-color: var(--biff-red-v2); transition:0.3s ease-in-out; }
.quick_top .top .size-6 {  width: 22px; height: 22px; color: #eee;}

@media (max-width:1024px) { 
	/* .btn_floating{right:20px; bottom:20px;} */
}

@media (max-width:768px) { 
	/* .btn_floating{width:70px; height:70px;} 
	.btn_floating .quickmenu_control_txt:before{width:70px; height:70px; background-size:35px;}
	.btn_floating.active .quickmenu_control_txt:before{width:70px; height:70px; background-size:20px;}
	#quickmenu_box{right:20px; bottom:100px;}*/

	.quick_top { bottom: 1.5rem;  right: 1.5rem; }
	.btn_floating { bottom: 8rem; right:1.5rem; }
	.btn_floating button img {width:60%;}
	#quickmenu_box { bottom:150px; right:1.5rem; }
	
	#quickmenu > li.quick_check2 {display:flex;}
	#quickmenu > li.quick_ticketing.mo {display:flex;}
	#quickmenu > li.quick_ticketing.pc {display:none;}
	
}

@media (max-width:480px) { 
	#quickmenu > li { height: 45px; line-height: 45px; padding: 0 15px; }
	#quickmenu > li a { font-size: 13px; padding: 0 10px; }
	#quickmenu_box { width: 180px; }
	#quickmenu > li:before { margin-right: 5px; }
}

/* 2024-07-26 모바일 타이틀 부분 수정 */
@media (max-width:1024px) { 
	.sub_title_wrap h2.en {font-size:4rem;}
}
@media (max-width:768px) { 
	.sub_title_wrap {padding:35px 0;}
	.sub_title_wrap h2.en {font-size:3.2rem; line-height:1.3;}
	
	.d3tab_basic {white-space: nowrap; margin-bottom:15px; overflow-x:auto;}
	.d3tab_basic li {padding:0; margin:0;}
	.d3tab_basic li a {font-size:2rem; padding:10px 0; margin:0 12px;}
	.d3tab_basic li:first-child a {margin-left:0;}
	
}
@media (max-width:430px) { 

	.d3tab_basic li a {font-size:1.8rem;}
}

@media (min-width:768px) {
    .container { max-width:1250px;}
}

body:has(.pgl ) .d3tab_basicbox {border-bottom:none !important;}
.d3tab_basic {margin:-10px 0 20px;}
.d3tab_basic.other {margin:25px 0;}
.d3tab_basic li a {padding-top:3px; padding-bottom:3px; font-size:1.8rem;}
.d3_cnt {margin:50px auto 120px auto;}

@media (min-width:769px) {
	.sub_title_wrap + div .d3tab_basic {margin-bottom:50px; margin-top:-30px; position:relative; z-index:1;}
}

@media (max-width:1024px) { 
	.d3tab_basic {margin:20px 0 10px;}
	.d3tab_basic ul {padding-bottom:10px;}
	.d3tab_basic li a {padding-top:0; padding-bottom:0; font-size:1.6rem;}
	.d3_cnt {margin:20px auto 80px auto;}
	.d3tab_basic.other {margin:15px 0 5px;}
	
	body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul {width:100%; overflow-x:hidden; border-radius: 0 0 1em 1em}
	body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li {white-space:normal;}
	body:has(li.current[data-menutxt="Award Winners"]) .d3tab_basic .depth3_ul li a {padding:1ex 0; font-size:1.4rem}
	
}

@media (max-width:430px) {
	.sub_title_wrap + div .d3tab_basic {margin-top:0; margin-bottom:20px;}
}

/* 메인스폰서 */
.main_sponsor {background:#f7f7f7; padding:6.5rem 0;}
.main_sponsor .wrap {display:block; width:1240px; margin:0 auto; *zoom:1; }
.main_sponsor .wrap:after {display:block; clear:both; content:""; }
.main_sponsor h3 {display:none;}
.main_sponsor .sitebanner li{display:inline-block; width:calc(25% - 1.8rem); text-align:center; vertical-align:middle; margin-right:2rem;}
.main_sponsor .sitebanner li:last-child{margin-right:0;}
.main_sponsor .sitebanner li.dark a img {filter:grayscale(1); opacity:0.65;}


@media (max-width:1024px) {
	.main_sns {padding-top:0;padding-bottom:0}
	
	/* .main_sns .m_newsletter {width:100%; float:none; clear:both; padding:40px 40px; border-right:0;border-bottom:1px solid #e0e0e0} */
	.main_sns .m_newsletter{width: 100%;float: none;clear: both;padding:0;border-right: 0;border-bottom: 0;}
	.main_sns .m_newsletter .formbox {width:90%;}
	.main_sns .m_newsletter form {height:70px}
	.main_sns .m_newsletter .emailaddr {width:80%;font-size:24px;line-height:38px;}
	.main_sns .m_newsletter .emailsubmit {background:#cf3b3e;height:70px;line-height:70px;font-size:20px;width:20%}
	.main_sns .m_newsletter .formbox .btn_more {font-size:20px;}
	
	
	.main_sns .biff_sns, .newsletter{width:100%; text-align:center;}
	/* .main_sns .m_sns {width:100%; float:none; clear:both; padding:40px 40px} */
	.main_sns .m_sns{width: 100%;float: none;clear: both;padding:0;}
	/* .main_sns .snslink {padding-top:30px;} */
	.main_sns .snslink{padding-top:0; display:flex; justify-content:center;}
	.main_sns .snslink li {margin-top:3rem; margin-left:1rem; margin-right:1rem;}
	.main_sns .snslink li:after {clear:both;content:'';display:block;}
	.main_sns .newsletter_btn{float:inherit; margin-top:3rem;}
	.main_sns .newsletter{margin-top:5rem;}
	.main_sponsor .wrap { display:block; width:640px; margin:0 auto; *zoom:1; }
	.main_sponsor .wrap:after { display:block; clear:both; content:""; }
	.main_sponsor h3 {display:none}
	.main_sponsor .sitebanner li img { width:110px; }

	.main_sns .section_tit h3{font-size:30px;}
	.main_sns .m_newsletter .newsletter_btn{padding-bottom:50px;}
	.main_sns{padding:5rem 0;}
}


html::-webkit-scrollbar{width:6px; /* 세로스크롤 넓이 */ height:8px; /* 가로스크롤 높이 */ background:#333;}
html::-webkit-scrollbar-track{width:6px; background:#333;}
html::-webkit-scrollbar-thumb{width:6px; background:#aaa; border-radius:10px;}

