@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css";.video-gallery-section h1{margin-bottom:40px}.video-gallery-section{width:100%;max-width:120rem;padding:0 5%;margin:40px auto;box-sizing:border-box}.video-gallery-section *{box-sizing:border-box}.filter-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:left;margin-bottom:40px}.filter-btn{padding:4px 20px;border:1px solid #e5e5e5;background:#fff;color:#333;cursor:pointer;transition:all .3s ease;border-radius:30px;font-size:1.3rem;white-space:nowrap;font-family:var(--font-body-family)}.filter-btn:hover{background:#f5f5f5}.filter-btn.active{background:#000;color:#fff;border-color:#000}.filter-toggle{display:none}@media(max-width:767px){.filter-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;background:#fff;border:1px solid #e5e5e5;border-radius:4px;cursor:pointer;margin-bottom:10px;font-size:1.4rem;color:#333}.filter-toggle-icon{transition:transform .3s ease;font-size:1.2rem}.filter-toggle.active .filter-toggle-icon{transform:rotate(180deg)}.filter-buttons{max-height:0;overflow:hidden;transition:max-height .3s ease;margin-bottom:0}.filter-buttons.active{max-height:500px;margin-bottom:20px}}.product_video-grid{display:grid;gap:20px;grid-template-columns:repeat(2,1fr)}@media(min-width:768px){.product_video-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1024px){.product_video-grid{grid-template-columns:repeat(4,1fr)}}.product_video-item{display:flex;flex-direction:column;min-width:0;animation:fadeIn .5s ease;gap:10px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.product-video-wrapper{position:relative;width:100%;aspect-ratio:9 / 16;background-color:#f0f0f0;border-radius:4px;overflow:hidden;cursor:pointer;z-index:1;transition:transform .2s ease,box-shadow .3s ease}@media(min-width:769px){.product-video-wrapper:hover{transform:scale(1.02);box-shadow:0 8px 16px #0003;z-index:2}}.gallery-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.product-card{display:flex;align-items:flex-start;gap:10px;text-align:left;margin-top:1rem}.product-video-link{color:#222;text-decoration:none;transition:opacity .3s}.product-video-link:hover{opacity:.7}.product-thumbnail{width:48px;height:48px;object-fit:cover;border-radius:4px;flex-shrink:0;display:block}.product-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.product-video-title{margin:0;line-height:1.4;font-weight:500;overflow:hidden;text-overflow:ellipsis;color:inherit}.product-video-price{margin:4px 0 0}.pagination{margin-top:40px;text-align:center;display:flex;justify-content:center;gap:20px}.pagination span{display:inline-block;padding:4px}.pagination .page.current{font-weight:700;border-bottom:1px solid #222222;color:#222}.pagination a{font-weight:400;border-bottom:none;color:#202020;text-decoration:none;padding:4px}.pagination a:hover{border-bottom:1px solid rgb(32,32,32)}.video-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000f2;z-index:9999;align-items:center;justify-content:center}.video-modal.active{display:flex}.video-modal-content{position:relative;width:90%;max-width:400px;max-height:90vh}.video-modal-video{width:100%;height:auto;aspect-ratio:9 / 16;border-radius:8px;object-fit:cover}.video-modal-video-wrapper{position:relative;width:100%;height:100%}.video-modal-close{position:absolute;top:0;background:none;right:-50px;border:none;color:#fff;font-size:2rem;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;opacity:.8;transition:opacity .2s}.video-modal-close:hover{opacity:1}.video-modal-nav{position:absolute;font-size:28px;font-weight:300;top:50%;transform:translateY(-50%);background:#ffffffe6;border:none;cursor:pointer;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:.8;transition:opacity .2s}.video-modal-nav:hover{opacity:1}.video-modal-nav.prev{left:-50px}.video-modal-nav.next{right:-50px}.video-modal-nav .carousel-chevron{width:.8rem;height:.8rem;border:2px solid #222;border-width:0 2px 2px 0;display:inline-block;transform:none}.video-modal-nav.prev .carousel-chevron{transform:rotate(135deg);margin-left:-2px}.video-modal-nav.next .carousel-chevron{transform:rotate(-45deg);margin-right:-2px}.video-modal-info{position:absolute;bottom:-12px;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.7) 50%,rgba(0,0,0,.7) 80%,transparent 100%);padding:3rem 1.5rem 1.5rem;border-radius:0 0 8px 8px}.video-modal-product-link{display:flex;align-items:center;gap:1rem;color:#fff;text-decoration:none;margin-bottom:1rem}.video-modal-thumbnail{width:60px;height:60px;object-fit:cover;border-radius:4px;flex-shrink:0}.video-modal-product-info{flex:1}.video-modal-title{margin:0 0 .25rem;color:#fff;font-size:1.5rem;font-weight:600}.video-modal-price{margin:0;color:#fff;font-size:1.5rem;font-weight:700}.video-modal-actions{display:flex;align-items:center;gap:10px}.video-modal-button.detail-btn{display:inline-block;padding:.2rem 1rem;background:#fff;color:#222;border-radius:4px;text-decoration:none;font-weight:400;font-size:1.4rem;white-space:nowrap;transition:all .2s;height:30px}.video-modal-button.detail-btn:hover{background:#222;color:#fff}.sns-button{display:flex;gap:.5rem;align-items:center}.sns-button a{display:flex;align-items:center;justify-content:center;width:40px;height:30px;border-radius:4px;text-decoration:none;transition:opacity .2s;flex-shrink:0;color:#fff}.sns-button a:hover{opacity:.8}.sns-button a.x{background:#000}.sns-button a.line{position:relative;background:#00b900;font-size:28px;color:#00b900}.sns-button a.line:before{position:absolute;content:"";height:24px;width:24px;background:#fff}.sns-button a.line i{z-index:1}.sns-button a.facebook{background:#214f97;font-size:19px}.video-modal-mute-btn{position:absolute;bottom:20px;right:20px;background:#0009;border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:background .3s ease}.video-modal-mute-btn:hover{background:#000c}.video-modal-mute-btn i{color:#fff;font-size:20px}@media(max-width:767px){.video-modal-close{right:10px;top:10px;background:#0009;border-radius:50%;touch-action:manipulation;z-index:10000}.video-modal-nav{display:none}.video-modal-content{max-width:95%}.video-modal-info{padding:2.5rem 1rem 1rem}.video-modal-button.detail-btn{padding:.5rem 1rem}.sns-button a{width:36px;height:36px}.video-modal-mute-btn{width:40px;height:40px;bottom:15px;right:15px}.video-modal-mute-btn i{font-size:18px}}.video-gallery-section .video-button{text-align:center;margin-top:40px}.video-gallery-section .all-video{display:inline-block;padding:12px 48px;font-size:1.1rem;font-weight:500;letter-spacing:.05em;border:1px solid #222;border-radius:4px;background-color:#222;color:#fff;cursor:pointer;transition:all .3s ease;font-family:var(--font-body-family)}.video-gallery-section .all-video:hover{background-color:#fff;color:#222;border-color:#222}.video-gallery-section .all-video:active{transform:translateY(1px)}
/*# sourceMappingURL=/cdn/shop/t/22/assets/video-gallery.css.map */