@charset "utf-8";
/* CSS Document */
*:first-child + html img {
  vertical-align: top;
}
* html img {
  vertical-align: top;
}
#tab1:hover img, #tab2:hover img, a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: “alpha(opacity=70)”;
}
/*parts*/
.f_o {
  overflow: hidden;
}
.f_l {
  float: left;
}
.f_r {
  float: right;
}
/*detail*/
.lp-main .inner {
  max-width: 1580px;
  margin: 0 auto;
}
.lp-main #wrapper .block {
  padding-bottom: 13vw;
}
section#navi {}
section#navi .tab-wrap {
  background-image: url("../../img/navi_bg.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100%;
}
section#navi .tab-wrap ul {
  padding: 2% 0;
}
/*tab*/
#tab_menu {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background: #fff;
  padding: 2% 22%;
  margin: 0 auto;
  background-image: url("../../img/navi_bg.png");
  background-repeat: no-repeat;
  background-position: top center;
}
#tab_menu li {
  text-align: center;
  list-style: none;
  cursor: pointer;
}
#tab_menu li:last-child {
  margin-right: 0;
}
#tab_menu li.selected {}
#tab_menu li:hover {}
#tab_menu li img {}
.tab_link {
  padding: 0;
  margin: 0 0 0 1em;
}
.tab_link li {
  padding: 0;
  margin: 0;
  text-decoration: underline;
  cursor: pointer;
}
li.tab_link01, li.tab_link02 {
  position: fixed;
  bottom: 35%;
  right: 1%;
  width: 100px;
  animation: yurayura 2s linear infinite;
  z-index: 10;
}
@keyframes yurayura {
  0%, 100% {
    transform: rotate(10deg);
  }
  50% {
    transform: rotate(-10deg);
  }
}
section#mv {
  background-image: url("../../img/mv_bg.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
}
section#mv .inner_detail {
  width: 100%;
  max-width: 80%;
  margin: 0 auto;
}
section#mv img {
  animation: fadein 3s forwards;
}
@keyframes fadein {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}
.inner_detail {
  width: 100%;
  max-width: 74%;
  margin: 0 auto;
}
div#schedule.stripes_bg .inner_detail {
  background-color: #ffd2d3;
}
div#schedule.theory_bg .inner_detail {
  background-color: #b0c4de;
}
div#schedule .bg_tit {
  background-repeat: no-repeat;
  background-size: 100%;
  width: 100%;
}
/*ストライプス*/
div#schedule.stripes_bg {
  background: repeating-linear-gradient(-45deg, #FFD2D3, #FFD2D3 25px, #fff 0, #fff 50px);
  padding: 0 0 5%;
}
div#schedule.stripes_bg .sec.tit {
  background-color: #ffd2d3;
}
div#schedule.stripes_bg .sec.tit .bg_tit {
  background-image: url("../../img/stripes-tit_bg.png");
  padding: 4% 10% 0;
}
div#schedule.stripes_bg .sec.tit h2 {
  background-image: url(../../img/stripes-h2_bg.png);
  background-repeat: no-repeat;
  background-size: 100%;
  padding: 0 22% 5%;
}
div#schedule .bg_time {
  width: 100%;
}
div#schedule .bg {
  position: relative;
}
div#schedule .text {
  width: 70%;
  position: absolute;
  top: 0;
  z-index: 1;
  margin: 0 auto;
  left: 0;
  right: 0;
}
div#schedule.stripes_bg .sec.time03 .bg .text {
  top: 35%;
  width: 85%;
}
div#schedule.stripes_bg .sec.time04 .bg .text {
  top: 26%;
}
div#schedule.stripes_bg .sec.time06 .bg .text {
  width: 80%;
}
div#schedule .f_l, div#schedule .f_r {
  width: 48%;
}
div#schedule.stripes_bg .sec.time01 .img .f_l h3 {
  padding: 35% 5% 0 20%;
}
div#schedule.stripes_bg .sec.time01 .point .f_l {
  padding: 5% 0% 0 0;
  width: 80%;
}
div#schedule.stripes_bg .sec.time02 .img .f_l {
  width: 45%;
}
div#schedule.stripes_bg .sec.time02 .img .f_r {
  width: 55%;
  padding: 1% 5% 0 0;
}
div#schedule.stripes_bg .sec.time02 .img .f_l h3 {
    padding: 55% 10% 0 0%;
}

