@charset "utf-8";
 body {
font-size: 18px;
line-height: 1.5
} @font-face {
font-family: "Nothing You Could Do";
src: url(https://atomiyosowaka.net/wp-content/themes/magemono-theme/assets/fonts/NothingYouCouldDo-Regular.ttf) format("truetype")
}
@font-face {
font-family: "Yuji Syuku";
src: url(https://atomiyosowaka.net/wp-content/themes/magemono-theme/assets/fonts/YujiSyuku-Regular.ttf) format("truetype")
}
@font-face {
font-family: "LINESeed-JP";
src: url(https://atomiyosowaka.net/wp-content/themes/magemono-theme/assets/fonts/LINESeedJP_OTF_Bd.woff2) format("woff2")
}
.nothing-you-could-do-regular {
font-family: "Nothing You Could Do", cursive;
font-style: normal;
font-weight: bold
}
.yuji-syuku-regular {
font-family: "Yuji Syuku", serif;
font-weight: 400;
font-style: normal
}
.sicyubi-hyojunpenji {
font-family: "sicyubi-hyojunpenji", sans-serif;
font-weight: 400;
font-style: normal;
}
.LINESeed-JP {
font-family: "LINESeed-JP", sans-serif;
font-weight: 700;
font-style: bold;
} *, *:before, *:after {
-webkit-box-sizing: border-box;
box-sizing: border-box
}
section {
padding: 5rem 0
}
.fig {
width: 200px;
height: 200px
}
a {
color: #343a40
}
.eye-catch {
object-fit: cover;
width: 100%
}
.grecaptcha-badge {
visibility: hidden
}
img:is([sizes="auto" i], [sizes^="auto," i]) {
contain-intrinsic-size: 300px 300px;
width: 100%;
object-fit: cover
}
.btn-basic {
color: #fff;
text-decoration: none;
display: inline-block;
text-align: center;
cursor: pointer;
vertical-align: middle;
box-sizing: border-box;
border: 1px solid transparent;
line-height: 1.5;
padding: .5em 1.5em;
background-color: #424A5B;
font-weight: bold;
border-radius: 4em;
outline: 0;
font-size: 1.4rem;
transition: background-color .3s
}
.wpcf7 .wpcf7-submit:disabled,
input.wpcf7-form-control.wpcf7-previous {
background-color: rgb(224, 224, 224);
color: #3f3f3f;
font-weight: 600;
font-size: 1em;
border: 1px solid rgb(109, 109, 109);
border-radius: 5px;
padding: .9em 2em;
}
input.wpcf7-previous {
display: inline-block !important;
}
[type="submit"]:not(:disabled) {
background-color: #2589d0;
color: #fff;
font-weight: 600;
font-size: 1em;
border: none;
border-radius: 5px; } .back-to-top {
position: fixed;
bottom: 10%;
right: 1%;
z-index: 1000
}
.back-to-top a {
-webkit-transition: .3s;
transition: .3s;
display: inline-block
}
.back-to-top a img {
width: 5rem;
height: 5rem
} .trigger {
opacity: 0;
visibility: hidden;
transform: translateY(30px);
transition: opacity 1s, visibility 1s, transform 1s
}
.is-fadein {
opacity: 1;
visibility: visible;
transform: translateX(0)
}   .navbar {
z-index: 999;
display: flex;
background: #fff;
overflow: visible;
} .navbar .navbar-nav .nav-link {
color: #1f2937;
font-weight: 600;
letter-spacing: .02em;
padding: .75rem 1rem;
position: relative;
transition: color .18s ease, opacity .18s ease;
}
.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:focus {
color: #111827;
text-decoration: none;
}
.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .show > .nav-link {
color: #111827;
} .navbar .btn-link.nav-link {
background: transparent;
border: 0;
color: #1f2937;
padding: .75rem 1rem;
font-weight: 600;
text-decoration: none;
cursor: pointer;
}
.navbar .btn-link.nav-link:hover,
.navbar .btn-link.nav-link:focus {
color: #111827;
text-decoration: none;
}
.navbar .btn-link.nav-link:focus-visible {
outline: 2px solid rgba(29, 78, 216, .3);
outline-offset: 2px;
border-radius: 6px;
} .navbar .dropdown-menu {
border-radius: 10px;
border: 1px solid rgba(0, 0, 0, .06);
box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
padding: .4rem;
top: 100% !important;
left: 0 !important;
right: auto !important;
transform: none !important; margin-top: .25rem;
z-index: 1060;
}
.navbar .dropdown-menu.show {
display: block;
} .navbar .dropdown {
position: relative;
}
.navbar .dropdown-item {
border-radius: 8px;
padding: .55rem .8rem;
font-weight: 600;
}
.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus {
background: rgba(0, 0, 0, .04);
} .navbar.navbar-dark .navbar-nav .nav-link,
.navbar.bg-dark .navbar-nav .nav-link,
.navbar.nav-scrolled .navbar-nav .nav-link {
color: #fff;
}
.navbar.navbar-dark .navbar-nav .nav-link:hover,
.navbar.bg-dark .navbar-nav .nav-link:hover,
.navbar.nav-scrolled .navbar-nav .nav-link:hover {
color: #fff;
opacity: .92;
} .navbar.navbar-dark .btn-link.nav-link,
.navbar.bg-dark .btn-link.nav-link,
.navbar.nav-scrolled .btn-link.nav-link,
.navbar.nav-scrolled .navbar-brand {
color: #fff;
}
.navbar.navbar-dark .btn-link.nav-link:hover,
.navbar.bg-dark .btn-link.nav-link:hover,
.navbar.nav-scrolled .btn-link.nav-link:hover {
color: #fff;
opacity: .92;
} .navbar.navbar-dark .dropdown-menu,
.navbar.bg-dark .dropdown-menu,
.navbar.nav-scrolled .dropdown-menu {
background: #0b1220;
border: 1px solid rgba(255, 255, 255, .08);
box-shadow: 0 12px 32px rgba(0, 0, 0, .45);
}
.navbar.navbar-dark .dropdown-item,
.navbar.bg-dark .dropdown-item,
.navbar.nav-scrolled .dropdown-item {
color: #e5e7eb;
}
.navbar.navbar-dark .dropdown-item:hover,
.navbar.navbar-dark .dropdown-item:focus,
.navbar.bg-dark .dropdown-item:hover,
.navbar.bg-dark .dropdown-item:focus,
.navbar.nav-scrolled .dropdown-item:hover,
.navbar.nav-scrolled .dropdown-item:focus {
background: rgba(255, 255, 255, .08);
color: #fff;
} .navbar.nav-scrolled {
background-color: #2F2F2F !important;
position: fixed;
width: 100%;
z-index: 999;
border-bottom: none;
} .navbar .navbar-toggler {
border-color: rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,0,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar.nav-scrolled .navbar-toggler {
border-color: rgba(255, 255, 255, .4);
}
.navbar.nav-scrolled .navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
} .nav-link--marker {
position: relative;
display: inline-block;
color: #1f2937;
}
.navbar.navbar-dark .nav-link--marker,
.navbar.bg-dark .nav-link--marker,
.navbar.nav-scrolled .nav-link--marker {
color: #fff;
}
.nav-link--marker::after {
content: "";
position: absolute;
left: -2px;
right: -2px;
height: .6em;
bottom: .12em;
z-index: -1;
background: linear-gradient(to bottom, transparent 35%, rgba(29, 78, 216, .18) 35%, rgba(29, 78, 216, .18) 100%);
border-radius: 4px;
transition: transform .18s ease, background-color .18s ease, opacity .18s ease;
}
.nav-link--marker:hover::after,
.nav-link--marker:focus::after {
background: linear-gradient(to bottom, transparent 35%, rgba(29, 78, 216, .3) 35%, rgba(29, 78, 216, .3) 100%);
transform: translateY(-1px);
} .navbar.navbar-dark .nav-link--marker::after,
.navbar.bg-dark .nav-link--marker::after,
.navbar.nav-scrolled .nav-link--marker::after {
background: linear-gradient(to bottom, transparent 35%, rgba(255, 255, 255, .25) 35%, rgba(255, 255, 255, .25) 100%);
}
.navbar.navbar-dark .nav-link--marker:hover::after,
.navbar.navbar-dark .nav-link--marker:focus::after,
.navbar.bg-dark .nav-link--marker:hover::after,
.navbar.bg-dark .nav-link--marker:focus::after,
.navbar.nav-scrolled .nav-link--marker:hover::after,
.navbar.nav-scrolled .nav-link--marker:focus::after {
background: linear-gradient(to bottom, transparent 35%, rgba(255, 255, 255, .4) 35%, rgba(255, 255, 255, .4) 100%);
}  #next-performance {
background-color: #6d7993;
}
#videos-photos, #page-history {
background-color: #946D7E;
}
#troupe-blog {
background-color: #e0c38c;
} #hero {
position: relative;
background: url(//atomiyosowaka.net/wp-content/themes/magemono-theme/assets/img/top-main.png) center center/cover no-repeat;
min-height: 70vh;
display: flex;
align-items: center;
color: #fff;
text-shadow: 0 2px 6px rgba(0, 0, 0, .6)
}
#hero::before {
content: "";
position: absolute;
inset: 0;
background: rgba(0, 0, 0, .45);
z-index: 0
}
#hero > .container {
position: relative;
z-index: 1
}
#hero .btn {
box-shadow: 0 4px 12px rgba(0, 0, 0, .18)
}
#hero .btn-outline-light:hover {
color: #111;
background: #fff
} .floating-reviews {
position: relative;
width: 100%;
height: 100px;
overflow: hidden;
text-align: center;
} .floating-review {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
opacity: 0;
background: rgba(255, 255, 255, 0.92);
color: #000;
padding: 0.7rem;
border-radius: 0.8rem;
width: 90%; max-width: 400px; box-sizing: border-box; line-height: 1.4;
font-size: 1rem;
text-shadow: none; animation: fadeReview 18s infinite ease-in-out;
} .review-title {
font-weight: bold;
display: block;
margin-bottom: 0.3rem;
text-shadow: none; } @keyframes fadeReview {
0%, 15% {
opacity: 0;
transform: translate(-50%, 10px);
}
20%, 40% {
opacity: 1;
transform: translate(-50%, 0);
}
45%, 100% {
opacity: 0;
transform: translate(-50%, -10px);
}
} .floating-review:nth-child(1) {
animation-delay: 0s;
opacity: 1; }
.floating-review:nth-child(2) {
animation-delay: 6s;
}
.floating-review:nth-child(3) {
animation-delay: 12s;
}
.floating-review:nth-child(4) {
animation-delay: 18s;
}  @media (max-width: 768px) {
.floating-review {
width: 100%; max-width: none; font-size: 0.95rem;
}
} footer {
background-color: #9099A2
}
.footer-bnr {
background-color: #dee2e6 !important
} .bg-plum-purple {
background-color: #aa4c8f
}
.bg-omesicha {
background-color: #43676b
}
.bg-lazuli-color {
background-color: #1e50a2
} #page-members, #page-performance {
background-color: #d5d5d5;
}
#front-page section .container > h2, section .container > h2 {
margin-bottom: .5rem;
font-size: 2.5rem
} #about h3 {
font-size: 1.4rem
}
.bg-primary-gradient {
background-image: linear-gradient(90deg, rgba(141, 139, 226, 1), rgba(253, 187, 203, 1))
} @media (max-width: 767.98px) {
#next-performance img.img-fluid {
width: 100%;
height: auto !important;
max-width: 100%;
object-fit: cover;
object-position: center;
display: block;
}
}  #page-performance .frame {
position: relative;
border-top: 2px solid var(--cat-color, #6d7993);
padding-top: .5rem;
}
#page-performance .frame::before,
#page-performance .frame::after {
content: "";
position: absolute;
top: -10px;
width: 2px;
height: calc(100% + 20px);
background-color: var(--cat-color, #6d7993);
} #page-performance .frame::before {
left: 0;
}
#page-performance .frame::after {
right: 0;
} @media (min-width: 768px) {
#page-performance .pf-actions .btn-outline-dark {
min-width: 260px;
}
}
#page-performance {
line-height: 180%
}
#page-performance .row {
min-height: 160px;
color: #2f2f2f
}
#page-performance h3 {
font-size: 3rem;
}
#page-performance h3 span {
font-size: 4rem;
position: absolute;
top: 0;
left: 0;
display: block;
padding: 3px 20px;
color: #fff;
border-radius: 10px 0 20px 10px;
background: #6d7993
}
#page-performance h4 {
margin-bottom: 1.5rem !important
}
#page-performance table th, #page-performance table td {
background-color: transparent
}
#page-performance .material-symbols-outlined {
color: #6d7993 !important;
font-weight: bold;
margin-top: .5rem;
padding-right: 1rem;
vertical-align: bottom
}
#page-performance .btn {
background-color: #b44c97;
width: 100%;
padding: .5rem;
margin-top: 1rem;
color: #fff;
font-size: 1.2rem
}
#page-performance .btn:hover {
opacity: .6
} .frame {
position: relative;
padding: .5em 1.5em;
border-top: 2px solid #000;
border-bottom: 2px solid #000
}
.frame:before, .frame:after {
content: "";
position: absolute;
top: -10px;
width: 2px;
height: calc(100% + 20px);
background-color: #000
}
.frame:before {
left: 10px
}
.frame:after {
right: 10px
}
.frame p {
margin: 0;
padding: 0
} .others {
position: relative;
margin-top: 1rem;
padding: 1rem 1rem .5rem;
border: 3px solid #6d7993;
border-radius: 8px
}
.others .others-title {
position: absolute;
display: inline-block;
top: -13px;
left: 10px;
padding: 0 9px;
line-height: 1;
font-size: 19px;
background-color: #d5d5d5;
color: #6d7993;
font-weight: bold
}
.others ul li {
line-height: 1.5;
padding: .5rem 1.4rem;
border-bottom: 2px dashed #6d7993;
list-style-type: none !important
} #page-history .material-symbols-outlined {
color: #fff;
font-size: 48px
}
#page-history .btn {
color: #fff;
background-color: #AD2A52;
border: none
}
#page-history .btn:hover {
color: #fff;
background-color: #96858f;
border-color: #fff
} #activity .material-symbols-outlined {
color: #fff;
font-size: 48px
}
#activity .btn:hover {
color: #fff;
background-color: #96858f;
border-color: #fff
}
.history-border {
border-top: 3px solid #fff;
border-right: 3px solid #fff;
margin-left: 24px;
padding-bottom: 3rem;
padding-right: 5rem;
width: 42.7%
}
.ttl-box {
position: relative;
margin-top: 1em;
padding: 1em 2em
}
.ttl-box h3 {
background-color: #946D7E;
width: 40%
} .profile-card {
width: 100%;
max-width: 400px;
position: relative;
background: #fff;
box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
overflow: hidden;
display: flex;
flex-direction: column;
} .profile-card::before {
content: "";
position: absolute;
top: -15%;
left: -10%;
width: 120%;
height: 150px;
background: #6d7993;
transform: skew(15deg, 10deg);
z-index: 0;
} .profile-card__inner {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
flex: 1 1 auto;
} .profile-thumb {
overflow: hidden;
width: 200px;
height: 200px;
border: #fff 3px solid;
border-radius: 50%;
margin: 20px auto 0;
background: #fff;
}
.profile-thumb img {
display: block;
width: 100%;
height: auto;
} .profile-content {
flex: 1 1 auto;
margin: 0;
padding: 15px;
background: #fff;
} .profile-content span {
display: block;
}
.profile-name {
margin-bottom: 3px;
font-weight: bold;
text-align: center;
}
.profile-job {
margin-bottom: 10px;
color: #ccc;
text-align: center;
}
.profile-intro {
font-size: 1rem;
} .profile-sns {
position: relative;
flex-shrink: 0;
padding: 35px 0 20px;
text-align: center;
color: #fff;
z-index: 1; }
.profile-sns::before {
content: "";
position: absolute;
inset: 0;
background: #6d7993;
clip-path: polygon(0 0, 100% 40px, 100% 100%, 0 100%); z-index: -1;
}
.profile-sns p {
display: block;
font-size: .8rem;
margin-bottom: 5px;
}
.profile-sns img {
width: 30px;
margin: 0 5px;
color: #fff;
} .news-list li:last-child {
border-bottom: 2px solid #fff
} .rec-ttl {
background-color: #6d7993
}
#page-rec section:nth-child(3) {
background-color: #96858f
} .heading {
font-size: 3rem;
font-weight: bold
}
.heading span {
display: flex;
align-items: center;
color: #498ee0;
font-size: 18px;
text-transform: uppercase;
margin-bottom: .5rem
}
.heading span::before {
content: '';
display: inline-block;
margin-right: 20px;
width: 40px;
height: 1px;
background-color: #498ee0
}
.synopsis {
position: relative;
font-size: 26px;
text-align: center;
border-bottom: 5px solid #ddd;
padding-bottom: 1rem
}
.synopsis::after {
content: '';
position: absolute;
bottom: -5px;
left: 50%;
transform: translateX(-50%);
width: 70px;
height: 5px;
background-color: #387ccc
}
.heading-date, .heading-time {
position: relative;
padding-top: 30px;
font-size: 1.5rem;
border-bottom: 1px solid rgba(5, 62, 98, 1)
}
.heading-date span, .heading-time span {
position: relative;
z-index: 2
}
.heading-date::before, .heading-time::before {
content: attr(data-en);
position: absolute;
top: 0;
left: 0;
color: rgba(5, 62, 98, .2);
font-size: 40px;
text-transform: uppercase;
z-index: 1
} div.wpcf7 .wpcf7-spinner {
display: none !important
}
.form-wrap {
width: 100%;
margin: 0 auto
}
.required {
font-size: .8em;
padding: 3px;
background: #c00;
color: #fff;
border-radius: 2px;
margin-right: 10px;
margin-bottom: 2px;
display: inline-block
}
.form-item, .form-input {
border-bottom: 1px solid #ccc
} .wp-block-button__link:hover {
opacity: .6
} .tmm .tmm_plugin_f .tmm_job {
font-size: 12px !important
}
.tmm .tmm_plugin_f .tmm_desc {
text-align: left
}
#member .container .tmm .tmm_member .tmm_photo {
border-radius: 10% !important
}  .promo-free-ticket {
position: fixed;
top: calc(var(--header-height, 64px) + max(8px, env(safe-area-inset-top)));
right: 1rem;
z-index: 1060;
color: #fff;
background: #111;
border: 1px solid rgba(255, 255, 255, .12);
border-left: 4px solid var(--brand-accent, #F59E0B);
padding: .6rem .8rem;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .6rem;
border-radius: 15px; box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
opacity: 0;
transform: translateY(-8px);
transition: transform .3s ease, opacity .3s ease;
max-width: 420px;
}
.promo-free-ticket.is-in {
opacity: 1;
transform: translateY(0);
}
.promo-free-ticket.is-out {
opacity: 0;
transform: translateY(-8px);
} .promo-free-ticket .promo-title {
font-weight: 800;
color: var(--brand-accent, #F59E0B);
}
.promo-free-ticket .promo-sub {
opacity: .85;
font-size: .9em;
} .promo-free-ticket .promo-cta-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: .5rem .9rem;
border-radius: 10px;
text-decoration: none;
color: #111;
background: #fff;
font-weight: 700;
transition: transform .2s ease;
text-shadow: none;
}
.promo-free-ticket .promo-cta-btn:hover {
transform: translateY(-1px);
} .promo-free-ticket .promo-close {
flex: 1 1 100%;
margin-top: .5rem;
display: inline-flex;
align-items: center;
justify-content: center;
padding: .5rem .75rem;
border-radius: 10px;
border: 2px solid rgba(255, 255, 255, .7);
background: transparent;
color: #fff;
font-weight: 600;
cursor: pointer;
text-shadow: none;
}
.promo-free-ticket .promo-close:hover {
background: rgba(255, 255, 255, .15);
border-color: #fff;
}
.promo-free-ticket .promo-close:focus {
outline: 2px solid #fff;
outline-offset: 2px;
} .archive-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 18px;
} .event-hero {
background: linear-gradient(180deg, rgba(0, 0, 0, .02), transparent)
}
.event-title {
font-size: clamp(1.6rem, 3.2vw, 2.4rem);
line-height: 1.2
}
.event-kana {
letter-spacing: .12em
}
.event-meta .meta-line {
display: flex;
gap: .5rem;
align-items: flex-start
}
.event-meta .meta-label {
display: inline-block;
min-width: 4.5em;
font-weight: 700
}
.event-tags .badge {
font-weight: 600
}
.bg-category {
background: #6d7993;
color: #fff
}
.event-datetime .material-symbols-outlined {
font-size: 20px;
line-height: 1
}
.min-w-6em {
min-width: 6em
}
.object-fit-cover {
object-fit: cover
}
.event-contents p {
margin-bottom: 1rem
} .min-w-6em {
min-width: 6em
}
.event-place dt {
font-weight: 700
}
.event-place dd {
margin: 0
}
.event-hero .material-symbols-outlined,
.event-datetime .material-symbols-outlined {
font-size: 20px;
line-height: 1
} .event-venue .card {
border-radius: 12px;
}
.event-venue .min-w-6em {
min-width: 6em;
}
.event-venue .map-box {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.event-venue .map-box > * {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
border: 0 !important;
display: block !important;
} .event-venue .map-box iframe,
.event-venue .map-box .gm-style,
.event-venue .map-box > div,
.event-venue .map-box > div > * {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
border: 0 !important;
} .event-venue {
isolation: isolate;
}
.event-venue .container {
position: relative;
z-index: 0;
} .event-venue .event-place .d-flex {
flex-wrap: wrap; }
.event-venue .event-place dt {
width: 6em; flex: 0 0 auto;
margin: 0;
}
.event-venue .event-place dd {
flex: 1 1 auto;
min-width: 0; margin: 0;
word-break: break-word; overflow-wrap: anywhere; } .event-venue .map-box {
position: relative;
overflow: hidden; }
.event-venue .map-box iframe {
width: 100% !important; height: 100% !important;
border: 0;
display: block;
} .event-venue .map-box > * {
max-width: 100%;
} .event-venue .event-place a {
word-break: break-all;
overflow-wrap: anywhere;
} .event-venue .map-box {
position: relative;
overflow: hidden;
}
.event-venue .map-box iframe,
.event-venue .map-box > * {
width: 100% !important;
height: 100% !important;
border: 0 !important;
display: block !important;
} .event-venue .venue-dl .venue-row {
display: grid;
grid-template-columns: 6em 1fr; gap: .5rem 1rem;
align-items: start;
margin-bottom: .5rem;
}
.event-venue .venue-dl dt {
font-weight: 700;
margin: 0;
}
.event-venue .venue-dl dd {
margin: 0;
min-width: 0; word-break: break-word;
overflow-wrap: anywhere; }
.event-venue .venue-dl a {
word-break: break-all;
}  .archive-card {
display: flex;
flex-direction: column;
border-radius: 12px;
overflow: hidden;
} .archive-card .thumb-wrap {
display: block;
overflow: hidden;
width: 100%;
}
.archive-card .thumb-img {
display: block;
width: 100%;
height: auto; object-fit: cover; object-position: center;
transform: translateZ(0); backface-visibility: hidden;
}
.archive-card .card-body {
padding: 14px 14px 16px;
}
.archive-card.has-frame {
border: 1px solid rgba(0, 0, 0, .08);
border-radius: 12px;
background: #fff;
box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
overflow: hidden;
} .blog-archive-filters {
padding: 12px;
border: 1px solid rgba(0, 0, 0, .06);
border-radius: 10px;
background: #fafafa;
}  body.has-fixed-cta { padding-bottom: calc(64px + env(safe-area-inset-bottom));
}
.cta-footer {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
background: #fff;
border-top: 1px solid #e5e5e5;
box-shadow: 0 -8px 24px rgba(0, 0, 0, .08);
padding: 8px max(12px, env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-right));
}
.cta-footer__inner {
max-width: 1080px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
align-items: center;
}
.cta-footer__btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 64px;
width: 100%;
border-radius: 12px;
font-weight: 700;
text-decoration: none;
color: #fff;
letter-spacing: .02em;
line-height: 1;
transition: transform .06s ease, filter .2s ease, opacity .2s ease;
-webkit-tap-highlight-color: transparent;
gap: .5rem; }
.cta-footer__btn:active {
transform: translateY(1px) scale(.99);
}
.cta-footer__btn--recruit {
background: #1e50a2;
}
.cta-footer__btn--ticket {
background: #AD2A52;
}
@media (hover:hover) {
.cta-footer__btn:hover {
filter: brightness(1.05);
}
}
.cta-footer__btn .material-symbols-outlined,
.cta-footer__btn .icon,
.cta-footer__btn svg {
font-size: 1.25em; line-height: 1;
vertical-align: middle;
display: inline-block;
}
.cta-footer__btn {
min-height: 56px;
}  .rec-sticky-cta {
background: rgba(255, 255, 255, .96);
backdrop-filter: saturate(1.1) blur(4px);
box-shadow: 0 -6px 24px rgba(0, 0, 0, .10);
} .rec-sticky-cta__btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: .5rem;
width: 100%;
padding: .8rem 1rem;
border-radius: .75rem;
font-weight: 800;
text-decoration: none;
border: 1px solid transparent;
transition: transform .06s, box-shadow .2s, background-color .2s, color .2s;
}
.rec-sticky-cta__btn:active {
transform: translateY(1px);
} .rec-sticky-cta__btn--primary {
background: #424A5B;
color: #fff;
}
.rec-sticky-cta__btn--primary:hover {
background: #2f3441;
color: #fff;
box-shadow: 0 6px 18px rgba(66, 74, 91, .25);
} .rec-sticky-cta__btn--line {
background: #06C755;
color: #fff;
}
.rec-sticky-cta__btn--line:hover {
background: #05b64e;
color: #fff;
box-shadow: 0 6px 18px rgba(6, 199, 85, .28);
} .rec-sticky-cta .material-symbols-outlined {
font-size: 1.25em;
line-height: 1;
}
.rec-sticky-cta .rec-line-icon {
width: 1.25em;
height: 1.25em;
display: inline-block;
} body.rec-cta--recruit.has-fixed-cta,
body.rec-cta--form.has-fixed-cta {
padding-bottom: calc(110px + env(safe-area-inset-bottom)); } body.rec-cta--form .rec-sticky-cta__btn--primary,
body.page-template-page-interview .rec-sticky-cta__btn--primary {
background: #1e50a2; color: #fff;
}
body.rec-cta--form .rec-sticky-cta__btn--primary:hover,
body.page-template-page-interview .rec-sticky-cta__btn--primary:hover {
background: #184285; color: #fff;
box-shadow: 0 6px 18px rgba(30, 80, 162, .25);
} #page-rec .rec-modern {
isolation: isolate;
} #page-rec .rec-roles {
padding: clamp(48px, 6vw, 72px) 0;
}
#page-rec .rec-role-card {
position: relative;
border: 1px solid rgba(0, 0, 0, .06);
border-radius: 16px;
padding: 3rem 1.5rem;
box-shadow: 0 8px 24px rgba(0, 0, 0, .05);
transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
#page-rec .rec-role-card:hover {
transform: translateY(-4px);
box-shadow: 0 14px 36px rgba(0, 0, 0, .08);
border-color: rgba(0, 0, 0, .12);
}
#page-rec .rec-role-card--cast {
background: #f6bfbc;
}
#page-rec .rec-role-card--staff {
background: #a2d7dd;
}
#page-rec .rec-role-card--guest {
background: #dbd0e6;
}
#page-rec .rec-role-card--ad {
background: #92b5a9;
}
#page-rec .rec-role-card__list {
margin: 0;
padding-left: 1.2rem;
font-size: .95rem;
} #page-rec .rec-facts {
padding: clamp(40px, 5vw, 64px) 0;
}
#page-rec .rec-feature {
border: 1px solid rgba(0, 0, 0, .06);
border-radius: 14px;
background: #fff;
padding: 16px 16px 14px;
box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
}
#page-rec .rec-feature__head {
font-weight: 800;
margin-bottom: .4rem;
display: flex;
align-items: center;
gap: .4rem;
} #page-rec .rec-gallery {
padding: clamp(40px, 5vw, 64px) 0;
}
#page-rec .rec-masonry {
columns: 2 280px;
column-gap: 16px;
}
#page-rec .rec-masonry__item {
break-inside: avoid;
margin-bottom: 16px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
}
#page-rec .rec-masonry__item img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
} #page-rec .bg-lightblue {
background-color: #ecf7fb !important;
}
#page-rec .list-unstyled {
padding-left: 0;
list-style: none;
}
#page-rec .flow > li .flow-icon {
font-family: 'Montserrat', sans-serif;
font-size: 18px;
line-height: 50px;
width: 120px;
color: #fff;
background-color: #6b90db;
margin: 0 auto 20px;
display: block;
text-align: center;
position: relative;
letter-spacing: 2px;
}
#page-rec .flow > li .flow-icon::before {
content: "";
border: solid transparent;
border-top-width: medium;
border-top-color: transparent;
border-right-width: medium;
border-bottom-width: medium;
border-left-width: medium;
border-width: 8px;
border-top-color: #6b90db;
position: absolute;
top: calc(100% - .2rem);
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#page-rec .flow > li dl dd {
margin-bottom: .5rem;
margin-left: 0;
}
@media (min-width: 992px) {
#page-rec .flow > li {
-ms-flex-preferred-size: 18%;
flex-basis: 18%;
}
.flow > li:not(:last-child) dl::before {
content: "";
width: 14px;
height: 14px;
margin-right: 10px;
display: inline-block;
border-top: 4px solid #6b90db;
border-right: 4px solid #6b90db;
position: absolute;
top: calc(50% - 14px);
left: 104%;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
#page-rec .flow > li dl {
padding: 1rem;
margin: 0;
border: 3px solid #6b90db;
position: relative;
height: 290px;
}
#page-rec .flow > li dl dt {
font-size: 20px;
font-weight: 600;
color: #6b90db;
-ms-flex-preferred-size: 20%;
flex-basis: 20%;
margin-bottom: 1vh;
text-align: center;
}
}
@media screen and (max-width: 991.98px) {
.flow > li dl {
padding: 1rem;
margin: 0;
border: 3px solid #6b90db;
position: relative;
}
.flow > li dl dt {
font-size: 20px;
font-weight: 600;
color: #6b90db;
-ms-flex-preferred-size: 20%;
flex-basis: 20%;
margin-bottom: 1vh;
text-align: center;
}
} #page-rec .rec-faq {
padding: clamp(40px, 5vw, 64px) 0;
}
#page-rec .rec-faq .accordion-item {
border-radius: 12px;
overflow: hidden;
border: 1px solid rgba(0, 0, 0, .06);
margin-bottom: 10px;
}
#page-rec .rec-faq .accordion-button {
font-weight: 700;
}
#page-rec .rec-faq .accordion-button:focus {
box-shadow: none;
} .rec-masonry__item {
position: relative;
overflow: hidden;
}
.rec-masonry__item img {
display: block;
width: 100%;
border-radius: 8px;
}
.rec-masonry__item figcaption {
margin-top: .4rem;
font-size: .9rem;
line-height: 1.4;
color: #555;
text-align: center;
} .rec-director-digest p {
line-height: 1.8;
margin-bottom: .5rem;
}
.director-interview h2 {
color: #1e50a2;
border-left: 4px solid #1e50a2;
padding-left: .6rem;
font-size: 1.15rem;
}
.director-interview p {
line-height: 1.8;
margin-bottom: 1rem;
} .rec-hero {
position: relative;
padding: clamp(48px, 6vw, 72px) 0;
overflow: hidden;
background: transparent; color: #fff;
}
.rec-hero__bg {
position: absolute;
inset: 0;
z-index: 0;
overflow: hidden;
}
.rec-hero__video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
background: transparent !important;
display: block; will-change: transform;
} .rec-hero > *:not(.rec-hero__bg) {
position: relative;
z-index: 2;
} .rec-hero::after {
content: "";
position: absolute;
inset: 0;
background: rgba(11, 18, 32, 0.5); z-index: 1;
pointer-events: none;
} @supports (animation-timeline: view()) {
.rec-hero__video {
filter: brightness(1.0001); }
} #page-rec .rec-hero__title {
line-height: 1.15;
margin-bottom: .5rem;
font-size: clamp(2rem, 6vw, 3.5rem);
font-weight: 700;
text-align: right;
}
#page-rec .rec-hero__lead {
opacity: .95;
font-size: 1.1rem;
line-height: 1.8;
text-align: right;
margin-top: 1.2rem;
}
.rec-hero__cta {
margin-bottom: 1rem;
text-align: right;
}
#page-rec .rec-hero__cta .btn-basic {
border-radius: 12px;
font-weight: 800;
}
#page-rec .rec-btn-line {
background: #06C755;
color: #fff;
}
#page-rec .rec-btn-line:hover {
background: #05b64e;
color: #fff;
box-shadow: 0 6px 18px rgba(6, 199, 85, .28);
}
.rec-hero__cta a {
margin-left: 12px;
} #page-rec .rec-badges {
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
list-style: none;
list-style: none;
padding: 0;
margin: 0;
gap: 20px;
}
#page-rec .rec-badges li {
align-items: center;
gap: .35rem;
background: rgba(255, 255, 255, .12);
border: 1px solid rgba(255, 255, 255, .18);
padding: .4rem .6rem;
border-radius: .6rem;
font-size: 1rem;
margin-bottom: 8px; } .rec-badges span {
margin-right: 8px; } .rec-voices {
margin: 72px auto 40px;
padding: 0 8px;
}
.rec-voices__title {
font-size: clamp(1.4rem, 2.4vw, 1.9rem);
font-weight: 800;
line-height: 1.35;
margin: 0 0 18px;
padding-left: 14px;
border-left: 4px solid #c9a85a; color: #111;
} .rec-voice {
display: grid;
grid-template-columns: 1fr;
gap: 24px;
align-items: center;
margin: 24px 0 12px;
}
.rec-voice {
grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
gap: 36px;
} .rec-voice__bubble {
position: relative;
background: #ffffff;
border: 1px solid #e7e7ec;
border-radius: 14px;
padding: 20px 22px 16px;
color: #222;
font-size: 1.2rem;
} .rec-voice--bubble-right .rec-voice__bubble::before,
.rec-voice--bubble-right .rec-voice__bubble::after {
content: "";
position: absolute;
top: 49px; right: -20px;
border-style: solid;
display: block;
width: 0;
height: 0;
} .rec-voice--bubble-right .rec-voice__bubble::before {
border-width: 12px 0 12px 50px;
border-color: transparent transparent transparent #e7e7ec;
right: -51px; } .rec-voice--bubble-right .rec-voice__bubble::after {
border-width: 10px 0 10px 48px;
border-color: transparent transparent transparent #ffffff;
right: -49px;
} .rec-voice--bubble-right .rec-voice__bubble::after {
content: "";
position: absolute;
bottom: -11px;
left: 42px; border-width: 11px 10px 0 10px;
border-style: solid;
border-color: #ffffff transparent transparent transparent;
} .rec-voice__text p:last-child {
margin-bottom: .8em;
} .rec-voice__role {
margin-top: 6px;
padding-top: 10px;
border-top: 1px dashed #e4e4ea;
color: #8d2a3b; font-weight: 700;
} .rec-voice__person {
text-align: center;
}
.rec-voice__img {
width: 200px; height: auto; max-width: 100%;
object-fit: contain;
}
.rec-voice__caption {
margin-top: 10px;
display: flex;
flex-direction: column;
gap: 2px;
}
.rec-voice__name {
font-weight: 800;
color: #111;
font-size: 1.05rem;
}
.rec-voice__affil {
color: #666;
font-size: .95rem;
} .button-54 {
display: flex;
justify-content: center;
align-items: center;
position: relative;
width: 100%;
margin: 0 auto;
padding: .9em 3em .9em 2em;
border: 1px solid #2589d0;
border-radius: 5px;
background-color: #fff;
color: #2589d0;
font-size: 1em;
}
.button-54::after {
position: absolute;
right: 2em;
transform: translateY(-50%);
transform-origin: left;
width: 2em;
height: .5em;
background-color: #2589d0;
clip-path: polygon(0 100%, 100% 100%, 70% 40%, 70% 90%, 0% 90%);
content: '';
transition: transform .3s;
}
.button-54:hover {
border-color: #2589d0 !important;
color: #2589d0 !important;
}
.button-54:hover::after {
transform: translateY(-50%) scaleX(1.4);
} .button-1 {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
margin: 0 auto;
padding: .9em 2em;
border: 1px solid #fff;
border-radius: 5px;
color: #fff;
font-size: 1em;
}
.button-1:hover {
background-color: #1e50a2;
border: 1px solid #fff;
}   .pagination {
margin-bottom: 0;
} .pagination .page-link {
color: #212529; border-color: #dee2e6;
padding: 0.5rem 0.75rem;
transition: all 0.3s ease;
} .pagination .page-link:hover {
background-color: #e9ecef;
color: #000;
border-color: #dee2e6;
z-index: 2;
}  .pagination .page-item.active .page-link,
.pagination .current {
background-color: #212529 !important; border-color: #212529 !important;
color: #fff !important;
z-index: 3;
} .pagination .dots {
display: inline-block;
padding: 0.5rem 0.75rem;
border: 1px solid #dee2e6;
background-color: #fff;
color: #6c757d;
} span.page-link.current {
cursor: default;
}  .x-style-grid {
width: 100%;
max-width: 526px; height: 743px; display: flex;
flex-direction: column; gap: 4px; background-color: #eee;
border-radius: 12px;
overflow: hidden; margin: 0 auto;
}
.x-style-grid .grid-item {
flex: 1; position: relative;
overflow: hidden;
display: block;
}
.x-style-grid .grid-item img {
width: 100%;
height: 100%;
object-fit: cover; transition: opacity 0.3s ease;
}
.x-style-grid .grid-item:hover img {
opacity: 0.8;
} @media (max-width: 767px) {
.x-style-grid {
height: 500px; }
}  .event-item.cat-stage {
--event-color: #198754;
}
.event-item.cat-event {
--event-color: #0dcaf0;
}
.event-item.cat-video {
--event-color: #ffc107;
}
.event-item.cat-pr {
--event-color: #0d6efd;
} .pf-cat {
display: inline-block;
background-color: var(--event-color);
color: #fff;
padding: 2px 10px;
font-size: 0.75rem;
border-radius: 2px;
vertical-align: middle;
margin-right: 10px;
} .event-table th {
width: 30%;
background-color: #fafafa;
font-weight: 600;
} .event-divider {
margin: 4rem 0;
border-top: 1px solid #eee;
}  .custom-album-img,
.object-fit-cover {
width: 100%;
aspect-ratio: 4 / 3; object-fit: cover; object-position: top; display: block; } #videos-photos img,
.album-photo-link img {
transition: transform 0.3s ease;
}
#videos-photos img:hover,
.album-photo-link:hover img {
transform: scale(1.05);
}  @media (min-width: 992px) {
#videos-photos .row.align-items-start > div {
margin-top: 0;
padding-top: 0;
} #videos-photos .col-lg-6 .row {
margin-top: 0;
}
}  .album-card {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.album-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
} .album-photo-link {
display: block;
overflow: hidden;
transition: transform 0.2s;
} :root {
--ps-main: #b22222; --ps-dark: #222222; --ps-gray: #666666;
--ps-bg-light: #fbf9f7; --ps-white: #ffffff;
}
.private_show { 
color: var(--ps-dark); 
line-height: 1.7; 
font-family: "Noto Serif JP", serif; 
overflow-x: hidden;
} .private_show .ps_hero { 
position: relative; 
background-size: cover; 
background-position: center; 
padding: clamp(50px, 6vh, 80px) 0; color: #fff !important; 
text-align: center; 
}
.private_show .ps_hero_overlay { 
position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.5)); 
z-index: 1; 
}
.private_show .ps_hero_inner { position: relative; z-index: 2; }
.private_show .ps_hero_title { 
font-size: clamp(1.4rem, 4vw, 2.4rem); 
margin-bottom: 0.8rem; 
line-height: 1.3; 
font-weight: 700;
letter-spacing: 0.05em;
}
.private_show .ps_hero_lead { 
font-size: clamp(0.85rem, 1.8vw, 1.05rem); 
max-width: 800px; 
margin: 0 auto 1.2rem; 
color: #f0f0f0; 
}
.private_show .ps_hero_cta .ps_btn {
padding: 0.7rem 2.2rem;
font-size: 0.95rem;
} .private_show .ps_section { padding: clamp(50px, 8vw, 80px) 0; }
.private_show .bg_light { background-color: var(--ps-bg-light); }
.private_show .bg_white { background-color: var(--ps-white); }
.private_show .ps_section_title { 
font-size: clamp(1.5rem, 3vw, 2rem); 
margin-bottom: 45px; 
text-align: center; 
position: relative;
}
.private_show .ps_section_title::after { 
content: ''; display: block; margin: 12px auto 0; 
width: 50px; height: 3px; background: var(--ps-main); 
} .private_show .ps_menu_card {
background: var(--ps-white);
padding: 35px 25px;
height: 100%;
border-radius: 8px;
box-shadow: 0 8px 25px rgba(0,0,0,0.05);
transition: all 0.3s ease;
border: 1px solid #f0f0f0;
text-align: center;
}
.private_show .ps_menu_card:hover {
transform: translateY(-8px);
box-shadow: 0 12px 35px rgba(178, 34, 34, 0.12);
}
.private_show .ps_icon {
font-size: 2.8rem;
color: var(--ps-main);
margin-bottom: 15px;
}
.private_show .ps_feature_list {
list-style: none;
padding: 15px 0 0;
margin-top: 15px;
text-align: left;
border-top: 1px dashed #ddd;
}
.private_show .ps_feature_list li {
font-size: 0.85rem;
margin-bottom: 6px;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #f9f9f9;
} .private_show .ps_point_box { 
padding: 30px; 
background: var(--ps-white); 
border-left: 5px solid var(--ps-main); 
box-shadow: 0 5px 15px rgba(0,0,0,0.04);
height: 100%;
} .private_show .ps_slider { 
width: 100%; 
overflow: hidden; 
padding: 20px 0; 
position: relative;
} .private_show .ps_slider::before,
.private_show .ps_slider::after {
content: "";
position: absolute;
top: 0;
width: 100px;
height: 100%;
z-index: 2;
pointer-events: none;
}
.private_show .ps_slider::before {
left: 0;
background: linear-gradient(to right, var(--ps-white), transparent);
}
.private_show .ps_slider::after {
right: 0;
background: linear-gradient(to left, var(--ps-white), transparent);
}
.private_show .ps_slider_track { 
display: flex; 
gap: 20px; 
width: max-content; animation: infinity-scroll 40s linear infinite; 
} .private_show .ps_slider_track:hover {
animation-play-state: paused;
}
.private_show .ps_voice_card { 
width: 320px; 
background: var(--ps-white); 
border-radius: 10px;
padding: 25px; 
border: 1px solid #eee;
flex-shrink: 0; }
@keyframes infinity-scroll {
0% {
transform: translateX(0);
}
100% { transform: translateX(-50%);
}
} .private_show .ps_flow { 
display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); 
gap: 25px; margin-top: 40px; 
}
.private_show .ps_flow_item { 
position: relative; 
padding: 40px 20px 25px; background: var(--ps-white); border-radius: 8px;
text-align: center; box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.private_show .ps_flow_num { 
position: absolute; top: -18px; left: 50%; transform: translateX(-50%); 
width: 36px; height: 36px; background: var(--ps-main); color: #fff; 
border-radius: 50%; display: flex; align-items: center; justify-content: center; 
font-size: 1.1rem; font-weight: 900;
} .private_show .ps_price_box { 
max-width: 800px; margin: 0 auto; padding: 45px 30px; 
background: #fdf2f2; border: 1px solid var(--ps-main); 
border-radius: 12px;
}
.private_show .ps_price_list { 
display: inline-block; list-style: none; padding: 0; margin: 0 auto;
}
.private_show .ps_price_list li { 
position: relative; padding-left: 1.5rem; margin-bottom: 8px; font-size: 0.95rem; 
text-align: left;
}
.private_show .ps_price_list li::before { 
content: "※"; position: absolute; left: 0; color: var(--ps-main); font-weight: bold;
} .private_show .ps_btn { 
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
padding: 1rem 2.5rem; border-radius: 50px; font-weight: bold; 
text-decoration: none; transition: all 0.3s; border: none;
}
.private_show .ps_btn_main { background: var(--ps-main); color: #fff !important; }
.private_show .ps_btn_line { background: #06C755; color: #fff !important; }
.private_show .ps_btn:hover { opacity: 0.9; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.2); color: #fff !important; } @media (max-width: 768px) { 
.private_show .ps_hero { padding: 40px 0; }
.private_show .ps_hero_lead br { display: none; }
.private_show .ps_section { padding: 50px 0; }
.private_show .ps_price_box { padding: 35px 20px; }
.private_show .ps_flow { grid-template-columns: 1fr; }
}