*{ box-sizing: border-box; }
figure{ display: inline-block; margin: 0; }
select::-ms-expand { display: none; }
select { 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none;
	outline: none;
}
input{ outline: none; border: none; }
input[type="submit"],input[type="button"], input[type="file"],
input[type="text"], button { appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0;-webkit-border-radius: 0; -moz-border-radius: 0; }
input[type="checkbox"]{ padding: 0 !important; }


/* popup */
#popup{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: fixed; top: 0; left: 0; z-index: 1000; display: none; }
#popup .blank{ width: 100%; height: 100%; }
#popup .inner{ max-width: 90%; position: absolute; background: #FFF; border-radius: 10px; top: 50%; left: 50%; z-index: 100; transform: translate(-50%, -50%); }

/* popup - delete(게시글 삭제) */
#popup.delete .inner{ width: 810px; text-align: center; }
#popup.delete dl > *{ padding: 30px; }
#popup.delete dl dt{ font-size: 18px; font-weight: 500; color: #999; border-bottom: 1px solid #DDD; }
#popup.delete dl dd{ padding-block: 60px; }
#popup.delete dl dd p{ font-size: 30px; font-weight: 600; color: #000; margin-bottom: 60px; }
#popup.delete .btn{ display: flex; justify-content: center; }
#popup.delete .btn > *{ width: 120px; height: 55px; display: flex; justify-content: center; align-items: center; background: #111; border: none; border-radius: 5px; font-family: var(--baseFont); font-size: 20px; font-weight: 400; color: #FFF; }
#popup.delete .btn > *:not(:last-child){ margin-right: 15px; }
#popup.delete .btn > *.gray{ background: #EEE; font-weight: 500; color: #999; }

@media screen and (max-width: 1800px){
	#popup.delete dl dd{ padding-block: 40px; }
	#popup.delete dl dd p{ font-size: 26px; margin-bottom: 50px; }
	#popup.delete .btn > *{ width: 100px; height: 50px; font-size: 18px; }
}

@media screen and (max-width: 1280px){
	#popup.delete dl > *{ padding: 20px; }
	#popup.delete dl dt{ font-size: 17px; }
	#popup.delete dl dd{ padding-block: 30px; }
	#popup.delete dl dd p{ font-size: 22px; margin-bottom: 30px; }
	#popup.delete .btn > *{ width: 85px; height: 45px; font-size: 17px; }
}

@media screen and (max-width: 900px){
	#popup.delete dl dd p{ font-size: 20px; }
}


