@charset "UTF-8";
@import url(//use.fontawesome.com/releases/v5.6.3/css/all.css);
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Lexend:wght@300;400;500;700;900&family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&family=Roboto+Slab:wght@300;400;500;700;800;900&display=swap");
/* ==========================================================================
   Foundation
========================================================================== */
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

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

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

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  text-indent: 0.01px;
  text-overflow: "";
  appearance: none;
  border-radius: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: none transparent;
  vertical-align: middle;
  color: inherit;
  box-sizing: content-box;
}

select::-ms-expand {
  display: none;
}

em {
  font-style: normal;
}

main {
  display: block;
}

html, body {
  height: 100%;
  width: 100%;
}

html {
  font-size: 62.5%;
}
@media only screen and (max-width: 1024px) {
  html {
    font-size: 50%;
  }
}

body {
  min-width: 1280px;
  background: #fff;
  font-size: 1em;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  color: #000;
  line-height: 1.87;
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  word-break: break-all;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}

.is-hidden {
  display: none;
}

.pc-hidden {
  display: none;
}

* {
  box-sizing: border-box;
}

img {
  vertical-align: bottom;
}

@media only screen and (max-width: 1024px) {
  .sp-hidden {
    display: none;
  }
  .pc-hidden {
    display: block;
  }
  body {
    min-width: 0;
  }
  .sp-scroll {
    width: 100%;
    overflow-x: auto;
  }
}
h1 {
  font-size: 2.8rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  h1 {
    font-size: 1.8rem;
  }
}

h2 {
  font-size: 2.2rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  h2 {
    font-size: 1.6rem;
  }
}

h3 {
  font-size: 1.6rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  h3 {
    font-size: 1.35rem;
  }
}

h4 {
  font-size: 1.4rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  h4 {
    font-size: 1.15rem;
  }
}

h5 {
  font-size: 1rem;
  font-weight: 700;
}

h6 {
  font-size: 0.8rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  h6 {
    font-size: 0.85rem;
  }
}

.txtLarge {
  font-size: 1.2rem;
}
@media only screen and (max-width: 1024px) {
  .txtLarge {
    font-size: 1.15rem;
  }
}

.txtSmall {
  font-size: 0.8rem;
}
@media only screen and (max-width: 1024px) {
  .txtSmall {
    font-size: 0.85rem;
  }
}

.txtXsmall {
  font-size: 0.7rem;
}

.txtXxsmall {
  font-size: 0.6rem;
}

/* ==========================================================================
   margin
========================================================================== */
.mT_xxl {
  margin-top: 100px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_xxl {
    margin-top: 50px !important;
  }
}

.mT_xl {
  margin-top: 80px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_xl {
    margin-top: 40px !important;
  }
}

.mT_l {
  margin-top: 60px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_l {
    margin-top: 30px !important;
  }
}

.mT_m {
  margin-top: 40px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_m {
    margin-top: 20px !important;
  }
}

.mT_s {
  margin-top: 30px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_s {
    margin-top: 15px !important;
  }
}

.mT_xs {
  margin-top: 20px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_xs {
    margin-top: 10px !important;
  }
}

.mT_xxs {
  margin-top: 10px !important;
}
@media only screen and (max-width: 1024px) {
  .mT_xxs {
    margin-top: 8px !important;
  }
}

.mB_xxl {
  margin-bottom: 100px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_xxl {
    margin-bottom: 50px !important;
  }
}

.mB_xl {
  margin-bottom: 80px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_xl {
    margin-bottom: 40px !important;
  }
}

.mB_l {
  margin-bottom: 60px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_l {
    margin-bottom: 30px !important;
  }
}

.mB_m {
  margin-bottom: 40px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_m {
    margin-bottom: 20px !important;
  }
}

.mB_s {
  margin-bottom: 30px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_s {
    margin-bottom: 15px !important;
  }
}

.mB_xs {
  margin-bottom: 20px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_xs {
    margin-bottom: 10px !important;
  }
}

.mB_xxs {
  margin-bottom: 10px !important;
}
@media only screen and (max-width: 1024px) {
  .mB_xxs {
    margin-bottom: 8px !important;
  }
}

/* ==========================================================================
   Common
========================================================================== */
@media only screen and (max-width: 1024px) {
  body {
    padding-top: 79px;
  }
}

.main {
  padding-bottom: 0;
  position: relative;
}
.contentsTitle {
  text-align: center;
  font-family: "Lexend", "Noto Sans JP", sans-serif;
  font-size: 4rem;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.5;
  margin-bottom: 60px;
  font-family: "Lexend", "Noto Sans JP", sans-serif;
  line-height: 1.5;
}
.contentsTitle.jp {
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  .contentsTitle {
    font-size: 3rem;
    letter-spacing: 5px;
    margin-bottom: 30px;
  }
}
.contentsTitle span {
  font-size: 1.8rem;
  display: block;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
}

.lead {
  font-size: 2rem;
  line-height: 2;
  padding: 0 0 50px;
  text-align: center;
  font-weight: bold;
  color: #1d1310;
}
@media only screen and (max-width: 1024px) {
  .lead {
    font-size: 1.6rem;
    padding: 0;
    text-align: center;
  }
}

.wrapper {
  width: 1280px;
  margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
  .wrapper {
    width: 100%;
  }
}
.wrapper__s {
  width: 980px;
  margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
  .wrapper__s {
    width: 100%;
  }
}

.pagetop {
  position: fixed;
  bottom: 80px;
  right: -100px;
  z-index: 999;
  width: 50px;
  height: 50px;
}
@media only screen and (max-width: 1024px) {
  .pagetop {
    width: 30px;
    height: 30px;
  }
}
.pagetop a {
  transition: all 0.2s ease-in;
  background: rgba(29, 19, 16, 0.3);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.pagetop a::after {
  content: "\e5ce";
  font-family: "Material Icons Outlined";
  color: #fff;
  font-size: 3rem;
}
.pagetop a:hover {
  opacity: 0.5;
}

.jp {
  font-family: "Noto Sans JP", sans-serif;
}

.ticketBtn {
  transform: skew(-10deg);
  width: 630px;
  margin: 0 auto;
  background-image: -ms-linear-gradient(0deg, rgb(0, 180, 200) 0%, rgb(0, 210, 45) 100%);
  filter: drop-shadow(0 15px 15px rgba(157, 226, 209, 0.8));
  transition: background 0.2s linear;
  z-index: 99;
}
@media only screen and (max-width: 1024px) {
  .ticketBtn {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
.ticketBtn a {
  transform: skew(10deg);
  padding: 30px 60px 30px 30px;
  text-align: center;
  font-size: 2.4rem;
  color: #fff;
  text-decoration: none;
  position: relative;
  letter-spacing: 0.34em;
  font-style: italic;
  display: block;
  font-weight: bold;
}
@media only screen and (max-width: 1024px) {
  .ticketBtn a {
    padding: 15px 30px 15px 15px;
    font-size: 1.6rem;
    letter-spacing: 0;
  }
}
.ticketBtn a::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-style: normal;
  content: "\f054";
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  transition: right 0.2s linear;
}
@media only screen and (max-width: 1024px) {
  .ticketBtn a::after {
    right: 10px;
  }
}
.ticketBtn:hover {
  background-image: -ms-linear-gradient(0deg, rgb(0, 205, 228) 0%, rgb(1, 237, 52) 100%);
}
.ticketBtn:hover a::after {
  right: 15px;
}

.moreBtn {
  width: 360px;
  position: relative;
  margin: 0 auto;
  font-size: 2rem;
  font-style: italic;
  font-weight: 700;
  background-color: #d3000d;
}
@media only screen and (max-width: 1024px) {
  .moreBtn {
    width: 80%;
  }
}
.moreBtn a {
  border-style: solid;
  border-width: 1px;
  border-color: rgb(255, 255, 255);
  color: #fff;
  text-decoration: none;
  display: block;
  border-radius: 100px;
  padding: 20px;
  text-align: center;
  font-size: 1.8rem;
  transition: background 0.2s linear;
  font-style: italic;
}
@media only screen and (max-width: 1024px) {
  .moreBtn a {
    padding: 10px;
  }
}
.moreBtn a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.5);
}

.text {
  font-size: 1.6rem;
  color: #1d1310;
}

.contentsFooter {
  width: 100%;
  text-align: center;
}

/* inview
---------------------------------------------------------------------------*/
.fade-mv {
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 1s ease, transform 1s ease;
}
.fade-mv.mv {
  opacity: 1;
  transform: translateY(0px);
}

