@charset "UTF-8";

:root {
	--orange: #da291c;
	--green: #3cb17e;
	--blue: #307fe2;
	--purple: #9063cd;
	--light-orange: #f8d4d2;
	--light-green: #d8efe5;
	--light-blue: #d6e5f9;
	--light-orange10: #fbe9e8;
	--light-blue10: #eaf2fc;
	--light-purple10: #f4effa;
}








/* mobile */
#mobile-wrap{
	max-width: 750px;
	width: 100%;
	margin: 0 auto;
}
.mobile-container{
	max-width: 750px;
	width: 100%;
	padding: 0 3rem;
	box-sizing: border-box;
}
.mobile-wrapper{
	max-width: 750px;
	width: 100%;
	position: relative;
}
@media only screen and (max-width:499px){
	
	.mobile-container{
		padding: 0 5%;
	}
}









/* 헤더 영역 */
#mobile-header{
	height: 4.6rem;
	max-width: 750px;
	width: 100%;
	position: unset;
}
#mobile-header .mobile-container{
	position: relative;
    transform: translate(0, -50%);
    top: 50%;
}
#mobile-header .mobile-wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.mobile-logo{
	max-width: 10rem;
	margin: 0;
	position: relative;
}
.mobile-nav{
	width: calc(100% - 10rem);
}
.mobile-gnb ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: right;
	gap: 2.3rem;
}
.mobile-gnb ul li{
	font-size: 1.1rem;
}
.mobile-gnb ul li a{
	color: #000;
	font-weight: 500;
}
.mobile-gnb .gnb-on a{
	color: var(--orange);
}
.mobile-gnb .gnb-off{
	display: none;
}
.mobile-gnb .logout a{
	padding: 0.5rem 1rem;
    border-radius: 2rem;
    color: #fff;
    background-color: var(--orange);
}
@media only screen and (max-width:960px) {
	
    .mobile-nav {
		display: block;
	}
}
@media only screen and (max-width:600px) {
	
    .mobile-gnb ul {
		gap: 5%;
	}
}










/* 비주얼 영역 */
.mobile-hero{
	background: url(../images/mo_bg_main.png) center / cover no-repeat;
}
.mobile-component-text{
	padding: 4.6rem 0;
}
.mobile-component-text h2{
	max-width: 27rem;
    width: 70%;
	margin: 0;
}
.mobile-component-text strong{
	padding: 1rem 0 0;
    font-size: 1.4rem;
    font-weight: 500;
    display: inline-block;
}










/* 메인페이지 메뉴 영역*/
.mobile-menu{
	padding: 9.2rem 0;
}
.mobile-menu-list{
	padding: 0 1.5rem;
}
.mobile-menu-list ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2.3rem;
}
.mobile-menu-list ul li{
	width: calc((100% - 2.3rem) / 2);
    height: 15.4rem;
	background-color: var(--light-green);
	text-align: center;
	position: relative;
	cursor: pointer;
}
.mobile-menu-list ul li a{
	display: block;
    width: 100%;
    height: 100%;
}
.mobile-menu-list ul li figure{
    width: 100%;
    padding: 4rem 0 0;
}
.mobile-menu-list ul li figure img{
	width: unset;
}
.mobile-menu-list ul li span{
	display: block;
	width: 100%;
    font-size: 1.4rem;
    font-weight: 500;
    color: #000;
}
.mobile-menu-list ul li:first-child{
	width: 100%;
    background-color: var(--light-orange);
}
.mobile-menu-list ul li:last-child{
    background-color: var(--light-blue);
}
.mobile-faq{
	width: 4.6rem;
    padding: 2.3rem 0;
	position: absolute;
    right: 0;
}
@media only screen and (max-width:499px){

	.mobile-menu-list{
		padding: 0 2%;
	}
	.mobile-menu-list ul{
		gap: 3%;
	}
	.mobile-menu-list ul li{
		width: calc(97% / 2);
	}
	.mobile-menu-list ul li:first-child{
		margin: 0 0 3%;
	}
}











/* 아젠다 영역 */
.mobile-agenda{
	padding: 0 0 3rem;
}
.mobile-agenda-tit{
	padding: 4.6rem 0 1rem;
}
.mobile-agenda-tit h3{
	font-size: 2rem;
	font-weight: 700;
}
.mobile-agenda-list{
	border-top: 2px solid #000;
}
.mobile-agenda-list h4{
	font-size: 1.2rem;
	font-weight: 600;
}
.mobile-agenda-list .track-time{
	font-size: 1.1rem;
}
.mobile-agenda-list .track-session{
	font-size: 1.2rem;
	font-weight: 600;
}
.speaker-off,
.agenda-track h4,
.agenda-track ul li,
.agenda-track-last{
	padding: 1rem 1.5rem;
}
.agenda-track ul {
	display: none;
  }
