@charset "utf-8";

/*********************************************************************************
HMG TECH SUMMIT 2026 - Main Page
*********************************************************************************/

/* section common */
.main__contents__wr{padding:144px 0; background:#000f30; position:relative;}
.section__title{
	font-size:54px; font-weight:500; line-height:1.1; letter-spacing:-0.64px;
	color:#fff; word-break:keep-all;
}
.section__desc{font-size:22px; font-weight:400; line-height:1.5; color:#fff; opacity:0.9; margin-top:22px !important;}

/*********************************************************************************
Hero
*********************************************************************************/
.main__hero__section{
	position:relative; background:#111;
}
.main__hero__pin{
	position:relative; height:100vh; height:100svh; height:var(--app-svh, 100svh); overflow:hidden;
}
@media screen and (min-width:1281px) and (min-height:1008px){
	.main__hero__pin{min-height:1007px;}
}
.main__hero__video__wr{
	position:absolute; inset:0; z-index:0; overflow:hidden;
}
.main__hero__video__wr::before{
	content:""; position:absolute; left:0; right:0; bottom:0; top:auto; z-index:1;
	height:42%;
	background:linear-gradient(to top, #000f30 0%, rgba(0,15,48,.85) 38%, transparent 100%);
	pointer-events:none;
}
.main__hero__video{
	position:absolute; top:50%; left:50%;
	min-width:100%; min-height:100%; width:auto; height:auto;
	transform:translate(-50%,-50%); object-fit:cover;
}
.main__hero__stage{
	position:relative; z-index:2; height:100%;
}
.main__hero__visual{
	position:absolute; inset:0;
	display:flex; align-items:center; justify-content:center;
}
.main__hero__visual__inner{
	display:flex; align-items:center; justify-content:space-between; gap:54px;
	height:100%; box-sizing:border-box;
}
.main__hero__title__wr{flex:0 1 auto; min-width:0;}
.main__hero__title{
	margin:0; font-size:99px; font-weight:700; line-height:90%;
	color:#fff; letter-spacing:-2.5%;
}
.main__hero__info__wr{
	flex:0 0 auto; width:467px; max-width:467px;
	padding-right:54px; box-sizing:border-box;
	display:flex; flex-direction:column; align-items:flex-start;
}
.main__hero__info{
	font-size:20px; font-weight:400; line-height:32px;
	letter-spacing:-0.24px; color:#fff; opacity:0.8;
}
.main__hero__info p{margin:0;}
.main__hero__more__btn{margin-top:27px;}
.main__hero__more__btn .main__btn__a img{
	width:12px; height:14px; margin-left:0;
}

/*********************************************************************************
Keynote  (Figma 663:2774)
  title↔desc 21.333 / desc↔slides 85.333 / card 328.86×304.93 / gap 68 / img↔text 32
*********************************************************************************/
.main__speakers__section > .inner__cen1500{position:relative; z-index:1;}
.main__speakers__title{text-transform:uppercase; margin:0; letter-spacing:-0.64px;}
.main__speakers__section .section__title{line-height:1.14;}
.main__speakers__section .section__desc{
	margin-top:19px !important;
}
.main__speakers__title__wr{margin-bottom:0; position:relative; z-index:1;}
.main__speakers__content__wr{
	width:100%;
	padding-left:max(5%, calc((100% - 1500px) / 2));
	box-sizing:border-box; overflow:hidden;
	position:relative; z-index:1;
}
.main__speakers__swiper{overflow:visible;}
.main__speakers__swiper .swiper-slide{
	width:295px; height:auto;
}
.main__speakers__content__item{
	position:relative; width:100%;
	overflow:visible; display:flex; flex-direction:column; gap:29px;
	z-index:1;
}
.main__speakers__content__item__img{
	position:relative; width:100%;
	aspect-ratio:328 / 399; height:auto;
	overflow:hidden; border-radius:27px;
	background:transparent;
}
.main__speakers__content__item__img img{
	display:block; pointer-events:none;
	transition:opacity .25s ease, filter .25s ease;
}
.main__speakers__content__item__img img.main__speakers__dim01,
.main__speakers__content__item__img img.main__speakers__dim02,
.main__speakers__content__item__img img.main__speakers__spk{
	position:absolute; inset:0; width:100%; height:100%;
	object-fit:fill;
}
.main__speakers__content__item__img img.main__speakers__dim01{z-index:0;}
.main__speakers__content__item__img img.main__speakers__dim02{
	z-index:1; opacity:0;
	filter:drop-shadow(0 14px 29px rgba(90,140,255,.18));
}
.main__speakers__content__item__img img.main__speakers__spk{
	z-index:2;
	filter:grayscale(100%);
}
.main__speakers__content__item:hover img.main__speakers__dim01{opacity:0;}
.main__speakers__content__item:hover img.main__speakers__dim02{opacity:1;}
.main__speakers__content__item:hover img.main__speakers__spk{filter:grayscale(0%);}

.main__speakers__content__item__text{margin-top:0;}
.main__speakers__content__item__name{
	display:flex; flex-direction:column; align-items:flex-start; gap:6px; margin-top:0;
	line-height:1.3;
}
.main__speakers__content__item__name strong{
	font-size:18px; font-weight:500; color:#fff;
}
.main__speakers__content__item__name span{
	font-size:14px; font-weight:400; color:rgba(255,255,255,.7);
}

/*********************************************************************************
Location (about.php sub__location__* 동일)
*********************************************************************************/
.sub__location__section{
	position:relative; overflow:visible; padding:180px 0 144px;
	margin-top:-2px; background:#000f30;
}
.sub__location__graphics{
	top:-144px; right:-108px; width:min(798px, 70vw); opacity:.7; z-index:0;
	pointer-events:none;
}
.sub__location__graphics img{display:block; width:100%;}
.sub__location__section > .inner__cen1500{position:relative; z-index:1;}
.sub__location__title__wr{
	display:flex; flex-direction:column; align-items:flex-start; gap:24px;
	text-align:left; margin-bottom:40px;
}
.sub__location__title{
	text-transform:uppercase; letter-spacing:-0.64px; margin:0;
}
.sub__location__tab__wr{
	display:flex; align-items:flex-start; gap:34px;
	margin:0; padding:0; list-style:none;
}
.sub__location__tab__item{margin:0; padding:0; list-style:none;}
.sub__location__tab__item button{
	padding:0 0 3px; font-size:24px; font-weight:500; line-height:35px;
	letter-spacing:-0.16px; color:rgba(255,255,255,.8);
	border-bottom:3px solid transparent; white-space:nowrap;
}
.sub__location__tab__item.active button{
	font-weight:700; color:#fff; border-bottom-color:#fff;
}
.sub__location__content__wr{
	display:flex; gap:15px; align-items:stretch;
}
.sub__location__map{
	position:relative; flex:1; min-width:0; width:50%; min-height:0;
	align-self:center;
	border-radius:8px; background:#121c2f; overflow:hidden;
}
.sub__location__map__panel{display:none; position:relative; width:100%; height:auto; min-height:0;}
.sub__location__map__panel.is-active{display:block;}
.sub__location__map img{
	display:block; width:100%; height:auto; min-height:0;
	object-fit:contain; object-position:center;
}
.sub__location__floor__tab{
	position:absolute; left:12px; top:12px; z-index:2;
	display:flex; align-items:center; height:46px; padding:6px; box-sizing:border-box;
	border-radius:40px;
	background:linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.01) 100%), rgba(255,255,255,.13);
}
.sub__location__floor__btn{
	display:flex; align-items:center; justify-content:center;
	height:100%; padding:0 14px; border-radius:30px;
	font-size:16px; font-weight:500; line-height:34px;
	letter-spacing:-0.32px; color:#fff; white-space:nowrap;
}
.sub__location__floor__btn.is-active{background:#fff; color:#111;}
.sub__location__floor__panel{display:none; width:100%; height:auto;}
.sub__location__floor__panel.is-active{display:block;}
.sub__location__info{
	position:relative; width:50%; flex-shrink:0; min-height:540px;
	padding:60px 54px 49px; box-sizing:border-box; overflow:hidden;
	border-radius:8px; color:#fff;
	background:linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.01) 100%), rgba(255,255,255,.02);
	backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.sub__location__info__deco{
	right:-36px; bottom:-72px; width:min(351px, 70%); z-index:0;
}
.sub__location__info__deco img{display:block; width:100%;}
.sub__location__info__title,
.sub__location__info__subtitle,
.sub__location__info__list,
.sub__location__info__btns{position:relative; z-index:1;}
.sub__location__info__title{
	margin:0; font-size:36px; font-weight:500; line-height:1.1; color:#fff;
}
.sub__location__info__subtitle{
	margin-top:9px; font-size:22px; font-weight:400; line-height:34px;
	letter-spacing:-0.48px; color:#fff;
}
.sub__location__info__list{
	display:flex; flex-direction:column; gap:14px; margin-top:61px;
}
.sub__location__info__item__label{
	font-size:16px; font-weight:500; line-height:26px; color:#fff;
}
.sub__location__info__item__value{
	margin-top:4px; font-size:14px; font-weight:500; line-height:23px;
	letter-spacing:-0.32px; color:#fff; opacity:.6; word-break:keep-all;
}
.sub__location__info__btns{
	display:flex; gap:8px; margin-top:77px;
}
.sub__location__info__btns .main__btn__a{
	flex:1; background:rgba(255,255,255,.13); border:0; backdrop-filter:blur(15px);
}
.sub__location__info__btns .main__btn__a img{
	width:20px; height:20px; margin-left:0;
}

/*********************************************************************************
graphics
*********************************************************************************/
.bg__graphics__conts{position:absolute; pointer-events:none; z-index:0;}
.bg__graphics__knt{
	top:-273px; left:-315px; z-index:0;
	width:830px; height:1149px;
	display:flex; align-items:center; justify-content:center;
	mix-blend-mode:screen;
}
.bg__graphics__knt img{
	display:block; width:583px; height:1033px; max-width:none;
	opacity:.8; object-fit:cover;
	transform:rotate(14.96deg);
}

/*********************************************************************************
Responsive
*********************************************************************************/
@media screen and (max-width:1600px){
	.sub__location__info__list{margin-top:40px;}
	.sub__location__info__btns{margin-top:40px;}
}
@media screen and (max-width:1280px){
	.main__contents__wr{padding:100px 0;}
	.section__title{font-size:56px;}
	.section__desc{font-size:18px; margin-top:18px !important;}
	.main__speakers__content__wr{padding-top:56px;}

	.main__hero__title{font-size:90px;}
	.main__hero__info__wr{width:430px; padding-right:0;}
	.main__hero__info{font-size:20px;}

	.sub__location__section{padding:140px 0 100px;}
	.sub__location__info{padding:48px 40px; min-height:initial;}
}
@media screen and (max-width:1024px){
	.main__hero__visual__inner{
		flex-direction:column; justify-content:center; align-items:flex-start;
		padding:72px 0 40px; gap:40px;
	}
	.main__hero__info__wr{width:100%; max-width:100%; padding-right:0;}

	.sub__location__section{padding:100px 0 80px;}
	.sub__location__content__wr{flex-direction:column;}
	.sub__location__map{width:100%;}
	.sub__location__info{width:100%; min-height:auto;}
	.sub__location__graphics{
		top:-80px; right:-72px; width:min(520px, 88vw);
	}
}
@media screen and (max-width:768px){
	.section__title{font-size:36px;}
	.main__hero__title{font-size:48px;}
	.section__desc,
	.main__hero__info{font-size:16px; line-height:1.6;}
	.main__speakers__swiper .swiper-slide{width:230px;}
	.main__speakers__content__item{gap:20px;}
	.main__speakers__content__item__img{border-radius:20px;}
	.main__speakers__content__wr{padding-top:40px;}
	.main__speakers__content__item__name{margin-top:0;}
	.sub__location__title__wr{margin-bottom:24px;}
	.sub__location__info__title{font-size:28px;}
	.sub__location__info__subtitle{font-size:18px; line-height:1.4;}
	.sub__location__section{padding:80px 0 64px;}
	.sub__location__graphics{top:-100px; right:-90px; width:min(460px, 92vw);}

	.bg__graphics__knt{top:-180px; left:-220px; width:580px; height:800px;}
	.bg__graphics__knt img{width:400px; height:708px;}
	
	.sub__location__tab__wr{
		gap:16px;
	}
	.sub__location__tab__item button{
		font-size:16px;line-height:18px;
	}

	.sub__location__floor__tab{
		left:8px; top:8px;
		height:40px;
	}

	.sub__location__floor__btn{
		padding:0 12px;
		font-size:12px; line-height:28px;
	}


}

@media screen and (max-width:480px){
	/*.sub__location__title{font-size:28px; line-height:1.2;}*/
	.sub__location__info{padding:30px 24px;}
	.sub__location__info__btns{flex-direction:column;}
	.sub__location__info__btns .main__btn__a{padding:10px;}
	.sub__location__graphics{top:-80px; right:-70px; width:min(360px, 90vw);}

	.bg__graphics__knt{top:-120px; left:-160px; width:420px; height:580px;}
	.bg__graphics__knt img{width:280px; height:496px;}
}