@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #828c9a;
}

a {
  text-decoration: none;
}

@media (min-width: 751px) {
  .pc {
    display: block;
  }
  .sp {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  .pcOnly {
    display: block;
  }
  .notPc {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  .pcOnly {
    display: none !important;
  }
  .notPc {
    display: block;
  }
}

@media (max-width: 750px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block;
  }
}

@media (min-width: 1181px) {
  .desktop {
    display: block;
  }
  .notDesktop {
    display: none !important;
  }
}

@media (max-width: 1180px) {
  .desktop {
    display: none;
  }
  .notDesktop {
    display: block;
  }
}

.ipad {
  display: none;
}

@media (min-width: 750px) and (max-width: 1024px) {
  .ipad {
    display: block;
  }
}

.small-sp {
  display: none;
}

@media (max-width: 520px) {
  .small-sp {
    display: block;
  }
}

.laptop {
  display: none;
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .laptop {
    display: block;
  }
}

.iphonese {
  display: none;
}

@media (max-width: 374px) {
  .iphonese {
    display: block;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  基本のスタイル


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
body {
  width: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: auto;
  font-size: 14px;
  font-family: "Roboto", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,
    sans-serif;
  color: #595656;
  background-color: #fff;
  overflow-x: hidden;
  color: #3f210e;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

ol,
ul {
  list-style: none;
}

img {
  max-width: 100%;
  vertical-align: middle;
}

a {
  color: #3f210e;
}

* {
  box-sizing: border-box;
}

input,
select,
textarea,
button {
  font-family: "Roboto", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,
    sans-serif;
}

select {
  color: #3f210e;
}

.c-f-bold {
  font-weight: bold;
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  ヘッダースタイル


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.header {
  position: relative;
  z-index: 100;
}

.logo {
  position: absolute;
}
@media (min-width: 751px) {
  .logo {
    width: 198px;
    height: 22px;
    top: 56px;
    left: 12.5%;
  }
}
@media (max-width: 750px) {
  .logo {
    width: 110px;
    height: 12px;
    top: 22px;
    left: 6.4%;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  フッター


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.footer {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #3f210e;
  height: 36px;
}
@media (min-width: 751px) {
  .footer {
    margin-top: 40px;
  }
}
@media (max-width: 750px) {
  .footer {
    margin-top: 80px;
  }
}

.copyright {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  color: #ffffff;
  letter-spacing: 0.05em;
}
@media (min-width: 751px) {
  .copyright {
    font-size: 12px;
  }
}
@media (max-width: 750px) {
  .copyright {
    font-size: 10px;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  共通ボタン


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.c-btn {
  display: block;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 751px) {
  .c-btn {
    height: 90px;
    max-width: 388px;
    margin: auto;
    border-radius: 45px;
  }
}
@media (max-width: 750px) {
  .c-btn {
    height: 76px;
    width: 87.2%;
    border-radius: 38px;
    margin: auto;
  }
}

.c-btn:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform: scale(0, 1);
  transform-origin: right;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  pointer-events: none;
}

.c-btn__link {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.c-btn__label {
  display: flex;
  font-weight: bold;
  position: relative;
  z-index: 10;
  text-align: center;
  transition: color 0.3s;
}
@media (min-width: 751px) {
  .c-btn__label {
    font-size: 18px;
  }
}
@media (max-width: 750px) {
  .c-btn__label {
    font-size: 20px;
  }
}

.c-btn + .c-btn {
  margin-top: 24px;
}

/*
  矢印
ーーーーーーーーーーーーーーーーーー*/
.c-btn.-arrow .c-btn__label {
  position: relative;
}
@media (min-width: 751px) {
  .c-btn.-arrow .c-btn__label {
    padding-right: 18px;
  }
}
@media (max-width: 750px) {
  .c-btn.-arrow .c-btn__label {
    padding-right: 14px;
  }
}

.c-btn.-arrow .c-btn__label::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  border: 2px solid #fff;
  transform: rotate(45deg);
  border-bottom: none;
  border-left: none;
  position: absolute;
  transition: border-color 0.3s;
  width: 9px;
  height: 9px;
  top: calc(50% - 5px);
  right: -8px;
}

/*
  ボタン アニメーション
ーーーーーーーーーーーーーーーーーー*/
.c-btn.is-over:after {
  transform: scale(1, 1);
  transform-origin: left;
}

/*
  オレンジボタン
ーーーーーーーーーーーーーーーーーー*/
.c-btn.-orange {
  background: #ff6b45;
}

.c-btn.-orange::after {
  background-color: #fff;
  opacity: 0.9;
}

.c-btn.-orange .c-btn__label {
  color: #ffffff;
}

.c-btn.-orange.is-over {
  border-color: #ff6b45;
}

.c-btn.-orange.is-over .c-btn__label {
  color: #ff6b45;
}

.c-btn.-orange.is-over .c-btn__label::after {
  border-color: #ff6b45;
}

/*
  白ボタン
ーーーーーーーーーーーーーーーーーー*/
.c-btn.-white {
  border: 2px solid #ff6b45;
}
@media (min-width: 751px) {
  .c-btn.-white {
    max-width: 482px;
    height: 66px;
    border-radius: 33px;
  }
}
@media (max-width: 750px) {
  .c-btn.-white {
    height: 60px;
    border-radius: 30px;
  }
}

.c-btn.-white .c-btn__label {
  color: #ff6b45;
  font-size: 16px;
}
@media (min-width: 751px) {
  .c-btn.-white .c-btn__label {
    font-size: 16px;
  }
}

.c-btn.-white.-arrow .c-btn__label::after {
  border-color: #ff6b45;
  width: 7px;
  height: 7px;
  top: calc(50% - 4px);
  right: -8px;
}

/*
  非活性ボタン
ーーーーーーーーーーーーーーーーーー*/
.c-btn.-disable {
  background: #dddddd;
}

.c-btn.-disable .c-btn__link {
  pointer-events: none;
}

.c-btn.-disable .c-btn__label {
  color: #ffffff;
}

.c-btn.-disable.is-over .c-btn__label {
  color: #ffffff;
}

.c-btn.-disable:after {
  display: none;
}

.c-btn.-disable.-arrow .c-btn__label::after {
  display: none;
}

/*
  トップへ戻るボタン
ーーーーーーーーーーーーーーーーーー*/
.c-btn.-gototop {
  margin-bottom: 60px;
}

/*

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  共通タイトルスタイル


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.c-ttl {
  text-align: center;
}
@media (min-width: 751px) {
  .c-ttl {
    margin-bottom: 40px;
  }
}
@media (max-width: 750px) {
  .c-ttl {
    margin-bottom: 40px;
  }
}

.c-ttl__main {
  font-weight: bold;
}
@media (min-width: 751px) {
  .c-ttl__main {
    margin-bottom: 18px;
    font-size: 28px;
  }
}
@media (max-width: 750px) {
  .c-ttl__main {
    margin-bottom: 12px;
    font-size: 20px;
  }
}

.c-ttl__sub {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-style: italic;
  letter-spacing: 0.14em;
  opacity: 0.6;
}
@media (min-width: 751px) {
  .c-ttl__sub {
    font-size: 14px;
  }
}
@media (max-width: 750px) {
  .c-ttl__sub {
    font-size: 12px;
  }
}
/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  共通注意文言


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.c-attention {
  margin-bottom: 18px;
  text-align: center;
  font-size: 20px;
  color: #ea2d22;
  font-weight: bold;
}

@media (max-width: 750px) {
  .c-attention {
    font-size: 18px;
  }
}

.c-attention.-small {
  margin-bottom: 22px;
  font-size: 18px;
}

@media (max-width: 750px) {
  .c-attention.-small {
    font-size: 16px;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  ビオクラのファンイベントとは？


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.aboutEvent {
  background: #fff6c5;
}
@media (min-width: 751px) {
  .aboutEvent {
    padding: 80px 0 60px;
    margin-bottom: 44px;
  }
}
@media (max-width: 750px) {
  .aboutEvent {
    padding: 56px 0 50px;
    margin-bottom: 80px;
  }
}

.aboutEvent__inBox {
  background: #ffffff;
  border: 1px dashed #ff6b45;
}
@media (min-width: 751px) {
  .aboutEvent__inBox {
    max-width: 630px;
    padding: 3em 0;
    margin: auto;
  }
}
@media (max-width: 750px) {
  .aboutEvent__inBox {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    padding: 2em;
  }
}

@media (min-width: 751px) {
  .aboutEvent__inBox.-eventReport {
    max-width: 600px;
  }
}

.aboutEvent__text {
  line-height: 2.2;
}
@media (min-width: 751px) {
  .aboutEvent__text {
    text-align: center;
  }
}

.aboutEvent__text:nth-last-child(n + 2) {
  margin-bottom: 14px;
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  イベント内容


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 751px) {
  .eventContents {
    padding-bottom: 70px;
  }
}

@media (max-width: 750px) {
  .eventContents {
    padding-bottom: 56px;
  }
}

@media (min-width: 751px) {
  .eventContents__list {
    max-width: 600px;
    margin: auto;
  }
}

@media (max-width: 750px) {
  .eventContents__list {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
  }
}

@media (min-width: 751px) {
  .eventContents__list:first-of-type {
    margin-top: 56px;
  }
}

@media (min-width: 751px) {
  .eventContents__list:nth-last-child(n + 2) {
    margin-bottom: 32px;
  }
}

@media (max-width: 750px) {
  .eventContents__list:nth-last-child(n + 2) {
    margin-bottom: 20px;
  }
}

.eventContents__ttl {
  font-weight: bold;
}
@media (min-width: 751px) {
  .eventContents__ttl {
    margin-bottom: 16px;
    font-size: 18px;
  }
}
@media (max-width: 750px) {
  .eventContents__ttl {
    margin-bottom: 12px;
    font-size: 16px;
  }
}

.eventContents__ttlNo {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-style: italic;
  font-weight: bold;
  margin-right: 6px;
}
@media (min-width: 751px) {
  .eventContents__ttlNo {
    font-size: 25px;
  }
}
@media (max-width: 750px) {
  .eventContents__ttlNo {
    font-size: 22px;
  }
}

@media (min-width: 751px) {
  .eventContents__body {
    font-size: 18px;
    line-height: 160%;
  }
}

@media (max-width: 750px) {
  .eventContents__body {
    line-height: 180%;
  }
}

.eventContents__images {
  display: flex;
  max-width: 600px;
  margin: auto;
}
@media (max-width: 750px) {
  .eventContents__images {
    width: 87.2%;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  ビオクラ ファンイベント詳細


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 751px) {
  .event-kv {
    padding: 140px 0 70px;
  }
}

@media (max-width: 750px) {
  .event-kv {
    padding: 56px 0 40px;
  }
}

@media (min-width: 751px) {
  .event-kv__image {
    width: 75%;
    max-width: 736px;
    margin: auto;
  }
}

@media (min-width: 751px) {
  .eventIntro {
    padding-bottom: 80px;
  }
}

@media (max-width: 750px) {
  .eventIntro {
    padding-bottom: 56px;
  }
}

.eventIntro__day {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
  opacity: 0.7;
}
@media (min-width: 751px) {
  .eventIntro__day {
    margin-bottom: 24px;
    font-size: 34px;
  }
}
@media (max-width: 750px) {
  .eventIntro__day {
    margin-bottom: 18px;
    font-size: 22px;
  }
}

@media (min-width: 751px) {
  .eventIntro__dayWeek {
    margin-left: 12px;
    font-size: 26px;
  }
}

@media (max-width: 750px) {
  .eventIntro__dayWeek {
    margin-left: 6px;
    font-size: 16px;
  }
}

.eventIntro__ttl {
  font-weight: bold;
  text-align: center;
}
@media (min-width: 751px) {
  .eventIntro__ttl {
    margin-bottom: 16px;
    font-size: 32px;
  }
}
@media (max-width: 750px) {
  .eventIntro__ttl {
    margin-bottom: 20px;
    font-size: 26px;
    line-height: 39px;
  }
}

.eventIntro__lead {
  text-align: center;
}
@media (min-width: 751px) {
  .eventIntro__lead {
    font-size: 20px;
    margin-bottom: 64px;
  }
}
@media (max-width: 750px) {
  .eventIntro__lead {
    margin-bottom: 50px;
  }
}

@media (min-width: 751px) {
  .eventIntro__lead + .c-btn {
    margin-bottom: 64px;
  }
}
@media (max-width: 750px) {
  .eventIntro__lead + .c-btn {
    margin-bottom: 50px;
  }
}

@media (min-width: 751px) {
  .eventIntro__txt {
    max-width: 600px;
    margin: 0 auto 2em;
    font-size: 16px;
    line-height: 2;
  }
}

@media (max-width: 750px) {
  .eventIntro__txt {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 18px;
    line-height: 180%;
    font-size: 15px;
  }
}

@media (min-width: 751px) {
  .eventIntro__image {
    max-width: 600px;
    margin: 0 auto 32px;
  }
}

@media (max-width: 750px) {
  .eventIntro__image {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 18px;
  }
}

@media (min-width: 751px) {
  .eventIntro__image + .eventIntro__txt {
    margin-bottom: 48px;
  }
}

@media (max-width: 750px) {
  .eventIntro__image + .eventIntro__txt {
    margin-bottom: 24px;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  ビオクラ ファンイベント スケジュール


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 751px) {
  .eventSchedule {
    padding-bottom: 120px;
  }
}

@media (max-width: 750px) {
  .eventSchedule {
    padding-bottom: 90px;
  }
}

.eventSchedule__box {
  background: #fff6c5;
}
@media (min-width: 751px) {
  .eventSchedule__box {
    max-width: 600px;
    padding: 42px 48px 32px 44px;
    margin: 0 auto 50px;
  }
}
@media (max-width: 750px) {
  .eventSchedule__box {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    padding: 7.8%;
    margin-bottom: 26px;
  }
}

@media (min-width: 751px) {
  .noticeList {
    margin-bottom: 110px;
  }
}

@media (max-width: 750px) {
  .noticeList {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 46px;
    line-height: 160%;
  }
}

@media (min-width: 751px) {
  .noticeList__item {
    max-width: 600px;
    margin: auto;
    font-size: 16px;
    line-height: 160%;
  }
}

@media (min-width: 751px) {
  .eventSchedule__list {
    display: flex;
  }
}

@media (min-width: 751px) {
  .eventSchedule__list:nth-last-child(n + 2) {
    margin-bottom: 20px;
  }
}

@media (max-width: 750px) {
  .eventSchedule__list:nth-last-child(n + 2) {
    margin-bottom: 18px;
  }
}

.eventSchedule__ttl {
  font-weight: bold;
  font-size: 16px;
  line-height: 160%;
}
@media (min-width: 751px) {
  .eventSchedule__ttl {
    width: 120px;
    flex: none;
  }
}
@media (max-width: 750px) {
  .eventSchedule__ttl {
    line-height: 1.8;
  }
}

.eventSchedule__body {
  font-size: 16px;
  line-height: 160%;
}
@media (max-width: 750px) {
  .eventSchedule__body {
    line-height: 1.8;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  トップページ - これまで開催したイベント


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.eventHistory {
  /* display: none; */
}
@media (min-width: 751px) {
  .eventHistory {
    padding: 60px 0;
    margin-bottom: 60px;
  }
}
@media (max-width: 750px) {
  .eventHistory {
    padding: 45px 0;
    margin-bottom: 45px;
  }
}

@media (min-width: 751px) {
  .eventHistory__list {
    max-width: 480px;
    margin: auto;
  }
}

@media (max-width: 750px) {
  .eventHistory__list {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 750px) {
  .eventHistory__item:nth-last-child(n + 2) {
    margin-bottom: 30px;
  }
}

.eventHistory__link {
  display: flex;
}
@media (min-width: 751px) {
  .eventHistory__link {
    padding: 18px 32px;
    transition: box-shadow 0.4s;
  }
}

@media (min-width: 751px) {
  .eventHistory__link:hover {
    box-shadow: 2px 2px 24px rgba(0, 0, 0, 0.1);
  }
}

.eventHistory__image {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 1px dashed #ff6b45;
  overflow: hidden;
}

.eventHistory__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover;";
}

.eventHistory__main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: calc(100% - 100px);
}
@media (min-width: 751px) {
  .eventHistory__main {
    padding-left: 22px;
  }
}
@media (max-width: 750px) {
  .eventHistory__main {
    padding-left: 12px;
  }
}

.eventHistory__day {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  opacity: 0.6;
}
@media (min-width: 751px) {
  .eventHistory__day {
    margin-bottom: 10px;
    font-size: 13px;
  }
}
@media (max-width: 750px) {
  .eventHistory__day {
    margin-bottom: 8px;
  }
}

.eventHistory__ttl {
  margin-bottom: 1em;
}
@media (max-width: 750px) {
  .eventHistory__ttl {
    font-size: 16px;
    line-height: 1.4;
  }
}

.eventHistory__detail {
  color: #ff6b45;
  text-align: right;
  position: absolute;
  bottom: 0;
  right: 0;
}
@media (min-width: 750px) {
  .eventHistory__detail {
    padding-right: 30px;
    font-size: 12px;
  }
}
@media (max-width: 750px) {
  .eventHistory__detail {
    padding-right: 24px;
    bottom: 3px;
  }
}

.eventHistory__detailArrow {
  display: inline-block;
  vertical-align: bottom;
  height: 1px;
  background: #ff6b45;
  position: absolute;
  top: 0;
  margin: auto 0;
  right: 0;
}
@media (min-width: 751px) {
  .eventHistory__detailArrow {
    width: 24px;
    bottom: -5px;
  }
}
@media (max-width: 750px) {
  .eventHistory__detailArrow {
    width: 18px;
    bottom: -9px;
  }
}

.eventHistory__detailArrow::after {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 8px;
  bottom: 0;
  right: -1px;
  background: #ff6b45;
  transform: rotate(-45deg);
  transform-origin: bottom;
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  トップページ - ファーストビュー


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.kv {
  position: relative;
}
@media (min-width: 751px) {
  .kv {
    margin-bottom: 120px;
  }
}
@media (max-width: 750px) {
  .kv {
    margin-bottom: 64px;
  }
}

@media (min-width: 751px) {
  .kv__image {
    width: 62%;
    height: 40vw;
    min-height: 520px;
    margin-left: auto;
  }
}

@media (max-width: 750px) {
  .kv__image {
    margin-bottom: 13vw;
  }
}

.kv__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover;";
}

@media (min-width: 751px) {
  .kv__texts {
    position: absolute;
    top: 45%;
    left: 12.5%;
  }
}

@media (max-width: 750px) {
  .kv__texts {
    position: relative;
    padding: 0 6% 0 9%;
  }
}

@media (min-width: 751px) {
  .kv__ttl {
    margin-bottom: 56px;
  }
}

@media (max-width: 750px) {
  .kv__ttl {
    margin-bottom: 18px;
  }
}

.kv__ttl::before {
  content: "";
  display: block;
  position: absolute;
  background: url(../images/fan_event/kv_cursive.png) no-repeat center/contain;
}
@media (min-width: 751px) {
  .kv__ttl::before {
    width: 509px;
    height: 138px;
    top: -100px;
    left: -50px;
    opacity: 0.1;
  }
}
@media (max-width: 750px) {
  .kv__ttl::before {
    width: 60vw;
    max-width: 300px;
    height: 16.8vw;
    top: -11vw;
    left: 5vw;
    opacity: 0.2;
  }
}

.kv__ttlMain {
  font-weight: bold;
}
@media (min-width: 751px) {
  .kv__ttlMain {
    margin-left: -4px;
    font-size: 48px;
  }
}
@media (max-width: 750px) {
  .kv__ttlMain {
    margin-left: -2px;
    font-size: 30px;
  }
}

.kv__ttlSub {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
}
@media (min-width: 751px) {
  .kv__ttlSub {
    margin-bottom: 14px;
    font-size: 38px;
  }
}
@media (max-width: 750px) {
  .kv__ttlSub {
    margin-bottom: 8px;
    font-size: 22px;
    letter-spacing: 0.05em;
  }
}

@media (min-width: 751px) {
  .kv__lead {
    margin-bottom: 36px;
    font-size: 17px;
  }
}

@media (max-width: 750px) {
  .kv__lead {
    margin-bottom: 18px;
    line-height: 2;
  }
}

.kv__icons {
  display: flex;
}

.kv__icon {
  background: linear-gradient(47.09deg, #ffdcc4 0%, #fff1ed 99.73%);
  box-shadow: 2px 2px 24px rgba(0, 0, 0, 0.1);
  text-align: center;
  font-family: "M PLUS 1p", serif;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 751px) {
  .kv__icon {
    min-height: 46px;
    min-width: 46px;
    padding: 0 8px;
    border-radius: 8px;
    margin-right: 14px;
    font-size: 16px;
    letter-spacing: 0.1em;
  }
}
@media (max-width: 750px) {
  .kv__icon {
    min-height: 34px;
    min-width: 34px;
    padding: 0 6px;
    border-radius: 4px;
    margin-right: 12px;
    font-size: 12px;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  トップページ - イベントレポート


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

@media (min-width: 751px) {
  .eventReport {
    padding-bottom: 60px;
  }
}

@media (max-width: 750px) {
  .eventReport {
    padding-bottom: 45px;
  }
}

.eventReport a {
  /* color: #ff6b45;
  text-decoration: underline; */
}

@media (min-width: 751px) {
  .eventReportIntro {
    padding-bottom: 80px;
  }
}

@media (max-width: 750px) {
  .eventReportIntro {
    padding-bottom: 56px;
  }
}

.eventReportIntro__day {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
  opacity: 0.7;
}
@media (min-width: 751px) {
  .eventReportIntro__day {
    margin-bottom: 24px;
    font-size: 34px;
  }
}
@media (max-width: 750px) {
  .eventReportIntro__day {
    margin-bottom: 18px;
    font-size: 22px;
  }
}

.eventReportIntro__ttl {
  font-weight: bold;
  text-align: center;
}
@media (min-width: 751px) {
  .eventReportIntro__ttl {
    margin-bottom: 16px;
    font-size: 24px;
  }
}
@media (max-width: 750px) {
  .eventReportIntro__ttl {
    margin-bottom: 20px;
    line-height: 39px;
    font-size: 22px;
  }
}

.eventReport__ttl {
  margin-right: auto;
  margin-left: auto;
  max-width: 600px;
  font-weight: bold;
  line-height: 1.4;
  font-size: 20px;
}

@media (min-width: 751px) {
  .eventReport__ttl {
    margin-bottom: 18px;
  }
}
@media (max-width: 750px) {
  .eventReport__ttl {
    width: 87.2%;
    margin-bottom: 16px;
  }
}

.eventReport__ttl:not(:first-child) {
  margin-top: 74px;
}

@media (min-width: 751px) {
  .eventReport__ttl:not(:first-child) {
    margin-top: 82px;
  }
}

.eventReport__subTtl {
  font-weight: bold;
}

@media (min-width: 751px) {
  .eventReport__subTtl {
    margin: 82px auto 18px;
    font-size: 18px;
    line-height: 1.8;
    text-align: center;
  }
}

@media (max-width: 750px) {
  .eventReport__subTtl {
    width: 87.2%;
    margin: 74px auto 16px;
    line-height: 180%;
    font-size: 15px;
  }
}

@media (min-width: 751px) {
  .eventReport__image {
    max-width: 600px;
    margin: 0 auto 20px;
  }
}

@media (max-width: 750px) {
  .eventReport__image {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
  }
}

@media (min-width: 751px) {
  .eventReport__text {
    margin-right: auto;
    margin-left: auto;
    max-width: 600px;
    margin: 0 auto 18px;
    font-size: 16px;
    line-height: 2;
  }
}

@media (max-width: 750px) {
  .eventReport__text {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
    line-height: 180%;
    font-size: 15px;
  }
}

@media (min-width: 751px) {
  .eventReport__sns {
    max-width: 600px;
    margin: 0 auto 20px;
  }
}

@media (max-width: 750px) {
  .eventReport__sns {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
  }
}

@media (min-width: 751px) {
  .eventReport__staffWrap {
    margin-bottom: 82px;
  }
}

@media (max-width: 750px) {
  .eventReport__staffWrap {
    margin-bottom: 74px;
  }
}

.eventReport__staff {
  display: flex;
  margin: 0 auto 20px;
}

@media (min-width: 751px) {
  .eventReport__staff {
    max-width: 600px;
  }
}

@media (max-width: 750px) {
  .eventReport__staff {
    width: 87.2%;
  }
}

.eventReport__staffIcon {
  width: 56px;
  margin-right: 14px;
  flex: none;
}

.eventReport__staffInfo {
  padding-top: 12px;
}

.eventReport__staffName {
  font-weight: bold;
  margin-bottom: 8px;
}

.eventReport__staffComment {
  line-height: 1.6;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
}

.eventReport__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 751px) {
  .eventReport__list {
    max-width: 600px;
    margin: 0 auto 20px;
  }
}

@media (max-width: 750px) {
  .eventReport__list {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
  }
}

.eventReport__list::after {
  content: "";
  display: block;
  width: 24%;
}

@media (min-width: 1024px) {
  .eventReport__item {
    width: 24%;
    margin-bottom: 26px;
  }
}

@media (max-width: 1023px) {
  .eventReport__item {
    width: 33%;
  }
}

@media (max-width: 750px) {
  .eventReport__item {
    width: 48%;
  }
}

.eventReport__listLink {
  display: block;
  transition: opacity 0.3s;
}

.eventReport__listLink:hover {
  opacity: 0.7;
}

.eventReport__itemImage {
  margin-bottom: 8px;
  overflow: hidden;
}

.eventReport__itemImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  font-family: "object-fit: cover;";
  transition: transform 0.3s;
}

.eventReport__itemImage:hover img {
  transform: scale(1.08);
}

.eventReport__itemName {
  line-height: 1.4;
}

.eventReport__gallery {
  margin-top: 80px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 751px) {
  .eventReport__gallery {
    max-width: 1200px;
    margin-bottom: 20px;
  }
}

@media (max-width: 750px) {
  .eventReport__gallery {
    margin-bottom: 16px;
  }
}

.eventReport__gallery .slick-arrow {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  appearance: none;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;

  display: block;
  width: 50px;
  height: 50px;
  position: absolute;
  top: calc(50% - 25px);
  z-index: 2;
  color: transparent;
  background: no-repeat center center/13px rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  transition: transform 0.3s;
}

.eventReport__gallery .slick-arrow:hover {
  transform: scale(1.1);
}

.eventReport__gallery .slick-prev {
  background-image: url(../images/fan_event/arrow-prev.png);
  left: 20px;
}

.eventReport__gallery .slick-next {
  background-image: url(../images/fan_event/arrow-next.png);
  background-position: 17px;
  right: 20px;
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  トップページ - 開催予定のイベント


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 751px) {
  .upcomings {
    /* padding-bottom: 60px; */
    padding: 60px 0;
  }
}

@media (max-width: 750px) {
  .upcomings {
    /* padding-bottom: 45px; */
    padding: 45px 0;
  }
}

.upcomings__image {
  margin: auto;
}
@media (min-width: 751px) {
  .upcomings__image {
    max-width: 736px;
    margin-bottom: 40px;
  }
}
@media (max-width: 750px) {
  .upcomings__image {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 32px;
  }
}

@media (min-width: 751px) {
  .upcomings__detail {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 46px;
  }
}

@media (max-width: 750px) {
  .upcomings__detail {
    width: 87.2%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 32px;
    text-align: center;
  }
}

.upcomings__day {
  font-family: "Lato", "游ゴシック", YuGothic, sans-serif;
  font-weight: 500;
  font-style: normal;
  opacity: 0.7;
}
@media (min-width: 751px) {
  .upcomings__day {
    margin-right: 64px;
    font-size: 30px;
    line-height: 1.2;
  }
}
@media (max-width: 750px) {
  .upcomings__day {
    padding-left: 3px;
    margin-bottom: 12px;
    font-size: 20px;
  }
}

@media (min-width: 751px) {
  .upcomings__week {
    display: block;
    text-align: center;
    font-size: 24px;
  }
}

@media (max-width: 750px) {
  .upcomings__week {
    margin-left: 10px;
    font-size: 17px;
  }
}

@media (min-width: 751px) {
  .upcomings__eventTtl {
    line-height: 1.6;
    font-size: 28px;
    font-weight: bold;
  }
}

@media (max-width: 750px) {
  .upcomings__eventTtl {
    font-weight: bold;
    font-size: 24px;
    line-height: 1.4;
  }
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー


  ローディングアニメーション


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