div#schedule.stripes_bg .sec.time02 .img .f_r img {}
div#schedule.stripes_bg .sec.time03 .point .f_t {
  text-align: center;
}
div#schedule.stripes_bg .sec.time03 .point .f_b {
  text-align: center;
  margin: -5% 0 0;
}
div#schedule.stripes_bg .sec.time04 .img .f_l h3 {
  padding: 20% 10% 0 20%;
}
div#schedule.stripes_bg .sec.time05 .img .f_l {
  width: 40%;
}
div#schedule.stripes_bg .sec.time05 .img .f_r {
  width: 60%;
  padding: 0;
}
div#schedule.stripes_bg .sec.time05 .img .f_l h3 {
  padding: 25% 10% 0 20%;
}
div#schedule.stripes_bg .sec.time05 .point {
  margin: -5% 0 0;
}
div#schedule.stripes_bg .sec.time05 .point .f_l {
  padding: 0;
  width: 70%;
}
div#schedule.stripes_bg .sec.time06 h3 {
  padding: 15% 0 0 8%;
}
/*セオリー*/
div#schedule.theory_bg {
  background: #336699;
  padding: 0 0 5%;
}
div#schedule.theory_bg .sec.tit {
  background-color: #b0c4de;
}
div#schedule.theory_bg .sec.tit h2 {
  background-image: url(../../img/theory-h2_bg.png);
  background-repeat: no-repeat;
  background-size: 100%;
  padding: 0 22% 5%;
}
div#schedule.theory_bg .sec.tit .bg_tit {
  background-image: url("../../img/theory-tit_bg.png");
  padding: 4% 10% 0;
}
div#schedule.theory_bg .sec.time02 .bg .text {
  top: 7%;
}
div#schedule.theory_bg .sec.time03 .bg .text {
  top: 25%;
}
div#schedule.theory_bg .sec.time04 .bg .text {
  top: 15%;
}
div#schedule.theory_bg .sec.time05 .bg .text {
  top: 15%;
}
div#schedule.theory_bg .sec.time06 .bg .text {
  top: 5%;
  width: 85%;
}
div#schedule.theory_bg .sec.time06_2 .bg .text {
  top: -17%;
  width: 75%;
}
div#schedule .f_l, div#schedule .f_r {
  width: 48%;
}
div#schedule.theory_bg .sec.time01 .img .f_l {
  width: 35%;
}
div#schedule.theory_bg .sec.time01 .img .f_r {
  width: 55%;
  padding: 10% 0% 0 0;
}
div#schedule.theory_bg .sec.time01 .img .f_l h3 {
    padding: 55% 0% 0 10%;
}
div#schedule.theory_bg .sec.time01 .point {
  margin: -5% 0 0;
}
div#schedule.theory_bg .sec.time01 .point .f_l {
  width: 85%;
}
div#schedule.theory_bg .sec.time02 .img {
  margin: 0 0 10%;
}
div#schedule.theory_bg .sec.time02 .img .f_l {
  width: 45%;
}
div#schedule.theory_bg .sec.time02 .img .f_r {
  width: 55%;
  padding: 1% 5% 0 0;
}
div#schedule.theory_bg .sec.time02 .img .f_l h3 {
padding: 25% 0% 0 10%;
}
div#schedule.theory_bg .sec.time02 .img .f_r img {
  padding: 25% 0 0;
}
div#schedule.theory_bg .sec.time03 .img .f_l {
  width: 43%;
}
div#schedule.theory_bg .sec.time03 .img .f_r {
  width: 55%;
  padding: 0;
}
div#schedule.theory_bg .sec.time03 .img .f_l h3 {
  padding: 20% 0 0 15%;
}
div#schedule.theory_bg .sec.time04 .img .f_l {
  width: 43%;
}
div#schedule.theory_bg .sec.time04 .img .f_r {
  width: 55%;
}
div#schedule.theory_bg .sec.time04 .img .f_l h3 {
  padding: 15% 20% 0 35%;
}
div#schedule.theory_bg .sec.time04 .point {
  margin: -5% 0 0;
}
div#schedule.theory_bg .sec.time04 .point .f_l {
  width: 75%;
  padding: 0;
}
div#schedule.theory_bg .sec.time05 .img .f_l {
  width: 40%;
}
div#schedule.theory_bg .sec.time05 .img .f_r {
  width: 55%;
  padding: 0;
}
div#schedule.theory_bg .sec.time05 .img .f_l h3 {
  padding: 30% 0% 0 15%;
}
div#schedule.theory_bg .sec.time05 .point {
  margin: -8% 0 0;
}
div#schedule.theory_bg .sec.time05 .point .f_l {
  width: 85%;
  padding: 5% 0 0 2%;
}
div#schedule.theory_bg .sec.time06 h3 {
  padding: 30% 5% 0 15%;
}
/* スライダー共通
----------------------------------------------*/
.lp-main .slider {
  margin: 0 auto;
  width: 100%;
  height: auto;
}
.lp-main .slick-slide img {
  margin: 0 auto;
  width: 100%;
}
.lp-main .slick-arrow:hover {
  opacity: 0.5;
  cursor: pointer;
}
ul.slick-dots {
  background-color: #F2F2F2;
  padding: 1.5% 2%;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  border-radius: 100px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
ul#slider-01, ul#slider-02 {
  padding: 13% 0 0;
  width: 100%;
  max-width: 1300px;
  margin: 0 auto 5%;
  position: relative;
}
.slick-list {
  background: url(../../img/slide/bg.png) no-repeat;
  background-size: 100%;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  height: 540px;
}
.lp-main .slick-arrow {
  max-width: 80px !important;
}
.slick-dots li button:before {
  content: '' !important;
  height: 100% !important;
  width: 100% !important;
}
.slick-dots li:nth-of-type(1) button:before .slick-dots li:nth-of-type(1) button:before, .slick-dots li:nth-of-type(1) button:before {
  background-position: center;
  background-size: 100%;
}
.slick-dots li:nth-of-type(1) button:before {
  background: url("../../img/slide/bodycolor_navi1.png") no-repeat;
  background-size: 94%;
}
.slick-dots li:nth-of-type(2) button:before {
  background: url("../../img/slide/bodycolor_navi2.png") no-repeat;
  background-size: 94%;
}
.slick-dots li:nth-of-type(3) button:before {
  background: url("../../img/slide/bodycolor_navi3.png") no-repeat;
  background-size: 94%;
}
#slider-01 .slick-dots li.slick-active:nth-of-type(1) button:before {
  background: url("../../img/slide/stripes-bodycolor_navi1_on.png") no-repeat;
  background-size: 94%;
}
#slider-01 .slick-dots li.slick-active:nth-of-type(2) button:before {
  background: url("../../img/slide/stripes-bodycolor_navi2_on.png") no-repeat;
  background-size: 94%;
}
#slider-01 .slick-dots li.slick-active:nth-of-type(3) button:before {
  background: url("../../img/slide/stripes-bodycolor_navi3_on.png") no-repeat;
  background-size: 94%;
}
#slider-02 .slick-dots li.slick-active:nth-of-type(1) button:before {
  background: url("../../img/slide/theory-bodycolor_navi1_on.png") no-repeat;
  background-size: 94%;
}
#slider-02 .slick-dots li.slick-active:nth-of-type(2) button:before {
  background: url("../../img/slide/theory-bodycolor_navi2_on.png") no-repeat;
  background-size: 94%;
}
#slider-02 .slick-dots li.slick-active:nth-of-type(3) button:before {
  background: url("../../img/slide/theory-bodycolor_navi3_on.png") no-repeat;
  background-size: 94%;
}
.slick-dots li {
  width: 33% !important;
  height: 75px !important;
  margin: 0 !important;
}
.slick-dots li button {
  width: 100% !important;
  height: 100% !important;
}
.slick-dots {
  bottom: initial !important;
}
.lp-main .pre_btn, .lp-main .next_btn {
  position: absolute;
  top: 54%;
  z-index: 5;
}
.lp-main .pre_btn {
  left: -1.5%;
}
.lp-main .next_btn {
  right: -1.5%;
}
/*車体情報*/
div#bodycolor {
  padding: 5% 5% 0%;
}
div#bodycolor .inner_detail {
  max-width: 86%;
}
div#bodycolor h2 {
  width: 100%;
  max-width: 610px;
  margin: 0 auto 3%;
}
div#bodycolor .select-navi {}
div#bodycolor .select-navi ul {
  background-color: #F2F2F2;
  max-width: 90%;
  width: 96%;
  padding: 1% 3%;
  border-radius: 100px;
  margin: 0 auto 3%;
}
div#bodycolor .select-navi ul li {
  width: 32%;
}
div#bodycolor .select-color {
  max-width: 92%;
  width: 96%;
  margin: 0 auto;
}
/*車体カラー*/
#stripes-bodycolor {
  background-color: #FFD2D3;
  padding: 5%;
  margin: 0 0 5%;
}
#stripes-bodycolor .inner_detail, #theory-bodycolor .inner_detail {
  max-width: 80%;
}
#stripes-bodycolor h2 {
  margin: 0 0 3%;
}
#theory-bodycolor {
  background-color: #b0c4de;
  padding: 5%;
  margin: 0 0 5%;
}
#theory-bodycolor h2 {
  margin: 0 0 3%;
}
/*リンク*/
div#link_box.link_box_bg {
  background-image: url("../../img/link_bg.png");
  background-repeat: no-repeat;
  background-size: 100%;
}
div#link_box.link_box_bg .inner_detail {
  background-image: url("../../img/link_box_bg.png");
  background-repeat: no-repeat;
  background-size: 100%;
  padding: 10%;
}
div#link_box.link_box_bg .inner_detail h2 {
  margin: 0 0 8%;
}
div#link_box.link_box_bg .inner_detail ul {
  width: 75%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}