.fade-mv_x {
  opacity: 0;
  transform: translateX(-100px);
  transition: opacity 1s ease, transform 1s ease;
}
@media only screen and (max-width: 1024px) {
  .fade-mv_x {
    transform: translateX(0);
    transform: translateY(60px);
  }
}

.mv_x {
  opacity: 1;
  transform: translateX(0px);
}
@media only screen and (max-width: 1024px) {
  .mv_x {
    transform: translateY(0px);
  }
}

li:nth-child(2n).fade-mv_x {
  transform: translateX(100px);
}
@media only screen and (max-width: 1024px) {
  li:nth-child(2n).fade-mv_x {
    transform: translateX(0);
    transform: translateY(60px);
  }
}
li:nth-child(2n).mv_x {
  opacity: 1;
  transform: translateX(0px);
}

/* ==========================================================================
   Header
========================================================================== */
header {
  background: #1d1310;
}

.headerHead {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
.headerHead h1 {
  width: 25%;
}
.headerHead h1 img {
  width: 100%;
}
.headerHead .flags {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
  align-items: baseline;
}
.headerHead .flags a {
  display: block;
  width: 20px;
  height: 13px;
  transition: all 0.2s ease-in;
}
.headerHead .flags a:hover {
  opacity: 0.7;
}
.headerHead .flags a.flag1 {
  background: url(/assets/images/flag_en_r.gif) no-repeat center top;
  background-size: cover;
}
.headerHead .flags a.flag2 {
  background: url(/assets/images/flag_jp_r.gif) no-repeat center top;
  background-size: cover;
}
.headerHead .flags a.flag3 {
  background: url(/assets/images/flag_kr_r.gif) no-repeat center top;
  background-size: cover;
}
.now-lang {
  pointer-events: none;
}
@media only screen and (max-width: 1024px) {
  .headerHead .flags {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
  .headerHead .flags a {
    width: 40px;
    height: 26px;
  }
  .headerHead .flags a:first-child {
    margin-right: 10px;
  }
}

.kv {
  width: 100%;
  background: #000;
  position: relative;
}
.kv img {
  width: 100%;
  height: auto;
}
.kv .slick-slider .slick-list {
  line-height: 0;
}
@media only screen and (max-width: 1024px) {
  .kv {
    padding-top: 0;
  }
}
.kv .slick-next,
.kv .slick-prev {
  right: 10px;
  z-index: 1;
  width: 48px;
  height: 48px;
  background: rgba(255, 255, 255, 0.5);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  transition: all 0.2s ease-in;
}
.kv .slick-next::before,
.kv .slick-prev::before {
  content: "\e5cc";
  font-family: "Material Icons Outlined";
  font-size: 3rem;
  color: #000;
  display: block;
}
.kv .slick-next:hover, .kv .slick-next:active, .kv .slick-next:visited,
.kv .slick-prev:hover,
.kv .slick-prev:active,
.kv .slick-prev:visited {
  background: rgba(255, 255, 255, 0.8) !important;
}
.kv .slick-prev {
  left: 10px;
  background: rgba(255, 255, 255, 0.5);
}
.kv .slick-prev::before {
  content: "\e5cb";
}

.nav {
  position: relative;
  background: #1d1310;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: baseline;
  width: 90%;
}
.nav .mainnav {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: baseline;
  font-size: 1.4rem;
  color: #fff;
  width: auto;
  margin: 0 auto;
  width: calc(100% - 50px);
}
.nav .mainnav > li {
  font-family: "Lexend", "Noto Sans JP", sans-serif;
  font-weight: 700;
  position: relative;
  transition: all 0.2s ease-in;
  width: 16.6666666667%;
  text-align: center;
}
.nav .mainnav > li:last-child {
  width: 80px;
}
@media only screen and (max-width: 1024px) {
  .nav .mainnav > li:last-child {
    width: 100%;
    padding: 20px 0;
  }
  .nav .mainnav > li:last-child .flags {
    text-align: right;
  }
  .nav .mainnav > li:last-child .flags img {
    width: 40px;
  }
  .nav .mainnav > li:last-child .flags:first-child img {
    margin-right: 20px;
  }
}
.nav .mainnav > li > a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 26px 10px;
  transition: all 0.2s ease-in;
}
.nav .mainnav > li > a .en {
  transition: all 0.2s ease-in;
  width: 100%;
}
.nav .mainnav > li > a .jp {
  width: 100%;
  display: none;
  visibility: hidden;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.2rem;
}
.nav .mainnav > li > a:hover .en {
  display: none;
  visibility: hidden;
}
@media only screen and (max-width: 1024px) {
  .nav .mainnav > li > a:hover .en {
    display: block;
    visibility: visible;
  }
}
.nav .mainnav > li > a:hover .jp {
  display: block;
  visibility: initial;
}
.nav .mainnav > li.dropdown > a {
  position: relative;
}
.nav .mainnav > li.dropdown > a::after {
  position: absolute;
  content: "\e5cf";
  display: block;
  font-family: "Material Icons Outlined";
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.4rem;
  transition: all 0.2s ease-in;
}
.nav .mainnav > li.dropdown > a:hover::after {
  bottom: -5px;
}
@media only screen and (max-width: 1024px) {
  .nav .mainnav > li.dropdown > a:hover::after {
    bottom: 10px;
  }
}
.nav .mainnav > li .dropdown__lists {
  position: absolute;
  display: none;
  visibility: hidden;
  top: 80%;
  left: 0;
  background: rgba(29, 19, 16, 0.08);
  z-index: 99;
  width: 250px;
}
.nav .mainnav > li .dropdown__lists .dropdown__list a {
  width: 100%;
  padding: 10px 10px;
  display: block;
  transition: all 0.2s ease-in;
  background: #707070;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.4rem;
  text-align: left;
}
.nav .mainnav > li .dropdown__lists .dropdown__list a:hover {
  background: rgba(0, 0, 0, 0.8);
}
.nav .mainnav > li .dropdown__lists .dropdown__list + .dropdown__list a {
  border-top: 1px solid #fff;
}
.nav .mainnav > li.current {
  background: #333;
}
.nav .mainnav > li.current .dropdown__lists {
  position: absolute;
  display: inline-block;
  visibility: visible;
  top: 100%;
}
.nav .mainnav > li.current .en {
  display: none;
  visibility: hidden;
}
@media only screen and (max-width: 1024px) {
  .nav .mainnav > li.current .en {
    display: block;
    visibility: visible;
  }
}
.nav .mainnav > li.current .jp {
  display: block;
  visibility: visible;
}
.nav .mainnav a {
  color: #fff;
}
@media only screen and (max-width: 1024px) {
  .nav .mainnav {
    display: block;
    width: 100%;
    position: fixed;
    font-size: 1.8rem;
    height: 100%;
    z-index: 99;
    padding: 80px 0;
    overflow: auto;
  }
  .nav .mainnav > li {
    padding: 0;
    width: 100%;
    text-align: left;
    border-top: 1px solid #999;
  }
  .nav .mainnav > li:last-child {
    border-bottom: 1px solid #999;
  }
  .nav .mainnav > li:last-child a {
    margin-bottom: 0;
  }
  .nav .mainnav > li > a {
    width: 100%;
    padding: 15px;
    display: block;
    text-align: left;
    font-size: 20px;
    color: black;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  .nav .mainnav > li > a > .en,
  .nav .mainnav > li > a > .jp {
    display: block;
    visibility: visible;
    color: #fff;
  }
  .nav .mainnav > li > a > .jp {
    margin: 0 0 0 10px;
    font-size: 1.4rem;
  }
  .nav .mainnav > li.dropdown > a::after {
    content: "\e145";
    display: block;
    font-family: "Material Icons Outlined";
    margin-left: 10px;
    color: #fff;
    font-size: 3rem;
    bottom: 10px;
    left: auto;
    right: 10px;
    transform: translateX(0);
  }
  .nav .mainnav > li.dropdown > a .en::after {
    display: block;
  }
  .nav .mainnav > li.dropdown > a:hover .en::after {
    display: block;
  }
  .nav .mainnav > li.dropdown.current {
    background: #333;
  }
  .nav .mainnav > li.dropdown.current .en {
    display: block;
    visibility: visible;
    color: #fff;
  }
  .nav .mainnav > li.dropdown.current .dropdown__lists {
    position: static;
    display: block;
    visibility: visible;
    top: auto;
    background: #333;
    z-index: 99;
    width: 100%;
  }
  .nav .mainnav > li.dropdown.current .dropdown__lists .dropdown__list a {
    width: 100%;
    padding: 15px;
    display: block;
    transition: all 0.2s ease-in;
    background: #707070;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1.6rem;
    text-align: left;
  }
  .nav .mainnav > li.dropdown.current .dropdown__lists .dropdown__list a:hover {
    background: rgba(0, 0, 0, 0.8);
  }
  .nav .mainnav > li.dropdown.current .dropdown__lists .dropdown__list + .dropdown__list a {
    border-top: 1px solid #fff;
  }
}

/* ヘッダーのナビ部分 */
.hamburger {
  display: none;
}

@media only screen and (max-width: 1024px) {
  .header {
    background-color: #1d1310;
    width: 100%;
    height: 50px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    position: relative;
  }
  .header .wrapper {
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }
  .headerHead h1 {
    width: 100%;
    padding: 0 10px;
    z-index: 99;
    background: #1d1310;
    position: fixed;
    top: 0;
  }
  .headerHead h1 img {
    width: 70%;
  }
  .headerHead h1 a {
    display: block;
  }
  .header__inner {
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    height: inherit;
  }
  .header__nav {
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    transform: translateX(100%);
    background-color: #1d1310;
    transition: ease 0.4s;
  }
  .header__nav.active {
    transform: translateX(0);
    z-index: 9;
  }
  .nav-items {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0;
  }
  /* ナビのリンク */
  .nav-items__item:last-child a {
    margin-bottom: 0;
  }
  /* ハンバーガーメニュー */
  .hamburger {
    display: block;
  }
  .header__hamburger {
    width: 48px;
    height: auto;
    background: #fff;
  }
  .hamburger {
    background-color: transparent;
    border-color: transparent;
    z-index: 9999;
    position: fixed;
    top: 30px;
    right: 10px;
  }
  /* ハンバーガーメニューの線 */
  .hamburger span {
    width: 100%;
    height: 1px;
    background-color: #fff;
    position: relative;
    transition: ease 0.4s;
    display: block;
  }
  .hamburger span:nth-child(1) {
    top: 0;
  }
  .hamburger span:nth-child(2) {
    margin: 8px 0;
  }
  .hamburger span:nth-child(3) {
    top: 0;
  }
  .hamburger.active {
    position: fixed;
  }
  .hamburger.active span {
    background-color: #fff;
  }
  .hamburger.active span:nth-child(1) {
    top: 5px;
    transform: rotate(45deg);
  }
  .hamburger.active span:nth-child(2) {
    opacity: 0;
  }
  .hamburger.active span:nth-child(3) {
    top: -13px;
    transform: rotate(-45deg);
  }
}
@media only screen and (max-width: 1024px) {
  .responsiveScroll {
    width: 100%;
    overflow-x: scroll;
  }
}

.tableArea {
  margin-bottom: 80px;
}
@media only screen and (max-width: 1024px) {
  .tableArea {
    margin-bottom: 40px;
  }
}

#bannerArea ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#bannerArea ul li {
  width: calc(50% - 20px);
}
@media only screen and (max-width: 1024px) {
  #bannerArea ul li {
    width: calc(50% - 10px);
  }
}
#bannerArea ul li a img {
  width: 100%;
  transition: all 0.2s ease-in;
}
#bannerArea ul li a img:hover {
  opacity: 0.5;
}