.agenda-track ul li{
	border-bottom: 1px solid var(--orange);
	background-color: var(--light-orange10);
}
.agenda-track ul li:last-child{
	margin: 0 0 0.2rem;
	border: none;
}
.mobile-agenda-list .speaker-off{
	border-bottom: 1px solid #e5e5e5;
	background-color: #f4f4f4;
}
.agenda-track h4{
	margin: 0.2rem 0 0;
	color: #fff;
}
.track-session{
	display: inline-block;
	padding: 0 1.5rem 0 0;
}
.track-speaker{
	font-size: 1.1rem;
	color: #525252;
}
.agenda-track-last{
	background-color: var(--green);
	color: #fff;
}
.agenda-track-last .track-speaker{
	color: #fff;
}
.track-a ul li,
.track-b ul li{
	display: flex;
	flex-wrap: wrap;
}
.track-a .track-time,
.track-b .track-time{
	width: 100%;
}
.track-keynote h4{
	background-color: var(--orange);
}
.agenda-track img{
	width: unset;
    position: absolute;
    transform: translate(0, -50%);
    top: 50%;
    right: 1.5rem;
}
.agenda-track h4 {
	cursor: pointer;
	position: relative;
}
.agenda-track h4.scale_active .arrow {
	transform: scaleY(-1);
    top: 40%;
}
.track-keynote .track-time{
	color: var(--orange);
}
.track-a h4{
	background-color: var(--blue);
}
.track-a .track-time{
	color: var(--blue);
}
.track-a ul li{
	border-bottom: 1px solid var(--blue);
	background-color: var(--light-blue10);
}
.track-b h4{
	background-color: var(--purple);
}
.track-b .track-time{
	color: var(--purple);
}
.track-b ul li{
	border-bottom: 1px solid var(--purple);
	background-color: var(--light-purple10);
}
br[class="off"]{
	display: none;
}
@media only screen and (max-width:600px){

	br[class="off"]{
		display: block;
	}
	.track-session {
		width: 100%;
	}
}









/* Q&A 영역 */
.mobile-qna-tit{
	padding: 4.6rem 0;
}
.mobile-qna-tit h3,
.mobile-write-tit h3{
	font-size: 1.8rem;
	font-weight: 500;
}
.mobile-qna-tit p{
	font-size: 1.1rem;
}
.mobile-qna-menu ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.mobile-qna-menu ul li{
	cursor: pointer;
}
.qna-track-a,
.qna-track-b{
	width: 48.5%;
    border-radius: 1.5rem;
    padding: 0.95rem 0;
    font-size: 2.1rem;
    font-weight: 500;
    text-align: center;
    background-color: var(--blue);
    color: #fff;
}
.qna-track-b{
	background-color: var(--purple);
}
.mobile-qna-menu .qna-menu-off{
	background-color: #d7d7d7;
}
.mobile-qna-list{
	padding: 2.3rem 0 4.6rem;
}
.mobile-qna-list ul li{
	padding: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	position: relative;
}
.track-b-list{
	display: none;
}
.track-a-list ul li{
	border-bottom: 1px solid var(--blue);
}
.track-b-list ul li{
	border-bottom: 1px solid var(--purple);
}
.mobile-qna-list .qna-time{
	font-size: 1.1rem;
}
.track-a-list .qna-time{
	color: var(--blue);
}
.track-b-list .qna-time{
	color: var(--purple);
}
.mobile-qna-list .qna-session{
	font-size: 1.4rem;
	font-weight: 600;
}
.mobile-qna-list .qna-speaker{
	font-size: 1.1rem;
	color: #525252;
	display: block;
}
.qna-list-btn {
    width: 30%;
    min-width: 9rem;
    height: 3.7rem;
    border-radius: 2rem;
    font-size: 1.5rem;
    text-align: center;
    background-color: var(--orange);
    display: grid;
    align-items: center;
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: 1.5rem;
}
.qna-list-btn a{
	color: #fff;
}
.qna-list-btn img{
	width: unset;
	margin: 0 0 0 0.8rem;
}
.qna-list-btn.btn-off{
	background-color: #111;
}
.qna-list-btn.btn-off a{
	color: #bfbfbf;
}
.mobile-qna-list-wrapper{
	width: 67%;
}
@media only screen and (max-width:600px){

	.mobile-qna-list ul li {
		padding: 1.5rem 0;
	}
	.qna-list-btn {
		right: 0;
		font-size: 1.2rem;
	}
	.qna-list-btn img{
		width: 10%;
	}
}








