@charset "UTF-8";

/* reaset */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,
fieldset,figcaption,figure,footer,form,header,hgroup,i,iframe,img,input,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,output,pre,q,
ruby,s,samp,section,select,small,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:middle;text-decoration: none;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}[hidden]{display:none}
body{line-height:1.5}
h1,h2,h3,h4,h5,h6,p,span{margin:0;padding:0;border:0;font-size:100%;font-weight: normal; vertical-align:baseline}
menu,ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
/* reaset */

:root {
	--red: #fe2c55;
	--green: #00faa2;
	--blue: #25f4ee;
	--gray: #171717;
	--light-gray: #2d2d2d;
}
*{
    font-family: 'GmarketSans';
	font-weight: normal;
}
img{
	width: 100%;
}
html{
    width: 100%;
    font-size: 62.5%;
}
@media only screen and (max-width:1280px){

	html{
		font-size: 55%;
	}
}
@media only screen and (max-width:960px){

	html{
		font-size: 50%;
	}
}
@media only screen and (max-width:499px){

	html{
		font-size: 45%;
	}
}










#wrap{
    width: 100%;
	background-color: #000;
}
main{
	width: 100%;
}
.container{
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 8rem;
}
.wrapper{
	padding: 0 8rem;
}
.active{
	display: block;
}
.inactive{
	display: none;
}
article{
	position: relative;
}
@media only screen and (max-width:1580px){

	.container{
		padding: 0 5%;
	}
	.wrapper{
		padding: 0;
	}
}





/* --- 헤더 영역 --- */
header{
    width: 100%;
}
header .wrapper{
	padding: 3rem 0;
}
h1{
	max-width: 150px;
	width: 15%;
    min-width: 100px;
}





/* --- 비주얼 영역 --- */
.hero .wrapper{
	padding-top: 13rem;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
	position: relative;
}
.hero .hero_tit{
    width: 48.5%;
}
h2{
	font-family: "TikTok Sans", sans-serif;
	font-size: 10rem;
	font-weight: bold;
	line-height: 1;
	color: #ffffff;
}
.hero .hero_tit p{
	font-size: 1.8rem;
	color: #ffffff;
}
.hero .hero_bgi{
    width: 51.5%;
	max-width: 70rem;
	margin-top: -5rem;
}
.hero .schedule{
	background-color: var(--red);
}
.hero .schedule .wrapper{
	padding-top: 0;
}
.hero .hero_text{
	width: 100%;
	padding: 5rem 0;
}
.hero .hero_text ul{
	display: grid;
	gap: 1rem;
}
.hero .hero_text ul li{
	display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.hero .hero_text ul li figure{
	width: 2.6rem;
}
.hero .hero_text ul li p,
.hero .hero_text ul li a{
	font-size: clamp(14px, 3vw, 2.2rem);
	color: #ffffff;
}
.hero .hero_text ul li a{
	display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.btn{
	margin-top: 6rem;
}
#btn{
	width: 29rem;
	border: none;
	border-radius: 5rem;
	padding: 1.85rem 0;
	background-color: var(--red);
	font-size: 2.8rem;
	color: #ffffff;
	cursor: pointer;
}
@media only screen and (max-width:1280px){

	.hero .hero_bgi{
		margin-top: 0;
	}
}
@media only screen and (max-width:960px){

	.hero .hero_tit{
		padding-bottom: 7rem;
		width: 100%;
	}
	.hero .hero_bgi{
		width: 100%;
		margin: 0 auto;
	}
}





/* --- 인사말 영역 --- */
.overview,
.agenda,
.speaker,
.information,
.contact,
.register{
	padding: 15rem 0;
	position: relative;
}
.overview_text{
	text-align: center;
	color: #ffffff;
}
.overview_text strong{
	font-size: 3.6rem;
	font-weight: bold;
	color: var(--blue);
}
.overview_text p{
	margin: 3rem 0;
	font-size: 2.2rem;
}
@media only screen and (max-width:763px){

	.br_off{
		display: none;
	}
}





/* --- 아젠다 --- */
.agenda,
.speaker{
	background-color: var(--gray);
}
.title{
	margin-bottom: 5rem;
}
h3{
	font-size: 5.0rem;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	line-height: 1;
}
.agenda_list > ul > li{
	padding: 2.5rem 0;
}
.agenda_list > ul > li:nth-child(2n+1){
	background-color: #202020;
}
.agenda_list > ul > li > ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.agenda_list .time{
	max-width: 34rem;
	width: 27%;
	padding: 0 1% 0 3%;
	box-sizing: border-box;
	font-size: clamp(13px, 2.8vw, 2.2rem);
	color: #ffffff;
	text-align: center;
	display: grid;
    align-items: center;
}
.agenda_list .cont{
	width: 73%;
	padding: 0 4% 0 2%;
	box-sizing: border-box;
}
.agenda_list .cont .session{
	display: block;
	font-size: clamp(18px, 4vw, 2.8rem);
	font-weight: bold;
	color: var(--red);
}
.agenda_list .cont .session_break{
	color: var(--blue);
}
.agenda_list .cont .session_speaker{
	display: inline-block;
	margin-top: 0.5rem;
	font-size: 1.8rem;
	color: #ffffff;
}
@media only screen and (max-width:499px){

	.agenda_list .time {
		width: 31%;
		padding: 0 1% 0 3%;
	}.agenda_list .cont {
		width: 69%;
		padding: 0 4% 0 4%;
	}
}





/* --- 스피커 --- */
.speaker_list ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem calc((100% - 88rem) / 3);
}
.speaker_list ul li{
	width: 22rem;
	color: #ffffff;
	text-align: center;
}
.speaker_list figure{
	margin-bottom: 3rem;
}
.speaker_name{
	display: block;
	font-size: 2.2rem;
	font-weight: bold;
}
.speaker_position{
	font-size: clamp(13px, 2.5vw, 1.6rem);
}

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

	.speaker_list ul{
		gap: 2rem 5%;
	}
	.speaker_list ul li{
		width: 30%;
	}
}
@media only screen and (max-width:499px){

	.speaker_list ul li{
		width: 60%;
	}
}