/* ==========================================================================
  第二階層共通
========================================================================== */
.titleImage {
  width: 100%;
  height: 300px;
  background: url(/assets/images/title_img_shoplist.png) no-repeat center top;
  background-size: cover;
}
.titleImage .wrapper {
  position: relative;
  margin: 0 auto;
  height: inherit;
}
.titleImage .wrapper .textArea {
  position: absolute;
  color: #fff;
  top: 50%;
  left: 100px;
  transform: translateY(-50%);
}
.titleImage .wrapper .textArea h1 {
  font-size: 4rem;
}
.titleImage .wrapper .textArea .text {
  font-size: 1.6rem;
  color: #fff;
}
@media only screen and (max-width: 1024px) {
  .titleImage {
    height: 150px;
    background-size: cover;
  }
  .titleImage .wrapper .textArea {
    position: absolute;
    color: #fff;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
  }
  .titleImage .wrapper .textArea h1 {
    font-size: 3rem;
  }
}

.pankuzu {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.pankuzu li {
  margin-top: 10px;
  font-size: 1.4rem;
}
.pankuzu li a {
  color: #fff;
  display: inline-block;
  transition: all 0.2s ease-in;
}
.pankuzu li a:hover {
  opacity: 0.7;
}
.pankuzu li + li::before {
  content: "＞";
  display: inline-block;
  color: #fff;
  font-size: 1.4rem;
  margin: 0 20px;
}
@media only screen and (max-width: 1024px) {
  .pankuzu {
    margin-left: 10px;
    overflow-x: scroll;
    word-break: keep-all;
    white-space: nowrap;
  }
  .pankuzu li {
    margin-top: 5px;
    font-size: 1.2rem;
  }
  .pankuzu li + li::before {
    margin: 0 10px;
  }
}
.pankuzuArea .pankuzu {
  margin-top: 0;
}
.pankuzuArea .pankuzu li {
  margin-top: 0;
}

.pankuzuArea {
  background: #000;
  padding: 5px;
  border-top: 1px solid #cecece;
  border-bottom: 1px solid #cecece;
}

.contentsArea {
  padding: 80px 0;
}
@media only screen and (max-width: 1024px) {
  .contentsArea {
    padding: 30px 5%;
  }
}

.listIndent li {
  text-indent: -1em;
  padding-left: 1em;
}
.listIndent li::before {
  content: "・";
}

.fontSub {
  font-size: 2rem;
}
@media only screen and (max-width: 1024px) {
  .fontSub {
    font-size: 1.8rem;
  }
}

.txtBold {
  font-weight: 700;
}

.timetable {
  font-size: 1.6rem;
  width: 100%;
}
.timetable thead tr th {
  padding: 10px;
  background: rgba(29, 19, 16, 0.08);
  text-align: center;
}
.timetable tbody tr td {
  padding: 10px;
  background: rgba(29, 19, 16, 0.05);
  text-align: center;
}

.basictable {
  font-size: 1.6rem;
  width: 100%;
}
.basictable tr th, .basictable tr td {
  padding: 10px;
  background: rgba(29, 19, 16, 0.08);
  text-align: center;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
.basictable tr th:last-child, .basictable tr td:last-child {
  border-right: none;
}
.basictable tr td {
  background: rgba(29, 19, 16, 0.05);
}

.paginate {
  width: 1280px;
  margin: 0 auto 70px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
.paginate span {
  display: block;
  color: #1d1310;
  font-size: 1.6rem;
  margin-bottom: 10px;
}
.paginate span + span {
  margin-left: 10px;
}
.paginate span.current {
  background: #1d1310;
  border: rgba(29, 19, 16, 0.3) 1px solid;
  padding: 3px 10px;
  color: #fff;
}
.paginate span a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  padding: 3px 10px;
  color: #1d1310;
  background: rgba(29, 19, 16, 0.05);
  border: rgba(29, 19, 16, 0.3) 1px solid;
  transition: all 0.2s ease-in;
}
.paginate span a:hover {
  background: rgba(29, 19, 16, 0);
}
@media only screen and (max-width: 1024px) {
  .paginate {
    width: 100%;
    margin: 0 auto 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .paginate span {
    font-size: 1.2rem;
  }
  .paginate span + span {
    margin-left: 5px;
  }
}

/* ==========================================================================
  Contents
========================================================================== */
.contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.topProducts {
  padding: 60px 0 80px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1024px) {
  .topProducts {
    padding: 40px 0;
  }
}
.topProducts::after {
  content: "";
  display: block;
  position: absolute;
  top: 300px;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  height: 58vh;
  background: rgba(29, 19, 16, 0.05);
  z-index: -1;
}
@media only screen and (max-width: 1024px) {
  .topProducts::after {
    height: 100%;
  }
}
.topProducts .productsList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  z-index: 2;
}
.topProducts .productsList li {
  width: calc(33.3333333333% - 40px);
  position: relative;
  overflow: hidden;
  transition: all 0.2s ease-in;
  margin-bottom: 40px;
}
.topProducts .productsList li .textArea {
  position: absolute;
  top: 70%;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(255, 255, 255, 0.8);
  transition: all 0.2s ease-in;
  padding: 0 20px;
}
.topProducts .productsList li .textArea h3 {
  height: 80px;
  padding: 18px 20px 30px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
.topProducts .productsList li .textArea h3 img {
  max-height: 25px;
  max-width: calc(100% - 40px);
}
@media only screen and (max-width: 1024px) {
  .topProducts .productsList li .textArea h3 {
    height: auto;
  }
  .topProducts .productsList li .textArea h3 img {
    width: auto;
  }
}
.topProducts .productsList li .textArea .text {
  color: #1d1310;
  font-size: 1.6rem;
  line-height: 1.8;
  margin-bottom: 10px;
}
.topProducts .productsList li .textArea .btnMore {
  font-size: 1.4rem;
  font-weight: bold;
  color: #1d1310;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.topProducts .productsList li .textArea .btnMore::after {
  content: "\e5cc";
  display: block;
  font-family: "Material Icons Outlined";
  margin-left: 10px;
  font-size: 1.8rem;
}
.topProducts .productsList li:hover .textArea {
  top: 0%;
}
@media only screen and (max-width: 1024px) {
  .topProducts .productsList {
    display: block;
    width: 90%;
    margin: 0 auto;
  }
  .topProducts .productsList li {
    width: 100%;
    overflow: visible;
    margin: 0 0 20px;
  }
  .topProducts .productsList li a > img {
    width: 100%;
  }
  .topProducts .productsList li .textArea {
    position: inherit;
    width: 100%;
    height: auto;
    padding: 10px 20px;
  }
  .topProducts .productsList li .textArea h3 {
    font-size: 2.2rem;
  }
}

/* ==========================================================================
  D-fits
========================================================================== */
.dfit {
  padding: 60px 0 80px;
  position: relative;
  z-index: 1;
  background: #DDDBDB;
}
@media only screen and (max-width: 1024px) {
  .dfit {
    padding: 40px 0;
  }
  .dfit .wrapper {
    width: 90%;
    margin: 0 5%;
  }
}
.dfit a {
  display: block;
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  background: #fff;
}
.dfit a figure {
  display: block;
  padding: 0 0 0 30px;
}
.dfit a .text {
  background: #EAF0DB;
  height: 300px;
  color: #1d1310;
  font-size: 1.6rem;
  padding: 50px 50px 50px 250px;
  position: relative;
  overflow: hidden;
}
.dfit a .text::before {
  content: "";
  display: block;
  border-top: 550px solid transparent;
  border-bottom: 300px solid transparent;
  border-left: 300px solid #fff;
  position: absolute;
  top: 0;
  left: 0;
}
.dfit a .btnMore {
  position: absolute;
  bottom: -20px;
  right: 50px;
  background: #9AB354;
  padding: 10px 60px;
  color: #fff;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  transition: all 0.2s ease-in;
}
.dfit a:hover {
  opacity: 0.7;
}
.dfit a:hover .btnMore {
  bottom: -10px;
}
@media only screen and (max-width: 1024px) {
  .dfit a {
    display: block;
  }
  .dfit a figure {
    padding: 20px;
  }
  .dfit a figure img {
    width: 100%;
  }
  .dfit a .text {
    height: auto;
    font-size: 1.6rem;
    padding: 20px 20px 50px;
  }
  .dfit a .text::before {
    display: none;
  }
  .dfit a .btnMore {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}

#dfit .dfitTtile {
  display: block;
  width: 100%;
  position: relative;
}
#dfit .dfitTtile .titleImage {
  background-image: none;
  height: auto;
  background: #EAF0DB;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage {
    background: #fff;
  }
}
#dfit .dfitTtile .titleImage .wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  z-index: 3;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper {
    display: block;
  }
}
#dfit .dfitTtile .titleImage .wrapper .pankuzu {
  width: 100%;
}
#dfit .dfitTtile .titleImage .wrapper .pankuzu li a, #dfit .dfitTtile .titleImage .wrapper .pankuzu li + li::before {
  color: #1d1310;
}
#dfit .dfitTtile .titleImage .wrapper figure {
  display: block;
  padding: 0 0 0 30px;
  width: 40%;
  background: #fff;
  z-index: -1;
}
#dfit .dfitTtile .titleImage .wrapper figure img {
  z-index: 3;
  position: relative;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper figure {
    padding: 20px;
    width: 100%;
  }
  #dfit .dfitTtile .titleImage .wrapper figure img {
    width: 100%;
  }
}
#dfit .dfitTtile .titleImage .wrapper figure::after {
  content: "";
  display: block;
  background: #fff;
  position: absolute;
  top: 0;
  left: -60%;
  height: 400px;
  width: 100%;
  z-index: 2;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper figure::after {
    display: none;
  }
}
#dfit .dfitTtile .titleImage .wrapper figure::before {
  content: "";
  display: block;
  border-top: 550px solid transparent;
  border-bottom: 300px solid transparent;
  border-left: 300px solid #fff;
  position: absolute;
  top: 0;
  left: 40%;
  z-index: 2;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper figure::before {
    display: none;
  }
}
#dfit .dfitTtile .titleImage .wrapper .text {
  width: 60%;
  color: #1d1310;
  font-size: 1.6rem;
  padding: 50px 50px 50px 200px;
  position: relative;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper .text {
    width: 100%;
    font-size: 1.4rem;
    padding: 20px;
    background: #EAF0DB;
  }
}
#dfit .dfitTtile .titleImage .wrapper .imgArea {
  margin-bottom: 80px;
}
#dfit .dfitTtile .titleImage .wrapper .imgArea img {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  #dfit .dfitTtile .titleImage .wrapper .imgArea {
    margin-bottom: 40px;
  }
}
#dfit .venuList li {
  padding-bottom: 40px;
  border-bottom: 1px solid #CECECE;
}
@media only screen and (max-width: 1024px) {
  #dfit .venuList li {
    padding-bottom: 20px;
  }
}
#dfit .venuList li + li {
  margin-top: 40px;
}
@media only screen and (max-width: 1024px) {
  #dfit .venuList li + li {
    margin-top: 20px;
  }
}
#dfit .imgArea {
  margin-bottom: 60px;
}
@media only screen and (max-width: 1024px) {
  #dfit .imgArea {
    margin: 0 auto 40px;
    width: 90%;
  }
  #dfit .imgArea img {
    width: 100%;
  }
}
#dfit .lead {
  margin-bottom: 60px;
}
@media only screen and (max-width: 1024px) {
  #dfit .lead {
    margin-bottom: 30px;
  }
}
#dfit .textArea {
  margin-bottom: 30px;
}
@media only screen and (max-width: 1024px) {
  #dfit .textArea {
    margin-bottom: 20px;
  }
}
#dfit h3 {
  font-size: 2rem;
}
@media only screen and (max-width: 1024px) {
  #dfit h3 {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 1024px) {
  #dfit .timetable tbody tr {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
  }
  #dfit .timetable tbody tr td {
    width: 50%;
  }
}