div#link_box.link_box_bg .inner_detail ul li {
  text-align: center;
}
div#link_box.link_box_bg .inner_detail ul li img {
  width: 96%;
}
footer {
  padding: 3% 40%;
  text-align: center;
}
/* スマホ版
******************************************************/
.pc.tb {
  display: block;
}
@media (max-width: 1024px) {
  .pc {
    display: none;
  }
}
@media (min-width: 480px) {
  .sp {
    display: none;
  }
}
@media screen and (min-width:481px) and (max-width:1024px) {
  .tb.sp {
    display: block !important;
  }
}
@media (max-width: 480px) {
  .pc.tb {
    display: none !important;
  }
}
@media only screen and (max-width: 1112px) {}
@media only screen and (max-width: 1024px) {
  section#mv {
    background-image: url(../../img/sp/mv_bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    position: relative;
  }
  section#mv .inner_detail {
    max-width: 90%;
  }
  #tab_menu {
    width: 80%;
    background: transparent;
    padding: 0 0%;
    margin: 0 auto;
    background-image: none;
    position: absolute;
    z-index: 1;
    bottom: 4%;
    left: 0;
    right: 0;
    gap: 0px 12%;
  }
  div#schedule .inner_detail {
    max-width: 90%;
  }
  div#schedule.stripes_bg, div#schedule.theory_bg {
    padding: 0 2.5% 5%;
  }
  #stripes-bodycolor .inner_detail, #theory-bodycolor .inner_detail {
    max-width: 100%;
  }
  div#bodycolor {
    padding: 10% 0% 0%;
  }
  .slick-list {
    background: none;
    height: auto;
  }
  .lp-main .pre_btn, .lp-main .next_btn {
    display: none !important;
  }
  ul.slick-dots {
    background-color: transparent;
    padding: 0;
  }
  .slick-dots li:nth-of-type(1) button:before {
    background: url("../../img/sp/slide/bodycolor_navi1.png") no-repeat;
  }
  .slick-dots li:nth-of-type(2) button:before {
    background: url("../../img/sp/slide/bodycolor_navi2.png") no-repeat;
  }
  .slick-dots li:nth-of-type(3) button:before {
    background: url("../../img/sp/slide/bodycolor_navi3.png") no-repeat;
  }
  #slider-01 .slick-dots li.slick-active:nth-of-type(1) button:before {
    background: url("../../img/sp/slide/stripes-bodycolor_navi1_on.png") no-repeat;
  }
  #slider-01 .slick-dots li.slick-active:nth-of-type(2) button:before {
    background: url("../../img/sp/slide/stripes-bodycolor_navi2_on.png") no-repeat;
  }
  #slider-01 .slick-dots li.slick-active:nth-of-type(3) button:before {
    background: url("../../img/sp/slide/stripes-bodycolor_navi3_on.png") no-repeat;
  }
  #slider-02 .slick-dots li.slick-active:nth-of-type(1) button:before {
    background: url("../../img/sp/slide/theory-bodycolor_navi1_on.png") no-repeat;
  }
  #slider-02 .slick-dots li.slick-active:nth-of-type(2) button:before {
    background: url("../../img/sp/slide/theory-bodycolor_navi2_on.png") no-repeat;
  }
  #slider-02 .slick-dots li.slick-active:nth-of-type(3) button:before {
    background: url("../../img/sp/slide/theory-bodycolor_navi3_on.png") no-repeat;
  }
  .slick-dots li:nth-of-type(1) button:before, .slick-dots li:nth-of-type(2) button:before, .slick-dots li:nth-of-type(3) button:before, #slider-01 .slick-dots li.slick-active:nth-of-type(1) button:before, #slider-01 .slick-dots li.slick-active:nth-of-type(2) button:before, #slider-01 .slick-dots li.slick-active:nth-of-type(3) button:before, #slider-02 .slick-dots li.slick-active:nth-of-type(1) button:before, #slider-02 .slick-dots li.slick-active:nth-of-type(2) button:before, #slider-02 .slick-dots li.slick-active:nth-of-type(3) button:before {
    background-size: 100%;
  }
  .slick-dots li {
    width: 119px !important;
    height: 119px !important;
    margin: 0 7% 0% !important;
  }
  ul#slider-01, ul#slider-02 {
    padding: 15% 0 0;
  }
  #stripes-bodycolor, #theory-bodycolor {
    background-color: #fff;
    padding: 5% 0;
  }
  ul.color-list {
    overflow: hidden;
  }
  .attention-m {
    margin: 5% 0 0;
  }
  ul.color-list li {
    width: 50%;
    float: left;
  }
  .lb {
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, .7);
    opacity: 0;
    transition: .3s opacity ease;
    pointer-events: none;
    z-index: 100;
  }
  .lb img {
    width: auto !important;
    max-height: 100% !important;
    cursor: pointer;
  }
  .lb img, .lb iframe {
    transform: scale(.85);
    transition: .3s all ease;
  }
  .lb:target {
    opacity: 1;
    pointer-events: auto;
    z-index: 101;
  }
  .lb:target img, .lb:target iframe {
    transform: scale(1);
  }
  /* なんちゃって閉じるボタン*/
  .lb::before, .lb::after {
    display: block;
    position: fixed;
    content: "";
    width: 24px;
    height: 3px;
    top: 24px;
    right: 12px;
    background: #fff;
    border-radius: 4px;
  }
  .lb::before {
    transform: rotate(-315deg);
  }
  .lb::after {
    transform: rotate(315deg);
  }
  div#stripes-bodycolor h2, div#theory-bodycolor h2 {
    width: 100%;
    max-width: 610px;
    margin: 0 auto 3%;
  }
  div#link_box.link_box_bg {
    background-image: url(../../img/sp/link_bg.png);
  }
  div#link_box.link_box_bg .inner_detail {
    background-image: url(../../img/sp/link_box_bg.png);
    padding: 20% 15% 12%;
    max-width: 100%;
  }
  div#link_box.link_box_bg .inner_detail ul {
    display: block;
  }
  div#link_box.link_box_bg .inner_detail ul li img {
    width: 100%;
  }
  div#link_box.link_box_bg .inner_detail h2 {
    margin: 0 0 8%;
  }
  div#link_box.link_box_bg .inner_detail ul li {
    margin: 0 0 10%;
  }
  div#link_box.link_box_bg .inner_detail ul li:last-child {
    margin: 0;
  }
  footer {
    padding: 5% 15%;
  }
}
@media only screen and (max-width: 480px) {
  div#bodycolor h2, div#stripes-bodycolor h2, div#theory-bodycolor h2 {
    width: 100%;
    max-width: 85%;
    margin: 0 auto 5%;
  }
  .slick-dots li {
    width: 70px !important;
    height: 70px !important;
    margin: 5px 5% 0% !important;
    padding: 0 5px !important;
  }
  div#link_box.link_box_bg .inner_detail {
    padding: 18% 5% 10%;
  }
  div#link_box.link_box_bg .inner_detail ul {
    width: 70%;
    margin: 5% auto 0;
  }
  div#link_box.link_box_bg .inner_detail ul li img {
    width: 80%;
  }
  li.tab_link01, li.tab_link02 {
    width: 65px;
    bottom: 5%;
    right: 2%;
  }
}