.mobile-write-tit{
	padding: 4.6rem 0 2.3rem;
}
.write-track-a,
.write-track-b{
    max-width: 15.4rem;
    width: 40%;
    height: 3.7rem;
    margin: 1rem 0 0;
    border-radius: 2rem;
    background-color: var(--blue);
    display: inline-block;
	font-size: 1.5rem;
    color: #fff;
    text-align: center;
    line-height: 2.3;
}
.write-track-b{
    background-color: var(--purple);
}
.track-off{
	display: none;
}
.mobile-write-wrapper {
    padding: 1rem 1.5rem;
    border: 2px solid var(--orange);
}
.write-time{
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--orange);
}
.write-session,
.write-speaker{
	display: block;
	font-size: 1.4rem;
}
.write-session{
	margin: 1rem 0 0;
	font-weight: 700;
}
.mobile-answer{
	width: 100%;
    height: 13.8rem;
    margin: 2.3rem 0 1rem;
    border: 2px solid #d7d7d7;
    padding: 1rem 1.5rem;
    box-sizing: border-box;
	overflow-y: scroll;
}
#qna-write{
	width: 100%;
    height: 9.2rem;
    border: 2px solid #d7d7d7;
	box-sizing: border-box;
    text-align: center;
    font-size: 1.1rem;
}
#qna-write::placeholder {
    color: #000;
	font-weight: 500;
}
.write-btn,
.login-btn{
    width: 15.4rem;
    height: 3.7rem;
    margin: 2.3rem auto 4.6rem;
    border-radius: 2rem;
    background-color: var(--orange);
    text-align: center;
    display: grid;
    align-items: center;
	cursor: pointer;
}
.write-btn button,
.login-btn button {
    background-color: unset;
    border: unset;
    font-size: 1.5rem;
    color: #fff;
	cursor: pointer;
}
.write-btn img,
.login-btn img{
	width: unset;
	margin: 0 0 0 1rem;
}










/* 관리자 영역 */
/* 로그인 */
.mobile-login-wrapper{
    max-width: 630px;
	width: 100%;
	margin: 9.2rem auto;
    border: 1px solid #D7D7E2;
    padding: 3rem 3.8rem;
    box-sizing: border-box;
    background-color: #fbfbfb;
}
.mobile-login-tit h3{
    font-size: 2rem;
    font-weight: 500;
	text-align: center;
}
.mobile-login-input{
	margin: 2.3rem 0 0;
}
.mobile-login-input label{
	display: block;
}
.mobile-login-input input{
    width: 100%;
    margin: 0.8rem 0 2rem;
	padding: 1rem;
    box-sizing: border-box;
}
.login-btn{
    margin: 0.5rem auto 0.8rem;
}
@media only screen and (max-width:600px){

	.mobile-login-wrapper{
		padding: 7%;
	}
}











.mobile-inbox-tit{
	margin: 2.3rem 0 0;
}
.mobile-inbox-tit h4{
	width: fit-content;
	padding: 0 0 0 1.5rem;
	font-size: 1.4rem;
	cursor: pointer;
}
.mobile-inbox-tit a{
	color: #000;
}
.mobile-inbox-list{
	border-top: 2px solid #bdbdbd;
	padding: 1.5rem 1.5rem 4.6rem;
}
.mobile-inbox-list ul{
	display: grid;
	gap: 2.3rem;
}
.mobile-inbox-list ul li a{
	display: flex;
    flex-wrap: wrap;
	color: #000;
}
.mobile-inbox-list figure{
    margin: 0 1rem 0 0;
	width: fit-content;
    display: grid;
    align-items: center;
}
.mobile-inbox-list img{
	width: unset;
}
.inbox-list-flex{
	display: flex;
	flex-wrap: wrap;
}
.send-tit{
	font-size: 1.4rem;
}
.send-time{
	font-size: 1.1rem;
	color: #bdbdbd;
}
.inbox-btn{
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
}
.inbox-btn button {
    width: 15.7rem;
    height: 3.7rem;
    border: unset;
    border-radius: 2rem;
    background-color: var(--orange);
    font-size: 1.5rem;
    color: #fff;
    text-align: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    cursor: pointer;
}
.inbox-btn button:last-child{
    width: 17.7rem;
}









/* 푸터 영역 */
#mobile-wrap footer .container{
	padding: 0 3rem;
}
#mobile-wrap footer .wrapper{
	padding: 0;
}