/* ==========================================================================
  topBanner
========================================================================== */
.topBanner {
  background: #f3f3f2;
}
@media only screen and (max-width: 1024px) {
  .topBanner {
    width: 100%;
    padding: 30px 0;
  }
}
.topBanner ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 1280px;
  margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
  .topBanner ul {
    width: 90%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
  }
}
.topBanner ul > li {
  position: relative;
  z-index: 1;
  width: calc(50% - 20px);
  text-align: left;
}
@media only screen and (max-width: 1024px) {
  .topBanner ul > li {
    width: calc(50% - 10px);
  }
}
.topBanner ul > li a {
  display: block;
  margin: 60px auto;
  width: 100%;
  color: #fff;
  position: relative;
}
.topBanner ul > li a img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.topBanner ul > li a .textArea {
  position: absolute;
  text-align: left;
  top: 50px;
  left: 50px;
}
.topBanner ul > li a .textArea h2 {
  color: #fff;
  font-size: 3rem;
}
.topBanner ul > li a .textArea .text {
  color: #fff;
  font-size: 1.6rem;
}
.topBanner ul > li a .btnMore {
  position: absolute;
  bottom: -20px;
  left: 50px;
  background: #d3000d;
  padding: 10px 60px;
  color: #fff;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  transition: all 0.2s ease-in;
}
.topBanner ul > li a:hover {
  opacity: 0.7;
}
.topBanner ul > li a:hover .btnMore {
  bottom: -10px;
}
@media only screen and (max-width: 1024px) {
  .topBanner ul > li a {
    display: block;
    width: 100%;
    margin: 0;
    height: auto;
    position: relative;
  }
  .topBanner ul > li a figure img {
    width: 100%;
    margin: 0 auto;
  }
  .topBanner ul > li a .textArea {
    position: static;
    text-align: left;
    background: #fff;
    padding: 15px 15px 40px;
    min-height: 180px;
  }
  .topBanner ul > li a .textArea h2 {
    position: absolute;
    font-size: 1.8rem;
    line-height: 1.2;
    top: 20px;
    left: 10px;
  }
  .topBanner ul > li a .textArea .text {
    color: #000;
    font-size: 1.4rem;
  }
  .topBanner ul > li a .btnMore {
    right: auto;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    padding: 5px 20px;
  }
}

