@charset "UTF-8";
*, ::before, ::after { box-sizing: border-box; border-style: solid; border-width: 0; min-width: 0; } html { line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; } body { margin: 0; } main { display: block; } p, table, blockquote, address, pre, iframe, form, figure, dl { margin: 0; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin: 0; } ul, ol { margin: 0; padding: 0; list-style: none; } dt { font-weight: 700; } dd { margin-left: 0; } hr { box-sizing: content-box; height: 0; overflow: visible; border-top-width: 1px; margin: 0; clear: both; color: inherit; } pre { font-family: monospace, monospace; font-size: inherit; } address { font-style: inherit; } a { background-color: transparent; text-decoration: none; color: inherit; } abbr[title] { text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: inherit; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } svg, img, embed, object, iframe { vertical-align: bottom; } button, input, optgroup, select, textarea { -webkit-appearance: none; appearance: none; vertical-align: middle; color: inherit; font: inherit; background: transparent; padding: 0; margin: 0; border-radius: 0; text-align: inherit; text-transform: inherit; } button, [type="button"], [type="reset"], [type="submit"] { cursor: pointer; } button:disabled, [type="button"]:disabled, [type="reset"]:disabled, [type="submit"]:disabled { cursor: default; } :-moz-focusring { outline: auto; } select:disabled { opacity: inherit; } option { padding: 0; } fieldset { margin: 0; padding: 0; min-width: 0; } legend { padding: 0; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } [type="number"] { -moz-appearance: textfield; } label[for] { cursor: pointer; } details { display: block; } summary { display: list-item; } [contenteditable]:focus { outline: auto; } table { border-color: inherit; border-collapse: collapse; } caption { text-align: left; } td, th { vertical-align: top; padding: 0; } th { text-align: left; font-weight: 700; } .wp-caption, .wp-caption-text, .sticky, .gallery-caption, .bypostauthor, .alignright, .alignleft, .aligncenter { }