/* --- 오시는길 --- */
.information_list ul li{
	margin-bottom: 1.5rem;
	font-size: 2.2rem;
	color: #ffffff;
	text-align: center;
}
.information_list ul li:last-child{
	margin: 0;
}
.information_list .dot{
    display: inline-block;
	width: 5px;
    height: 5px;
    margin-right: 1rem;
    background-color: var(--blue);
    border-radius: 3px;
    position: relative;
    top: -5px;
}
.information_list .text_highlight{
	font-weight: bold;
	color: var(--blue);
}
.information_list a{
    margin-left: 2rem;
	padding: 0.65rem 2rem 0.35rem;
    border-radius: 2rem;
    background-color: var(--red);
    font-size: 1.8rem;
    color: #ffffff;
	display: inline-block;
}





/* --- 문의하기 --- */
.contact_mail{
	text-align: center;
}
.contact_mail a{
	font-size: 2.2rem;
	color: #ffffff;
}
.contact_mail img{
	width: 3rem;
	margin-right: 2rem;
}





/* --- 에셋 --- */
.bgi{
    width: clamp(150px, 23%, 30rem);
    aspect-ratio: 1 / 1;
    position: absolute;
    top: -10vw;
}
.bgi_01{
	right: 0;
	background: url(../images/bgi_01.png) center right -7rem / contain no-repeat;
}
.bgi_02{
	background: url(../images/bgi_02.png) center left -8rem / contain no-repeat;
}
.bgi_03{
	right: 0;
	background: url(../images/bgi_03.png) center right -10rem / contain no-repeat;
}
.bgi_04{
	background: url(../images/bgi_04.png) center left -10rem / contain no-repeat;
}
@media only screen and (max-width:499px){

	.bgi{
		width: 110px;
		top: -40px;
	}
	.bgi_01{
		right: 0;
		background: url(../images/bgi_01.png) center right -30px / contain no-repeat;
	}
	.bgi_02{
		background: url(../images/bgi_02.png) center left -40px / contain no-repeat;
	}
	.bgi_03{
		right: 0;
		background: url(../images/bgi_03.png) center right -50px / contain no-repeat;
	}
	.bgi_04{
		background: url(../images/bgi_04.png) center left -50px / contain no-repeat;
	}
}





