@charset 'utf-8';

body {overflow-x: hidden;}
.sec_virtual { background-color:#ededed;margin-bottom: 10rem; margin-top: 5rem;padding: 3vw 0 3vw 3vw;}
.field-row {display: flex;justify-content:space-between;}
.field-col-1 {width: 24.5vw;}
.field-col-2 {width: 48.5vw;}
.sec_virtual .field-title{font-family: "Roboto", sans-serif;font-size: 3.6rem;line-height: 1.25;font-weight: 900;}
.sec_virtual .textarea {margin-top: 1vw;margin-bottom: 2vw;font-size: 1vw;font-weight: bold;line-height: 2.5;font-feature-settings: "palt";}
.sec_virtual .btn {border: 1px solid #666666;padding: 1vw 0.5vw;}
.sec_virtual .btn-wrap {width: 75%;}
.sec_virtual .btn:before{background: #666666;}
.btn-row {display: flex;align-items:center;justify-content: space-evenly;margin-bottom: 1.5rem;}
.btn-row span {font-size: 1vw;}
.btn-row img[src*=".svg"] {position:relative;z-index:100;width:20px;height:20px;}
.sec_virtual .caption {color: #666666;font-size: 1.4rem;}
.field-col-2 .image_wrap {position:relative;margin-top: -7.5vw;}
.field-col-2 .virtual_btn {position: absolute;z-index: 100;bottom: 1.5vw;left: -1.5vw;width: 22vw;transition: .25s;}
.field-col-2 .image_wrap {position:relative;}
.field-col-2 .image_wrap img {transition: .5s;}
.field-col-2 .image_wrap:hover img{transform:scale(1.05) ;opacity:.8;}
.field-col-2 .image_wrap:hover .virtual_btn img {transform:scale(1);}
.clip-box {display: block;position: relative;overflow: hidden;background: #FFF;}
#player_close {border: none !important;}
@media screen and ( min-width : 767px ) {
	#player_close { left: 90vw !important;}
	.field-row { align-items: center; }
	.sec_virtual .textarea { margin-bottom: 0; }
}
@media screen and ( max-width : 1500px ) {
	.sec_virtual .btn-wrap {width: 90%;}
	.sec_virtual .field-title{font-size: 2.4vw;}
	.sec_virtual .caption{font-size: 1vw;}
}
@media screen and ( max-width : 767px ) {
	.sec_virtual {background: none;padding: 0;}
	.sec_virtual .field-title span{font-size: 5vw !important;}
	.sec_virtual .field-title br {display: none;}
	.sec_virtual .field-row {flex-direction : column;}
	.sec_virtual .field-row span {font-size: 3vw;}
	.sec_virtual .field-row [class*="field-col-"] {width: 100%;}
	.field-col-2 .image_wrap {margin-top: 0;}
	.sec_virtual .textarea {margin-top: 3vw;margin-bottom: 5vw;font-size: 3vw;line-height: 2;}
	.sec_virtual .caption {font-size: 3vw;}
	.field-col-2 .virtual_btn {left: -3.5vw;width: 60vw;}
	.sec_virtual .btn-wrap {width: 75%;margin: 3.5rem auto 0;}
	.sec_virtual .btn-row {width: 100%;padding: 2vw .5vw;border: 1px solid #666666;background: #666666;color: #FFFFFF;}
	.sec_virtual .caption {text-align: center;}
	.field-col-2 {position: relative;}
	.field-col-2:before {content:"";position: absolute;width: 120vw;height: 85%;background: #ededed;z-index: -1;top: 25%;left: -10vw;}
}


.is-bg-primary {
  background: #ededed; }

#content {
  margin-top: 226px; }
  @media screen and (max-width: 575px) {
    #content {
      margin-top: 10vw; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    #content {
      margin-top: 10vw; } }

.list-mv07 {
  opacity: 0;
  -webkit-transform: translate(-60px, 0);
  -ms-transform: translate(-60px, 0);
  transform: translate(-60px, 0);
  -webkit-transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1);
  -o-transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1);
  transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1); }

.mv07 {
  opacity: 1.0;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1);
  -o-transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1);
  transition: 1.2s cubic-bezier(0.14, 1, 0.34, 1); }

.sec1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: url("../../../img/dist/top/sec1_bg_img.jpg") no-repeat center/cover;
  padding: 4.6% 0 3.3%; }
  @media screen and (max-width: 575px) {
    .sec1 {
      background: none;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      padding: 0; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .sec1 {
      background: none;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      padding: 0; } }
  .sec1 .sp-logo {
    width: 76%;
    margin-bottom: 18vw; }
  .sec1 .is-sec1-left-content {
    width: 46%;
    position: relative; }
    @media screen and (max-width: 575px) {
      .sec1 .is-sec1-left-content {
        width: 100%;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; } }
    @media screen and (min-width: 576px) and (max-width: 767px) {
      .sec1 .is-sec1-left-content {
        width: 100%;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2; } }
  .sec1 .is-sec1-right-content {
    width: 41%; }
    @media screen and (max-width: 575px) {
      .sec1 .is-sec1-right-content {
        width: 100%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1; } }
    @media screen and (min-width: 576px) and (max-width: 767px) {
      .sec1 .is-sec1-right-content {
        width: 100%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1; } }
    .sec1 .is-sec1-right-content .is-sec1-ttl {
      margin-bottom: 15px; }
      @media screen and (max-width: 575px) {
        .sec1 .is-sec1-right-content .is-sec1-ttl {
          margin-bottom: 4vw; } }
      @media screen and (min-width: 576px) and (max-width: 767px) {
        .sec1 .is-sec1-right-content .is-sec1-ttl {
          margin-bottom: 4vw; } }
      .sec1 .is-sec1-right-content .is-sec1-ttl span {
        margin-bottom: 15px; }
        @media screen and (max-width: 575px) {
          .sec1 .is-sec1-right-content .is-sec1-ttl span {
            margin-bottom: 5vw; } }
        @media screen and (min-width: 576px) and (max-width: 767px) {
          .sec1 .is-sec1-right-content .is-sec1-ttl span {
            margin-bottom: 5vw; } }
    .sec1 .is-sec1-right-content .is-sec1-text {
      line-height: 2.2; }
      @media screen and (max-width: 575px) {
        .sec1 .is-sec1-right-content .is-sec1-text {
          line-height: 1.8;
          margin-bottom: 6vw; } }
      @media screen and (min-width: 576px) and (max-width: 767px) {
        .sec1 .is-sec1-right-content .is-sec1-text {
          line-height: 1.8;
          margin-bottom: 6vw; } }
    .sec1 .is-sec1-right-content .btn-wrap {
      width: 100%;
      text-align: right;
      margin-top: 50px; }
      @media screen and (min-width: 576px) and (max-width: 767px) {
        .sec1 .is-sec1-right-content .btn-wrap {
          display: none; } }
      .sec1 .is-sec1-right-content .btn-wrap .btn {
        margin-right: 12%; }
  @media screen and (max-width: 575px) {
    .sec1 .btn-wrap {
      text-align: center;
      margin-top: 12vw; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .sec1 .btn-wrap {
      display: block;
      text-align: center;
      margin-top: 12vw; } }

@media screen and (max-width: 575px) {
  .site-en .sec1 .is-sec1-right-content .is-sec1-ttl {
    line-height: 1.6; } }

@media screen and (min-width: 576px) and (max-width: 767px) {
  .site-en .sec1 .is-sec1-right-content .is-sec1-ttl {
    line-height: 1.6; } }

.site-en .sec1 .is-sec1-right-content .is-sec1-text {
  line-height: 1.8; }
  @media screen and (max-width: 575px) {
    .site-en .sec1 .is-sec1-right-content .is-sec1-text {
      font-weight: 500; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .site-en .sec1 .is-sec1-right-content .is-sec1-text {
      font-weight: 500; } }

.sec2 .btn-wrap, .sec3 .btn-wrap {
  text-align: right;
  margin-right: 11px; }
  @media screen and (max-width: 575px) {
    .sec2 .btn-wrap, .sec3 .btn-wrap {
      text-align: center; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .sec2 .btn-wrap, .sec3 .btn-wrap {
      text-align: center; } }

.sec2 {
  padding: 150px 0; }
  @media screen and (max-width: 575px) {
    .sec2 {
      padding: 20vw 0; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .sec2 {
      padding: 20vw 0; } }
  .sec2 .btn-wrap {
    margin-top: 75px; }
    @media screen and (max-width: 575px) {
      .sec2 .btn-wrap {
        margin-top: 10vw; } }
    @media screen and (min-width: 576px) and (max-width: 767px) {
      .sec2 .btn-wrap {
        margin-top: 10vw; } }

.sec3 {
  padding: 42px 0 224px; }
  @media screen and (max-width: 575px) {
    .sec3 {
      padding: 0 0 22vw; } }
  @media screen and (min-width: 576px) and (max-width: 767px) {
    .sec3 {
      padding: 0 0 22vw; } }
  .sec3 .btn-wrap {
    margin-top: 100px; }
    @media screen and (max-width: 575px) {
      .sec3 .btn-wrap {
        margin-top: 10vw; } }
    @media screen and (min-width: 576px) and (max-width: 767px) {
      .sec3 .btn-wrap {
        margin-top: 10vw; } }


/* fs-c-productListCarousel */
.fs-c-productListCarousel { display: none; }