:root {
  --Key-color: #99138b;
  --Main-color: #741d80;
  --accent-color: #f10313;
  --font-color: #FFFFFF;
  --fontSub-color: #d6cbcb;
  --bg-color: #000000;
  --inner: min(1200px, 96%);
  --topinner: min(1343px, 96%);
  --contents: min(980px, 90%);
  --font72: clamp(40px, 3.27vw + 32.73px, 72px);
  --font60: clamp(50px, 3.27vw + 32.73px, 60px);
  --font52: clamp(42px, 3.27vw + 32.73px, 52px);
  --font42: clamp(24px, 2.18vw + 15.8px, 42px);
  --font42: clamp(28px, 1.55vw + 23px, 42px);
  --font38: clamp(30px, 0.97vw + 26.4px, 38px);
  --font34: clamp(28px, 0.73vw + 25.3px, 34px);
  --font30: clamp(22px, 0.97vw + 18.4px, 30px);
  --font28: clamp(22px, 0.73vw + 19.3px, 28px);
  --font24: clamp(18px, 0.73vw + 15.3px, 24px);
  --font22: clamp(18px, 0.48vw + 16.2px, 22px);
  --font20: clamp(16px, 0.48vw + 14.2px, 20px);
  --font18: clamp(15px, 0.36vw + 13.6px, 18px);
  --font16: clamp(14px, 0.24vw + 13.1px, 16px);
  --font12: clamp(12px, 0.24vw + 11.1px, 14px);
  --side-width: 28%;
  --main-width: 69%;
  --font-en: "EB Garamond", serif;
}
@font-face {
font-family: 'ToronoGlitchSerif';
src: url('/wp-content/themes/zom-ore-com/fonts/toronoglitchserif-h1-heavy.woff2') format('woff2'),
url('/wp-content/themes/zom-ore-com/fonts/toronoglitchserif-h1-heavy-subset.woff2') format('woff2');
font-display: swap; 
}
html {background: var(--bg-color);}
body {
position: relative;
z-index: 0;
margin: 0;
background: url("../images/background/bg.webp") repeat left top;
background-size: 100% auto;
color: var(--font-color);
font-family: "Shippori Mincho B1", serif;
font-optical-sizing: auto;
font-weight: 400;
text-align: center;
animation: fadein 1.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
animation-delay: 0.3s;
opacity: 0;
}
body::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: 0;
background-image: url("../images/background/back.png"),
url("../images/background/gradation.png");
background-repeat: no-repeat;
background-position: center bottom, right bottom;
background-size: 70% auto, 100% auto;
pointer-events: none;
/* animation: horror-shake 7s infinite; */
}
#wrapper {
position: relative;
z-index: 1;
margin: 0 auto;
}
#wrapper>* {
position: relative;
z-index: 1;
}
#wrapper::before {
content: "";
position: absolute;
inset: 0;
background: url("../images/background/header_bg.webp") top left repeat-x;
background-size: auto 350px;
z-index: 0;
pointer-events: none;
}
a {
list-style: none;
color: var(--font-color);
text-decoration: none;
transition: 0.3s;
}
a:hover {
color: var(--Key-color);
text-shadow: 0 0 10px rgba(255, 0, 0, 0.6);
}
img {
vertical-align: bottom;
max-width: 100%;
}
main {
margin: 0 auto;
width: var(--inner);
}
footer {
margin: 200px auto 0;
padding-bottom:2.5em;
font-size: var(--font12);
}
.official__x{
margin: 1em auto;
}
.official__x p{
margin: 0 auto;
text-align: center;
font-family: var(--font-en);
font-size: var(--font16);
font-weight:500;
color:#cbc7c7;
}
.sns {
width: 32px;
margin: .5em auto;
}
.sns a::before {
content: "";
display: block;
position: relative;
display: grid;
place-items: center;
aspect-ratio: 1;
background: #cbc7c7 url("../images/footer/logo-black.png") no-repeat center / 50%;
border-radius: 50%;
-webkit-transition: .6s;
transition: .6s;
}
.sns a:hover::before {
background: var(--Key-color) url("../images/footer/logo-white.png") no-repeat center / 50%;
filter: drop-shadow(0 0 5px rgba(153, 19, 139, 0.7)) drop-shadow(0 0 5px rgba(153, 19, 139, 0.7));
}
/* header */
header {
margin: 0 auto;
padding-top: 5px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
width: var(--inner);
}
header h1 {
width: min(11vw, 130px); 
min-width: 90px; 
margin: 0;
}
header h1 img {
display: block;
width: 100%;
height: auto;
}
@media (min-width: 899px) {
header h1 img {
width: 130px;
}
}
.nav-menu ul {
margin: 0;
padding: 0;
display: flex;
flex-wrap: nowrap; 
justify-content: start;
gap: clamp(8px, 1vw + 2px, 15px);   
font-family: var(--font_en);
font-optical-sizing: auto;
font-weight: 500;
letter-spacing: 0.01em;
line-height: 1;
}
.nav-menu li {
white-space: nowrap; 
font-size: min(1.4vw, 17px); 
}
.nav-menu a {
display: block;
position: relative;
z-index: 1;
}
.nav-menu a::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.6); 
background: url("../images/common/splatter.png") no-repeat center center;
background-size: contain;  
width: 100px;
height: 55px;
z-index: -1; 
opacity: 0;
pointer-events: none;
transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s ease; 
}
.nav-menu a:hover::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
@media (max-width: 898px) {
#wrapper > header { 
z-index: 99999 !important; 
}
.burger-btn {
display: block;
z-index: 100000 !important; 
width: 30px;
height: 24px;
background: none;
border: none;
cursor: pointer;
padding: 0;
position: fixed;
right: 10px;
top: 20px;
}
.burger-btn span {
display: block;
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: var(--font-color);
transition: transform 0.3s, opacity 0.3s;
}
.burger-btn span:nth-child(1) { top: 0; }
.burger-btn span:nth-child(2) { top: 50%; transform: translateY(-50%); }
.burger-btn span:nth-child(3) { bottom: 0; }
.burger-btn.is-active span:nth-child(1) { transform: translateY(11px) rotate(45deg); }
.burger-btn.is-active span:nth-child(2) { opacity: 0; }
.burger-btn.is-active span:nth-child(3) { transform: translateY(-11px) rotate(-45deg); }
.nav-menu {
position: fixed;
top: -13vh;
left: 0;
right: 0;
bottom: 0;
z-index: 99999 !important; 
width: 100vw;
height: 113vh;
background: #000;
background-image:
url("../images/background/back.png"),
url("../images/background/bg.webp");
background-repeat: no-repeat, repeat;
background-position: right bottom, left top;
background-size: 150% auto, 100% auto;
display: flex;
flex-direction: column; 
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s, visibility 0.3s;
}
.nav-menu.is-open {
opacity: 1;
visibility: visible;
}
.nav-menu ul {
display: flex;
flex-direction: column;
gap: 25px;
justify-content: center;
align-items: center;
text-align: center;
margin: 0;
padding: 0;
}
.nav-menu li {
white-space: nowrap; 
font-size: min(7vw, 18px); 
}
.nav-menu .sp-menu-logo {
display: block;
margin-bottom: 10px;
text-align: center;
}
.nav-menu .sp-menu-logo img {
display: block;
margin: 0 auto;
width: 115px; 
height: auto;
}
}
@media (min-width: 899px) {
.sp-menu-logo { display: none; }
.nav-menu { max-width: 100%; }
}
body.page-id-25 .nav-menu ul li:nth-child(2) a::before,
body.single-post .nav-menu ul li:nth-child(2) a::before,
body.page-id-125 .nav-menu ul li:nth-child(3) a::before,
body.page-id-230 .nav-menu ul li:nth-child(3) a::before,
body.page-id-127 .nav-menu ul li:nth-child(4) a::before,
body.page-id-232 .nav-menu ul li:nth-child(4) a::before,
body.post-type-archive-story .nav-menu ul li:nth-child(5) a::before,
body.single-story .nav-menu ul li:nth-child(5) a::before,
body.post-type-archive-character .nav-menu ul li:nth-child(6) a::before,
body.single-character .nav-menu ul li:nth-child(6) a::before,
body.page-id-130 .nav-menu ul li:nth-child(7) a::before,
body.page-id-234 .nav-menu ul li:nth-child(7) a::before,
body.post-type-archive-movie .nav-menu ul li:nth-child(8) a::before,
body.single-movie .nav-menu ul li:nth-child(8) a::before,
body.page-id-000 .nav-menu ul li:nth-child(9) a::before,
body.page-id-132 .nav-menu ul li:nth-child(10) a::before,
body.page-id-236 .nav-menu ul li:nth-child(10) a::before {
opacity: 1 !important;
transform: translate(-50%, -50%) scale(1) !important;
text-shadow: 0 0 10px rgba(255, 0, 0, 0.8);
}
body.page-id-25 .nav-menu ul li:nth-child(2) a,
body.single-post .nav-menu ul li:nth-child(2) a,
body.page-id-125 .nav-menu ul li:nth-child(3) a,
body.page-id-230 .nav-menu ul li:nth-child(3) a,
body.page-id-127 .nav-menu ul li:nth-child(4) a,
body.page-id-232 .nav-menu ul li:nth-child(4) a,
body.post-type-archive-story .nav-menu ul li:nth-child(5) a,
body.single-story .nav-menu ul li:nth-child(5) a,
body.post-type-archive-character .nav-menu ul li:nth-child(6) a,
body.single-character .nav-menu ul li:nth-child(6) a,
body.page-id-130 .nav-menu ul li:nth-child(7) a,
body.page-id-234 .nav-menu ul li:nth-child(7) a,
body.post-type-archive-movie .nav-menu ul li:nth-child(8) a,
body.single-movie .nav-menu ul li:nth-child(8) a,
body.page-id-000 .nav-menu ul li:nth-child(9) a,
body.page-id-132 .nav-menu ul li:nth-child(10) a,
body.page-id-236 .nav-menu ul li:nth-child(10) a{
color: #ffffff !important;
text-shadow: 0 0 8px rgba(255, 0, 0, 0.9), 0 0 8px rgba(255, 0, 0, 0.9), 0 0 8px rgba(255, 0, 0, 0.9);
}
.nav-menu ul li a:hover {
color: #ffffff !important;
text-shadow: 0 0 8px rgba(255, 0, 0, 0.9), 0 0 8px rgba(255, 0, 0, 0.9), 0 0 8px rgba(255, 0, 0, 0.9);
}
/* main */
.Contents {
width: var(--contents);
min-height: 400px;
margin-top:-2em;
container-type: inline-size;
}
@media (min-width: 899px) {
.Contents {
min-height: 60vh;
margin-top:0;
}
}
h2 {
position: relative;
font-size: min(11cqw, 50px);
white-space: nowrap; 
margin: 0 auto;
text-align: center;
font-family: var(--font-en);
font-optical-sizing: auto;
font-weight: 300;
padding: 40px 0;
}
@media (min-width: 899px) {
h2 { font-size: var(--font72); }
}
h2::before {
content: "";
position: absolute;
top: 65%;
left: 50%;
transform: translate(-50%, -50%);
width: clamp(160px, 4.55vw + 145.45px, 200px);
aspect-ratio: 1 / 1; 
background-image: url(../images/common/h2_bg.png);
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
}
h2 span {
display: inline-block;
text-shadow: 0 0 10px rgba(255, 0, 0, 0.9), 0 0 10px rgba(255, 0, 0, 0.9);
margin-right: -0.15em;
position: relative;
z-index: 1;
}
h2 span:nth-child(even) { transform: rotate(7deg); }
h2 span:nth-child(odd) { transform: rotate(-7deg); }
h3 {
display: flex;
align-items: center;
justify-content: center;
color: var(--Key-color);
font-size: var(--font38);
line-height:1;
filter: drop-shadow(0 0 10px rgba(255, 0, 0, 0.8));
margin-bottom:1em;
}
h3::before,
h3::after {
content: "";
display: block;
flex-grow: 1;
height: 1px;
background-color: rgba(116, 29, 128, 0.6)
}
h3::before {
margin-right: .5em;
}
h3::after {
margin-left: .5em;
}
/* news */
.news {
margin: 3vw 0 0;
border-top: solid 1px rgba(255, 255, 255, 0.2);
}
@media (min-width: 899px) {
.news {
margin: 0;
}
}
.news ul li {
border-bottom: solid 1px rgba(255, 255, 255, 0.2);
margin: 0;
padding: 12px 5px;
cursor: pointer;
}
.news ul li:hover {
background-color: rgba(153, 19, 139, 0.15);
}
.news ul li dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
margin: 0;
padding: 0; 
}
.news ul li dl dt {
color: var(--Key-color);
font-size: var(--font30);
font-family: var(--font-en);
font-optical-sizing: auto;
font-weight: 500;
line-height: 1;
text-align: left;
padding: 0 1em 0 0;
}
.news ul li dl dt a {
color: var(--Key-color);
 text-shadow: none !important;
}
.news ul li dl dt span {
display: block;
font-size: var(--font16);
}
.news ul li dl dd {
color: var(--font-color);
text-align: left;
font-size: 3.7333333333vw;
font-weight:700;
line-height:1.6;
width:100%;
}
@media (min-width: 480px) {
.news ul li dl dd {
font-size: var(--font16);
}
}
.news ul li dl dd a {
color: var(--font-color);
}
.news ul li dt,
.news ul li dd {
padding: 0; 
}
.news ul li dt a,
.news ul li dd a {
display: block; 
width: 100%;
}
/* movie */
.movieIcon {
display: block;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
transition: transform 0.3s ease;
}
.movieIcon:hover {
-webkit-transform: translate(-50%, -50%) scale(1.1);
transform: translate(-50%, -50%) scale(1.1);
}
.movieIcon img {
width: 20%;
}
.glightbox-container {
--plyr-color-main: var(--Key-color);
}
/* comingsoon */
.comingsoon {
margin: 0 auto;
min-height: 150px;
grid-column: 1 / -1;
text-align: center; 
width: 100%; 
display: flex;
justify-content: center;
align-items: center;
text-align:center;
color: var(--Key-color);
font-size: var(--font34);
line-height:1;
filter: drop-shadow(0 0 10px rgba(255, 0, 0, 0.8));
}
@media (min-width: 899px) {
.comingsoon {
min-height: 300px;
}
}
/* animation */
@keyframes fadein {
0% {opacity: 0;}
100% {opacity: 1;}
}
/* NEWS */
body.single-post .news ul li {
cursor: default;
}
body.single-post .news ul li:hover {
background-color: transparent !important;
}
.newsContents{
margin:50px auto;
text-align: left;
line-height:1.8;
min-height: 200px;
}
.newsContents h2,
.newsContents h3 {
margin: 0;  
padding: 0;  
font-size: inherit; 
font-weight: inherit; 
font-family: inherit;  
font-optical-sizing: auto; 
text-align: initial;
color: inherit;  
display: inherit;
text-shadow: inherit;  
line-height:1.6;
}
.newsContents h2::before,
.newsContents h3::before,
.newsContents h3::after {
content: none;
}
.newsContents h2 {
font-size: 32px; 
font-weight: 700; 
margin-top:20px;
}
.newsContents h2 span {
display: inherit;
text-shadow: inherit;
margin-right: 0;
}
.newsContents h3 {
font-size: 24px; 
margin-bottom: 16px;
font-weight: 600; 
}
.newsContents h4 {
font-size: 20px; 
margin-bottom: 12px;
font-weight: 500; 
}
.single__thumb {
width: 80% !important;
margin: 1em auto;
}
.single__thumb img {
width: 100%!important;
height: auto!important;
display: block;
border: solid 1px rgba(255, 255, 255, 0.1);
}
.newsContents a {
color: var(--Key-color);
}
body.single .news ul li:hover {
background-color: rgba(153, 19, 139, 0);
}
/* pager */
.pagination{
margin: 40px auto 0;
font-family:  var(--font-en);
font-size: var(--font16);
}
.pagination ul {
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
padding: 0;
}
.news .pagination ul li {
border-bottom: none;
margin: 0 ;
padding: 0;
}
.news .pagination ul li:hover {
background-color: transparent;
}
.pagination .page-numbers {
display: inline-flex;
 justify-content: center;
align-items: center;
min-width: 28px;
height: 28px;
color: var(--font-color);
text-decoration: none;
box-sizing: border-box;
transition: all 0.2s ease; 
}
.pagination .page-numbers.current {
background-color: var(--Key-color);
color: var(--font-color);
}
.pagination a.page-numbers:hover {
color: var(--Key-color);
}
.pagination .prev,
.pagination .next {
color: rgba(255, 255, 255, 0.6);
}
.single__pagination{
border-top: solid 1px rgba(255, 255, 255, 0.2);
display: flex;
margin:80px auto 0;
padding-top:1em;
font-family: var(--font-en);
font-size: 3.7333333333vw;
padding-top: 10px;
}
.single__pagination a{
color: var(--font-color);
}
.single__pagination a:hover{
color: var(--Key-color);
}
.single__pagination .prev {
flex-basis: 30%;
text-align: left;
}
.single__pagination .newstop {
flex-basis: 40%;
text-align: center;
}
.single__pagination .next {
flex-basis: 30%;
text-align: right;
}
.wp-block-paragraph {
overflow-wrap: break-word; 
}