body{background-color:var(--bg-page)}.movie-list-wrap{padding:3.125rem 0}.movie-list-wrap .area{margin:3.125rem 0 0}.movie-list-wrap .area .tit{margin:0 0 1.25rem}.page-header-area .header-tit{font-size:var(--fs-display);color:var(--text-title)}.page-header-area .header-descrip{margin:10px 0 0;font-size:var(--fs-body);color:var(--text-body)}.genre-area{margin:3rem 0 0}.genre-area .genre-tit{position:relative;padding:0 0 0 1.5625rem;font-size:var(--fs-subtitle);font-weight:700;color:var(--text-title)}.genre-area .genre-tit:before{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);display:block;width:1.25rem;height:1.25rem;background-image:url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M8.33333%204.1665H2.5'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M10%2015.8335H2.5'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M11.6667%202.5V5.83333'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M13.3333%2014.1665V17.4998'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M17.5%2010H10'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M17.5%2015.8335H13.3333'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M17.5%204.1665H11.6667'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M6.66666%208.3335V11.6668'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M6.66667%2010H2.5'%20stroke='%2399A1AF'%20stroke-width='1.66667'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e")}.genre-list fieldset{margin:0;border:.125rem solid var(--border-subtle);padding:1rem;border-radius:.5rem}.genre-list .genres{display:flex;flex-wrap:wrap;gap:.5rem}.genres input[type=radio]{position:absolute;opacity:0}.genres label{padding:0 1rem;border-radius:1.875rem;border:.0625rem solid var(--border-subtle);background:transparent;font-size:var(--fs-caption);line-height:2.5;color:var(--text-body);cursor:pointer;transition:all .2s ease}.genres label:hover{border-color:var(--border-strong);background:#ffffff0d}.genres input[type=radio]:checked+label{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.genres input[type=radio]:checked+label:hover{background:var(--accent-primary-hover)}.genres input[type=radio]:focus-visible+label{outline:.125rem solid var(--rating-text);outline-offset:.125rem}.movie-area{margin:2.5rem 0 0}.movie-area .result-tit{display:flex;align-items:center;gap:10px;font-size:var(--fs-title);color:var(--text-title)}.movie-area .result-tit .result-total{font-size:var(--fs-caption)}.movie-list .no-results{display:flex;justify-content:center;align-items:center;text-align:center;min-height:18.75rem;font-size:var(--fs-body);color:var(--text-muted)}.lists{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.2rem}.lists .movie{position:relative;display:block;border-radius:1rem;overflow:hidden;cursor:pointer}.lists .movie:focus-visible{outline:.125rem solid var(--rating-text);outline-offset:.125rem}.lists .movie .movie-poster{aspect-ratio:2 / 3;width:100%;object-fit:cover;display:block}.lists .movie:hover .movie-info .info-txt,.lists .movie:focus-visible .movie-info .info-txt{opacity:1;max-height:3.2em;margin:.3125rem 0 0}.lists .movie:hover .movie-info .movie-info-detail .genre,.lists .movie:focus-visible .movie-info-detail .genre{opacity:1;max-width:10rem}.movie-list-wrap .movie-info{position:absolute;right:0;bottom:0;left:0;padding:.625rem;background:#000000b8;z-index:1}.movie-list-wrap .movie-info .info-tit{font-size:var(--fs-body);color:var(--text-title);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.movie-list-wrap .movie-info .info-txt{font-size:.9rem;color:#ffffffbf;opacity:0;max-height:0;overflow:hidden;transition:.2s ease;text-overflow:ellipsis;white-space:nowrap}.movie-list-wrap .movie-info .movie-info-detail{margin:.35rem 0 0;display:flex;gap:.75rem;align-items:center;font-size:.85rem;color:#ffffffb3}.movie-list-wrap .movie-info .movie-info-detail dd{margin:0}.movie-list-wrap .movie-info .movie-info-detail dd.genre{opacity:0;max-width:0;transition:.2s ease;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.movie:hover .rate,.movie:hover .rate-high,.movie:focus-visible .rate,.movie:focus-visible .rate-high{color:var(--rating-text)}.movie:hover .rate,.movie:focus-visible .rate{border:1px solid var(--rating-text)}.movie .rate{position:absolute;top:.75rem;right:.75rem;z-index:1;display:flex;align-items:center;gap:.35rem;padding:0 .5rem;background:#00000080;border:1px solid rgba(255,255,255,.14);border-radius:30px;font-size:.875rem;color:var(--text-body);line-height:2}.movie .rate-high{color:var(--rating-text)}.pagination{display:flex;align-items:center;justify-content:center;gap:15px;margin:50px 0 0}.pagination .pagination-btn{display:inline-flex;gap:10px;width:45px;height:45px;padding:0 14px;border:.125rem solid var(--border-subtle);border-radius:30px;font-weight:500;font-size:var(--fs-display);line-height:28px;color:var(--text-title);opacity:.5}.pagination .pagination-btn:hover{opacity:1}.pagination .pagination-btn:focus-visible{outline:.125rem solid var(--rating-text);outline-offset:2px;opacity:1}.pagination .pagination-list{display:flex;align-items:center;gap:10px}.pagination-list .pagination-num{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:.125rem solid var(--border-subtle);border-radius:30px;font-weight:500;font-size:var(--fs-caption);color:var(--text-title)}.pagination-list .pagination-num:focus-visible{outline:.125rem solid var(--rating-text);outline-offset:2px}.pagination-list .pagination-num.is-active,.pagination-num[aria-current=page]{color:var(--text-title);background:var(--accent-primary);border:.125rem solid var(--accent-primary)}