/* paging */
.paging{
	--size: 30px;
}
.paging{ display: flex; justify-content: center; align-items: center; margin-top: 120px; }
.paging > *{ display: flex; justify-content: center; align-items: center; }
.paging a{ width: var(--size); height: var(--size); display: flex; justify-content: center; align-items: center; background: none; border: none; font-size: 18px; font-weight: 600; color: #BBB; }
.paging i{ transform: unset !important; }
.paging i::before{ content: ""; width: 9px; height: var(--size); display: inline-block; }
.paging i.xi-angle-left-min::before{ background: url("/img/board/paging_prev.svg") no-repeat center center / contain; }
.paging i.xi-angle-right-min::before{ background: url("/img/board/paging_next.svg") no-repeat center center / contain; }
.paging a i:not(:last-of-type){ margin-right: -2px; }

.paging .arr a:not(:last-of-type){ margin-right: 15px; }

.paging ul{ margin: 0 25px; }
.paging ul li:not(:last-of-type){ margin-right: 5px; }
.paging ul li.on a{ background: none; color: var(--mainColor); }

@media screen and (max-width: 1800px){
	.paging{ margin-top: 80px; }
	.paging a{ font-size: 17px; }
	.paging .arr a:not(:last-of-type){ margin-right: 10px; }
	.paging ul{ margin: 0 15px; }
}

@media screen and (max-width: 1280px){
	.paging{
		--size: 26px;
	}
	.paging{ margin-top: 40px; }
	.paging a{ font-size: 16px; }
	.paging i::before{ width: 7px; }

	.paging .arr a:not(:last-of-type){ margin-right: 0; }
	.paging ul{ margin: 0 5px; }
}


/* 검색창 */
.search-box{
	--height: 45px;
	--select: 112px;
	--input: 320px;
	--button: 125px;
	--padding: 20px;
}
.search-box.mb{ margin-bottom: 80px; }

.search-box *{ font-family: var(--baseFont); font-size: 17px; font-weight: 500; color: #353535; }
.search-box .flex-box{ display: flex; flex-wrap: wrap; justify-content: flex-end; }
.search-box .flex-box > *{ height: var(--height); }
.search-box .flex-box > *:not(:last-child){ margin-right: 20px; }

.search-box select, 
.search-box button{ border-radius: 5px; -webkit-border-radius: 5px; }
.search-box select{ width: var(--select); background: url("/img/board/search_arrow.svg") no-repeat center right var(--padding) / auto; border: 1px solid #151515; padding: 0 var(--padding); padding-right: calc(var(--padding) + 24px); cursor: pointer; }
.search-box input{ width: var(--input); background: none; border: none; border-bottom: 1px solid #151515; letter-spacing: 1; }
.search-box input::placeholder{ font-weight: 400; color: #DDD; }
.search-box button{ width: var(--button); display: flex; justify-content: center; align-items: center; background: #151515; border: none; color: #FFF; margin-right: 0 !important; }
.search-box button i{ content: ""; display: inline-block; width: 20px; height: 20px; background: url("/img/board/search_icon.svg") no-repeat center center / contain; margin-left: 10px; transform: translateY(-1px); }

.search-box button.write{ width: 190px; background: var(--mainColor); margin-left: 20px; }
.search-box button.write i{ background-image: url("/img/board/write_icon.svg"); margin: 0 10px 0 0; }

@media screen and (max-width: 1800px){
	.search-box{
		--input: 300px;
		--button: 100px;
	}
	.search-box.mb{ margin-bottom: 50px; }

	.search-box button.write{ width: 170px; }
}

@media screen and (max-width: 1280px){
	.search-box{
		--height: 40px;
		--select: 100px;
		--input: 250px;
		--padding: 15px;
	}
	.search-box.mb{ margin-bottom: 30px; }

	.search-box button.write{ width: 150px; }
}

@media screen and (max-width: 750px){
	.search-box input{ flex: 1 0 auto; }

	.search-box button.write{ width: 100%; margin: 10px 0 0; }
}

@media screen and (max-width: 600px){
	.search-box{
		--height: 50px;
	}
	.search-box select{ width: 100%; margin-right: 0 !important; margin-bottom: 10px; }
	.search-box input{ width: calc(100% - var(--button) - 20px); }
}


/* 기본 게시판 */
.board-box{
	--thBg: #151515;
	--border: 1px solid #DDD;
}
.board-box{ text-align: center; }
.board-box col.s{ width: 120px; }
.board-box col.m{ width: 150px; }
.board-box col.l{ width: 210px; }

.board-box tr{ clip-path: inset(0 1px 0 1px round 5px); -webkit-clip-path: inset(0 1px 0 1px round 5px); cursor: pointer; }
.board-box th, 
.board-box td{ padding: 37px 10px; }
.board-box th{ background: var(--thBg); font-size: 20px; font-weight: 400; color: #FFF; }
.board-box td{ font-size: 18px; font-weight: 400; color: #666; }
.board-box td span{ color: #222; }
.board-box td a{ display: block; font-weight: 500; color: #222; line-height: 1.3; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 0 30px; } 

.board-box tbody tr{ border-bottom: var(--border); }

.board-box .notice{ background: #F8F8F8; }
.board-box .notice i{ display: inline-block; width: 16px; height: 21px; background: url("/img/board/notice_icon.svg") no-repeat center center / contain; }

@media screen and (max-width: 1800px){
	.board-box th, 
	.board-box td{ padding: 30px 10px; }
	.board-box th{ font-size: 19px; }
	.board-box td a{ padding: 0 20px; }
}

@media screen and (max-width: 1500px){
	.board-box col.s{ width: 100px; }
	.board-box col.m{ width: 120px; }
	.board-box col.l{ width: 180px; }
}

@media screen and (max-width: 1280px){
	.board-box th, 
	.board-box td{ padding: 20px 10px; }
	.board-box th{ font-size: 18px; }
	.board-box td{ font-size: 17px; }
	.board-box td a{ padding: 0 10px; }
}

@media screen and (max-width: 1000px){
	.board-box colgroup,
	.board-box thead{ display: none; }
	.board-box tr{ width: 100%; display: flex; flex-wrap: wrap; align-items: center; }
	.board-box tr:first-of-type{ border-top: var(--border); }
	.board-box td a{ padding: 0; }

	.board-box tr{ padding: 8px 0; }
	.board-box tr td{ padding: 7px 15px; padding-right: 0; }
	.board-box tr td:nth-of-type(1){ display: none; padding-bottom: 0; }
	.board-box tr td:nth-of-type(2){ width: 100%; padding-bottom: 0; padding-right: 15px; }

	.board-box .notice td:nth-of-type(1){ display: block; }
	.board-box .notice td:nth-of-type(2){ width: calc(100% - 30px); padding-left: 12px; }
	.board-box .notice i{ width: 12px; height: 14px; }
}


/* 이미지 게시판 (세로형) */
.img_board_list{ 
	--gapB: 80px; 
	--gapR: 30px; 
	--line: 4;
}

.img_board_list{ display: flex; flex-wrap: wrap; margin-bottom: calc(var(--gapB) * -1); }
.img_board_list .item{ width: calc((100% - calc(var(--gapR) * (var(--line) - 1))) / var(--line)); margin-right: var(--gapR); margin-bottom: var(--gapB); }
.img_board_list .item:nth-of-type(4n){ margin-right: 0; }
.img_board_list figure{ display: block; position: relative; padding-bottom: 57%; border-radius: 5px; overflow: hidden; }
.img_board_list figure img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); transition: transform 0.4s; }
.img_board_list .txt{ margin-top: 20px; }
.img_board_list .txt span{ display: block; font-size: 18px; font-weight: 500; color: #BBB; margin-bottom: 20px; }
.img_board_list .txt h6{ display: -webkit-box; font-size: 22px; font-weight: 600; color: #151515; line-height: 1.6; word-break: break-word; white-space: normal; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.img_board_list .txt p{ height: 3.2em; display: -webkit-box; font-size: 17px; font-weight: 300; color: #555; line-height: 1.6; word-break: break-word; white-space: normal; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-top: 15px; }


/* 비디오 게시판 */
#video .flex-title{ margin-bottom: 60px; }
#video .img_board_list.video{ border-top: 1px solid #EEE; padding-top: 135px; }

.img_board_list.video{ 
	--gapB: 120px; 
	--gapR: 40px; 
	--line: 3;
}
.img_board_list.video .item{ margin-right: var(--gapR); }
.img_board_list.video .item:nth-of-type(3n){ margin-right: 0; }
.img_board_list.video .txt h6{ height: 3.2em; -webkit-line-clamp: 2; }

@media screen and (hover: hover){
	.img_board_list .item:hover figure img{ transform: translate(-50%, -50%) scale(1.05); }
}

@media screen and (max-width: 1800px){
	.img_board_list{ 
		--gapB: 70px;
	}

	.img_board_list .txt span{ font-size: 17px; }
	.img_board_list .txt h6{ font-size: 20px; }

	/* 비디오 게시판 */
	#video .flex-title{ margin-bottom: 40px; }
	#video .img_board_list.video{ padding-top: 80px; }

	.img_board_list.video{ 
		--gapB: 90px; 
	}
}

@media screen and (max-width: 1280px){
	.img_board_list{ 
		--gapB: 60px;
		--line: 3;
	}
	.img_board_list .item:nth-of-type(4n){ margin-right: var(--gapR); }
	.img_board_list .item:nth-of-type(3n){ margin-right: 0; }
	.img_board_list .txt span{ font-size: 16px; margin-bottom: 10px; }
	.img_board_list .txt h6{ font-size: 18px; }
	.img_board_list .txt p{ font-size: 16px; margin-top: 5px; }

	/* 비디오 게시판 */
	#video .flex-title{ margin-bottom: 30px; }
	#video .img_board_list.video{ padding-top: 40px; }

	.img_board_list.video{ 
		--gapB: 60px;
		--gapR: 30px;
	}
}

@media screen and (max-width: 1100px){
	.img_board_list{ 
		--gapR: 20px;
	}

	.img_board_list .txt{ margin-top: 15px; }
	.img_board_list .txt span{ margin-bottom: 5px; }
	.img_board_list .txt h6{ font-size: 18px; }

	/* 비디오 게시판 */
	.img_board_list.video{ 
		--gapR: 20px;
	}
}

@media screen and (max-width: 900px){
	.img_board_list{ 
		--gapB: 45px;
		--gapR: 15px;
		--line: 2;
	}
	.img_board_list .item:nth-of-type(3n){ margin-right: var(--gapR); }
	.img_board_list .item:nth-of-type(2n){ margin-right: 0; }
	.img_board_list .txt span{ font-size: 15px; }
	.img_board_list .txt h6{ font-size: 17px; }
	.img_board_list .txt p{ margin-top: 0; }

	/* 비디오 게시판 */
	.img_board_list.video{ 
		--gapB: 45px;
		--gapR: 15px;
		--line: 2;
	}
	.img_board_list.video .item:nth-of-type(3n){ margin-right: var(--gapR); }
	.img_board_list.video .item:nth-of-type(2n){ margin-right: 0; }
}


/* 이미지 게시판 (세로형) */
.img_board_list.horizontal{
	--img: 400px;
	--border: 1px solid #DDD;
}

.img_board_list.horizontal{ display: block; border-top: 1px solid #151515; margin-bottom: 0; }
.img_board_list.horizontal .item{ width: 100%; border-bottom: var(--border); margin: 0; }
.img_board_list.horizontal a{ display: flex; padding: 40px 60px; }
.img_board_list.horizontal .img{ width: var(--img); }
.img_board_list.horizontal figure{ padding-bottom: 60%; }
.img_board_list.horizontal .txt{ width: calc(100% - var(--img)); display: flex; flex-direction: column; margin: 0; padding-left: 60px; }
.img_board_list.horizontal .txt h6{ font-size: 24px; }
.img_board_list.horizontal .txt p{ font-size: 18px; margin: 30px 0; }
.img_board_list.horizontal .txt span{ flex: 1 0 auto; display: flex; align-items: flex-end; font-weight: 400; margin: 0; }

@media screen and (max-width: 1800px){
	.img_board_list.horizontal{
		--img: 350px;
	}
	.img_board_list.horizontal a{ padding: 30px 40px; }
	.img_board_list.horizontal .txt{ padding-left: 40px; }
	.img_board_list.horizontal .txt h6{ font-size: 22px; }
	.img_board_list.horizontal .txt p{ margin: 20px 0; }
}

@media screen and (max-width: 1280px){
	.img_board_list.horizontal{
		--img: 300px;
	}
	.img_board_list.horizontal a{ padding: 25px; }
	.img_board_list.horizontal .txt{ padding-left: 30px; }
	.img_board_list.horizontal .txt h6{ font-size: 20px; }
	.img_board_list.horizontal .txt p{ font-size: 17px; margin: 10px 0; }
}

@media screen and (max-width: 900px){
	.img_board_list.horizontal{
		--img: 250px;
	}
	.img_board_list.horizontal a{ padding: 20px 0; }
	.img_board_list.horizontal .txt h6{ font-size: 19px; }
	.img_board_list.horizontal .txt p{ margin: 5px 0; }
}

@media screen and (max-width: 650px){
	.img_board_list.horizontal a{ flex-direction: column; padding: 20px 10px; }
	.img_board_list.horizontal a > *{ width: 100% !important; }
	.img_board_list.horizontal .txt{ padding-left: 0; padding-top: 20px; }
}


/* 상세 페이지 (공통) */
.edit-content{ font-size: 18px; color: #353535; line-height: 1.7; }
.edit-content *{ line-height: inherit !important; }

#view{
	--border: 1px solid #DDD;
	--dt: 190px;
	--padding: 30px;
}

#view .tit{ border-top: 1px solid #111; border-bottom: var(--border); text-align: center; padding: 80px 0; overflow: hidden; }
#view .tit h6{ font-size: 38px; font-weight: 600; color: #151515; margin-bottom: 50px; }
#view .tit ul{ display: flex; justify-content: center; flex-wrap: wrap; margin: -5px -20px; }
#view .tit ul li{ font-size: 18px; font-weight: 400; color: #999; margin: 5px 20px; }
#view .tit ul li em{ display: inline-block; color: #151515; padding-right: 20px; position: relative; }
#view .tit ul li em::after{ content: ""; width: 1px; height: 10px; background: #DDD; position: absolute; top: calc(1.3em / 2); right: 9px; transform: translateY(-50%); }

#view .ptb{ padding: 55px 0; }

#view .file dl,
#view .page dl{ display: flex; align-items: baseline; font-size: 18px; }
#view .file dl dt,
#view .page dl dt{ width: var(--dt); font-weight: 500; color: #111; padding: 0 var(--padding); position: relative; }
#view .file dl dt::after,
#view .page dl dt::after{ content: ""; width: 1px; height: 35px; background: #DDD; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#view .file dl dd,
#view .page dl dd{ width: calc(100% - var(--dt)); padding: 0 var(--padding); }
#view .file a,
#view .page a{ display: block; font-weight: 300; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

#view .file{ border-top: var(--border); border-bottom: var(--border); padding: 10px 0; margin-bottom: 40px; }
#view .file a{ color: var(--mainColor); padding: 15px 0; padding-left: 30px !important; padding-right: 120px !important; position: relative; }
#view .file a::before{ content: ""; width: 16px; height: 16px; background: url("/img/board/view_file.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#view .file a span{ color: #999; padding-left: 25px; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#view .file a span::before{ content: ""; width: 16px; height: 16px; background: url("/img/board/view_download.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }

#view .page{ border-top: var(--border); }
#view .page dl{ border-bottom: var(--border); }
#view .page dt{ display: flex; align-items: center; line-height: 1; }
#view .page dt i{ display: inline; width: 16px; height: 16px; margin-right: 40px; }
#view .page dl:first-child dt i{ background: url("/img/board/view_prev.svg") no-repeat center center / contain; }
#view .page dl:last-child dt i{ background: url("/img/board/view_next.svg") no-repeat center center / contain; }
#view .page a{ padding: 25px 0; }

#view .list-btn{ display: flex; justify-content: center; margin-top: 120px; }
#view .list-btn > *:not(:last-child){ margin-right: 15px; }
#view .list-btn > *{ width: 200px; height: 70px; display: flex; justify-content: center; align-items: center; background: #111; border: none; border-radius: 5px; font-family: var(--baseFont); font-size: 20px; font-weight: 400; color: #FFF; text-align: center; transition: background 0.4s; }
#view .list-btn > *::before{ content: ""; display: inline-block; width: 20px; height: 20px; background: url("/img/board/list_icon.svg") no-repeat center center / contain; margin-right: 10px; }
#view .list-btn > *.red{ background: var(--mainColor); }
#view .list-btn > *.gray{ background: #EEE; font-weight: 500; color: #999; }

#view .list-btn > *.rewrite::before{ background-image: url("/img/board/rewrite_icon.svg"); }
#view .list-btn > *.delete::before{ background-image: url("/img/board/delete_icon.svg"); }

@media screen and (max-width: 1800px){
	#view{
		--dt: 160px;
		--padding: 25px;
	}

	#view .tit{ padding: 50px 0; }
	#view .tit h6{ font-size: 30px; margin-bottom: 40px; }
	#view .tit ul{ margin: -5px -15px; }
	#view .tit ul li{ font-size: 17px; margin: 5px 15px; }

	#view .file dl,
	#view .page dl{ font-size: 17px; }
	#view .file dl dt::after,
	#view .page dl dt::after{ height: 30px; }

	#view .file{ margin-bottom: 30px; }
		
	#view .page dt i{ width: 14px; height: 14px; margin-right: 30px; }

	#view .list-btn{ margin-top: 80px; }
	#view .list-btn > *{ width: 170px; height: 60px; font-size: 18px; }
}

@media screen and (max-width: 1280px){
	#view{
		--dt: 130px;
		--padding: 20px;
	}
	.edit-content{ font-size: 17px; }

	#view .tit{ padding: 30px 0; }
	#view .tit h6{ font-size: 26px; margin-bottom: 20px; }
	#view .tit ul{ margin: -5px -10px; }
	#view .tit ul li{ font-size: 16px; margin: 5px 10px; }

	#view .ptb{ padding: 40px 0; }

	#view .file dl,
	#view .page dl{ font-size: 16px; }
	#view .file dl dt::after,
	#view .page dl dt::after{ height: 20px; }

	#view .file{ padding: 5px 0; margin-bottom: 20px; }
	#view .file a{ padding: 10px 0; }

	#view .page dt i{ width: 12px; height: 12px; margin-right: 20px; }
	#view .page a{ padding: 20px 0; }

	#view .list-btn{ margin-top: 40px; }
	#view .list-btn > *{ width: 140px; height: 55px; font-size: 17px; }
	#view .list-btn > *::before{ width: 16px; height: 16px; transform: translateY(-1px); margin-right: 7px; }
}

@media screen and (max-width: 900px){
	#view .tit h6{ font-size: 23px; }
}


/* 일정 - 검색 필터 */
.schedule-filter{ 
	--height: 50px;
	--select: 165px;
	--dl: 440px;
	--padding: 20px;
}
.schedule-filter{ margin-bottom: 50px; }
.schedule-filter *{ font-family: var(--baseFont); font-size: 18px; }
.schedule-filter .flex-box{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.schedule-filter .flex-box > div{ display: flex; align-items: flex-start; }
.schedule-filter .left{ width: calc(100% - var(--dl)); padding-right: 30px; }
.schedule-filter .right{ width: var(--dl); }

.schedule-filter select{
	--padding: 40px;
}
.schedule-filter select{ width: var(--select); height: var(--height); background: #151515 url("/img/board/select_icon_white.svg") no-repeat center right var(--padding) / auto; border-radius: 5px; -webkit-border-radius: 5px; font-size: 22px; font-weight: 400; color: #FFF; padding: 0 var(--padding); padding-right: calc(var(--padding) + 20px); cursor: pointer; }

.schedule-filter ul{ width: calc(100% - var(--select)); display: flex; flex-wrap: wrap; margin: -5px 0; padding-left: 15px; }
.schedule-filter ul li{ font-weight: 500; color: #555; margin: 5px; }
.schedule-filter ul li input{ display: none; }
.schedule-filter ul li label{ width: 78px; height: var(--height); display: flex; justify-content: center; align-items: center; border: 1px solid #DDD; border-radius: 5px; -webkit-border-radius: 5px; cursor: pointer; }
.schedule-filter ul li input:checked + label{ background: #353535; border-color: #353535; font-weight: 400; color: #FFF; }

.schedule-filter dl{ width: 100%; display: flex; justify-content: flex-end; align-items: center; background: #F5F5F5; border: 1px solid #DDD; border-radius: 5px; }
.schedule-filter dl dt{ font-weight: 600; color: #151515; padding-right: 20px; }
.schedule-filter dl dd{ padding-left: 32px; position: relative; }
.schedule-filter dl dd::before{ content: ""; width: 22px; height: 22px; background: url("/img/board/calendar_icon.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
.schedule-filter dl dd::after{ content: "~"; color: #999; position: absolute; top: 50%; right: 0; transform: translate(-75%, -50%); }
.schedule-filter dl dd:last-of-type::after{ display: none; }
.schedule-filter dl dd input{ width: 120px; height: var(--height); background: none; border: none; outline: none; }
.schedule-filter dl dd input::placeholder{ color: #999; }

@media screen and (max-width: 1800px){
	.schedule-filter{ 
		--height: 45px;
		--select: 140px;
		--dl: 440px;
	}

	.schedule-filter select{
		--padding: 30px;
	}
	.schedule-filter select{ font-size: 20px; }
	.schedule-filter ul li label{ width: 70px; }
}

@media screen and (max-width: 1280px){
	.schedule-filter{ 
		--height: 40px;
		--select: 120px;
		--dl: 420px;
		--padding: 15px;
	}
	
	.schedule-filter *{ font-size: 17px; }

	.schedule-filter select{
		--padding: 20px;
	}
	.schedule-filter select{ font-size: 18px; }

	.schedule-filter dl dd input{ width: 110px; }
}

@media screen and (max-width: 1200px){
	.schedule-filter *{ font-size: 16px; }
	.schedule-filter .flex-box{ flex-direction: column-reverse; }
	.schedule-filter .left{ width: 100%; padding-right: 0; margin-top: 10px; }
	.schedule-filter .right{ width: 100%; }

	.schedule-filter select{ font-size: 17px; }
	.schedule-filter ul{  padding-left: 5px; }
	.schedule-filter ul li label{ width: 60px; }

	.schedule-filter dl{ justify-content: center; }

	.flex-title + .schedule-filter{ margin-top: -15px; }
}

@media screen and (max-width: 600px){
	.schedule-filter{ 
		--height: 50px;	
	}
	.schedule-filter .left{ flex-direction: column; }
	.schedule-filter select{ width: 100%; margin-bottom: 10px; }
	.schedule-filter ul{ width: calc(100% + 10px); display: grid; grid-template-columns: repeat(5, 1fr); padding-left: 0; margin: -5px; }
	.schedule-filter ul li label{ width: 100%; height: auto; padding: 10px; }
}


/* 예매 게시판 */
.reserve-board{ 
	--img: 500px;
	--btnW: 140px;
	--btnH: 55px;
	--start: calc(50% - 10px);
	--end: calc(50% + 10px);
}
.reserve-board .item:first-of-type{ border-top: 1px solid #DDD; }
.reserve-board .item{ display: flex; border-bottom: 1px solid #DDD; padding: 80px 0; }

.reserve-board .item .img{ width: var(--img); }
.reserve-board .item .img a{ position: relative; }
.reserve-board .item .img i{ width: 150px; height: 150px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: opacity 0.4s; }
.reserve-board .item .img i::before{ content: ""; display: block; height: 100%; background: url("/img/board/viewmore.svg") no-repeat center center / contain; position: relative; z-index: 10; animation: rotate360 8s linear infinite; }
.reserve-board .item .img i::after{ content: ""; width: 44px; height: 22px; background: url("/img/board/viewmore_arrow.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); animation: viewmore 1.5s infinite; will-change: left; }
.reserve-board .item figure{ display: block; position: relative; padding-bottom: 66%; overflow: hidden; border-radius: 10px; }
.reserve-board .item figure::after{ content: ""; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent, var(--mainColor)); position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.4s; }
.reserve-board .item figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); transition: transform 0.4s; }

.reserve-board .item .text{ width: calc(100% - var(--img)); display: flex; flex-direction: column; padding-left: 120px; }
.reserve-board .item .text h6{ font-size: 32px; font-weight: 600; color: #151515; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-bottom: 50px; }
.reserve-board .item .info{ flex: 1 0 auto; position: relative; padding-right: calc((var(--btnW) * 2) + 20px); }

.reserve-board .item .dl dl:not(:last-of-type){ margin-bottom: 13px; }
.reserve-board .item .dl dl{ display: flex; font-size: 18px; }
.reserve-board .item .dl dl dt{ width: 140px; font-weight: 600; color: #222; }
.reserve-board .item .dl dl dd{ width: calc(100% - 140px); font-weight: 300; color: #555; }
.reserve-board .item .dl dl dd a{ display: inline-block; background: transparent; border: 1px solid #555; border-radius: 3px; font-size: 14px; font-weight: 500; color: #555; line-height: 1; vertical-align: middle; padding: 5px 10px; margin-left: 15px; transform: translateY(-1px); transition: background 0.3s, border-color 0.3s, color 0.3s; }

.reserve-board .item .btn{ width: calc((var(--btnW) * 2) + 20px); display: flex; flex-wrap: wrap; justify-content: flex-end; position: absolute; bottom: 0; right: 0; }
.reserve-board .item .btn > *{ width: var(--btnW); height: var(--btnH); display: flex; justify-content: center; align-items: center; background: #F5F5F5; border: 1px solid #DDD; border-radius: 5px; font-family: var(--baseFont); font-size: 19px; font-weight: 600; color: #555; text-align: center; margin-left: 10px; }
.reserve-board .item .btn .red{ background: var(--mainColor); border: 1px solid var(--mainColor); font-weight: 500; color: #FFF; }
.reserve-board .item .btn .gray{ background: #EEE; border: none; color: #999; }
.reserve-board .item .btn .border{ background: transparent; color: #999; }

@media screen and (hover: hover){
	.reserve-board .item:hover figure::after{ opacity: 1; }
	.reserve-board .item:hover figure img{ transform: translate(-50%, -50%) scale(1.05); }
	.reserve-board .item:hover i{ opacity: 1; }

	.reserve-board .item .dl dl dd a:hover{ background: var(--mainColor); border-color: var(--mainColor); color: #FFF; }
}

@media screen and (max-width: 1800px){
	.reserve-board{ 
		--img: 450px;
		--btnW: 120px;
		--btnH: 50px;
	}

	.reserve-board .item{ padding: 60px 0; }

	.reserve-board .item .text{ padding-left: 80px; }
	.reserve-board .item .text h6{ font-size: 28px; margin-bottom: 30px; }
	.reserve-board .item .dl dl{ font-size: 17px; }
	.reserve-board .item .dl dl dt{ width: 100px; }
	.reserve-board .item .dl dl dd{ width: calc(100% - 100px); }

	.reserve-board .item .btn > *{ font-size: 17px; }
}

@media screen and (max-width: 1280px){
	.reserve-board{ 
		--img: 400px;
		--btnW: 100px;
		--btnH: 40px;
	}

	.reserve-board .item{ padding: 30px 0; }
	.reserve-board .item .img i{ width: 120px; height: 120px; }
	.reserve-board .item .img i::after{ width: 33px; height: 22px; }

	.reserve-board .item .text{ padding-left: 50px; }
	.reserve-board .item .text h6{ font-size: 24px; margin-bottom: 20px; }
	.reserve-board .item .dl dl:not(:last-of-type){ margin-bottom: 10px; }
	.reserve-board .item .dl dl dt{ width: 100px; }
	.reserve-board .item .dl dl dd{ width: calc(100% - 100px); }

	.reserve-board .item .btn > *{ font-size: 16px; }
}

@media screen and (max-width: 1200px){
	.reserve-board{ 
		--img: 300px;	
	}
	.reserve-board .item .info{ padding-right: 0 !important; }
	.reserve-board .item .btn{ position: relative; margin-top: 20px; margin-left: auto; }
	.reserve-board .item .btn > *:first-child{ margin-left: 0; }
}

@media screen and (max-width: 900px){
	.reserve-board .item .text h6{ font-size: 22px; }
}

@media screen and (max-width: 750px){
	.reserve-board .item{ flex-direction: column; }
	.reserve-board .item .img{ width: 100%; }
	.reserve-board .item .text{ width: 100%; padding-left: 0; padding-top: 25px; }
}


/* 예매 상세 */
#view .reserve-board{ margin-bottom: 60px; }
#view .reserve-board .item{ padding: 60px 0; }
#view .reserve-board .item figure::after{ display: none; }
#view .reserve-board .item figure img{ transform: translate(-50%, -50%) scale(1) !important; }
#view .reserve-board .item .text h6{ white-space: normal; text-overflow: unset; overflow: unset; }
#view .reserve-board .item .info{ padding-right: calc(var(--btnW) + 10px); }
#view .reserve-board .item .btn{ width: calc(var(--btnW) + 10px); }

#view .view-menu{ margin-bottom: 60px; }
#view .view-menu ul{ display: flex; flex-wrap: wrap; margin: -5px; }
#view .view-menu ul li{ border-radius: 5px; font-size: 20px; font-weight: 500; color: #555; line-height: 1; padding: 13px 30px; margin: 5px; cursor: pointer; }
#view .view-menu ul li.on{ background: #151515; color: #FFF; }

#view .tab-content .tab:not(:first-of-type){ display: none; }


@media screen and (max-width: 1800px){
	#view .view-menu ul li{ font-size: 18px; padding: 11px 20px; }
}

@media screen and (max-width: 1280px){
	#view .reserve-board{ margin-bottom: 40px; }
	#view .reserve-board .item{ padding: 30px 0 20px; }

	#view .view-menu{ margin-bottom: 40px; }
	#view .view-menu ul li{ font-size: 17px; padding: 9px 15px; }
}


/* 예매 확인 */
.check-filter{ 
	--height: 50px;
	--padding: 20px;
}
.check-filter{ border: 1px solid #DDD; border-radius: 5px; padding: 25px; overflow: hidden; }
.check-filter *{ font-size: 19px; font-weight: 500; color: #555; }
.check-filter .inner{ margin: -7px -22px; }
.check-filter .flex-box{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto; }
.check-filter .flex-box > *{ margin: 7px 22px; }
.check-filter dl{ display: flex; justify-content: center; align-items: center; }
.check-filter dl dt{ font-size: 22px; font-weight: 600; color: #353535; margin-right: 20px; }
.check-filter select,
.check-filter input{ height: var(--height); border: 1px solid #959595; border-radius: 5px; -webkit-border-radius: 5px; padding: 0 var(--padding); }
.check-filter select{ width: 130px; background: url("/img/board/check_arrow.svg") no-repeat center right var(--padding) / auto; padding-right: calc(var(--padding) * 2); }
.check-filter input{ width: 112px; }

.check-filter .checkbox ul{ display: flex; flex-wrap: wrap; margin-bottom: -10px; }
.check-filter .checkbox ul li{ margin-left: 10px; margin-bottom: 10px; }
.check-filter .checkbox input{ display: none; }
.check-filter .checkbox label{ height: var(--height); display: flex; justify-content: center; align-items: center; border: 1px solid #959595; border-radius: 5px; padding: 0 var(--padding); cursor: pointer; }
.check-filter .checkbox input:checked + label{ background: #353535; border-color: #353535; color: #FFF; }

.check-filter .flex{ display: flex; align-items: center; margin: -5px 0; }
.check-filter .flex > *{ margin: 5px 0; margin-left: 10px; }
.check-filter .flex .input{ display: flex; align-items: center; }
.check-filter .flex .input span{ display: inline-block; margin-left: 10px; }

.check-filter button{ width: 160px; height: var(--height); background: #151515; border-radius: 5px; -webkit-border-radius: 5px; font-size: 20px; font-weight: 600; color: #FFF; }
.check-filter button i{ display: inline-block; width: 20px; height: 20px; background: url("/img/board/search_icon.svg") no-repeat center center / contain; vertical-align: middle; margin-left: 10px; transform: translateY(-2px); }


#check .reserve-board .item{ border-top: none; }
#check .reserve-board .item figure::after{ display: none; }
#check .reserve-board .item img{ transform: translate(-50%, -50%) scale(1); }

@media screen and (max-width: 1800px){
	.check-filter{ padding: 20px; }
	.check-filter *{ font-size: 18px; }
	.check-filter dl dt{ font-size: 20px; }
	.check-filter button{ width: 140px; font-size: 19px; }
}

@media screen and (max-width: 1400px){
	.check-filter .inner{ margin: -7px 0; }
	.check-filter .flex-box{ max-width: 100%; width: max-content; flex-direction: column; align-items: center; }
	.check-filter .flex-box > *{ margin: 7px 0; }
	.check-filter button{ width: 100%; height: auto; padding: var(--padding); }
}

@media screen and (max-width: 1280px){
	.check-filter{ 
		--height: 45px;
		--padding: 15px;
	}
	.check-filter *{ font-size: 17px; }
	.check-filter .flex-box{ width: 100%; }
	.check-filter dl dt{ font-size: 18px; margin-right: 10px; }
	.check-filter button{ font-size: 18px; }
}

@media screen and (max-width: 650px){
	.check-filter .inner{ margin: -15px 0; }
	.check-filter .flex-box > *{ margin: 15px 0; }
	
	.check-filter dl, 
	.check-filter dl > *{ width: 100%; }
	.check-filter dl{ flex-direction: column; }
	.check-filter dl dt{ margin-bottom: 10px; }
	.check-filter .checkbox ul li:first-child,
	.check-filter .flex > *:first-child{ margin-left: 0; }

	.check-filter .checkbox ul li,
	.check-filter .input,
	.check-filter select,
	.check-filter input{ flex: 1 0 auto; }
	.check-filter select{ width: 100px; }
	.check-filter input{ width: 80px; }
}


/* table-form */
.table-form{
	--thBg: #151515;
	--thBorder: 1px solid rgba(255, 255, 255, 0.1);
	--border: 1px solid #CCC;
	--red: #CE0E19;
	--th: 270px;
	--height: 55px;
	--padding: 15px;
	--pt: 12px;
	--pr: 20px;
	--icon: 16px;
}
.table-form table{ clip-path: inset(0 0 0 0 round 5px 0 0 5px); -webkit-clip-path: inset(0 0 0 0 round 5px 0 0 5px) }
.table-form table *{ font-size: 17px; font-weight: 300; color: #111; }
.table-form colgroup col.th,
.table-form tbody th{ width: var(--th); }
.table-form tr > *:last-child{ border-right: none !important; }
.table-form th,
.table-form td{ padding: var(--pt) var(--pr); border-left: none !important; }
.table-form th{ background: var(--thBg); border: var(--thBorder); font-weight: 400; color: #FFF; }
.table-form th span{ color: var(--red); }
.table-form td{ border: var(--border); }
.table-form td span{ display: inline-block; }
.table-form td span.hyphen{ width: 8px; height: 1px; background: #000; }
.table-form .ptb{ padding-top: var(--pr); padding-bottom: var(--pr); }
.table-form .min{ min-height: var(--height); display: flex; flex-direction: column; justify-content: center; }
.table-form .flex{ display: flex; align-items: center; }
.table-form .flex > *:not(:last-child){ margin-right: 10px; }
.table-form .notes{ font-size: 17px; font-weight: 400; color: #333; text-align: right; margin-bottom: 25px; }
.table-form .notes span{ color: var(--red); }
.table-form .i{ font-size: 15px; font-weight: 400; color: var(--red); padding-left: 20px; position: relative; display: none; }
.table-form .i::before{ content: ""; width: 15px; height: 15px; background: url("/img/board/i_icon.svg") no-repeat center center / contain; border: 1px solid var(--red); border-radius: 50%; position: absolute; top: calc((1.3em / 2) - 1px); left: 0; transform: translateY(-50%); box-sizing: border-box; }
.table-form .small{ font-size: 15px; font-weight: 400; color: #999; margin-top: 15px; }

.table-form tr:first-child th{ border-top-color: var(--thBg); }
.table-form tr:last-child th{ border-bottom-color: var(--thBg); }

.table-form input,
.table-form select,
.table-form textarea{ width: 100%; background: #FFF; border: var(--border); border-radius: 5px; -webkit-border-radius: 5px; }
.table-form input,
.table-form select{ height: var(--height); padding: 0 var(--padding); }
.table-form input{ max-width: 610px; }
.table-form input::placeholder{ color: #888; }
.table-form select{ max-width: 425px; background: url("/img/board/select_arrow.svg") no-repeat center right var(--padding) / auto; padding-right: calc((var(--padding) * 2) + 10px); }
.table-form textarea{ resize: none; height: 335px; }
.table-form .button{ height: var(--height); background: var(--thBg); border: none; border-radius: 5px; color: #FFF; padding: 0 30px; }
 
.table-form .input-list ul{ display: flex; flex-wrap: wrap; margin: -5px -7px; }
.table-form .input-list ul li{ margin: 0 7px; }
.table-form .input-list input{ display: none; }
.table-form .input-list label{ display: block; font-size: 15px; font-weight: 400; color: #000; padding: 5px 0; padding-left: 25px; position: relative; cursor: pointer; }
.table-form .input-list label::before,
.table-form .input-list label::after{ content: ""; width: var(--icon); height: var(--icon); border-radius: 50%; position: absolute; top: calc((1.3em / 2) + 4px); left: 0; transform: translateY(-50%); box-sizing: border-box; }
.table-form .input-list label::before{ background: url("/img/board/check_icon.svg") no-repeat center center / contain; border: 1px solid #FFF; filter: invert(1); -webkit-filter: invert(1); }
.table-form .input-list label::after{ background: #353535 url("/img/board/check_icon.svg") no-repeat center center / contain; opacity: 0; }
.table-form .input-list input:checked + label::after{ opacity: 1; }

.table-form .id{ max-width: 610px; }
.table-form .id input{ width: calc(100% - 128px); }

.table-form .pw{ display: flex; flex-direction: column; }
.table-form .pw > *:not(:first-child){ margin-top: 15px; }

.table-form .birth{ max-width: 416px; }
.table-form .birth input{ width: calc(((100% - 56px) / 4) + 10px); }
.table-form .birth input:first-of-type{ width: calc(((100% - 56px) / 2) - 20px); }

.table-form .file > input{ max-width: calc(100% - 120px); width: 610px; }
.table-form .file .btn input{ display: none; }
.table-form .file .btn label{ width: 120px; height: var(--height); display: flex; justify-content: center; align-items: center; background: #151515; border-radius: 5px; -webkit-border-radius: 5px; color: #FFF; cursor: pointer; }

.table-form .captcha div{ display: flex; border-radius: 5px; overflow: hidden; }
.table-form .captcha figure{ height: var(--height); }
.table-form .captcha figure img{ height: 100% !important; }
.table-form .captcha button{ width: var(--height); height: var(--height); border: none; background: #DDD; }
.table-form .captcha input{ max-width: calc(100% - 202px); width: 610px; }

.table-form .agree{ display: flex; justify-content: center; margin-top: 55px; margin-bottom: -5px; }
.table-form .agree input{ display: none; }
.table-form .agree label{ font-size: 18px; font-weight: 500; color: #353535; padding: 5px; padding-left: 25px; position: relative; cursor: pointer; }
.table-form .agree label::before,
.table-form .agree label::after{ content: ""; width: var(--icon); height: var(--icon); border-radius: 50%; position: absolute; top: calc((1.3em / 2) + 5px); left: 0; transform: translateY(-50%); box-sizing: border-box; }
.table-form .agree label::before{ border: 1px solid #353535; }
.table-form .agree label::after{ background: #353535 url("/img/board/check_icon.svg") no-repeat center center / contain; opacity: 0; }
.table-form .agree input:checked + label::after{ opacity: 1; }

.table-form .policy{ margin-bottom: 70px; }
.table-form .policy > h5{ font-size: 30px; font-weight: 600; color: #111; margin-bottom: 35px; }
.table-form .policy .privacy *{ font-size: 17px; color: #333; }
.table-form .policy .scroll-bar{ height: 370px; background: #F8F8F8; border-radius: 10px; overflow-x: clip; overflow-y: auto; }
.table-form .policy .scroll-bar .padding{ padding: 35px 30px; padding-right: 65px; }
.table-form .policy .scroll-bar.os-theme-dark > .os-scrollbar-vertical,
.table-form .policy .scroll-bar.os-theme-light > .os-scrollbar-vertical{ height: auto; }
.table-form .policy .agree{ justify-content: flex-start; margin-top: 25px; }

.table-form .submit{ display: flex; justify-content: center; }
.table-form .submit > *{ width: 200px; height: 70px; display: flex; justify-content: center; align-items: center; background: var(--thBg); border: none; border-radius: 5px; font-size: 20px; font-weight: 500; color: #FFF; }
.table-form .submit > *:not(:last-child){ margin-right: 15px; }
.table-form .submit > *.border{ background: transparent; border: 1px solid #353535; font-weight: 500; color: var(--thBg); transition: background 0.3s, border-color 0.3s, color 0.3s; }
.table-form .submit > *.gray{ background: #EEE; font-weight: 500; color: #999; }

@media screen and (hover: hover){
	.table-form .submit > *.border:hover{ background: var(--thBg); border-color: var(--th); font-weight: 400; color: #FFF; }
}

@media screen and (max-width: 1800px){
	.table-form{
		--th: 250px;
	}
	.table-form .notes{ margin-bottom: 15px; }

	.table-form .agree{ margin-top: 35px; }

	.table-form .policy > h5{ font-size: 24px; margin-bottom: 20px; }
	.table-form .policy .scroll-bar .padding{ padding: 25px; padding-right: 60px; }

	.table-form .submit > *{ width: 170px; height: 65px; font-size: 19px; }
}

@media screen and (max-width: 1280px){
	.table-form{
		--height: 50px;
		--th: 220px;
		--pt: 10px;
	}
	.table-form .notes{ font-size: 16px; margin-bottom: 10px; }
	.table-form .small{ margin-top: 7px; }

	.table-form .button{ padding: 0 20px; }

	.table-form .id input{ width: calc(100% - 90px); }

	.table-form .file > input{ max-width: calc(100% - 100px); }
	.table-form .file .btn label{ width: 100px; font-size: 16px; }

	.table-form .agree{ margin-top: 25px; }
	.table-form .agree label{ font-size: 17px; }

	.table-form .policy > h5{ font-size: 22px; margin-bottom: 10px; }
	.table-form .policy .scroll-bar .padding{ padding: 20px; padding-right: 55px; }
	.table-form .policy .privacy *{ font-size: 16px; }
	.table-form .policy .agree{ font-size: 17px; margin-top: 10px; }

	.table-form .submit > *{ width: 140px; height: 55px; font-size: 18px; }
}

@media screen and (max-width: 1000px){
	.table-form table{ text-align: center; clip-path: unset; -webkit-clip-path: unset; }
	.table-form colgroup,
	.table-form thead{ display: none; }
	.table-form tr{ width: 100%; display: flex; flex-direction: column; }
	.table-form tr:not(:last-of-type),
	.table-form tr > td:not(:last-child){ margin-bottom: 20px; }
	.table-form tr > *{ width: 100% !important; border-right: none !important; }
	.table-form td{ margin-top: -1px; }

	.table-form .min{ min-height: auto; }

	.table-form input{ max-width: 100%; }
	.table-form select{ max-width: 100%; }

	.table-form .input-list.min{ padding: 10px 0; }

	.table-form .id{ max-width: 100%; }

	.table-form .birth{ max-width: 100%; }

	.table-form .file > input{ width: 100%; }

	/* table-form (responsive) */
	.table-form .responsive td::before{ content: attr(data-th); display: block; background: var(--thBg); border-bottom: var(--border); font-weight: 500; padding: var(--pt) var(--pr); margin: calc(var(--pt) * -1) calc(var(--pr) * -1) var(--pt);  }
}

@media screen and (max-width: 900px){
	.table-form .policy > h5{ font-size: 20px; }
}


/* 예약일 및 공연정보 (공통) */
#reserve .tit{ border-bottom: 1px solid #353535; padding-bottom: 20px; margin-bottom: 40px; }
#reserve .tit h3,
#reserve .tit h4{ font-weight: 600; color: #151515; }
#reserve .tit h3{ font-size: 5rem; }
#reserve .tit h4{ font-size: 30px; }
#reserve h5{ font-size: 24px; font-weight: 600; color: #000; padding-top: 20px; margin-bottom: 40px; }
#reserve .asterisk{ font-size: 17px; color: #888; margin-top: 15px; }
#reserve .asterisk::before{ filter: brightness(2); -webkit-filter: brightness(2); }

#reserve .tab .tit{ padding-right: 40px; margin-bottom: 0 !important; position: relative; cursor: pointer; }
#reserve .tab .tit::after{ content: ""; width: 40px; height: 40px; background: url("/img/board/tab_arrow.svg") no-repeat center center / contain; position: absolute; top: 50%; right: 0; transform: translateY(-50%) scaleY(-1); transition: transform 0.3s; }
#reserve .tab.on .tit::after{ transform: translateY(-50%)  scaleY(1); }
#reserve .tab .content{ margin-top: 40px; }

#reserve .reserve-board{ margin: 0; }
#reserve .reserve-board .item{ padding: 0; border: none; }
#reserve .reserve-board .item figure::after{ display: none; }
#reserve .reserve-board .item figure img{ transform: translate(-50%, -50%) scale(1) !important; }
#reserve .reserve-board .item .text h6{ white-space: normal; text-overflow: unset; overflow: unset; }
#reserve .reserve-board .item .info{ padding-right: 0; }

#reserve .table-box{
	--th: 440px;
	--pt: 20px;
	--pr: 40px;
}
#reserve .table-box table{ clip-path: unset; -webkit-clip-path: unset; }
#reserve .table-box th{ border-top: var(--border); border-bottom: var(--border); }
#reserve .table-box ul.grid{ display: grid; margin: calc(var(--pt) * -1) calc(var(--pr) * -1); }
#reserve .table-box ul.grid li{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: var(--pt) var(--pr); }
#reserve .table-box ul.grid li:not(:last-of-type){ border-right: var(--border); }
#reserve .table-box ul.grid li span{ display: none; }

/* 예약일 및 공연정보 (reserve01) */
#reserve.reserve01 h5{ margin-bottom: 20px; }
#reserve.reserve01 .table-form .sec:not(:last-of-type){ margin-bottom: 40px; }
#reserve.reserve01 .table-form .sec:not(:first-of-type) h5{ padding-top: 0; }

#reserve.reserve01 .sec01 .asterisk{ margin-left: calc(var(--th) + 10px); }
#reserve.reserve01 .sec02 table{ text-align: center; }

#reserve.reserve01 .input{ overflow: hidden; }
#reserve.reserve01 .input ul{ display: flex; flex-wrap: wrap; margin: -5px -50px; }
#reserve.reserve01 .input li{ margin: 0 50px; }
#reserve.reserve01 .input input{ display: none; }
#reserve.reserve01 .input label{ display: block; padding: 5px; padding-left: 25px !important; position: relative; cursor: pointer; }
#reserve.reserve01 .input label::before,
#reserve.reserve01 .input label::after{ content: ""; width: var(--icon); height: var(--icon); border-radius: 50%; position: absolute; top: calc((1.3em / 2) + 5px); left: 0; transform: translateY(-50%); box-sizing: border-box; }
#reserve.reserve01 .input label::before{ border: 1px solid #353535; }
#reserve.reserve01 .input label::after{ width: calc(var(--icon) / 2); height: calc(var(--icon) / 2); background: #353535; left: calc(var(--icon) / 4); opacity: 0; }
#reserve.reserve01 .input input:checked + label::after{ opacity: 1; }

#reserve.reserve01 ul.grid{ grid-template-columns: repeat(2, 1fr); }
#reserve.reserve01 ul.grid li{ display: flex !important; justify-content: center; align-items: center; }
#reserve.reserve01 .select{ display: flex; align-items: center; }
#reserve.reserve01 .select select,
#reserve.reserve01 .select option{ font-size: 17px; text-align: center !important; text-align-last: center; }
#reserve.reserve01 .select select{ width: 70px; height: 1.8em; background: none; border: none; border-bottom: 1px solid #353535; border-radius: 0; -webkit-border-radius: 0; padding: 3px; margin: 0 5px; }
#reserve.reserve01 .select::after{ content: ""; display: inline-block; width: 24px; height: 24px; background: url("/img/board/search_arrow.svg") no-repeat center center / contain; }


/* 예약일 및 공연정보 (reserve02) */
#reserve.reserve02 .sec01 .table-box{ 
	--pt: 7px;
	--pr: 10px;
}
#reserve.reserve02 .sec01 colgroup col.s{ width: 400px; }
#reserve.reserve02 .sec01 colgroup col.m{ width: 28%; }
#reserve.reserve02 .sec01 .table-box{ text-align: center; }
#reserve.reserve02 .sec01 .table-box ul.grid{ grid-template-columns: repeat(3, 1fr); }
#reserve.reserve02 .sec01 .table-box td{ --pt: 20px; --pr: 20px; }

#reserve.reserve02 .sec03 td{ font-weight: 300; font-size: 18px; }


/* 작성 폼 */
#write h4{ font-size: 30px; font-weight: 600; color: #111; margin-bottom: 40px; }

#write .submit > *{ width: 265px; height: 65px; font-size: 19px; }
#write .submit > *.gray::before{ content: ""; display: inline-block; width: 14px; height: 14px; background: url("/img/board/list_icon.svg") no-repeat center center / contain; filter: invert(1) opacity(0.35); -webkit-filter: invert(1) opacity(0.35); margin-right: 10px; transform: translateY(-1px); }

@media screen and (max-width: 1800px){
	#write h4{ font-size: 26px; margin-bottom: 30px; }
	#write .submit > *{ width: 220px; height: 60px; font-size: 18px; }
}

@media screen and (max-width: 1280px){
	#write h4{ font-size: 24px; margin-bottom: 20px; }
	#write .submit > *{ width: 160px; height: 55px; font-size: 17px; }
}

@media screen and (max-width: 900px){
	#write h4{ font-size: 22px; }
}


/* 환불/취소 안내 */
#reserve.cancel .submit > *{ width: 305px; height: 65px; font-size: 19px; }


@media screen and (max-width: 1800px){
	/* 예약일 및 공연정보 (공통) */
	#reserve .tit{ padding-bottom: 15px; margin-bottom: 30px; }
	#reserve .tit h4{ font-size: 26px; }
	#reserve h5{ font-size: 22px; padding-top: 10px; margin-bottom: 20px; }

	#reserve .tab .content{ margin-top: 30px; }

	#reserve .table-box{
		--th: 300px;
		--pt: 15px;
		--pr: 30px;
	}

	/* 예약일 및 공연정보 (reserve02) */
	#reserve.reserve02 .sec01 .table-box td{ --pt: 15px; --pr: 15px; }

	/* 환불/취소 안내 */
	#reserve.cancel .submit > *{ width: 240px; height: 60px; font-size: 18px; }
}

@media screen and (max-width: 1280px){
	/* 예약일 및 공연정보 (공통) */
	#reserve .tit{ padding-bottom: 10px; margin-bottom: 20px; }
	#reserve .tit h4{ font-size: 22px; }
	#reserve h5{ font-size: 20px; padding-top: 0; margin-bottom: 10px; }
	#reserve .asterisk{ font-size: 16px; margin-top: 10px; }

	#reserve .tab .tit::after{ width: 30px; height: 30px; }
	#reserve .tab .content{ margin-top: 20px; }
	
	#reserve .table-box{
		--th: 230px;
		--pt: 10px;
		--pr: 20px;
	}

	/* 예약일 및 공연정보 (reserve01) */
	#reserve.reserve01 h5{ margin-bottom: 10px; }

	/* 예약일 및 공연정보 (reserve02) */
	#reserve.reserve02 .sec01 colgroup col.s{ width: 320px; }
	#reserve.reserve02 .sec01 .table-box td{ --pt: 10px; }

	#reserve.reserve02 .sec03 td{ font-size: 17px; }

	/* 환불/취소 안내 */
	#reserve.cancel .submit > *{ width: 200px; height: 55px; font-size: 17px; }
}

@media screen and (max-width: 1000px){
	/* 예약일 및 공연정보 (공통) */
	#reserve .table-box ul.grid{ min-height: unset !important; }
	#reserve .table-box ul.grid li{ display: block; }
	#reserve .table-box ul.grid li span{ display: block; background: var(--thBg); border-bottom: var(--border); font-weight: 500; padding: 7px 10px; margin: calc(var(--pt) * -1) calc(var(--pr) * -1) var(--pt); }

	/* 예약일 및 공연정보 (reserve01) */
	#reserve.reserve01 .sec01 .asterisk{ margin-left: 0; }
}

@media screen and (max-width: 900px){
	/* 예약일 및 공연정보 (공통) */
	#reserve .tit h3{ font-size: 5.5rem; }
	#reserve .tit h4{ font-size: 20px; }
	#reserve h5{ font-size: 18px; }
}


/* 회원가입, 마이페이지 */
#member .table-form{
	--pr: 30px;
}
#member .table-form td{ text-align: left; }
#member .table-form tr:first-of-type td{ border-top-color: var(--thBg); }
#member .submit button{ width: 265px; height: 65px; font-size: 19px; font-weight: 400; }

@media screen and (max-width: 1800px){
	#member .table-form{
		--pr: 25px;
	}

	#member .submit button{ width: 200px; height: 60px; }
}

@media screen and (max-width: 1280px){
	#member .table-form{
		--pr: 15px;
	}

	#member .submit button{ width: 160px; height: 55px; font-size: 18px; }
}


/* 로그인 , 아이디/비밀번호 찾기 */
#login{
	--height: 80px;
	--padding: 30px;
}
#login{ background: url("/img/sub/member/login_bg.jpg") no-repeat bottom right / cover; }
#login .inner{ max-width: 600px; margin: 0 auto; }
#login h4,
#login h5{ font-weight: 500; color: #151515; text-align: center; }
#login h4{ font-size: 6rem; margin-bottom: 80px; }
#login h5{ font-size: 5rem; margin-bottom: 60px; }
#login input{ width: 100%; height: var(--height); background: transparent; border: 1px solid #BBB; border-radius: 5px; -webkit-border-radius: 5px; font-size: 20px; font-weight: 400; color: #151515; padding: 0 var(--padding); }
#login input::placeholder{ font-weight: 300; color: #BBB; }
#login span{ display: inline-block; font-size: 22px; font-weight: 400; color: #353535; }
#login .i{ font-size: 15px; font-weight: 500; color: #353535; margin-top: 25px; padding-left: 25px; position: relative; }
#login .i::before{ content: ""; width: 15px; height: 15px; background: url("/img/sub/member/i_icon.svg") no-repeat center center / contain; border: 1px solid var(--mainColor); border-radius: 50%; box-sizing: border-box; position: absolute; top: calc((1.3em / 2) - 1px); left: 0; transform: translateY(-50%); }

#login .input{ margin-bottom: 20px; }
#login .input > *:not(:last-child){ margin-bottom: 15px; }
#login .input .email{ display: flex; align-items: center; }
#login .input .email > *:not(:last-child){ margin-right: 10px; }

#login .check{ margin: -10px 0; }
#login .check input{ display: none; }
#login .check label{ display: inline-block; font-size: 16px; font-weight: 500; color: #353535; padding: 10px 0; padding-left: 25px !important; position: relative; cursor: pointer; }
#login .check label::before,
#login .check label::after{ content: ""; width: 15px; height: 15px; border-radius: 50%; position: absolute; top: calc((1.3em / 2) + 10px); left: 0; transform: translateY(-50%); box-sizing: border-box; }
#login .check label::before{ border: 1px solid #353535; }
#login .check label::after{ background: #353535 url("/img/board/check_icon.svg") no-repeat center center / contain; opacity: 0; }
#login .check input:checked + label::after{ opacity: 1; }

#login .btns{ margin-top: 40px; }
#login .btns button,
#login .btns a{ width: 100%; height: var(--height); display: flex; justify-content: center; align-items: center; background: #151515; border: none; border-radius: 5px; -webkit-border-radius: 5px; font-family: var(--baseFont); font-size: 18px; font-weight: 400; color: #FFF; padding: 0 var(--padding); position: relative; }
#login .btns > *:not(:last-child){ margin-bottom: 10px; }
#login .btns i{ width: 30px; height: 30px; position: absolute; top: 50%; left: var(--padding); transform: translateY(-50%); }
#login .btns .grid{ display: grid; grid-template-columns: repeat(2, 1fr); margin-left: -5px; margin-right: -5px; }
#login .btns .grid > *{ width: auto; margin: 0 5px; }

#login .btns #naverIdLogin{ background: #24BE57; }
#login .btns #naverIdLogin::before{ content: ""; width: 30px; height: 30px; background: url("/img/sub/member/btn_naver.svg") no-repeat center center / contain; position: absolute; top: 50%; left: var(--padding); transform: translateY(-50%); }
#login .btns #naverIdLogin::after{ content: attr(data-txt); }
#login .btns #naverIdLogin a{ opacity: 0; position: absolute; top: 0; left: 0; }
#login .btns .kakao{ background: #FFD900; font-weight: 500; color: #151515; }
#login .btns .kakao i{ background: url("/img/sub/member/btn_kakao.svg") no-repeat center center / contain; }

#login .btns .gray{ background: #DDD; font-weight: 500; color: #353535; }
#login .btns .red{ background: var(--mainColor); }


/* 아이디/비밀번호 찾기 */
#login.find .grid-box{ display: grid; grid-template-columns: 50% 50%; }
#login.find .grid-box > div{ padding: 0 80px; position: relative; }
#login.find .grid-box > div:first-of-type{ padding-left: 0 !important; }
#login.find .grid-box > div:last-of-type{ padding-right: 0 !important; }
#login.find .grid-box > div::after{ content: ""; width: 1px; height: 320px; background: #DDD; position: absolute; top: 60%; right: 0; transform: translateY(-50%); }
#login.find .grid-box > div:last-of-type::after{ display: none; }

@media screen and (max-width: 1800px){
	#login{
		--height: 70px;
		--padding: 25px;
	}
	#login h4{ margin-bottom: 60px; }
	#login h5{ margin-bottom: 35px; }
	#login input{ font-size: 18px; }
	#login span{ font-size: 20px; }

	/* 아이디/비밀번호 찾기 */
	#login.find .grid-box > div::after{ height: 250px; }
}

@media screen and (max-width: 1280px){
	#login{
		--height: 60px;
		--padding: 20px;
	}
	#login .inner{ max-width: 500px; }
	#login h4{ margin-bottom: 30px; }
	#login h5{ margin-bottom: 25px; }
	#login input{ font-size: 17px; }
	#login span{ font-size: 18px; }
	#login .i{ margin-top: 15px; }

	#login .input{ margin-bottom: 12px; }

	#login .btns{ margin-top: 30px; }
	#login .btns button,
	#login .btns a{ font-size: 17px; }
	#login .btns i{ width: 25px; height: 25px; }

	#login .btns #naverIdLogin::before{ width: 25px; height: 25px; }

	/* 아이디/비밀번호 찾기 */
	#login.find .grid-box > div{ padding: 0 50px; }
	#login.find .grid-box > div::after{ height: 220px; top: 55%; }
}

@media screen and (max-width: 1000px){
	/* 아이디/비밀번호 찾기 */
	#login.find .grid-box{ grid-template-columns: repeat(1, 1fr); }
	#login.find .grid-box > div{ padding: 50px 0; }
	#login.find .grid-box > div:first-of-type{ padding-top: 0 !important; }
	#login.find .grid-box > div:last-of-type{ padding-bottom: 0 !important; }
	#login.find .grid-box > div::after{ max-width: 500px; width: 100%; height: 1px; top: 100%; right: 50%; transform: translateX(50%); }
}

@media screen and (max-width: 900px){
	#login h4{ font-size: 6.5rem; }
	#login h5{ font-size: 5.5rem; }
}


/* 검색결과 */
#result .search-box{ 
	--height: 80px;
	--select: 200px;
	--button: 180px;
	--padding: 25px;
}
#result .search-box{ margin-bottom: 100px; }
#result .search-box *{ font-size: 22px; }
#result .search-box .flex-box{ justify-content: center; }
#result .search-box input{ max-width: 840px; width: calc(100% - var(--select) - var(--button) - 40px); padding: 0 var(--padding); }

#result .border-title{ margin-bottom: 40px; }
#result .reserve-board,
#result .img_board_list.horizontal{ margin-top: -40px; }


#result .reserve-board .item:first-of-type{ border-top: none; }

#result .img_board_list{ border-top: none; }

@media screen and (max-width: 1800px){
	#result .search-box{ 
		--height: 70px;
		--select: 170px;
		--button: 150px;
	}
	#result .search-box{ margin-bottom: 70px; }
	#result .search-box *{ font-size: 20px; }

	#result .border-title{ margin-bottom: 30px; }
	#result .reserve-board,
	#result .img_board_list.horizontal{ margin-top: -30px; }
}

@media screen and (max-width: 1280px){
	#result .search-box{ 
		--height: 60px;
		--select: 140px;
		--button: 120px;
		--padding: 20px;
	}
	#result .search-box{ margin-bottom: 40px; }
	#result .search-box *{ font-size: 18px; }

	#result .border-title{ margin-bottom: 20px; }
	#result .reserve-board,
	#result .img_board_list.horizontal{ margin-top: -20px; }
}

@media screen and (max-width: 900px){
	#result .search-box{ 
		--height: 50px;
		--select: 120px;
		--button: 100px;
		--padding: 15px;
	}
}
