@charset "utf-8";

.admin_login {position: fixed; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; padding-left: 1rem; background: var(--blue); height: 2.8rem; color: #fff; font-size: .9rem; box-sizing: border-box; z-index: 91; }
.admin_login .logout {height: 100%; padding: 0 1rem; background: var(--yellow); display: flex; align-items: center; justify-content: center; color: #333; font-weight: 600; }

#wrap:has(.admin_login) { padding-top: 2.8rem; }
#wrap:has(.admin_login) header { top: 2.8rem; }

header .navBox .dep { gap: 0; }

.main .visual { background: #488FC7; }
.fade-in-image { opacity: 0; transition: opacity 0.5s ease-in-out; }

.sub .festival_overview .box .posterBox { border-radius: 32px; overflow: hidden; }
.sub .poster .board_list li .textBox .nameBox > * { font-weight: 500; }

.board_view .textWrap .edit_view span,
.board_view .textWrap .edit_view strong,
.board_view .textWrap .edit_view a { display: inline !important; }
.board_view .textWrap .edit_view p + p { margin-top: 0.3rem; }

.modalCon .boxWrap { border-radius: 1.7rem; }

p[style*="font-family:'맑은 고딕'"],
span[style*="font-family:'맑은 고딕'"] { font-family: 'Pretendard', sans-serif !important; }
p[style*="font-size:12pt"],
span[style*="font-size:12pt"] { font-size: unset !important; }

.sub .invitation_letter .box.soda { gap: 2rem 2rem; }
.sub .invitation_letter .box.soda .titleBox { width: calc(50% - 1rem); gap: 2rem; }
.sub .invitation_letter .box.soda .textBox { width: calc(50% - 1rem); gap: 2rem; }
.sub .invitation_letter .box.soda figure { border-radius: 1rem; overflow: hidden; }

.sub .listType1 {display: flex; flex-wrap: wrap; gap: 2.2rem;}
.sub .listType1 > li {width: calc(50% - 1.1rem); display: flex; align-items: flex-start; gap: 3.5%;}
.sub .listType1 > li .imgBox {border-radius: .9rem; overflow: hidden; box-shadow: 0 2px 8px #00000016;}
.sub .listType1 > li .textBox {max-width: 240px; width: 45%; flex: none;}
.sub .listType1 > li .title {font-size: 1.2rem; font-weight: 600; word-break: keep-all;}
.sub .listType1 > li .textList {display: flex; flex-direction: column; gap: .6rem; font-size: .9rem; margin-top: 1rem;}
.sub .listType1 > li .textList li {display: flex; gap: .3rem;}
.sub .listType1 > li .textList .tt1 {color: #666666; font-weight: 600; width: 2em; flex: none;}
.sub .listType1 > li .textList .tt2 {color: #999999;}
.sub .listType1 > li .text {font-size: .9rem; color: #999999; margin-top: 1rem; word-break: keep-all;}

.sub .listType1 > li.large { width: 100%; gap: 2%; }
.sub .listType1 > li.large .textBox { max-width: unset; width: 50%; }
.sub .listType1 > li.large .title { font-size: 2rem; }
.sub .listType1 > li.large .textList { font-size: 1.3rem; }
.sub .listType1 > li.large .text { font-size: 1.1rem; line-height: 1.5; }
.sub .listType1 > li.large .text img { max-width: 100%; }

@media screen and (max-width: 1024px) {
    
	.sub .invitation_letter .box.soda > *:not(.imgBox) { width: 100%; }
	
	.sub .listType1 > li {flex-direction: column; gap: 2rem;}
	.sub .listType1 > li .imgBox {width: 100%;}
	.sub .listType1 > li .imgBox img {width: 100%;}
	.sub .listType1 > li .textBox {width: 100%; max-width: none;}
	
	.sub .listType1 > li.large { gap: 2rem; }
	.sub .listType1 > li.large .textBox { width: 100%; }
	.sub .listType1 > li.large .title { font-size: 1.2rem; }
	.sub .listType1 > li.large .textList { font-size: .9rem; }
	.sub .listType1 > li.large .text { font-size: .9rem; line-height: unset; }
	
}

@media screen and (max-width: 768px) {
	
	.sub .listType1 {gap: 2rem 1.2rem;}
	.sub .listType1 > li {width: calc(50% - .6rem);}
	
}

@media screen and (max-width: 480px) {
	
	.sub .listType1 {gap: 3rem;}
	.sub .listType1 > li {width: 100%; gap: 1.5rem;}
	.sub .listType1 > li .title br, .sub .listType1 > li .text br {display: none;}

}