@charset "UTF-8";
/*
 * burgerburger
 */

@font-face {
  font-family: 'm54';
  src: url(../fonts/JerseyM54.ttf);
}

a {
  color: #232323;
  text-decoration: none;
}

.m54 {
  font-family: 'm54';
}

.fade-in2 {
  transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
}

.fade-up2 {
  transition: opacity 0.7s;
  -moz-transition: opacity 0.7s;
  -webkit-transition: opacity 0.7s;
  -o-transition: opacity 0.7s;
  transition: transform 0.7s;
  -moz-transition: transform 0.7s;
  -webkit-transition: transform 0.7s;
  -o-transition: transform 0.7s;
}
.flex-container {
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-flex-direction: row; /* Safari */
  flex-direction:         row;
  flex-wrap: wrap;
}
.flex-container-bx {
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-flex-direction: row; /* Safari */
  flex-direction:         row;
  flex-wrap: wrap;
  margin:0 -2%;
}
@media (max-width: 767px) {
  .flex-container-bx {
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-flex-direction: row; /* Safari */
    flex-direction:         row;
    flex-wrap: wrap;
    margin:0 0;
  }
}
.flex-container-bt, .flex-container-bt-arc{
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-flex-direction: row; /* Safari */
  flex-direction:         row;
  flex-wrap: wrap;
  -webkit-justify-content:space-between;
  -moz-justify-content:space-between;
  justify-content:space-between;
  align-items: top;
}
.flex-container-bt-arc:after {
    content: "";
    display: block;
    width: 32%;  /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
}
.flex-container-riv {
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-flex-direction: row-reverse; /* Safari */
  flex-direction:         row-reverse;
  flex-wrap: wrap;
}
.flex-container-cen {
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-justify-content: center; /* Safari */
  justify-content:         center;
  flex-wrap: wrap;
}
.breadcrumbs {
  font-size: 0.8em;
  margin-bottom: 20px;
}
.wrapper {
  margin: 160px 0 120px;
}
.wrapper-bg {
  padding: 100px 0;
  background-color: #fafafa;
}
.wrapper-bg-f {
  padding: 100px 0;
  background-color: #fff;
}
.wrapper-bg-b {
  padding: 100px 0;
  background-color: #263B61;
  color: #fff;
}
.wrapper-single {
  margin: 100px 0 100px;
}
.wrapper-single2 {
  margin: 20px 0 20px;
}
.wrapper-single img {
  display: block;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.w-t {
  color: #fff;
}
.gray {
  color: #5b5b5b;
}
.stock-noselect {
  color:#e5e5e5;
}
.stock-noselect2 {
  color:#e6e6e6;
}
.thum-ins img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit:cover;
  border-radius:50%;
}
.thum-ins span {
  position: absolute;
  bottom:-40px;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);"
}