/* ==========================================================================
  News
========================================================================== */
.newsArea {
  padding: 80px 0;
}
.newsArea .wrapper {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0 100px;
}
@media only screen and (max-width: 1024px) {
  .newsArea .wrapper {
    width: 90%;
    margin: 0 5%;
  }
}
.newsArea .contentsTitle {
  text-align: left;
  padding-right: 150px;
}
@media only screen and (max-width: 1024px) {
  .newsArea {
    padding: 30px 0;
  }
  .newsArea .wrapper {
    display: block;
    padding: 0;
  }
  .newsArea .contentsTitle {
    text-align: center;
    padding-right: 0;
  }
}
.newsArea .newsList {
  width: calc(100% - 280px);
}
@media only screen and (max-width: 1024px) {
  .newsArea .newsList {
    width: 100%;
  }
}
.newsArea .newsList li a {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: 1.6rem;
  color: #1d1310;
  transition: all 0.2s ease-in;
}
.newsArea .newsList li a .date {
  padding-right: 20px;
  width: 20%;
}
.newsArea .newsList li a .text {
  width: calc(80% - 20px);
}
.newsArea .newsList li a:hover {
  opacity: 0.5;
  text-decoration: underline;
}
@media only screen and (max-width: 1024px) {
  .newsArea .newsList li a {
    display: block;
  }
  .newsArea .newsList li a .date {
    padding-right: 0;
    width: 100%;
  }
  .newsArea .newsList li a .text {
    width: 100%;
  }
}
.newsArea .newsList li + li {
  margin-top: 20px;
}

/* ==========================================================================
  第二階層テンプレ
========================================================================== */
.second .titleImage {
  background: url(/assets/images/title_img_shoplist.png) no-repeat center top;
  background-size: cover;
}

/* ==========================================================================
  TECHNOLOGY & MATERIAL
========================================================================== */
#technology_material .titleImage {
  background: url(/assets/images/title_img_technology_material.png) no-repeat center top;
  background-size: cover;
}

.techList li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(29, 19, 16, 0.08);
}
.techList li + li {
  padding-top: 40px;
}
@media only screen and (max-width: 1024px) {
  .techList li {
    display: block;
    padding-bottom: 20px;
  }
  .techList li + li {
    padding-top: 20px;
  }
}
.techList li figure {
  display: block;
  max-width: 340px;
  margin-right: 40px;
}
@media only screen and (max-width: 1024px) {
  .techList li figure {
    max-width: 100%;
    margin-right: 0;
  }
  .techList li figure img {
    width: 100%;
  }
}
.techList li .textArea h3 {
  font-size: 2.4rem;
  margin-bottom: 30px;
}
.techList li .textArea .text {
  font-size: 1.6rem;
  line-height: 1.8;
}
@media only screen and (max-width: 1024px) {
  .techList li .textArea h3 {
    font-size: 2rem;
    margin-bottom: 15px;
    margin-top: 15px;
  }
}

/* ==========================================================================
  店舗一覧
========================================================================== */
body#about .titleImage {
  background: url(/assets/images/title_img_about.png) no-repeat center top;
  background-size: cover;
}
body#about .lead {
  text-align: left;
}
body#about #secondSection {
  background: rgba(29, 19, 16, 0.05);
}
body#about #thirdSection {
  background: url(/assets/images/about/BG_about.jpg) no-repeat center top;
  background-size: cover;
}
body#about #thirdSection ul li {
  padding-bottom: 30px;
  border-bottom: 1px solid #fff;
}
body#about #thirdSection ul li + li {
  margin-top: 30px;
}
@media only screen and (max-width: 1024px) {
  body#about #thirdSection ul li {
    padding-bottom: 20px;
  }
  body#about #thirdSection ul li + li {
    margin-top: 20px;
  }
}
body#about #thirdSection ul li dl {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
body#about #thirdSection ul li dl dt {
  padding: 0 50px;
}
@media only screen and (max-width: 1024px) {
  body#about #thirdSection ul li dl dt {
    padding: 0 20px;
  }
  body#about #thirdSection ul li dl dt img {
    width: 50px;
  }
}
body#about #thirdSection ul li dl dd {
  color: #fff;
}
body#about #thirdSection ul li dl dd h3 {
  font-size: 2.4rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  body#about #thirdSection ul li dl dd h3 {
    font-size: 2rem;
  }
}
body#about #thirdSection ul li dl dd p {
  color: #fff;
}

