@charset "UTF-8";
*, *::before, *::after {
	box-sizing: border-box;
}
.event_wrap .e_container {
	padding: 120px 0;
}
.event_wrap .e_container.bg_01 {
	background-color: #EFEFEF;
}
.event_wrap .e_container.bg_02 {
	background-color: #D4B7F9;
}
.event_wrap .e_container.bg_03 {
	background-color: #EFEFEF;
}
.event_wrap .e_container.bg_04 {
}
/* ==========================
	공통 스타일
============================= */
.event_wrap img {
	width: 100%;
}
.event_wrap .w670 {
	width: 670px;
	margin: 0 auto;
}
.event_wrap h3 {
	margin: 0 auto 64px;
}
/* ==========================
	영역별 스타일
============================= */
/* bg_01 */
.event_wrap .bg_01 h3 {
	width: 626px;
	margin: 64px auto 0;
}
.event_wrap .picks_wrap {
	position: relative;
	margin: 20px auto 64px;
}
.event_wrap .picks_wrap .book_box {
	position: absolute;
	bottom: 2px;
	right: 0;
	width: 365px;
	height: 336px;
	overflow: hidden;
}
.event_wrap .picks_wrap .book_box .book {
	display: block;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 222px;
	height: 306px;
	border: 2px solid #111;
	border-bottom: 0;
	animation: bookActive 7.5s infinite;
}
.event_wrap .picks_wrap .book_box .book.img_type01 {
	width: 300px;
	height: 304px;
}
.event_wrap .picks_wrap .book_box .book.on {
	opacity: 1;
	visibility: visible;
}
.event_wrap .picks_wrap .book_box .book:nth-child(1) { 
	animation-delay: 0s; 
}
.event_wrap .picks_wrap .book_box .book:nth-child(2) { 
	animation-delay: 1.5s; 
}
.event_wrap .picks_wrap .book_box .book:nth-child(3) { 
	animation-delay: 3s; 
}
.event_wrap .picks_wrap .book_box .book:nth-child(4) { 
	animation-delay: 4.5s; 
}
.event_wrap .picks_wrap .book_box .book:nth-child(5) { 
	animation-delay: 6s; 
}
/* bg_02 */
.event_wrap .bg_02 h3 {
	width: 660px;
}
.event_wrap .slide_box {
	width: 750px;
	margin: 64px auto 0;
}
.event_wrap .slide_box h4 {
	margin: 0 auto 28px;
}
.event_wrap .slide_box.slide_box01 h4 {
	width: 345px;
}
.event_wrap .slide_box.slide_box02 h4 {
	width: 336px;
}
.event_wrap .slide_box .swiper-button-next, 
.event_wrap .slide_box .swiper-button-prev {
	opacity: 1;
	background-image: url("https://contents.kyobobook.co.kr/pmtn/2026/book/260612_ahngraphics/bnX_slide_nav.png");
	background-color: transparent;
	background-size: contain;
	width: 60px;
	height: 60px;
}
.event_wrap .slide_box .swiper-button-next {
	right: 25px;
}
.event_wrap .slide_box .swiper-button-prev {
	left: 25px;
	transform: rotateY(180deg);
}
.event_wrap .slide_box .swiper-pagination {
	position: static;
	font-size: 0;
	margin-top: 48px;
}
.event_wrap .slide_box .swiper-pagination-bullet {
	opacity: 1;
	width: 12px;
	height: 12px;
	border: 1px solid #000;
	background-color: #fff;
	margin: 0 6px;
}
.event_wrap .slide_box .swiper-pagination-bullet-active {
	background-color: #000;
}
/* bg_03 */
.event_wrap .bg_03 h3 {
	width: 624px;
}
/* bg_04 */
.event_wrap .bg_04 .img_box {
	margin-top: 36px;
}
.event_wrap .bg_04 .eMap a {
	top: 106px;
	left: 36%;
	width: 29%;
}
.event_wrap .bg_04 .eMap .link_01 {
	height: 32%;
}
.event_wrap .bg_04 .eMap .link_02 {
	height: 28%;
}
.event_wrap .bg_04 .eMap .link_03 {
	height: 30%;
}
/* 슬라이드 추가 */
.event_wrap .book_slide .eMap .link_book {
	top: 106px;
	left: 36%;
	width: 29%;
	height: 29%;
}
.event_wrap .book_slide .eMap .link_book.link_book02 {
	height: 27%;
}
.event_wrap .book_slide .eMap .link_book.link_book03 {
	left: 31%;
	width: 39%;
}
.event_wrap .book_slide .swiper-pagination {
	position: static;
	font-size: 0;
	margin-top: 24px;
}
.event_wrap .book_slide .swiper-pagination-bullet {
	opacity: 1;
	width: 12px;
	height: 12px;
	border: 1px solid #000;
	background-color: #F2F2F2;
	margin: 0 6px;
}
.event_wrap .book_slide .swiper-pagination-bullet-active {
	background-color: #000;
}
/* ==========================
	keyframes
============================= */
@keyframes bookActive {
	0%, 19.99% { 
		opacity: 1; 
		visibility: visible; 
	}
	20%, 100% { 
		opacity: 0; 
		visibility: hidden; 
	}
}