@charset "utf-8";

/* 전자카탈로그 */
.catalog_section{position:relative; overflow:hidden; padding:78px 0 96px; background:linear-gradient(145deg,#fffaf4 0%,#f7efe4 50%,#fffdf9 100%);}
.catalog_section:before{content:""; position:absolute; left:-12%; top:8%; width:45vw; height:45vw; max-width:680px; max-height:680px; border-radius:50%; background:radial-gradient(circle,rgba(232,184,109,.16),rgba(232,184,109,0) 68%); pointer-events:none;}
.catalog_inner{position:relative; z-index:1; width:1200px; max-width:calc(100% - 40px); margin:0 auto;}
.catalog_heading{text-align:center; margin-bottom:36px;}
.catalog_kicker{display:inline-block; color:#b8822a; font-size:11px; font-weight:700; letter-spacing:.28em;}
.catalog_heading h2{margin:13px 0 10px; color:#2a2119; font-family:'Noto Serif KR','NanumGothic',serif; font-size:38px; font-weight:700; letter-spacing:-.04em;}
.catalog_heading p{margin:0; color:#806f5c; font-size:16px; letter-spacing:-.03em;}
.catalog_viewer{width:100%;}
.catalog_book_area{position:relative; display:flex; align-items:center; justify-content:center; width:100%;}
.catalog_book{position:relative; width:min(57vw,560px); aspect-ratio:497 / 706; perspective:1800px; border-radius:3px 10px 10px 3px; background:#e7d6bf; box-shadow:22px 24px 50px rgba(69,45,22,.22),-8px 8px 26px rgba(69,45,22,.09);}
.catalog_book:before{content:""; position:absolute; z-index:4; left:-1px; top:0; bottom:0; width:5px; background:linear-gradient(90deg,rgba(75,47,22,.34),rgba(255,255,255,.38),rgba(125,78,37,.18)); pointer-events:none;}
.catalog_book:after{content:""; position:absolute; z-index:5; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(94,57,22,.14),inset -12px 0 20px rgba(88,51,21,.07); pointer-events:none;}
.catalog_page{position:absolute; inset:0; overflow:hidden; border-radius:2px 9px 9px 2px; background:#fff; transform-style:preserve-3d; backface-visibility:hidden; -webkit-backface-visibility:hidden;}
.catalog_page img{display:block; width:100%; height:100%; object-fit:cover; user-select:none; -webkit-user-drag:none;}
.catalog_back_page{z-index:1; box-shadow:inset 8px 0 18px rgba(60,35,12,.12);}
.catalog_current_page{z-index:2; transform-origin:left center; box-shadow:8px 0 16px rgba(47,27,11,.15);}
.catalog_current_page.flip-next{animation:catalog_flip_next .64s cubic-bezier(.22,.75,.22,1) forwards;}
.catalog_current_page.flip-prev{transform-origin:right center; animation:catalog_flip_prev .64s cubic-bezier(.22,.75,.22,1) forwards;}
.catalog_page_shine{position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(105deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.28) 48%,rgba(255,255,255,0) 58%); opacity:0;}
.catalog_current_page.flip-next .catalog_page_shine,.catalog_current_page.flip-prev .catalog_page_shine{animation:catalog_shine .64s ease-out forwards;}
@keyframes catalog_flip_next{0%{transform:rotateY(0deg);box-shadow:8px 0 16px rgba(47,27,11,.15)}45%{box-shadow:18px 0 28px rgba(47,27,11,.28)}100%{transform:rotateY(-180deg);box-shadow:-6px 0 12px rgba(47,27,11,.06)}}
@keyframes catalog_flip_prev{0%{transform:rotateY(0deg);box-shadow:-8px 0 16px rgba(47,27,11,.15)}45%{box-shadow:-18px 0 28px rgba(47,27,11,.28)}100%{transform:rotateY(180deg);box-shadow:6px 0 12px rgba(47,27,11,.06)}}
@keyframes catalog_shine{0%{opacity:0;transform:translateX(-38%)}40%{opacity:.9}100%{opacity:0;transform:translateX(38%)}}
.catalog_side_button{position:absolute; z-index:8; display:flex; align-items:center; justify-content:center; width:48px; height:48px; border:1px solid rgba(138,92,26,.24); border-radius:50%; background:rgba(255,255,255,.78); color:#8a5c1a; font-family:Arial,sans-serif; font-size:38px; font-weight:300; line-height:1; cursor:pointer; box-shadow:0 5px 16px rgba(71,45,17,.1); transition:background .25s,transform .25s,box-shadow .25s;}
.catalog_side_button:hover{background:#fff; transform:scale(1.08); box-shadow:0 8px 22px rgba(71,45,17,.18);}
.catalog_side_button:disabled{opacity:.28; cursor:default; transform:none; box-shadow:none;}
.catalog_prev{left:calc(50% - min(28.5vw,280px) - 78px);}
.catalog_next{right:calc(50% - min(28.5vw,280px) - 78px);}
.catalog_controls{width:min(57vw,560px); margin:26px auto 0;}
.catalog_progress{height:3px; overflow:hidden; border-radius:5px; background:rgba(138,92,26,.14);}
.catalog_progress span{display:block; width:25%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#c8965a,#e8b86d); transition:width .45s ease;}
.catalog_control_row{display:flex; align-items:center; justify-content:center; gap:16px; margin-top:16px; color:#8a5c1a;}
.catalog_control,.catalog_fullscreen{border:0; background:transparent; color:#8a5c1a; font-size:13px; cursor:pointer; transition:color .2s,transform .2s;}
.catalog_control:hover,.catalog_fullscreen:hover{color:#4c3216; transform:translateY(-1px);}
.catalog_page_number{min-width:64px; color:#4c3216; font-size:14px; font-weight:600; text-align:center;}
.catalog_thumbnails{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:28px auto 0;}
.catalog_thumb{position:relative; width:58px; height:82px; padding:0; overflow:hidden; border:2px solid transparent; border-radius:3px; background:#fff; box-shadow:0 3px 10px rgba(71,45,17,.12); cursor:pointer; opacity:.62; transition:opacity .25s,transform .25s,border-color .25s;}
.catalog_thumb:hover{opacity:1; transform:translateY(-3px);}
.catalog_thumb.is-active{opacity:1; border-color:#c8965a; transform:translateY(-3px);}
.catalog_thumb img{display:block; width:100%; height:100%; object-fit:cover;}
.catalog_thumb span{position:absolute; right:3px; bottom:2px; color:#fff; font:600 10px/1 Arial,sans-serif; text-shadow:0 1px 3px rgba(0,0,0,.7);}
.catalog_empty{max-width:560px; margin:0 auto; padding:100px 20px; border:1px solid #eadbca; background:rgba(255,255,255,.7); color:#806f5c; text-align:center;}
@media (max-width:768px){
	.catalog_section{padding:54px 0 66px;}
	.catalog_inner{max-width:calc(100% - 28px);}
	.catalog_heading{margin-bottom:26px;}
	.catalog_heading h2{font-size:29px;}
	.catalog_heading p{font-size:14px;}
	.catalog_book{width:min(76vw,470px);}
	.catalog_side_button{width:40px;height:40px;font-size:31px;}
	.catalog_prev{left:4px;}
	.catalog_next{right:4px;}
	.catalog_controls{width:min(76vw,470px); margin-top:20px;}
}
@media (max-width:480px){
	.catalog_section{padding-top:42px;}
	.catalog_kicker{font-size:9px;}
	.catalog_heading h2{font-size:25px; margin-top:10px;}
	.catalog_heading p{font-size:13px;}
	.catalog_book{width:calc(100vw - 72px);}
	.catalog_side_button{width:34px;height:34px;font-size:27px;}
	.catalog_prev{left:0;}
	.catalog_next{right:0;}
	.catalog_control_row{gap:10px;}
	.catalog_control,.catalog_fullscreen{font-size:12px;}
	.catalog_thumbnails{gap:8px;margin-top:22px;}
	.catalog_thumb{width:48px;height:68px;}
}
@media (prefers-reduced-motion:reduce){
	.catalog_current_page.flip-next,.catalog_current_page.flip-prev{animation-duration:.01ms;}
	.catalog_progress span,.catalog_thumb,.catalog_side_button{transition:none;}
}

/* 오른쪽 퀵메뉴 카탈로그 버튼 */
.quick_menu_shell{display:flex; align-items:flex-start; gap:0;}
.quick_menu_tabs{display:flex; flex-direction:column; gap:8px; flex:0 0 auto;}
.btn_catalog_quick{display:flex; flex-direction:column; align-items:center; justify-content:center; width:62px; min-height:92px; padding:13px 8px 14px; border:0; border-radius:6px 0 0 6px; background:linear-gradient(160deg,#3b3330,#211d1c); color:#f5d28f; box-shadow:-2px 2px 12px rgba(0,0,0,.24); cursor:pointer; transition:background .25s,transform .25s,box-shadow .25s;}
.btn_catalog_quick:hover{background:linear-gradient(160deg,#5a4a3b,#2b2522); transform:translateX(-3px); box-shadow:-4px 3px 16px rgba(0,0,0,.3);}
.btn_catalog_quick svg{width:28px; height:28px; margin-bottom:8px;}
.btn_catalog_quick span{font-size:13px; font-weight:600; letter-spacing:-.04em; writing-mode:vertical-rl;}
.right_quick_menu_wrap .btn_quotation_inquiry{border-radius:6px 0 0 6px;}

/* 퀵메뉴에서 열리는 모달 */
body.catalog-modal-open{overflow:hidden;}
.catalog_modal{display:none; position:fixed; inset:0; z-index:1200; align-items:center; justify-content:center; padding:28px; background:rgba(18,14,12,.72); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
.catalog_modal.is-open{display:flex; animation:catalog_modal_fade .3s ease both;}
@keyframes catalog_modal_fade{from{opacity:0;}to{opacity:1;}}
.catalog_modal_panel{position:relative; display:flex; flex-direction:column; width:min(100%,760px); max-height:calc(100vh - 56px); overflow:auto; border:1px solid rgba(232,184,109,.35); border-radius:14px; background:linear-gradient(145deg,#fffaf4 0%,#f7efe4 52%,#fffdf9 100%); box-shadow:0 26px 80px rgba(0,0,0,.38); animation:catalog_modal_panel_in .45s cubic-bezier(.22,1,.36,1) both;}
@keyframes catalog_modal_panel_in{from{opacity:0;transform:translateY(18px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}
.catalog_modal_close{position:absolute; z-index:5; top:14px; right:16px; display:flex; align-items:center; justify-content:center; width:34px; height:34px; border:1px solid rgba(138,92,26,.2); border-radius:50%; background:rgba(255,255,255,.72); color:#6e4a1e; font:300 28px/1 Arial,sans-serif; cursor:pointer; transition:background .2s,transform .2s;}
.catalog_modal_close:hover{background:#fff; transform:rotate(90deg);}
.catalog_modal_header{padding:30px 64px 14px; text-align:center;}
.catalog_modal_header h2{margin:8px 0 6px; color:#2a2119; font-family:'Noto Serif KR','NanumGothic',serif; font-size:28px; font-weight:700; letter-spacing:-.04em;}
.catalog_modal_header p{margin:0; color:#806f5c; font-size:13px;}
.catalog_modal .catalog_viewer{padding:0 40px 28px;}
.catalog_modal .catalog_book{width:min(47vw,430px);}
.catalog_modal .catalog_controls{width:min(47vw,430px); margin-top:18px;}
.catalog_modal .catalog_thumbnails{margin-top:20px;}
.catalog_modal_empty{margin:0 32px 32px; padding:80px 20px; border:1px solid #eadbca; background:rgba(255,255,255,.7); color:#806f5c; text-align:center;}
@media (max-width:768px){
	.btn_catalog_quick{width:54px; min-height:82px; padding:10px 6px;}
	.btn_catalog_quick svg{width:24px; height:24px; margin-bottom:6px;}
	.btn_catalog_quick span{font-size:12px;}
	.catalog_modal{padding:12px;}
	.catalog_modal_panel{max-height:calc(100vh - 24px); border-radius:11px;}
	.catalog_modal_header{padding:25px 50px 10px;}
	.catalog_modal_header h2{font-size:23px;}
	.catalog_modal_header p{font-size:12px;}
	.catalog_modal .catalog_viewer{padding:0 16px 20px;}
	.catalog_modal .catalog_book{width:min(76vw,400px);}
	.catalog_modal .catalog_controls{width:min(76vw,400px);}
	.catalog_modal .catalog_side_button{width:38px;height:38px;font-size:30px;}
	.catalog_modal .catalog_prev{left:2px;}
	.catalog_modal .catalog_next{right:2px;}
}
@media (prefers-reduced-motion:reduce){
	.catalog_modal.is-open,.catalog_modal_panel{animation:none;}
}