/* ==========================================================================
  PRODUCTS
========================================================================== */
body#products .titleImage {
  background: url(/assets/images/products/title_img_products.png) no-repeat center top;
  background-size: cover;
}
body#products.manual .titleImage {
  background: url(/assets/images/products/title_img_manual.png) no-repeat center top;
  background-size: cover;
}
body#products.vanquish .titleImage {
  background: url(/assets/images/products/title_img_vanquish.png) no-repeat center top;
  background-size: cover;
}
body#products.eldio .titleImage {
  background: url(/assets/images/products/title_img_eldio.png) no-repeat center top;
  background-size: cover;
}
body#products.tensei .titleImage {
  background: url(/assets/images/products/title_img_tensei.png) no-repeat center top;
  background-size: cover;
}
body#products.ot .titleImage {
  background: url(/assets/images/products/title_img_ot.png) no-repeat center top;
  background-size: cover;
}
body#products.grandbassara .titleImage {
  background: url(/assets/images/products/title_img_grandbassara.png) no-repeat center top;
  background-size: cover;
}
body#products.diamana .titleImage {
  background: url(/assets/images/products/title_img_diamana.png) no-repeat center top;
  background-size: cover;
}
body#products .productsTitle {
  position: absolute;
  top: 20px;
  left: 30px;
  color: #fff;
  font-family: "Lexend", "Noto Sans JP", sans-serif;
  font-size: 3rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  body#products .productsTitle {
    font-size: 2rem;
    top: 5px;
    left: 10px;
  }
}
body#products .productsSeries .wrapper > ul > li + li {
  margin-top: 40px;
}
body#products .productsSeries .wrapper > ul > li dl dt {
  position: relative;
  background: rgb(0, 0, 0);
  background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgb(45, 45, 45) 50%, rgb(51, 51, 51) 100%);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  height: 200px;
}
@media only screen and (max-width: 1024px) {
  body#products .productsSeries .wrapper > ul > li dl dt {
    height: 100px;
  }
}
body#products .productsSeries .wrapper > ul > li dl dt img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  padding-top: 40px;
}
@media only screen and (max-width: 1024px) {
  body#products .productsSeries .wrapper > ul > li dl dt img {
    padding-top: 20px;
  }
}
body#products .productsSeries .wrapper > ul > li dl dd .seriesList {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 20px;
  border-bottom: 1px solid #f3f3f2;
}
body#products .productsSeries .wrapper > ul > li dl dd .seriesList li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
body#products .productsSeries .wrapper > ul > li dl dd .seriesList li a {
  width: 100%;
  display: block;
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  color: #000;
  transition: all 0.2s ease-in;
  line-height: 1.5;
}
body#products .productsSeries .wrapper > ul > li dl dd .seriesList li a:hover {
  opacity: 0.5;
  background: rgba(29, 19, 16, 0.05);
}
body#products .productsSeries .wrapper > ul > li dl dd .seriesList li + li::before {
  content: "｜";
  display: inline-block;
  color: #000;
  font-size: 2rem;
  margin: 0 20px;
}
@media only screen and (max-width: 1024px) {
  body#products .productsSeries .wrapper > ul > li dl dd .seriesList {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  body#products .productsSeries .wrapper > ul > li dl dd .seriesList li {
    width: calc(50% - 5px);
  }
  body#products .productsSeries .wrapper > ul > li dl dd .seriesList li + li::before {
    display: none;
  }
  body#products .productsSeries .wrapper > ul > li dl dd .seriesList li:nth-child(2n)::before {
    content: "｜";
    display: inline-block;
    color: #000;
    font-size: 2rem;
    margin: 0 5px;
  }
  body#products .productsSeries .wrapper > ul > li dl dd .seriesList li a {
    width: 100%;
  }
}
body#products.detail .kv {
  background: none;
}
body#products.detail .titleImage {
  background: none;
  height: auto;
  width: 100%;
}
body#products.detail .titleImage .text {
  color: #1d1310;
}
body#products.detail .titleImage .wrapper .textArea {
  position: relative;
  padding: 50px 30px;
  transform: translateY(0);
  top: auto;
  left: auto;
  width: calc(100% - 60px);
  color: #1d1310;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .titleImage .wrapper .textArea {
    padding: 20px 5%;
    width: 90%;
  }
}
body#products.detail .detailImage {
  margin: 0 auto 80px;
}
body#products.detail .detailImage img {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .detailImage {
    margin: 0 auto 40px;
  }
}
body#products.detail .contentsTitle {
  text-align: left;
  font-size: 3rem;
  margin-bottom: 40px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: baseline;
}
body#products.detail .contentsTitle span {
  display: block;
  margin-left: 20px;
  font-size: 1.8rem;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .contentsTitle {
    font-size: 2.6rem;
    margin-bottom: 20px;
    display: block;
  }
  body#products.detail .contentsTitle span {
    margin-left: 0;
    font-size: 1.4rem;
  }
}
body#products.detail .tableDetail {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .tableDetail {
    width: -moz-max-content;
    width: max-content;
  }
}
body#products.detail .tableDetail thead th {
  background: #000;
  color: #fff;
  font-size: 1.6rem;
  padding: 10px 0;
  text-align: center;
}
body#products.detail .tableDetail thead th + th {
  border-left: 1px solid #fff;
}
body#products.detail .tableDetail thead th:first-child {
  width: 20%;
}
body#products.detail .tableDetail thead th:nth-child(2), body#products.detail .tableDetail thead th:nth-child(3), body#products.detail .tableDetail thead th:nth-child(4), body#products.detail .tableDetail thead th:nth-child(5), body#products.detail .tableDetail thead th:nth-child(6), body#products.detail .tableDetail thead th:nth-child(7), body#products.detail .tableDetail thead th:nth-child(8), body#products.detail .tableDetail thead th:nth-child(9) {
  width: 10%;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .tableDetail thead th {
    font-size: 1.4rem;
  }
  body#products.detail .tableDetail thead th:first-child {
    width: 200px;
  }
  body#products.detail .tableDetail thead th:nth-child(2), body#products.detail .tableDetail thead th:nth-child(3), body#products.detail .tableDetail thead th:nth-child(4), body#products.detail .tableDetail thead th:nth-child(5), body#products.detail .tableDetail thead th:nth-child(6), body#products.detail .tableDetail thead th:nth-child(7), body#products.detail .tableDetail thead th:nth-child(8), body#products.detail .tableDetail thead th:nth-child(9) {
    width: 80px;
  }
}
body#products.detail .tableDetail tbody tr td {
  background: rgba(29, 19, 16, 0.05);
  font-size: 1.6rem;
  padding: 10px 20px;
  text-align: center;
}
body#products.detail .tableDetail tbody tr td + td {
  border-left: 1px solid #fff;
}
body#products.detail .tableDetail tbody tr td:last-child {
  text-align: center;
}
body#products.detail .tableDetail tbody tr td:last-child a {
  color: #000;
  text-decoration: underline;
  transition: all 0.2s ease-in;
}
body#products.detail .tableDetail tbody tr td:last-child a:hover {
  opacity: 0.5;
}
@media only screen and (max-width: 1024px) {
  body#products.detail .tableDetail tbody tr td {
    padding: 5px 10px;
    font-size: 1.4rem;
  }
}
body#products.detail .tableDetail tbody tr + tr td {
  border-top: 1px solid #fff;
}
body#products.detail .tableDetail tbody tr:nth-child(2n) td {
  background: rgba(29, 19, 16, 0.08);
}
body#products.manual ul.manualList > li + li {
  border-top: 1px solid #fff;
}
body#products.manual ul.manualList > li dl dt {
  background: #1d1310;
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  padding: 10px 40px 10px 20px;
  width: 100%;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease-in;
}
@media only screen and (max-width: 1024px) {
  body#products.manual ul.manualList > li dl dt {
    padding: 8px 30px 8px 15px;
    font-size: 1.8rem;
  }
}
body#products.manual ul.manualList > li dl dd {
  font-size: 1.6rem;
  padding: 30px;
  background-color: rgba(29, 19, 16, 0.05);
}
@media only screen and (max-width: 1024px) {
  body#products.manual ul.manualList > li dl dd {
    font-size: 1.4rem;
    padding: 15px;
  }
}
body#products.manual .address {
  font-size: 1.6rem;
  line-height: 1.8;
  padding: 60px 0 0;
}
@media only screen and (max-width: 1024px) {
  body#products.manual .address {
    font-size: 1.4rem;
    padding: 30px 0 0;
  }
}

#otherSeries {
  background: rgba(29, 19, 16, 0.05);
}

.otherList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  z-index: 2;
}
.otherList > li {
  width: calc(50% - 20px);
  position: relative;
  overflow: hidden;
  transition: all 0.2s ease-in;
}
@media only screen and (max-width: 1024px) {
  .otherList > li {
    width: 100%;
  }
}
.otherList > li dl dt {
  position: relative;
  background: rgb(0, 0, 0);
  background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgb(45, 45, 45) 50%, rgb(51, 51, 51) 100%);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  height: 120px;
}
.otherList > li dl dt img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.otherList > li dl dt .productsTitle {
  top: 10px !important;
  left: 20px !important;
  font-size: 2rem !important;
}
@media only screen and (max-width: 1024px) {
  .otherList > li dl dt .productsTitle {
    font-size: 1.6rem !important;
    top: 5px !important;
    left: 10px !important;
  }
}
.otherList > li dl dd .seriesList {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px;
  border-bottom: none;
}
.otherList > li dl dd .seriesList li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.otherList > li dl dd .seriesList li a {
  width: 100%;
  display: block;
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  color: #000;
  transition: all 0.2s ease-in;
}
.otherList > li dl dd .seriesList li a:hover {
  opacity: 0.5;
  background: rgba(29, 19, 16, 0.05);
}
.otherList > li dl dd .seriesList li + li::before {
  content: "｜";
  display: inline-block;
  color: #000;
  font-size: 2rem;
  margin: 0 20px;
}
@media only screen and (max-width: 1024px) {
  .otherList > li dl dd .seriesList {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .otherList > li dl dd .seriesList li {
    width: calc(50% - 5px);
  }
  .otherList > li dl dd .seriesList li + li::before {
    display: none;
  }
  .otherList > li dl dd .seriesList li:nth-child(2n)::before {
    content: "｜";
    display: inline-block;
    color: #000;
    font-size: 2rem;
    margin: 0 5px;
  }
  .otherList > li dl dd .seriesList li a {
    width: 100%;
  }
}

/* ==========================================================================
プレスリリース
========================================================================== */
body#pressrelease .titleImage {
  background: url(/assets/images/title_img_pressrelease.png) no-repeat center top;
  background-size: cover;
}
body#pressrelease.detail .titleImage {
  background: url(/assets/images/title_img_pressrelease.png) no-repeat center top;
  background-size: cover;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail .titleImage {
    background: url(/assets/images/title_img_pressrelease.png) no-repeat center center;
  }
}
body#pressrelease.detail #newsdetailArea .wrapper {
  padding-bottom: 80px;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .wrapper {
    padding-bottom: 40px;
  }
}
body#pressrelease.detail #newsdetailArea .newsContents {
  padding-bottom: 60px;
  margin-bottom: 60px;
  border-bottom: 1px solid #000;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .newsContents {
    padding-bottom: 30px;
    margin-bottom: 30px;
  }
}
body#pressrelease.detail #newsdetailArea .newsContents .btnMore {
  position: static;
  bottom: 0;
  left: 0;
  background: #d3000d;
  padding: 15px 0;
  color: #fff;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
  transition: all 0.2s ease-in;
  margin: 0 auto;
  width: 400px;
  display: block;
}
body#pressrelease.detail #newsdetailArea .newsContents .btnMore:hover {
  opacity: 0.7;
}
body#pressrelease.detail #newsdetailArea .newsContents .btnMore:hover .btnMore {
  bottom: 0;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .newsContents .btnMore {
    width: 80%;
    font-size: 1.4rem;
  }
}
body#pressrelease.detail #newsdetailArea .date {
  font-size: 1.6rem;
  margin-bottom: 20px;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .date {
    font-size: 1.4rem;
    margin-bottom: 15px;
  }
}
body#pressrelease.detail #newsdetailArea h2.newsTitle {
  padding-bottom: 20px;
  margin-bottom: 40px;
  border-bottom: 1px solid #cecece;
  font-size: 3rem;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea h2.newsTitle {
    font-size: 2rem;
    padding-bottom: 15px;
    margin-bottom: 20px;
  }
}
body#pressrelease.detail #newsdetailArea h3 {
  padding-bottom: 15px;
  margin-bottom: 30px;
  border-bottom: 1px solid #cecece;
  font-size: 2rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea h3 {
    font-size: 1.6rem;
    padding-bottom: 15px;
    margin-bottom: 20px;
  }
}
body#pressrelease.detail #newsdetailArea h4 {
  margin-bottom: 30px;
  font-size: 1.6rem;
  font-weight: 700;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea h4 {
    font-size: 1.4rem;
    margin-bottom: 20px;
  }
}
body#pressrelease.detail #newsdetailArea .newsImage {
  margin-bottom: 30px;
}
body#pressrelease.detail #newsdetailArea .newsImage img {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .newsImage {
    margin-bottom: 20px;
  }
}
body#pressrelease.detail #newsdetailArea .text {
  font-size: 1.6rem;
  line-height: 1.8;
  margin-bottom: 40px;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .text {
    font-size: 1.4rem;
    margin-bottom: 20px;
  }
}
body#pressrelease.detail #newsdetailArea .btnMore {
  position: static;
  bottom: 0;
  left: 0;
  background: #d3000d;
  padding: 10px 0;
  color: #fff;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  transition: all 0.2s ease-in;
  margin: 0 auto;
  display: block;
  width: 300px;
}
body#pressrelease.detail #newsdetailArea .btnMore:hover {
  opacity: 0.7;
}
body#pressrelease.detail #newsdetailArea .btnMore:hover .btnMore {
  bottom: 0;
}
@media only screen and (max-width: 1024px) {
  body#pressrelease.detail #newsdetailArea .btnMore {
    width: 60%;
  }
}

