@charset "UTF-8";

#page { position: relative; }
.mochiy { font-family: 'Mochiy Pop One', sans-serif !important; }
.zen_maru_m { font-family: 'Zen Maru Gothic', sans-serif !important; }
.zen_maru_b { font-family: 'Zen Maru Gothic', sans-serif !important; font-weight: bold !important; }
.primary-navigation .primary-menu-container > ul > .menu-item > a { font-family: 'Zen Maru Gothic', sans-serif !important; font-weight: bold !important; font-size: 0.75em; }
.primary-navigation .primary-menu-container > ul > .menu-item > a:hover { color: #fefd61 !important; }
.mb-0 { margin-bottom: 0 !important; }
.mt-0 { margin-top: 0 !important; }

header { background: #000; padding: 0 50px !important; min-width: 100%; position: fixed; z-index: 1000; }
main { padding: 0 !important; }
footer * { font-family: 'Zen Maru Gothic', sans-serif !important; font-weight: bold !important; font-size: 1.2em; }
a { text-decoration: none !important; }
.bg-layout { background-image: url("/wp-content/themes/ondeproductionfunclub/assets/images/bg_black.png"); background-repeat: round; background-size: contain; border-top: 15px solid #ffee5a; border-bottom: 15px solid #ffee5a; }
.relative { position: relative; }
.mv_logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
.primary-navigation a { color: #FFF !important; }
.wp-block-cover { background-color: #FFF !important; }
.button-membership a { padding: 10px 30px !important; border-radius: 40px; box-shadow: 1px 1px 5px 1px #999; font-family: 'Zen Maru Gothic', sans-serif !important; font-weight: bold !important; }
.widget-area .button-membership a { font-size: 1.5em; }
#about p strong { font-size: 1.6em; }
#about .wp-block-cover__inner-container { width: 100%; }
#about .wp-block-media-text .wp-block-media-text__content > * { min-height: 90%; }
#about .wp-block-cover__image-background { object-fit: contain !important; }
.site-info .site-name { display: none; }
.widget-area { background: #000 !important; margin: 0 !important; max-width: 100% !important; width:100%; position:fixed; bottom:0; z-index:1000; }
.border-red { border: 12px solid #FF0532 !important; border-radius: 20px; padding: 20px !important; }
.border-purple { border: 12px solid #B7AAEC !important; border-radius: 20px; padding: 20px !important; }
.border-pink { border: 12px solid #FF4675 !important; border-radius: 20px; padding: 20px !important; }
#tokuten h3, #tokuten p, #plan h3, #plan p.alignwide { color: #FFF; }
#plan h4 { font-size: 1.4em !important; }
#plan .text-top { font-size: 0.73em !important; }
#plan .text-bottom { padding-left: 1.5em !important; }
#plan .plan-first { padding-left: 3em; }

#flow p { letter-spacing: 0.1em; }
#flow .preparate { border: 1px solid; box-shadow: 1px 1px 5px 1px #999; padding: 2rem 3rem; margin: 3rem; }
#flow .preparate .title { text-align: center; margin-bottom: 20px; }
#flow .step .item { border: 1px solid; border-radius: 20px; padding: 1rem 4rem; box-shadow: 1px 1px 5px 1px #999; margin: 0 17rem; }
#flow .step .item .title, #flow .step .item .text { text-align: center; }
#flow .step .allow { text-align: center; margin-top: 40px; }
.under_yellow { text-decoration: underline; text-decoration-color: #fefd61; text-decoration-thickness: 5px; }
#member .member-about { position: absolute; bottom: 50px; left: -25px; background: #FFF; font-size: 0.8em; border: 2px solid; padding: 0.5em 1em; width: 47%; box-shadow: 1px 1px 5px 1px #999; }
#member .member-about p { line-height: 2em; }
#member .member-about p a img { width: 35px; }

#tokuten, #member, #plan, #flow { padding-top: 70px !important; }
#tokuten .anchor, #member .anchor, #plan .anchor, #flow .anchor { padding-top: 100px !important; margin-top: -100px !important; } 

.sp { display: none; }
.footer-navigation, .site-footer > .site-info { margin: 0 !important; }

@media screen and (max-width:822px) {
:where(.wp-block-columns.is-layout-flex) { gap: 0em; }
header { height: 54px; padding: 0 10px !important; }
main { margin-top: 54px; }
.mv_logo { top: 35%; }
.menu-button-container #primary-mobile-menu .dropdown-icon .svg-icon { color: #FFF; }
.sp { display: block; }
.pc { display: none; }
h1 strong, .h1 strong, h2 strong, .h2 strong, h3 strong, .h3 strong, h4 strong, .h4 strong, h5 strong, .h5 strong, h6 strong, .h6 strong { font-size: 6vw; }
  #tokuten .is-layout-flex { flex-wrap: wrap !important; justify-content: space-around; gap: 1em !important; }
  #tokuten .is-layout-flex .is-layout-flow { max-width: calc(90%/2); min-width: calc(90%/2); }
  .wp-block-media-text.is-stacked-on-mobile { grid-template-columns: 100%!important; }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media { grid-column: 1 !important; grid-row: 1!important; }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content { grid-column: 1 !important; grid-row: 2 !important;}
  .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column { flex-basis: 100%!important; }
  #about .wp-block-media-text__content { padding: 0; }
  #member .is-layout-flex { flex-wrap: wrap !important; justify-content: space-around; gap: 1em !important; }
  #member .is-layout-flex .is-layout-flow { max-width: 100%; min-width: 100%; }
  #flow .step .item { margin: 0; }
  #flow p { letter-spacing: 0; font-size: 0.64em; font-weight: bold; }
  #flow .preparate, #flow .step .item { padding: 1rem 0.5rem; }
  #about p, #plan p.alignwide, #plan p.text-top { font-size: 3.4vw !important; }
  #about h3 { font-size: 1.2em; }
  #about h4 { font-size: 4.8vw; }
  #tokuten p.has-text-align-center { font-size: 2.9vw; }
  span.dropdown-icon.open { text-indent:150%; white-space:nowrap; overflow:hidden; }
  #member .member-about { bottom: 35px; left: 0px; width: 55%; }
  #plan .border-red .wp-block-group__inner-container { max-height: 260px !important; }
  .widget-area .button-membership a { font-size: 1.1em; }
  footer * { font-size: 1em; }
  .primary-navigation a { font-family: 'Zen Maru Gothic', sans-serif !important; font-weight: bold !important; font-size: 0.65em; }
}