.top-about-bg {
  margin-bottom: 0rem;
  color: #fff;
}
.top-about-bg::before {
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100vw;
  height:100vh;
  background-image: url(/img/top/top-about-bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(0,0,0,0.3);
  background-blend-mode: darken;
}
.title-jp {
  font-weight: 500;
  font-style: normal;
  font-size: 60%;
  font-weight: bold;
  display: block;
  color: #232323;
}
.title-en {
  font-family: futura-pt, 'source-han-sans-cjk-ja', sans-serif;
  display: block;
  color: #0c3258;
  font-weight: 500;
  letter-spacing: 0.1em;
  font-size: 140%;
  line-height: 1.3;
}
.title-sub {
  display: block;
  letter-spacing: 0.1em;
  font-size: 70%;
  line-height: 1.8;
  margin-top:32px;
}
.title-p {
  margin-top:10px;
}
.title-std {
  margin:10px 0;
  font-size:1.2em;
  font-weight: 500;
}
.page-title {
  font-size: 130%;
  font-weight: 400;
  margin: 30px 0 20px;
}
.page-text {
  margin: 0 0 8rem 0;
}
.page-text01-sv01 {
  padding-left:1em;
  text-indent:-1em;
}
.page-text02-sv01 {
  font-weight: 500;
}
.bf-tit01 {
  font-family: 'Teko';
  font-weight: 600;
  font-size: 200%;
  text-align: center;
}
.soldout {
  font-family: 'Teko';
  font-size: 5em;
  font-weight: 900;
  color:#6e0000;
}
.box-shadow {
  box-shadow: 2px 2px 4px #c6c6c6;
}
a:hover,a:hover div, a:hover img{
  opacity: 0.9;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
a:hover .btn01{
  opacity: 1;
}
a:hover .btn02{
  opacity: 1;
}
@keyframes my-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadein01 {  
  animation-name:     my-fade-in;
  animation-duration: 3s;
}
@media (max-width: 768px) {
  .wrapper {
    margin: 100px 0;
    padding: 0 0px;
  }
  .wrapper-bg {
    padding: 100px 0;
    background-color: #fafafa;
  }
  .wrapper-bg-f {
    padding: 100px 0;
    background-color: #fff;
  }
  .wrapper-bg-b {
    padding: 100px 0;
    background-color: #263B61;
    color: #fff;
  }
  .navbar-default .navbar-nav > li {
      position: relative;
      text-align: center;
  }
  .navbar-default .navbar-nav > li a:after{
    /*display: block;
    content: "";
    position: absolute;
    top: 46%;
    right: 20px;
    width: 10px;
    height: 10px;
    margin: -4px 0 0 0;
    border-top: solid 1px #232323;
    border-right: solid 1px #232323;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);*/
  }
 /* .navbar-default .navbar-nav > li a[aria-expanded="true"]:after {
    display: block;
    content: "";
    position: absolute;
    top: 46%;
    right: 20px;
    width: 10px;
    height: 10px;
    margin: -4px 0 0 0;
    border-top: solid 1px #232323;
    border-right: solid 1px #232323;
    -webkit-transform: rotate(133deg);
            transform: rotate(133deg);
  }*/
  .navbar-default .dropdown-menu > li a:after{
    display: none;
  }
  .dropdown-menu {
    font-size: 95%;
  }
}
@media (min-width: 768px) {
  .spbox01{
    margin:50px 0;
  }
  .spbox02{
  }
  .top-sv-flo { 
    width:50%;
    padding:5%;
    display: block;
  }
  .flo20 {
    width: 20%;
    padding: 1%;
  }
  .flo30 {
    width: 30%;
    padding: 1%;
  }
  .flo50 {
    width: 50%;
    padding: 1%;
  }
  .mission-flo {
    width: 50%;
    padding: 20px;
  }
  .company-flo {
    width: 50%;
  }
  .flo70 {
    width: 70%;
    padding: 1%;
  }
  .flo80 {
    width: 80%;
    padding: 1%;
  }
  .top-flo01 {
    width:50%;
    padding: 2%;
  }
  .top-flo02 {
    width:50%;
  }
  .top-flo03 {
    margin:4% 0 0 7%;
    text-align:right;
    width:40%;
  }
  .top-flo04 {
    width:50%;
    padding: 5%;
  }
  .parts-flo01 {
    width: 33.33%;
    padding: 1%;
  }
  .parts-flo02 {
    width: 25%;
    padding: 1%;
  }
  .media-flo01 {
    width: 25%;
    padding: 1%;
  }
  .media-flo01 img{
    width: 100%;
    height: 280px;
    object-fit: cover;
  }
  .media-trimming img{
    width: 100%;
    height: 280px;
    object-fit: cover;
  }
  .box-shadow2 {
    box-shadow: 2px 2px 4px #c6c6c6;
    background-color: #fff;
    padding-top:40px;
  }
  .pick01 {
    width: 24%;
  }
  .news-pad {
    padding: 0 20%;
  }
  .news-pad-arc {
    padding: 0 0%;
  }
  .page-text {
    margin-bottom: 60px;
  }
  .page-text2 {
    margin-bottom: 40px;
  }
  .page-flo01 {
    width: 50%;
    padding-right: 5%;
    margin-bottom: 40px;
  }
  .page-flo02 {
    width: 50%;
  }
  .page-flo03 {
    width: 50%;
    padding-left: 5%;
    margin-bottom: 80px;
  }
  .page-flo04 {
    width: 50%;
  }
  .interior-flo01 {
    width: 33%;
    padding: 1%;
  }
  .pcv {
   
  }
  .spv {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .spbox01{
    padding:10% 5% 5% 5%;
  }
  .spbox02{
    padding:5% 5% 10% 5%;
  }
  .top-sv-flo { 
    width:100%;
    padding:5% 0;
  }
  .flo20 {
    width: 30%;
    padding: 1%;
  }
  .flo30 {
    width: 30%;
    padding: 1%;
  }
  .flo50 {
    width: 100%;
    margin-top: 1%;
    margin-bottom: 1%;
  }
  .flo50 img {
    width: 100%;
    max-width: 400px;
  }
  .mission-flo {
    width: 100%;
    margin: 20px 0;
  }
  .company-flo {
    width: 100%;
  }
  .flo70 {
    width: 70%;
    padding: 1%;
  }
  .flo80 {
    width: 70%;
    padding: 1%;
  }
  .top-flo01 {
    width:100%;
  }
  .top-flo02 {
    width:100%;
  }
  .top-flo03 {
    margin:0 auto;
    text-align:center;
    width:80%;
    padding: 10% 0 5%;
  }
  .top-flo04 {
    margin:0 auto;
    text-align:center;
    width:100%;
    padding: 5%;
  }
  .parts-flo01 {
    width: 50%;
    padding: 1%;
  }
  .parts-flo02 {
    width: 50%;
    padding: 1%;
  }
  .media-flo01 {
    width: 33.33%;
    padding: 1%;
  }
  .media-flo01 img{
    width: 100%;
    height: 150px;
    object-fit: cover;
  }
  .media-trimming img{
    width: 100%;
    height: 200px;
    object-fit: cover;
  }
  .box-shadow2 {
    box-shadow: 2px 2px 4px #c6c6c6;
    background-color: #fff;
  }
  .pick01 {
    width: 49%;
    margin-bottom: 2%;
  }
  .page-text {
    margin-bottom: 60px;
  }
  .page-text2 {
    margin-bottom: 40px;
  }
  .page-title02 {
    font-weight: 900;
    font-size: 130%;
    border-left: solid 2px #b1b0b0;
    padding: .25em 0 .25em .75em;
    margin: 20px 0 20px 0;
  }
  .page-flo01 {
    width: 100%; 
  }
  .page-flo02 {
    width: 100%;
  }
  .page-flo03 {
    width: 100%; 
  }
  .page-flo04 {
    width: 100%;
  }
  .interior-flo01 {
    width: 100%;
    padding: 1%;
  }
  .pcv {
    display: none !important;
  }
  .spv {
  }
}

.btn01 {
  display: inline-block;
  width: 100%;
  max-width: 300px;
  height: 55px;
  padding: 5px 0px;
  text-align: center;
  text-decoration: none;
  line-height: 42px;
  outline: none;
  margin-left:-1px;
  margin-top:-1px;
  z-index: 100;
}
.btn01-cur {
  display: inline-block;
  font-size: 1em;
  width: 25.104%;
  height: 50px;
  padding: 5px 0px;
  text-align: center;
  text-decoration: none;
  line-height: 42px;
  outline: none;
  margin-left:-1px;
  margin-top:-1px;
  z-index: 100;
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn01::before,
.btn01::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn01,
.btn01::before,
.btn01::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn01 {
  position:relative;
  border: 1px solid #565656;
  color: #565656;
}
.btn01:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn01:hover:after {
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
}

.btn01-w {
  display: inline-block;
  width: 270px;
  height: 50px;
  padding: 5px 40px;
  text-align: center;
  text-decoration: none;
  line-height: 40px;
  outline: none;
  margin-top:20px;
}
.btn01-w::before,
.btn01-w::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn01-w,
.btn01-w::before,
.btn01-w::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn01-w {
  position:relative;
  border: 1px solid #fff;
  color: #fff;
}
.btn01-w:after{
  display: block;
  content: "";
  position: absolute;
  top: 49%;
  right: 20px;
  width: 8px;
  height: 8px;
  margin: -4px 0 0 0;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  z-index :1;
}
.btn01-w:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn01-w:hover:after {
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
}
.btn02 {
  font-family: 'Noto Serif JP', 'Noto Sans Japanese', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', 'Yu Gothic', 'YuGothic', 'sans-serif';
  display: inline-block;
  width: 31%;
  height: 50px;
  text-align: center;
  text-decoration: none;
  line-height: 50px;
  outline: none;
  /*  padding-left: 30px;*/
  position:relative;
  color: #232323;
  border: solid 1px #232323;
}
.flex-container-cen .btn02 {
  margin: 1%;
}
@media (max-width: 767px) {
  .btn02 {
    width: 100%;
  }
}
.btn02::before,
.btn02::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn02:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn03 {
  display: inline-block;
  max-width: 380px;
  height: 50px;
  padding: 0 90px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.btn03::before,
.btn03::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn03,
.btn03::before,
.btn03::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn03 {
  position:relative;
  background-color: #0d0d81;
  border: 1px solid #000;
  color: #fff;
  line-height: 52px;
}
.btn03:after{
  display: block;
  content: url('../../../../img/icon/mail.png');
  position: absolute;
  top: 23%;
  right: 50px;
  width: 10px;
  height: 10px;
  margin: -4px 0 0 0;
  z-index :1;
}
.btn03:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn03:hover:after {
}
.btn04 {
  display: block;
  max-width: 1000px;
  height: 55px;
  padding: 8px 90px 0;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.btn04::before,
.btn04::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn04,
.btn04::before,
.btn04::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn04 {
  position:relative;
  background-color: #cf002e;
  border: 1px solid #000;
  color: #fff;
  line-height: 12px;
}
.btn04:after{
  display: block;
  content: url('../../../../img/icon/tel.png');
  position: absolute;
  top: 23%;
  right: 50px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :1;
}
.btn04:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn04:hover:after {
}
.btn05 {
  display: block;
  max-width: 1000px;
  height: 55px;
  padding: 0 90px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.btn05::before,
.btn05::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn05,
.btn05::before,
.btn05::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn05 {
  position:relative;
  background-color: #0d0d81;
  border: 1px solid #000;
  color: #fff;
  line-height: 52px;
}
.btn05:after{
  display: block;
  content: url('../../../../img/icon/mail.png');
  position: absolute;
  top: 23%;
  right: 50px;
  width: 10px;
  height: 10px;
  margin: -4px 0 0 0;
  z-index :1;
}
.btn05:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn05:hover:after {
}
.btn06 {
  display: block;
  max-width: 1000px;
  height: 50px;
  padding: 0 90px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.btn06::before,
.btn06::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn06,
.btn06::before,
.btn06::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn06 {
  position:relative;
  background-color: #fff;
  border: 1px solid #565656;
  color: #565656;
  line-height: 52px;
}
.btn06:after{
  display: block;
  content: "";
  position: absolute;
  top: 46%;
  right: 20px;
  width: 10px;
  height: 10px;
  margin: -4px 0 0 0;
  border-top: solid 2px #565656;
  border-right: solid 2px #565656;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  z-index :1;
}
.btn06:hover {
  background-color: #000;
  border-color: #232323;
  color: #fff;
}
.btn06:hover:after {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media (min-width: 991px) {
  .btn07 {
    display: inline-block;
    width: 150px;
    height: 40px;
    padding: 0px 10px;
    text-align: center;
    text-decoration: none;
    line-height: 36px;
    outline: none;
    margin-top:-10px;
    border: solid 1px #000;
    position:relative;
    color: #000;
  }
  .btn07::before,
  .btn07::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: '';
  }
  .btn07,
  .btn07::before,
  .btn07::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
  }
}

.container2 {
  max-width: 800px;
  margin: 0 auto;
}
.footer-bg {
  margin-top: 120px;
  color: #fff;
  background-color: #3c3c3c;
  padding: 60px 0;
  text-align: center;
}

.youtube2 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube2 iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  z-index:1;
}
.breadcrumbs span[property="name"] {
    display: inline-block;
    padding: 0;
    margin-top: -3px;
    vertical-align: middle;
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .slide-text {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate(-50%, -30%);
    -webkit-transform: translate(-50%, -30%);
    -ms-transform: translate(-50%, -30%);
    color: #fff;
    font-size: 280%;
    z-index: 100;
    line-height: 1.2em;
  }
  .bg-b {
    background-color: #121212;
    padding-top: 3rem;
  }
  .f-24 {
    font-size: 24px;
  }
  .top-banner-t {
    font-size: 400%;
    color: #fff;
    margin-bottom: 10px;
    text-align: center;
  }
  .top-banner-t2 {
    color: #fff;
  }
  .about-flo01 {
    width: 50%;
  }
  .about-flo02 {
    width: 60%;
    background-color: rgba(255,255,255,0.9);
    padding: 5%;
    position: absolute;
    top: 15%;
    right: 0%;
    z-index: 1;
  }
  .about-flo03 {
    width: 50%;
    margin-left: 50%;
  }
  .about-flo04 {
    width: 60%;
    margin-right: 40%;
    background-color: rgba(255,255,255,0.9);
    padding: 5%;
    position: absolute;
    top: 15%;
    right: 0%;
    z-index: 1;
  }
  .about-flo05 {
    width: 49%;
    margin-bottom: 4%;
  }
  .asobu-flo01 {
    width: 32%;
    margin-bottom: 4%;
  }
  .asobu-flo02 {
    width: 49%;
    margin-bottom: 4%;
  }
  .about-flo05-txt {
    padding: 0 4%;
    font-size: 0.8em;
  }
  .about-flo05-arc-txt {
  }
  .stock-main-detail01 {
    width: 20%;
    border: solid 0.5px #696969;
    background-color: #f0f0f0;
    padding: .5% 0;
    margin: -0.5px;
  }
  .stock-main-detail02 {
    width: 30%;
    border: solid 0.5px #696969;
    padding: .5% 1%;
    margin: -0.5px;
    text-align: justify;
  }
  .stock-main-detail03 {
    width: 20%;
    border: solid 0.5px #696969;
    background-color: #f0f0f0;
    padding: .5% 1%;
    margin: -0.5px;
  }
  .stock-main-detail04 {
    width: 30%;
    border: solid 0.5px #696969;
    padding: .5% 1%;
    margin: -0.5px;
  }
  .stock-main-detail05 {
    width: 20%;
    border: solid 1px #696969;
    padding: .5% 1%;
    margin: -0.5px;
    font-size: 0.8em;
  }
  .fake-bg {
    margin-top:100px;
  }

  .top-about-bg2 {
    background-image: url(/img/top/top-about-bg2.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    padding: 9rem 0;
    margin-bottom: 0rem;
    color: #fff;
  }
  .news-top-bg {
    position: relative;
    background-image: url(/img/news-top-bg.jpg);
    background-position: center 770px;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: -50px;
    color: #fff;
  }
  .default-top-bg {
    background-color: ;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    color: #232323;
    line-height: 1.4;
  }
  .faq-top-bg {
    background-image: url(/img/faq-top-bg.jpg);
    background-position: center 150%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .price-top-bg {
    background-image: url(/img/price-top-bg.jpg);
    background-position: center -70rem;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .service03-top-bg {
    background-image: url(/img/service03/service03-top-bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .service04-top-bg {
    background-image: url(/img/service04/service04-top-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .company-top-bg {
    background-image: url(/img/company/company-top-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .contact-top-bg {
    position: relative;
    background-image: url(/img/contact-top-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
    color: #fff;
  }
  .democar-top-bg {
    background-image: url(/img/democar/democar-top-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .movie-top-bg {
    background-image: url(/img/movie/movie-top-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
  .recruit-top-bg {
    background-image: url(/img/recruit-top-bg2.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    padding: 32rem 0 32rem;
    margin-bottom: 0rem;
  }
  .reserve-top-bg {
    background-image: url(/img/reserve-top-bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    padding: 32rem 0 32rem;
    margin-bottom: 0rem;
    color: #fff;
  }
  .menu-top-bg {
    position: relative;
    background-image: url(/img/menu/top-bg.jpg);
    background-position: center 660px;
    background-size: cover;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
    color: #fff;
  }
}
@media (max-width: 767px) {
  .slide-text {
    position: absolute;
    top: 40%;
    right: 20%;
    color: #fff;
    font-size: 220%;
    z-index: 100;
    line-height: 1.2em;
    letter-spacing: 0.em;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
  }
  .bg-b {
    background-color: #121212;
    padding-top: 1rem;
  }
  .f-24 {
    font-size: 18px;
  }
  .top-banner-t {
    font-size: 300%;
    color: #fff;
    margin-bottom: 10px;
    text-align: center;
  }
  .top-banner-t2 {
    color: #fff;
  }
  .about-flo01 {
    width: 100%;
    margin-bottom: 20px;
  }
  .about-flo02 {
    width: 100%;
  }
  .about-flo03 {
    width: 100%;
    margin-bottom: 20px;
  }
  .about-flo05 {
    width: 49%;
    margin-bottom: 30px;
  }
  .about-flo05-txt {
    padding: 0%;
    font-size: 0.8em;
  }
  .about-flo05-arc-txt {
  }
  .asobu-flo01 {
    width: 49%;
    margin-bottom: 30px;
  }
  .asobu-flo02 {
    width: 100%;
    margin-bottom: 30px;
  }
  .stock-main-detail01 {
    width: 20%;
    border: solid 0.5px #696969;
    background-color: #f0f0f0;
    padding: 1% 0;
    margin: -0.5px;
  }
  .stock-main-detail02 {
    width: 30%;
    border: solid 0.5px #696969;
    padding: 1% 1%;
    margin: -0.5px;
    text-align: justify;
  }
  .stock-main-detail03 {
    width: 20%;
    border: solid 0.5px #696969;
    background-color: #f0f0f0;
    padding: .5% 1%;
    margin: -0.5px;
  }
  .stock-main-detail04 {
    width: 30%;
    border: solid 0.5px #696969;
    padding: .5% 1%;
    margin: -0.5px;
  }
  .stock-main-detail05 {
    width: 50%;
    border: solid 1px #696969;
    padding: .5% 1%;
    margin: -0.5px;
  }
  .fake-bg {
    margin-top:80px;
  }
  .top-about-bg2 {
    background-image: url(/img/top/top-about-bg2.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    padding: 9rem 0;
    margin-bottom: 0rem;
    color: #fff;
  }
  .news-top-bg {
    position: relative;
    background-image: url(/img/news-top-bg.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: -50px;
    color: #fff;
  }
  .default-top-bg {
    padding: 11rem 0 4rem;
    color: #232323;
    line-height: 1.4;
  }
  .faq-top-bg {
    background-image: url(/img/faq-top-bg.jpg);
    background-position: 28% 50%;
    background-repeat: no-repeat;
    background-size: ;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .price-top-bg {
    background-image: url(/img/price-top-bg.jpg);
    background-position: 70% top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .service03-top-bg {
    background-image: url(/img/service03/service03-top-bg.jpg);
    background-position: 70% top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .service04-top-bg {
    background-image: url(/img/service04/service04-top-bg.jpg);
    background-position: 70% top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .bodykit-top-bg {
    background-image: url(/img/bodykit/bodykit-top-bg.jpg);
    background-position: 80% top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
 .interior-top-bg {
    background-image: url(/img/interior/interior-top-bg.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .parts-top-bg {
    background-image: url(/img/parts/parts-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .company-top-bg {
    background-image: url(/img/company/company-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .contact-top-bg {
    position: relative;
    background-image: url(/img/contact-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
    color: #fff;
  }
  .democar-top-bg {
    background-image: url(/img/democar/democar-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .movie-top-bg {
    background-image: url(/img/movie/movie-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .media-top-bg {
    background-image: url(/img/media/media-top-bg.jpg);
    background-position: 60% bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
  .recruit-top-bg {
    background-image: url(/img/recruit-top-bg2.jpg);
    background-position: center 100%;
    background-repeat: no-repeat;
    background-size: contain;
    padding: 16rem 0 8rem;
    margin-bottom: 0rem;
  }
  .reserve-top-bg {
    background-image: url(/img/reserve-top-bg.jpg);
    background-position: center 80%;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 16rem 0 8rem;
    margin-bottom: 0rem;
    color: #fff;
  }
  .menu-top-bg {
    position: relative;
    background-image: url(/img/menu/top-bg.jpg);
    background-position: center center;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
    color: #fff;
  }
}

.about-top-bg:before,.menu-top-bg:before,.faq-top-bg:before,.news-top-bg:before,.company-top-bg:before,.contact-top-bg:before {
  background-color: rgba(0,0,0,0.3);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: ' ';
}

#page-feature th {
  background-color: #5d5d5d;
  color: #fff;
  padding: 0.5% 1%;
  font-weight: normal;
}
#page-feature td {
  color: #5d5d5d;
  padding: 0.5% 1%;
}
#page-feature tr {
  border :solid 1px #5d5d5d;
}
#bodykit th {
  background-color: #5d5d5d;
  color: #fff;
  padding: 0.5% 1%;
  font-weight: normal;
}
#bodykit td {
  color: #5d5d5d;
  padding: 0.5% 1%;
}
#bodykit tr {
  border :solid 1px #5d5d5d;
}
#afterparts th {
  background-color: #5d5d5d;
  color: #fff;
  padding: 0.5% 1%;
  font-weight: normal;
}
#afterparts td {
  color: #5d5d5d;
  padding: 0.5% 1%;
}
#afterparts tr {
  border :solid 1px #5d5d5d;
}
.trim01 img {
  width: 300px;
  height: 150px;
  object-fit: cover; /* この一行を追加するだけ！ */
}
#primary table {
  border-top: solid 0px #e6e6e6;
  border-bottom: solid 1px #e6e6e6;
}
#primary table th, #primary table td {
  border-bottom: solid 1px #000;
  padding: 0.6em;
}
#primary td, #primary th {
  vertical-align: middle;
}
#primary th {
  background-color:#3d3d3d;
  color: #fff;
}


/** PANCROSS **/
@media (min-width: 768px) {
  .slider1 img {
    width: 100vw;
    height: 800px;
    object-fit: cover; /* この一行を追加するだけ！ */
  }
}
@media (max-width: 767px) {
  .slider1 img {
    width: 100vw;
    height: 100vh;
    object-fit: cover; /* この一行を追加するだけ！ */
  }
}
.swiper-slide {

}
.swiper-slide a{
  color: #232323;
}
.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3.2em;
}
.swiper-container3 img{
  width: 100%;
}
@media (min-width: 768px) {
  .dropdown:hover > .dropdown-menu{
    display: block;
  }
  .dropdown-menu > li > a {
    font-size: 0.8em;
  }
  .page-head-title-en {
    font-family: 'Jost';
    position: relative;
    display: block;
    text-align: center;
    font-size: 300%;
    margin-bottom: -10px;
  }
  .page-head-title-jp {
    position: relative;
    letter-spacing: 0.1em;
    font-size: 18px;
    display: block;
    text-align: center;
  }
  .top-bnr {
    width: 32%;
  }
  .top-bnr2 {
    width: 32%;
    margin: 0 2%;
  }
  .aboutus-top-bg {
    background-image: url(/img/top/aboutus-bg.jpg);
    background-position: 0% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 9rem 0 9rem;
    margin-bottom: 0rem;
  }
  .aboutus-top-bg2 {
    background-image: url(/img/aboutus/aboutus-top-bg.jpg);
    background-position: 0% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 16rem 0 9rem;
    margin-bottom: 0rem;
  }
}
@media (max-width: 767px) {
  .page-head-title-en {
    font-family: 'Jost';
    position: relative;
    display: block;
    text-align: center;
    font-size: 250%;
    margin-bottom: -10px;
  }
  .page-head-title-jp {
    position: relative;
    letter-spacing: 0.1em;
    font-size: 18px;
    display: block;
    text-align: center;
  }
  .top-bnr {
    width: 100%;
    margin-bottom:1%;
  }
  .top-bnr2 {
    width: 100%;
    margin-bottom:1%;
  }
  .aboutus-top-bg {
    background-image: url(/img/top/aboutus-bg.jpg);
    background-position: 0% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 4rem 0 4rem;
    margin-bottom: 0rem;
  }
  .aboutus-top-bg2 {
    background-image: url(/img/aboutus/aboutus-top-bg.jpg);
    background-position: 80% top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 11rem 0 4rem;
    margin-bottom: 0rem;
  }
}
@media screen and (min-width:768px){
  .buy-btn {
    width: 100%;
    height: 130px;
    background-color: #8F1A15;
    color: #fff;
    text-align: center;
    padding: 30px 0;
    border: 1px solid #fff;
  }
}
@media screen and (max-width:767px){
  .buy-btn {
    width: 100%;
    height: 80px;
    background-color: #8F1A15;
    color: #fff;
    text-align: center;
    padding: 16px 0;
    border: 1px solid #fff;
  }
}

/* シェアボタン */
.shareList {
  list-style:none;
  display: flex;
  justify-content: flex-end;
  flex-wrap:wrap;
  padding:0;
  margin:-5px 0 0 -5px;
}
.shareList a:visited {
  color: #fff;
}
.shareList__item {
  flex-grow: 1;
  height:50px;
  line-height:50px;
  min-width:100px;
  text-align:center;
  margin:5px 0 0 5px;
}
.shareList__link {
  display:block;
  color:#ffffff;
  text-decoration: none;
}
.shareList__link::before{
  font-size:20px;
  display:block;
  transition: ease-in-out .2s;
}
.shareList__link:hover::before{
  background:#ffffff;
  transform: scale(1.2);
  box-shadow:1px 1px 4px 0px rgba(0,0,0,0.15);
}
 
.shareList__link.icon-twitter{background:#55acee;}
.shareList__link.icon-twitter:hover::before{color:#55acee;}
 
.shareList__link.icon-facebook{background:#3B5998;}
.shareList__link.icon-facebook:hover::before{color:#3B5998;}
 
.shareList__link.icon-google-plus{background:#dd4b39;}
.shareList__link.icon-google-plus:hover::before{color:#dd4b39;}
 
.shareList__link.icon-hatebu{background:#008FDE;}
.shareList__link.icon-hatebu:hover::before{color:#008FDE;}
 
.shareList__link.icon-pocket{background:#EB4654;}
.shareList__link.icon-pocket:hover::before{color:#EB4654;}
 
.shareList__link.icon-rss{background:#ff9900;}
.shareList__link.icon-rss:hover::before{color:#ff9900;}
 
.shareList__link.icon-feedly{background:#6cc655;}
.shareList__link.icon-feedly:hover::before{color:#6cc655;}
 
.shareList__link.icon-pinterest{background:#cb2027;}
.shareList__link.icon-pinterest:hover::before{color:#cb2027;}
 
.shareList__link.icon-linkedin{background:#0e76a8;}
.shareList__link.icon-linkedin:hover::before{color:#0e76a8;}
 
.shareList__link.icon-line{background:#1dcd00;}
.shareList__link.icon-line:hover::before{color:#1dcd00;}

@font-face {
  font-family: 'icomoon';
  src:url('../fonts/icomoon.eot?ookgoz');
  src:url('../fonts/icomoon.eot?ookgoz#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?ookgoz') format('truetype'),
    url('../fonts/icomoon.woff?ookgoz') format('woff'),
    url('../fonts/icomoon.svg?ookgoz#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: inherit;
  
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-line:before        {content: "\e90a";}
.icon-feedly:before      {content: "\e900";}
.icon-pocket:before      {content: "\e902";}
.icon-instagram:before   {content: "\ea92";}
.icon-twitter:before     {content: "\ea96";}
.icon-youtube:before     {content: "\ea9d";}
.icon-google:before      {content: "\ea88";}
.icon-google2:before     {content: "\ea89";}
.icon-google-plus:before {content: "\ea8b";}
.icon-google-plus2:before{content: "\ea8c";}
.icon-facebook:before    {content: "\ea90";}
.icon-facebook2:before   {content: "\ea91";}
.icon-linkedin:before    {content: "\eaca";}
.icon-linkedin2:before   {content: "\eac9";}
.icon-pinterest:before   {content: "\ead2";}
.icon-pinterest2:before  {content: "\ead1";}
.icon-hatebu:before      {content: "\e903";}
.icon-hatebu2:before     {content: "\e901";}
.icon-rss:before         {content: "\ea9b";}
.icon-rss2:before        {content: "\ea9c";}

.phone {
  font-weight: 500;
  font-size: 300%;
  display: block;
  margin: -10px 0 -20px;
}

@media (min-width: 768px) {
  .swiper-container .slide img {
    width: 100vw;
    height: 100vh;
    object-fit: cover; /* この一行を追加するだけ！ */
  }
}
@media (max-width: 767px) {
  .swiper-container .slide img {
    width: 100vw;
    height: 100vh;
    object-fit: cover; /* この一行を追加するだけ！ */
  }
}

.slide-layer01 {
  opacity: 0;/* ここを追加 */
  animation-name: layer1;/* アニメーション名 */
  animation-duration: 4s;
  animation-delay : 1.5s;/* 変化開始の時間 */
  animation-timing-function: ease;
  animation-iteration-count: 1;/* アニメーションの繰り返し（無限）*/
  animation-direction: alternate;
}
@keyframes layer1 {
0% {
    opacity: 0;
}
25% {
    opacity: 1;
}
75% {
    opacity: 1;
}
100% {
    opacity: 0;
  }
}
.slide-layer02-01 {
  color: #fff;
  line-height: 1.8;
  position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
  text-align: center;
  width: 820px;
  max-width: 90%;
}

.slide-layer02-02 {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  letter-spacing: 0.1em;
  position: absolute;
    top: 26%;
    left: 26%;
}

@media (min-width: 768px) {
  .top-tit {
    font-size: 6em;
  }
  .slide-layer03 {
    position: absolute;
      top: 0;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
    width: 900px;
    max-width: 90%;
    z-index: 100;
  }
}

@media (max-width: 1280px) {
  .top-tit {
    font-size: 12em;
  }
}

@media (max-width: 767px) {
  .top-tit {
    font-size: 4em;
  }
  .slide-layer02-02 {
    top: 23%;
    left: 16%;
  }
  .slide-layer03 {
    position: absolute;
      top: 0;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
    width: 900px;
    max-width: 90%;
    z-index: 100;
  }
}

.cta-bg01 {
  padding: 16% 0;
  background-image: url(/img/cta-bg01.jpg);
  background-position: center center;
  background-size: cover;
  color: #fff;
  position: relative;
}
.cta-bg01::before{
  /* 透過した黒を重ねる */
  background-color: rgba(0,0,0,0.4);
  /* どの範囲に重ねるかを指定 */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: ' ';
}
.cta-bg02 {
  padding: 16% 0;
  background-image: url(/img/cta-bg02.jpg);
  background-position: center center;
  background-size: cover;
  color: #fff;
  position: relative;
}
.cta-bg02::before{
  /* 透過した黒を重ねる */
  background-color: rgba(0,0,0,0.3);
  /* どの範囲に重ねるかを指定 */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: ' ';
}
@media (max-width: 768px) {
  .wrapper-bg-wood {
     background-image: url(/img/top/wood-bg.jpg);
     padding: 50px 0;
  }
}
.menu-subt {
  font-size:0.8em;
  color:#777;
  font-weight: normal;
}
.menu-osusume {
  font-size: 0.8em;
  color: #ffffff;
  font-weight: normal;
  background-color: #8b0000;
  padding: 1px 3px;
}
.menu-bg-sq {
  background-color:#fff;
  padding:1% 2%;
  margin-bottom:40px;
}
.menu-yen {
  color: #d62d2d;
  font-weight: 600;
}
.menu-yen .small{
  font-size:0.7em;
}
.menu-flo {
  width:33%;
  padding:1%;
  margin-bottom:40px;
}
.instructor-flo{
  position: relative;
  width: 23.3%; /* 幅 */
  padding-bottom: 23.3%; /* 幅と同じ高さをつくる */
  box-sizing: border-box;
  margin:0 2% 100px;
}
.instructor-flo2{
  width: 25%;
  padding: 0 1%;
  margin-bottom: 30px;
}
.btn-flo01 {
  width:50%;
}
.bbs-flo2 {
  width:50%;
  padding:1%;
}
@media screen and (max-width:767px){
  .menu-flo {
    width:50%;
    margin-bottom:40px;
  }
  .instructor-flo {
    position: relative;
    width: 46%; /* 幅 */
    padding-bottom: 46%; /* 幅と同じ高さをつくる */
    box-sizing: border-box;
    margin:0 2% 60px;
  }
  .instructor-flo2{
    width: 33.3%;
    padding: 0 1%;
    margin-bottom: 30px;
  }
  .btn-flo01 {
    width:100%;
    padding: 0 -10px;
  }
  .bbs-flo2 {
    width:100%;
    padding:1%;
  }
}

.title-menu {
  font-size: 22px;
  font-weight: 900;
  text-align: center;
  position: relative;
  margin: 40px 0;
}
.title-menu:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -8px;/*線の上下位置*/
  display: inline-block;
  width: 70px;/*線の長さ*/
  height: 3px;/*線の太さ*/
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);/*位置調整*/
  background-color: #8b0000;/*線の色*/
}

.anchor{
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}

@media screen and (max-width:767px){
  .navbar-nav .open .dropdown-menu > li > a{
    padding: 10px 0 10px 0px;
    font-size: 0.8em;
  }
  .navbar-nav .open .dropdown-menu {
    text-align: center;
    font-size: 0.8em;
  }
}
.dropdown-menu {
  background-color: #fff;
}

body {
  font-family: "Noto Serif JP";
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
  line-height: 2;
}
h2 {
  font-family: "Noto Serif JP";
  line-height: 1.5;
}
 
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
 
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.qa-list dl {
    position: relative;
    margin: 10px 0 0;
    cursor: pointer;
    border: 1px solid #DDD;
}
.qa-list dl:first-child {
  margin-top: 0;
}
.qa-list dl::after {
    position: absolute;
    top: 27px;
    right: 26px;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: rotate(135deg);
    border-top: 2px solid #ddd;
    border-right: 2px solid #ddd;
}
.qa-list .open::after {
    transform: rotate(-45deg);
}
.qa-list dl dt {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 60px;
    font-weight: bold;
    background: #fff;
}
.qa-list dl dt::before {
    font-size: 22px;
    line-height: 1;
    position: absolute;
    top: 20px;
    left: 20px;
    display: block;
    content: 'Q.';
    color: #3285bf;
}
.qa-list dl dd::before {
    font-size: 22px;
    line-height: 1;
    position: absolute;
    left: 20px;
    display: block;
    content: 'A.';
    font-weight: bold;
    color: #b3007c;
}
.qa-list dl dd {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 60px;
    border-top: 1px solid #DDD;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}

@media screen and (max-width: 767px) {
   .qa-list dl {
      margin: 10px 0 0;
  }
  .qa-list dl:after {
      top: 20px;
      right: 20px;
      width: 7px;
      height: 7px;
  }
  .qa-list dl dt {
      padding: 16px 34px 16px 50px;
      font-size: 14px;
  }
  .qa-list dl dt::before {
      font-size: 14px;
      top: 20px;
      left: 20px;
  }
  .qa-list dl dd::before {
      font-size: 14px;
      left: 20px;
      margin-top: 5px;
  }
  .qa-list dl dd {
      margin: 0;
      padding: 16px 16px 16px 50px;
      font-size: 14px;
  }
  .qa-list dl dd p {
      margin: 30px 0 0;
  }
  .qa-list dl dd p:first-child{
      margin-top: 0;
  }
}

.qa-list2 dl {
    position: relative;
    margin: 10px 0 0;
    cursor: pointer;
    border: 1px solid #DDD;
}
.qa-list2 dl:first-child {
  margin-top: 0;
}
.qa-list2 dl::after {
    position: absolute;
    top: 27px;
    right: 26px;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: rotate(135deg);
    border-top: 2px solid #ddd;
    border-right: 2px solid #ddd;
}
.qa-list2 .open::after {
    transform: rotate(-45deg);
}
.qa-list2 dl dt {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 20px;
    font-weight: bold;
    background: #fff;
}
.qa-list2 dl dd {
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 20px;
    border-top: 1px solid #DDD;
}
.qa-list2 dl dd p {
    margin: 30px 0 0;
}
.qa-list2 dl dd p:first-child{
    margin-top: 0;
}

@media screen and (max-width: 767px) {
  .qa-list2 dl {
      margin: 10px 0 0;
  }
  .qa-list2 dl:after {
      top: 20px;
      right: 20px;
      width: 7px;
      height: 7px;
  }
  .qa-list2 dl dt {
      padding: 16px 34px 16px 16px;
      font-size: 14px;
  }
  .qa-list2 dl dt::before {
      font-size: 14px;
      top: 20px;
      left: 20px;
  }
  .qa-list2 dl dd::before {
      font-size: 14px;
      left: 20px;
      margin-top: 5px;
  }
  .qa-list2 dl dd {
      margin: 0;
      padding: 16px 16px 16px 16px;
      font-size: 14px;
  }
  .qa-list2 dl dd p {
      margin: 30px 0 0;
  }
  .qa-list2 dl dd p:first-child{
      margin-top: 0;
  }
}

.sml-txt {
  font-size: 0.8em;
}

tr td a {
  color: #1069c1;
}

.alert {
  color: #d8005c;
}

.blue {
   color: #1069c1;
}

.top-movie {
  position: relative;
  width: 100%;
  margin-bottom: -8px;
}
.videos {
  position: relative;
  right: 0;
  top: 0;
  z-index:1;
}
.top-movie video {
  width: 100%;
  height: 800px;
  object-fit: cover;
}
.top-movie2 {
  position: relative;
  width: 100%;
  margin-bottom: -8px;
}
.top-movie2 video {
  width: 100%;
  height: 800px;
  object-fit: cover;
}

@media screen and (max-width:767px){
  .top-movie video {
      width: 100%;
      height: 80vh;
      object-fit: cover;
  }
  .top-movie2 video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.navbar-nav li {
  margin-bottom: 0;
}

.bg-00 {
  background-color: #fff;
  padding: 6% 0;
}
.bg-01 {
  background-color: #d62d2d;
  color: #fff;
  padding: 6% 0;
}
.bg-02 {
  background-color: #707070;
  color: #fff;
  padding: 6% 0;
}

@media (max-width: 768px) {
  .store-btn {
    background-color: #0c3258;
    color: #fff !important;
  }
  .store-btn:after {
    border-top: solid 1px #fff !important;
    border-right: solid 1px #fff !important;
  }
}

.text-center-pc {
  text-align: center;
}
@media (max-width: 767px) {
  .text-center-pc {
    text-align: left;
  }
}

.sec-title {
  font-size: 3.4em;
  text-align: center;
  margin: 0 0 20px;
  letter-spacing: 0.1em;
  font-weight: 700;
}
.sec-sub-title {
  font-size: 1.6em;
  text-align: center;
  margin: 20px 0 60px;
  font-weight: 400;
}
.sec-sub-txt {
  text-align: justify;
  margin: 0 0 60px;
}
.story-title {
  font-size: 3em;
  margin: 10px 0 10px;
}
.cast-title {
  font-size: 1.8em;
  font-family: 'Noto Serif JP', 'Noto Sans Japanese', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', 'Yu Gothic', 'YuGothic', 'sans-serif';
  margin:2% 0 -1%;
}
@media (min-width: 768px) {
  .cast-flo01 {
    width: 50%;
    padding: 2%;
  }
  .cast-flo02 {
    width : calc(100% / 3) ;
    padding: 0 2% 2% 2%;
    font-size: 0.8em;
  }
  .img-w-sec img{
    width: 100%;
    height: 60%;
    object-fit: cover;
    object-position: center;
  }
  .img-w-sec2 img{
    width: 100%;
    height: 60%;
    object-fit: cover;
    object-position: center;
  }
  .img-w-thumb img{
    width: 100%;
    height: 6cm;
    object-fit: cover;
    object-position: center;
  }
  .logo-size {
    width: 140px;
  }
}

@media (max-width: 767px) {
  .sec-title {
    font-size: 2em;
    font-weight: 700;
    text-align: center;
    margin: 0px 0 20px;
  }
  .sec-sub-title {
    font-size: 1.2em;
    text-align: center;
    margin: 20px 0 40px;
    font-weight: 400;
  }
  .sec-sub-txt {
    text-align: justify;
    margin: 0 0 60px;
  }
  .cast-flo01 {
    width: 100%;
    margin-bottom: -6%;
  }
  .cast-flo02:nth-child(odd) {
    width: 50%;
    padding: 0 2% 2% 0;
    font-size: 0.6em;
  }
  .cast-flo02:nth-child(even) {
    width: 50%;
    padding: 0 0 2% 2%;
    font-size: 0.6em;
  }
  
  .img-w-sec img{
    width: 100%;
    height: 50%;
    object-fit: cover;
    object-position: center;
  }
  .img-w-sec2 img{
    width: 100%;
    height: 40%;
    object-fit: cover;
    object-position: center;
  }
  .img-w-thumb img{
    width: 100%;
    height: 5cm;
    object-fit: cover;
    object-position: center;
  }
  .logo-size {
    width: 100px;
  }
}

.br-sp {
  display: none;
}

@media screen and (max-width: 1080px) {
  .br-pc {
    display: none;
  }

  .br-sp {
    display: inline-block;
  }
}

.yt-icon:before{
  display: block;
  content: url(/img/icon/yt-icon.jpg);
  position: absolute;
  top: 6px;
  left: 40px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :100;
}
.tktk-icon:before{
  display: block;
  content: url(/img/icon/tktk-icon.jpg);
  position: absolute;
  top: 6px;
  left: 40px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :100;
}
.tw-icon:before{
  display: block;
  content: url(/img/icon/tw-icon.jpg);
  position: absolute;
  top: 6px;
  left: 40px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :100;
}
.insta-icon:before{
  display: block;
  content: url(/img/icon/insta-icon.jpg);
  position: absolute;
  top: 6px;
  left: 40px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :100;
}
.fempass-icon:before{
  display: block;
  content: url(/img/icon/fempass-icon.png);
  position: absolute;
  top: 6px;
  left: 40px;
  width: 10px;
  height: 10px;
  margin: 0 0 0 0;
  z-index :100;
}

/** #01 **/
.story01-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/img/story01-bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(219,231,232,1);
  background-blend-mode: soft-light;
}
.story01-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/img/story01-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(219,231,232,1);
  background-blend-mode: soft-light;
}
/** #02 **/
.story02-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/img/story02-bg.jpg);
  background-position: 90%;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(255 232 193 / 90%);
  background-blend-mode: soft-light;
}
.story02-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/img/story02-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(255 232 193 / 90%);
  background-blend-mode: soft-light;
}
/** #03 **/
.story03-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/img/story03-bg.jpg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(230 229 255 / 90%);
  background-blend-mode: soft-light;
}
.story03-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/img/story03-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(230 229 255 / 90%);
  background-blend-mode: soft-light;
}
/** #04 **/
.story04-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/img/story04-bg.jpg);
/*  background-position: 50%;*/
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(255 228 234 / 90%);
  background-blend-mode: soft-light;
}
.story04-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/img/story04-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(255 228 234 / 90%);
  background-blend-mode: soft-light;
}
/** #05 **/
.story05-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/img/story05-bg.jpg);
/*  background-position: 50%;*/
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(217 244 197 / 90%);
  background-blend-mode: soft-light;
}
.story05-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/img/story05-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(217 244 197 / 90%);
  background-blend-mode: soft-light;
}
/** #06 **/
.story06-bg {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0 7%;
  position:relative;
  background-image: url(/fempass-cinema/img/story06-bg.jpg);
/*  background-position: 50%;*/
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(255,252,229,1);
  background-blend-mode: soft-light;
}
.story06-bg2 {
  width: 100vw;
  max-width: 100%;
  padding: 7% 0;
  position:relative;
  background-image: url(/fempass-cinema/img/story06-bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(255,252,229,1);
  background-blend-mode: soft-light;
}
 
.loader {
  position: fixed;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  z-index: 555;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1500;
}
.loader  img{
  width: 180px;
}
.col-xs-12 {
  margin-bottom: 40px;
}
.entry-header {
  display: none;
}

.gallery {
  grid-gap: 5px;
}

.navbar-toggle span:nth-of-type(2) {
  transition:0.3s;
}
.navbar-toggle span:nth-of-type(3) {
  transition:0.3s;
}
.navbar-toggle span:nth-of-type(4) {
  transition:0.3s;
}
.toggle-active span:nth-of-type(2) {
  transform: translate(0px,8.5px) rotate(-45deg);
  transition:0.3s;
}
.toggle-active span:nth-of-type(3) {
  opacity: 0;
  transition:0.3s;
}
.toggle-active span:nth-of-type(4) {
  transform: translate(0px,-3px) rotate(45deg);
  transition:0.3s;
}
#menu-wrap {
  transition: .3s; /* スクロール時に一瞬で消えると物足りないので.hideの処理を0.5秒で行う */
}
.hide-header{
  transform: translateY(-100%); /* 上に消えるようにする */
}

@media (max-width: 767px) {
  .txt {
    padding: 0 6%;
  }
}

.sec01-flo1 {
  width: 50%;
}
.sec01-flo1 img, .sec02-flo1 img{
  width: 100%;
  height: 1000px;
  object-fit: cover;
}
.sec01-flo2 {
  width: 50%;
  background-color: #786236;
  color: #fff;
  vertical-align: middle;
}
.sec01-flo2 .txt {
  display: table;
  height: 100%;
  padding: 13% 10% 18%;
}
.sec01-flo2 .txt .txt2{
  display: table-cell;
  vertical-align: middle; /*上下の中央揃え指定*/
}
@media screen and (max-width:767px){
  .sec01-flo1 {
    width: 100%;
  }
  .sec01-flo2 {
    width: 100%;
  }
  .sec01-flo1 img, .sec02-flo1 img{
    width: 100%;
    height: 100%;
  }
}

.sec02-flo1 {
  width: 50%;
}
.sec02-flo2 {
  width: 50%;
  background-color: #565656;
  color: #fff;
  vertical-align: middle;
}
.sec02-flo2 .txt {
  display: table;
  height: 100%;
  padding: 13% 10% 18%;
}
.sec02-flo2 .txt .txt2{
  display: table-cell;
  vertical-align: middle; /*上下の中央揃え指定*/
}
@media screen and (max-width:767px){
  .sec02-flo1 {
    width: 100%;
  }
  .sec02-flo2 {
    width: 100%;
  }
}
.txt3 {
  margin-top:40px;
}

.navbar-default .navbar-nav > li > a {
  font-family: "Noto Serif JP";
  font-size: 1.1em;
}

.navbar-brand {
  
}

.menu-tit {
  margin-top: 80px;
}

.menu01 {
  width: 32%;
  margin-bottom: 10%;
}

.menu01 .title {
  font-family: "Noto Serif JP";
  margin-top: 10px;
  font-weight: 400;
  line-height: 1.8;
}
.menu01 .sub {
  font-size: 0.9em;
  margin-top: 6px;
}

.flexbox:after {
    content: "";
    display: block;
    width: 32%;  /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
}

@media screen and (max-width:767px){
  .menu01 {
    width: 100%;
    margin-bottom: 20%;
  }
  .menu-tit {
    font-size: 20px;
  }
  .sec-bg img {
    height: 200px;
    width: 100%;
    object-fit: cover;
    object-position: 0px 50%;
  }
}

@media (min-width: 768px) {
.sec-bg img {
    height: 400px;
    width: 100%;
    object-fit: cover;
    object-position: 0px 50%;
  }
}

.ggmap {
  position: relative;
  padding-bottom: 18.25%;
  padding-top: 100px;
  height: 0;
  overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
  .ggmap {
    position: relative;
    padding-bottom: 78.25%;
    padding-top: 100px;
    height: 0;
    overflow: hidden;
  }
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: unset;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
  border: none;
}

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
  position:absolute;
  left:50%;
  bottom:10px;
    /*全体の高さ*/
  height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
  position: absolute;
  left:-15px;
  top: -15px;
    /*テキストの形状*/
  color: #eee;
  font-size: 1rem;
  letter-spacing: 0.05em;
  font-family: "Noto Serif JP";
}

/* 線の描写 */
.scrolldown1::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
    /*線の形状*/
  width: 1px;
  height: 30px;
  background: #eee;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:30px;
    opacity: 1;
  }
  100%{
    height:0;
    top:50px;
    opacity: 0;
  }
}

/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 1200;
  background:#C5151D;
  text-align:center;
  color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:100px;
}

/* fadeUpをするアイコンの動き */

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

.menu01 img {
  width: 100%;
  height: 80%;
  object-fit: cover;
}

/* --- お問い合わせフォーム --- */
/* デザインカスタマイズ */
div.wpcf7 { background:#fff; border:1px solid #ddd; padding:0px; -moz-border-radius:10px; -khtml-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; margin:0 0 30px 0; }
div.wpcf7 p { padding:20px 20px 0; margin:0; font-size:11px; }
div.wpcf7 input, .wpcf7 textarea { border:1px solid #ccc; padding:8px; font-size:14px; max-width:100%;}
div.wpcf7 textarea { width:97.5%; height:300px; }
div.wpcf7 input.wpcf7-submit {
   cursor:pointer; color:#fff; font-weight:bold; font-size:14px; width:200px; height:45px; margin:0 auto; display:block;
   -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;
   background:#333;  border:1px solid #666;
}
div.wpcf7 input.wpcf7-submit:hover { background:#006080; box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5), inset 0px 32px 0px -12px #007ea8; border:1px solid #006080; }
.wpcf7 input.wpcf7-submit:active { box-shadow:none; bottom:-2px; position:relative; }
.wpcf7 input:focus, .wpcf7 textarea:focus { border:1px solid #009de1; }
.wpcf7-captchac { border:1px solid #ccc; }
 
 
/* エラー個所をわかりやすく表示 */
.wpcf7 .wpcf7-not-valid { background: #ffb6c1; }
.wpcf7 span.wpcf7-not-valid-tip {font-size: 80%;}
.wpcf7 .wpcf7-response-output {margin: 10px 0 0; padding: 8px 35px 8px 14px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.wpcf7 .wpcf7-validation-errors {color: #B94A48; background-color: #F2DEDE; border: 1px solid #EED3D7;}
.wpcf7 .wpcf7-mail-sent-ok {color: #3A87AD; background-color: #D9EDF7; border: 1px solid #BCE8F1;}
 
/* 必須赤色表示 */
.wpcf7 .required { color: #f00;}
/* 任意緑色表示 */
.wpcf7 .any{ color: #080;}