.selectbox {
  position: relative;
  font-size: 1.6rem;
}
.selectbox::before, .selectbox::after {
  position: absolute;
  content: "";
  pointer-events: none;
}
.selectbox::before {
  right: 0;
  display: inline-block;
  border-radius: 0 3px 3px 0;
  background-color: #fff;
  content: "";
}
.selectbox::after {
  position: absolute;
  top: 50%;
  right: 3em;
  transform: translate(50%, -50%) rotate(45deg);
  width: 6px;
  height: 6px;
  border-bottom: 3px solid #000;
  border-right: 3px solid #000;
  content: "";
}
.selectbox select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  min-width: 180px;
  height: 2.8em;
  padding: 0.4em 3.6em 0.4em 0.8em;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #333333;
  font-size: 1.6rem;
  background: #fff;
  cursor: pointer;
}
@media only screen and (max-width: 1024px) {
  .selectbox select {
    min-width: 120px;
    height: 2em;
  }
}
.selectbox select:focus {
  outline: 1px solid rgba(29, 19, 16, 0.5);
}

/* ==========================================================================
  店舗一覧
========================================================================== */
body#shoplist .titleImage {
  background: url(/assets/images/title_img_shoplist.png) no-repeat center top;
  background-size: cover;
}
body#shoplist .listArea {
  padding: 80px 0;
}
body#shoplist .listArea .mapList > li + li {
  margin-top: 40px;
}
body#shoplist .listArea .mapList > li dl {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
body#shoplist .listArea .mapList > li dl dt {
  width: 260px;
}
body#shoplist .listArea .mapList > li dl dt a {
  width: 100%;
  height: 80px;
  display: block;
  font-size: 2rem;
  line-height: 80px;
  text-align: center;
  border: solid 1px #cecece;
  color: #000;
  transition: all 0.2s ease-in;
}
body#shoplist .listArea .mapList > li dl dt a:hover {
  opacity: 0.7;
  background: rgba(29, 19, 16, 0.05);
}
body#shoplist .listArea .mapList > li dl dd {
  height: 80px;
  width: calc(100% - 300px);
  margin-left: 40px;
  border-bottom: 1px solid #cecece;
}
body#shoplist .listArea .mapList > li dl dd .prefectures {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  line-height: 80px;
  padding: 0 20px;
}
body#shoplist .listArea .mapList > li dl dd .prefectures > li a {
  color: #000;
  font-size: 1.8rem;
  transition: all 0.2s ease-in;
}
body#shoplist .listArea .mapList > li dl dd .prefectures > li a:hover {
  opacity: 0.5;
}
body#shoplist .listArea .mapList > li dl dd .prefectures > li + li::before {
  content: "｜";
  display: inline-block;
  color: #000;
  font-size: 2rem;
  margin: 0 20px;
}
@media only screen and (max-width: 1024px) {
  body#shoplist .listArea {
    padding: 30px 5%;
  }
  body#shoplist .listArea .mapList > li + li {
    margin-top: 20px;
  }
  body#shoplist .listArea .mapList > li dl {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  body#shoplist .listArea .mapList > li dl dt {
    width: 100%;
    margin-bottom: 20px;
  }
  body#shoplist .listArea .mapList > li dl dt a {
    height: 40px;
    line-height: 40px;
    background: rgba(29, 19, 16, 0.05);
  }
  body#shoplist .listArea .mapList > li dl dd {
    height: auto;
    width: 100%;
    margin-left: 0;
  }
  body#shoplist .listArea .mapList > li dl dd .prefectures {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    line-height: auto;
    padding: 0 10px;
  }
  body#shoplist .listArea .mapList > li dl dd .prefectures > li {
    line-height: 1.5;
    margin-bottom: 10px;
  }
  body#shoplist .listArea .mapList > li dl dd .prefectures > li a {
    color: #000;
  }
  body#shoplist .listArea .mapList > li dl dd .prefectures > li + li::before {
    content: "｜";
    font-size: 1.8rem;
    margin: 0 10px;
  }
}
body#shoplist .tableShop {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  body#shoplist .tableShop {
    width: -moz-max-content;
    width: max-content;
  }
}
body#shoplist .tableShop thead th {
  background: #000;
  color: #fff;
  font-size: 1.6rem;
  padding: 10px 0;
  text-align: center;
}
body#shoplist .tableShop thead th + th {
  border-left: 1px solid #fff;
}
body#shoplist .tableShop thead th:first-child {
  width: 10%;
}
body#shoplist .tableShop thead th:nth-child(2) {
  width: 25%;
}
body#shoplist .tableShop thead th:nth-child(3) {
  width: 42%;
}
body#shoplist .tableShop thead th:nth-child(4) {
  width: 15%;
}
body#shoplist .tableShop thead th:nth-child(5) {
  width: 8%;
}
@media only screen and (max-width: 1024px) {
  body#shoplist .tableShop thead th {
    font-size: 1.4rem;
  }
  body#shoplist .tableShop thead th:first-child {
    width: 60px;
  }
  body#shoplist .tableShop thead th:nth-child(2) {
    width: 150px;
  }
  body#shoplist .tableShop thead th:nth-child(3) {
    width: 200px;
  }
  body#shoplist .tableShop thead th:nth-child(4) {
    width: 120px;
  }
  body#shoplist .tableShop thead th:nth-child(5) {
    width: 50px;
  }
}
body#shoplist .tableShop tbody tr td {
  background: rgba(29, 19, 16, 0.05);
  font-size: 1.6rem;
  padding: 10px 20px;
  text-align: left;
}
body#shoplist .tableShop tbody tr td:nth-child(3) span {
  display: inline-block;
  margin-right: 20px;
}
body#shoplist .tableShop tbody tr td + td {
  border-left: 1px solid #fff;
}
body#shoplist .tableShop tbody tr td:last-child {
  text-align: center;
}
body#shoplist .tableShop tbody tr td:last-child a {
  color: #000;
  text-decoration: underline;
  transition: all 0.2s ease-in;
}
body#shoplist .tableShop tbody tr td:last-child a:hover {
  opacity: 0.5;
}
@media only screen and (max-width: 1024px) {
  body#shoplist .tableShop tbody tr td {
    padding: 5px 10px;
    font-size: 1.4rem;
  }
  body#shoplist .tableShop tbody tr td:nth-child(3) span {
    display: block;
    margin-right: 0;
  }
}
body#shoplist .tableShop tbody tr + tr td {
  border-top: 1px solid #fff;
}
body#shoplist .tableShop tbody tr:nth-child(2n) td {
  background: rgba(29, 19, 16, 0.08);
}

/* ==========================================================================
試打会情報
========================================================================== */
body#event .titleImage {
  background: url(/assets/images/title_img_event.png) no-repeat center center;
  background-size: cover;
  height: 160px;
}