/* --- 등록페이지 --- */
.register .wrapper{
    max-width: 1100px;
	margin: 0 auto;
}
.register_tit{
	display: flex;
    justify-content: space-between;
	color: #fff;
}
.register_tit h3{
	display: inline-block;
	font-size: 3.2rem;
    font-weight: bold;
}
.register_tit span{
	display: inline-block;
	margin-top: 2.5rem;
	font-size: clamp(13px, 1vw, 1.4rem);
	color: var(--blue);
}
.register_list{
	border-top: 2px solid var(--blue);
	margin: 2rem 0 5rem;
}
.register_list ul li{
	border-bottom: 1px solid var(--light-gray);
	padding: 2.4rem 5%;
}
.register_list ul li:last-child{
	border-bottom: 2px solid var(--blue);
}
.register_list label{
	width: 20rem;
    display: inline-block;
	font-size: 2.4rem;
    color: #ffffff;
}
.register_list input,
#session{
	width: 50rem;
    border-radius: 3rem;
    border: none;
    box-sizing: border-box;
    padding: 1.2rem 2rem;
    font-size: 2rem;
	background-color: #ffffff;
}
input::placeholder{
    color: #c1c1c1;
}
#session option {
	color: #000000; /* 드롭다운을 펼쳤을 때 옵션 목록의 색 */
}
#session option:first-child {
	color: #c1c1c1; /* 첫 옵션은 회색 */
}
#session {
	color: #000000; /* 닫힌 상태에서 보이는 선택된 값의 색 제어 */
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

	background-color: #ffffff;
	background-image: url("data:image/svg+xml;utf8,<svg fill='%23000000' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 24px;

	padding-right: 40px; /* 텍스트랑 화살표 겹치지 않게 */
}
#session:has(option:first-child:checked) {
	color: #c1c1c1; /* 첫 옵션이 선택돼 있으면 회색 */
}
.register_list ul li label span{
	color: var(--blue);
	vertical-align:-6px;
}
.privacy-list {
	padding: 4rem 5rem;
	background-color: var(--gray);
}
  
/* 체크박스 전용 */
.privacy-list input[type="checkbox"] {
	-webkit-appearance: checkbox !important;
	appearance: checkbox !important;
	display: inline-block !important;
 
	width: 18px!important;
	height: 18px!important;
	min-width: 18px!important;
	min-height: 18px!important;
 
	background: #fff!important;
	border: 1px solid #000!important;
	flex-shrink: 0!important; /* flex 안에서 찌그러지지 않도록 */
}
.privacy-list label {
	width: calc(100% - 4rem);
	margin-left: 1rem;
	color: #ffffff;
	font-size: clamp(12px, 2.5vw, 1.5rem);
	font-weight: lighter;
	line-height: 1.5;
}
.privacy-list ul li {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start; /* 체크박스와 텍스트가 잘 정렬되도록 */
}
.privacy-list ul li:first-child {
	margin-bottom: 3rem;
}

.btn_rgst{
	margin: 7rem auto;
    width: fit-content;
	text-align: center;
}
.btn_rgst p{
	margin-top: 3rem;
	font-size: 1.8rem;
	color: #ffffff;
}
@media only screen and (max-width:960px){

	.register_tit{
		display: block;
	}
	.register_tit h3{
		width: 100%;
        text-align: left;
	}
	.register_tit span{
		margin-top: 1rem;
	}
	.register_list input, #session {
		margin-top: 1rem;
		width: 100%;
	}
	.register_list ul li{
        padding: 2.4rem 0;
    }
	.privacy-list {
        padding: 5%;
    }
}





/* --- 완료페이지 --- */
.success .overview{
	background-color: var(--gray);
}
.success_text{
	text-align: center;
	color: #ffffff;
}
.success_text strong{
	font-size: 4.4rem;
	font-weight: bold;
}
.success_text span{
	font-weight: bold;
	color: var(--blue);
}
.success_text p{
	margin: 5rem 0 7rem;
	font-size: 2.2rem;
}
.btn_end{
	margin: 7rem auto 0;
	width: fit-content;
	text-align: center;
}
@media only screen and (max-width:382px){
	
	.success_text br{
		display: none;
	}
}





/* --- 푸터 --- */
footer{
	width: 100%;
	border-top: 1px solid var(--light-gray);
}
footer .wrapper{
	padding: 6rem 0;
}
.footer_cont{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.icon{
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}
.icon img{
	width: 5rem;
}
.logo{
	width: 28rem;
}