.tableEvent {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  .tableEvent {
    width: -moz-max-content;
    width: max-content;
  }
}
.tableEvent thead th {
  background: #000;
  color: #fff;
  font-size: 1.6rem;
  padding: 10px 0;
  text-align: center;
}
.tableEvent thead th + th {
  border-left: 1px solid #fff;
}
.tableEvent thead th:first-child {
  width: 15%;
}
.tableEvent thead th:nth-child(2) {
  width: 30%;
}
.tableEvent thead th:nth-child(3) {
  width: 40%;
}
.tableEvent thead th:nth-child(4) {
  width: 15%;
}
@media only screen and (max-width: 1024px) {
  .tableEvent thead th {
    font-size: 1.4rem;
  }
  .tableEvent thead th:first-child {
    width: 80px;
  }
  .tableEvent thead th:nth-child(2) {
    width: 150px;
  }
  .tableEvent thead th:nth-child(3) {
    width: 200px;
  }
  .tableEvent thead th:nth-child(4) {
    width: 80px;
  }
}
.tableEvent tbody tr td {
  background: rgba(29, 19, 16, 0.05);
  font-size: 1.6rem;
  padding: 10px 20px;
  text-align: left;
}
.tableEvent tbody tr td span {
  display: block;
  font-weight: 700;
}
.tableEvent tbody tr td + td {
  border-left: 1px solid #fff;
}
.tableEvent tbody tr td:last-child {
  text-align: center;
}
.tableEvent tbody tr td:last-child a {
  color: #000;
  text-decoration: underline;
  transition: all 0.2s ease-in;
}
.tableEvent tbody tr td:last-child a:hover {
  opacity: 0.5;
}
@media only screen and (max-width: 1024px) {
  .tableEvent tbody tr td {
    padding: 5px 10px;
    font-size: 1.4rem;
  }
  .tableEvent tbody tr td:nth-child(3) span {
    display: block;
    margin-right: 0;
  }
}
.tableEvent tbody tr + tr td {
  border-top: 1px solid #fff;
}
.tableEvent tbody tr:nth-child(2n) td {
  background: rgba(29, 19, 16, 0.08);
}

/* ==========================================================================
  試打会＆レンタル
========================================================================== */
@media only screen and (max-width: 1024px) {
  #trial h2 {
    font-size: 2.2rem;
  }
}
#trial .titleImage {
  background: url(/assets/images/title_img_trial.png) no-repeat center top;
  background-size: cover;
  min-height: 600px;
}
#trial .titleImage .wrapper {
  height: 100%;
}
#trial .titleImage .cap {
  background: rgba(255, 255, 255, 0.2);
  padding: 30px;
  margin-top: 30px;
}
#trial .titleImage .lead {
  text-align: left;
  color: #fff;
  padding: 0 0 20px;
}
@media only screen and (max-width: 1024px) {
  #trial .titleImage {
    min-height: 500px;
  }
  #trial .titleImage .lead {
    padding: 20px 0 10px;
  }
  #trial .titleImage .cap {
    padding: 15px;
    margin: 20px 20px 0 0;
  }
  #trial .titleImage .lead {
    padding: 0;
  }
}
#trial #appArea .wrapper__s > .text {
  text-align: center;
  margin-top: 30px;
  width: 100%;
}
#trial .trialApp {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media only screen and (max-width: 1024px) {
  #trial .trialApp {
    display: block;
  }
}
#trial .trialApp li {
  width: calc(50% - 20px);
}
@media only screen and (max-width: 1024px) {
  #trial .trialApp li {
    width: 100%;
  }
  #trial .trialApp li + li {
    margin-top: 30px;
  }
}
#trial .trialApp li h2 {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#trial .trialApp li h2::before {
  content: "\e61c";
  display: inline-block;
  font-size: 3rem;
  font-family: "Material Icons Outlined";
  margin-right: 10px;
  font-weight: normal;
}
#trial .trialApp li:nth-child(2) h2::before {
  content: "\e30a";
}
#trial .trialApp li:nth-child(2) img {
  width: 100%;
}
#trial .trialApp li .phone {
  font-size: 3rem;
  font-weight: 700;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#trial .trialApp li .phone img {
  margin-right: 10px;
}
#trial .trialApp li .text:first-of-type {
  margin-bottom: 20px;
}
#trial #noteArea ul:first-of-type {
  display: block;
  margin-bottom: 60px;
}
@media only screen and (max-width: 1024px) {
  #trial #noteArea ul:first-of-type {
    margin-bottom: 30px;
  }
}
#trial #noteArea .basictable thead tr th:first-child {
  width: 20%;
}
#trial #noteArea .basictable thead tr th:nth-child(2) {
  width: 40%;
}
#trial #noteArea .basictable thead tr th:nth-child(3) {
  width: 40%;
}

/* ==========================================================================
お問い合わせ
========================================================================== */
body#contact .titleImage {
  background: url(/assets/images/contact/title_img_contact.png) no-repeat center top;
  background-size: cover;
}

/* ==========================================================================
プライバシーポリシー
========================================================================== */
body#privacypolicy .titleImage {
  background: url(/assets/images/title_img_privacypolicy.png) no-repeat center top;
  background-size: cover;
  height: 160px;
}

/* ==========================================================================
模造品に関するご注意
========================================================================== */
body#counterfeit .titleImage {
  background: url(/assets/images/title_img_counterfeit.png) no-repeat center top;
  background-size: cover;
  height: 160px;
}

/* ==========================================================================
   footer
========================================================================== */
footer {
  padding-top: 50px;
  background: #1d1310;
}
@media only screen and (max-width: 1024px) {
  footer {
    padding-top: 25px;
  }
}
footer__logo {
  margin: 30px auto;
}
footer .wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media only screen and (max-width: 1024px) {
  footer .wrapper {
    display: block;
    width: 90%;
  }
}
footer .footerList {
  width: calc(25% - 20px);
}
@media only screen and (max-width: 1024px) {
  footer .footerList {
    width: 100%;
  }
}
footer .footerList > li a {
  text-align: left;
  color: #fff;
  font-size: 1.4rem;
  width: 100%;
  display: block;
  padding: 0 10px;
  transition: all 0.2s ease-in;
}
footer .footerList > li a:hover {
  opacity: 0.5;
}
footer .footerList > li > a {
  margin-bottom: 10px;
  padding: 10px 0;
  border-bottom: 1px solid #fff;
  font-weight: bold;
}
footer .footerList > li > ul > li:last-child {
  margin-bottom: 30px;
}
@media only screen and (max-width: 1024px) {
  footer .footerList > li > ul > li:last-child {
    margin-bottom: 10px;
  }
}
footer .footerList.products {
  width: calc(50% - 20px);
}
footer .footerList.products .footerProducts ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
footer .footerList.products .footerProducts ul li {
  width: 50%;
}
@media only screen and (max-width: 1024px) {
  footer .footerList.products {
    width: 100%;
  }
  footer .footerList.products .footerProducts ul {
    display: block;
  }
  footer .footerList.products .footerProducts ul li {
    width: 100%;
    margin: 0 0 10px;
  }
}
footer .footerSns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
footer .footerSns li {
  text-align: center;
}
footer .footerSns li + li {
  margin-left: 40px;
}
@media only screen and (max-width: 1024px) {
  footer .footerSns li + li {
    margin-left: 20px;
  }
}
footer .footerSns li img {
  width: 50px;
  transition: all 0.2s ease-in;
}
footer .footerSns li img:hover {
  opacity: 0.7;
}
@media only screen and (max-width: 1024px) {
  footer .footerSns li img {
    width: 40px;
  }
}
footer .footerUnder {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 30px 0;
}
footer .footerUnder li {
  padding: 0 20px;
}
footer .footerUnder li a {
  color: #ccc;
  font-size: 1.4rem;
  transition: all 0.2s ease-in;
}
footer .footerUnder li a:hover {
  opacity: 0.5;
}
footer .copy {
  padding: 30px 0;
  text-align: center;
  font-size: 1.2rem;
  color: #ccc;
  border-top: 1px solid #666;
}

/* modal */
.modalImg {
  background: #fff;
  pointer-events: none;
}
@media only screen and (max-width: 1024px) {
  .modalImg {
    pointer-events: auto;
  }
}
.modalImg img {
  transition: opacity 0.3s linear;
}
.modalImg:hover img {
  opacity: 0.8;
}

.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
}

#modalClone {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
#modalClone.is-active {
  width: 100%;
  height: 100%;
  overflow-x: scroll;
}
#modalClone.is-active img {
  width: auto;
  height: 100vh;
  max-width: none;
}

.modalMenu {
  position: fixed;
  top: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.95);
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  z-index: 500;
}

#modalSearch,
#modalClose {
  padding: 10px;
  color: #fff;
  font-size: 16px;
}

#modalSearch .fa-search-plus,
#modalSearch .fa-search-minus {
  display: none;
}
#modalSearch .fa-search-plus.is-active,
#modalSearch .fa-search-minus.is-active {
  display: block;
}/*# sourceMappingURL=common.css.map */
