
/** -------------------------------
 * mainview
 */
#mainview {
  background-color: #000;
}
  #mainview > .wrap {
    position: relative;
    width: 100%;
  }
    #mainview .swiper-container {}
      #mainview .swiper-wrapper {}
        #mainview .swiper-slide {
          position: relative;
          padding-top: 106.666%;
        }
          #mainview .bg {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            background-repeat: no-repeat;
            background-position: center top;
            background-size: cover;
          }
          #mainview .swiper-slide > .wrap {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
          }
            #mainview .inner {
              position: relative;
              width: 100%;
              height: 100%;
            }
        /* item01 */
        #mainview .item01 {
          overflow: hidden;
        }
          #mainview .item01 .bg.pc {
            display: none;
          }
          #mainview .item01 .bg.sp {
            margin-top: 0;
            padding-top: calc(400/375 * 100vw);
            background-image: url(../IMAGES/SP/mainview01_img.jpg);
            transition: 1.0s ease-in;
            -o-transition: 1.0s ease-in;
            -moz-transition: 1.0s ease-in;
            -webkit-transition: 1.0s ease-in;
            opacity: 0;
          }
          #mainview .item01.show .bg.sp {
            opacity: 1;
          }
            #mainview .item01 .inner.pc {
              display: none;
            }
              /* copy
              #mainview .item01 .inner.sp .copy {
                position: absolute;
                left: 0;
                top: 6%;
                display: block;
                width: 100%;
                transition: 1.0s ease-in;
                -o-transition: 1.0s ease-in;
                -moz-transition: 1.0s ease-in;
                -webkit-transition: 1.0s ease-in;
                opacity: 0;
              }
              #mainview .item01.show .inner.sp .copy {
                opacity: 1;
              }
              */
/*              #mainview .item01 .inner.sp .copy01 {
                top: 9.75%;
              }
              #mainview .item01 .inner.sp .copy02 {
                top: 23.7%;
              }
              #mainview .item01 .inner.sp .copy03 {
                top: 29.25%;
              }
              #mainview .item01 .inner.sp .copy04 {
                top: 37.5%;
              }
              #mainview .item01 .inner.sp .copy05 {
                top: 46.5%;
              }*/
        /* item02 */
        #mainview .item02 {
          overflow: hidden;
        }
          #mainview .item02 .movie {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 13.333vw;
            background-color: #000;
            background-image: url(../MP4/safety.jpg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
          }
          #mainview .item02 .movie.init {
            background-image: none;
          }
            #mainview .item02 .movie_wrap {
              position: relative;
              width: 100%;
            }
        /* item03
        #mainview .item03 {
          overflow: hidden;
        }
          #mainview .item03 .movie {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 13.333vw;
            background-color: #000;
            background-image: url(../MP4/15s_Generic.jpg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
          }
          #mainview .item03 .movie.init {
            background-image: none;
          }
            #mainview .item03 .movie_wrap {
              position: relative;
              width: 100%;
              height: 100%;
            }*/
        /* item04 */
        #mainview .item04 {
          overflow: hidden;
        }
          #mainview .item04 .bg.pc {
            display: none;
          }
          #mainview .item04 .bg.sp {
            margin-top: 0;
            padding-top: calc(400/375 * 100vw);
            background-image: url(../IMAGES/SP/mainview02_img.jpg);
            transition: 1.0s ease-in;
            -o-transition: 1.0s ease-in;
            -moz-transition: 1.0s ease-in;
            -webkit-transition: 1.0s ease-in;
            opacity: 0;
          }
          #mainview .item04.show .bg.sp {
            opacity: 1;
          }
            #mainview .item04 .inner.pc {
              display: none;
            }
              /* copy
              #mainview .item04 .inner.sp .copy {
                position: absolute;
                left: 0;
                top: 6%;
                display: block;
                width: 100%;
                transition: 1.0s ease-in;
                -o-transition: 1.0s ease-in;
                -moz-transition: 1.0s ease-in;
                -webkit-transition: 1.0s ease-in;
                opacity: 0;
              }
              #mainview .item04.show .inner.sp .copy {
                opacity: 1;
              }
              */
              /* item05 */
              #mainview .item05 {
                overflow: hidden;
              }
                #mainview .item05 .bg.pc {
                  display: none;
                }
                #mainview .item05 .bg.sp {
                  margin-top: 0;
                  padding-top: calc(400/375 * 100vw);
                  background-image: url(../IMAGES/SP/mainview03_img.jpg);
                  transition: 1.0s ease-in;
                  -o-transition: 1.0s ease-in;
                  -moz-transition: 1.0s ease-in;
                  -webkit-transition: 1.0s ease-in;
                  opacity: 0;
                }
                #mainview .item05.show .bg.sp {
                  opacity: 1;
                }
                  #mainview .item05 .inner.pc {
                    display: none;
                  }
              /* item07 */
              #mainview .item07 {
                overflow: hidden;
              }
                #mainview .item07 .bg.pc {
                  display: none;
                }
                #mainview .item07 .bg.sp {
                  margin-top: 0;
                  padding-top: calc(400/375 * 100vw);
                  background-image: url(../IMAGES/SP/mainview07_img.jpg);
                  transition: 1.0s ease-in;
                  -o-transition: 1.0s ease-in;
                  -moz-transition: 1.0s ease-in;
                  -webkit-transition: 1.0s ease-in;
                  opacity: 0;
                }
                #mainview .item07.show .bg.sp {
                  opacity: 1;
                }
                  #mainview .item07 .inner.pc {
                    display: none;
                  }
                #mainview .item07 .btn {
                  position: absolute;
                  left: 0;
                  bottom: 0;
                  right: 0;
                }
                  #mainview .item07 .btn a {
                    display: block;
                    width: 100%;
                    height: 13.333vw;
                    background-color: #c3002f;
                    color: #fff;
                    text-align: center;
                  }
                    #mainview .item07 .btn a span {
                      display: inline-block;
                      height: 13.333vw;
                      padding-right: 6vw;
                      padding-top: 4.2vw;
                      background-image: url(../IMAGES/swiper_next_white.png);
                      background-repeat: no-repeat;
                      background-position: right;
                      background-size: auto 3.066vw;
                      font-size: 3.2vw;
                      white-space: nowrap;
                    }
    /* navi */
    #mainview .mainviewNavigation {
      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
    }
      #mainview .mainviewNavigation > .wrap {
        position: relative;
        width: 100%;
        height: 100%;
      }
        #mainview .mainviewNavigation .content {

        }
          #mainview .mainviewNavigation .price {
            position: absolute;
            right: 4%;
            bottom: -1%;
            z-index: 2;
            margin-bottom: 18%;
            /*opacity: 0;*/
          }
            #mainview .mainviewNavigation .price dl {
              white-space: nowrap;
            }
              #mainview .mainviewNavigation .price dt {
                font-size: 9px;
                font-size: 2.4vw;
                color: #ccc;
                line-height: 1.1;
              }
              #mainview .mainviewNavigation .price dd {
                padding-top: 1.2%;
                font-size: 23px;
                font-size: 6.133vw;
                font-weight: bold;
                color: #fff;
                line-height: 1.1;
              }
                #mainview .mainviewNavigation .price em {
                  padding-left: 2%;
                  font-size: 16px;
                  font-size: 4.266vw;
                  vertical-align: middle;
                }
          #mainview .mainviewNavigation .button {
            position: absolute;
            bottom: 0;
            z-index: 2;
            width: 50%;
            /*width: 100%;*/
            background-color: #000;
            border-top: 1px solid #555;
          }
          #mainview .mainviewNavigation .button.carSearch {
            left: 0;
          }
          #mainview .mainviewNavigation .button.quotation {
            right: 0;
            border-left: 1px solid #555;
          }
            #mainview .mainviewNavigation .button.carSearch a {
              display: table;
              width: 100%;
              height: 13.333vw;
              background-color: #c3002f;
              background-repeat: no-repeat;
              background-position: 1.4vw;
              background-size: auto 10vw;
            }
            #mainview .mainviewNavigation .button.quotation a {
              display: table;
              width: 100%;
              height: 13.333vw;
              background-color: #000;
              background-repeat: no-repeat;
              background-position: 1.4vw;
              background-size: auto 10vw;
            }
            #mainview .mainviewNavigation .button.carSearch a { background-image: url(../IMAGES/icon_carSearch02.png); }
/*
            #mainview .mainviewNavigation .button.quotation a { background-image: url(../IMAGES/icon_quotation.png); }
*/
              #mainview .mainviewNavigation .button span {
                display: table-cell;
                padding-left: 11.6vw;
                font-size: 13px;
                font-size: 3.466vw;
                color: #fff;
                line-height: 1.1;
                vertical-align: middle;
              }
              #mainview .mainviewNavigation .button.quotation span {
                padding-left: 3.6vw;
              }
    /* swiper ctrl */
    #mainview .swiper-button-prev {
      display: none;
    }
    #mainview .swiper-button-next {
      display: none;
    }
    #mainview .swiper-pagination {
      clear: both;
      /*left: 0;*/
      bottom: 0;
      width: 96.5%;/*100%*/
      margin-bottom: -30vw;/*-17.6vw*/
      /*margin-bottom: -7vw;*/
      /*padding-right: 2.666vw;*/
      text-align: center;
    }
    #mainview .swiper-pagination.none {
      display: none;
    }
      /*#mainview .swiper-pagination-bullet {
        position: relative;
        width: 2.666vw;
        height: 2.666vw;
        margin-left: 2.666vw;
        background-color: #fff;
        border: 1px solid #c3002c;
        border-radius: 1.333vw;
        -moz-border-radius: 1.333vw;
        -webkit-border-radius: 1.333vw;
        opacity: 1;
      }
      #mainview .swiper-pagination-bullet-active {
        background-color: #c3002c;
      }*/
      #mainview .swiper-pagination-bullet {
        position: relative;
        /*width: 30vw;*/
        /*height: 16.875vw;*/
        /*width: 24vw;*/
        /*height: 13.5vw;*/
		width: 21.8666vw;
		height: 12.2666666667vw;
        margin-left: 2.4vw;
        background-color: #000;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        opacity: 1;
      }
      #mainview .swiper-pagination-bullet:nth-child(1) {
        background-image: url(../IMAGES/mainview_thumb01.jpg);
      }
      #mainview .swiper-pagination-bullet:nth-child(2) {
        background-image: url(../IMAGES/mainview_thumb07.jpg);
      }
      #mainview .swiper-pagination-bullet:nth-child(3) {
        background-image: url(../IMAGES/mainview_thumb05.jpg);
      }
      #mainview .swiper-pagination-bullet:nth-child(4) {
        background-image: url(../IMAGES/mainview_thumb04.jpg);
      }
      #mainview .swiper-pagination-bullet:nth-child(5) {
        background-image: url(../IMAGES/mainview_thumb10.jpg);
      }
      #mainview .swiper-pagination-bullet-active {

      }
      #mainview .swiper-pagination-bullet-active:after {
        content: '';
        position: absolute;
        left: -0.8vw;
        top: -0.8vw;
        right: -0.8vw;
        bottom: -0.8vw;
        display: block;
        background-color: rgba(255,255,255,0.3);
        border: 1px solid #c3002c;
      }


/** -------------------------------
 * notice
 */
#notice {
  /* margin: 3.8% auto 0; */
  padding: 0 6.1%;
  margin-top: 36%;/*26%*/
}

#notice .description {
  font-size: 1.2em;
  text-align: center;
  padding: 1.0em;
  background: #eee;
}

#notice .description a {
  color: #666;
  border-bottom: 1px solid;
  text-decoration: none;
}



/** -------------------------------
 * large-banner
 */
.large-banner {
  margin: 8% 4% 0;
  margin-top: 10%;
  /*margin-top: 26%;*/
}

.large-banner .banner {
  margin-top: 8%;
}

.large-banner .banner img {
  width: 100%;
}





/** -------------------------------
 * banner
 */

 /* @group .at_210210bnr */

 .at_210210bnr {
 	margin: 8% 4% 0;
 }

 .at_210210bnr .wrap .at_210210bnr_pc {
 	display: none;
 }

 .at_210210bnr .wrap img {
 	width: 100%;
    margin-bottom: 8%;
 }

 .at_210210bnr + script + #gradeRanking {
 	margin-top: 15%;
 }

 /* @end .at_210210bnr */


#banner {
  clear: both;
  margin-top: 42%;
  /*overflow-x: scroll;*/
  /*overflow-y: hidden;*/
  /*-webkit-overflow-scrolling: touch;*/
}
  #banner > .wrap {

  }
    #banner .header {
      position: relative;
      padding: 0 4%;
    }
    #banner .header:before {
      content: '';
      position: absolute;
      left: 4%;
      top: 0;
      display: block;
      width: 18.667%;
      height: 4px;
      border-top: 3.99px solid #c3002c;
    }
      #banner .header h1 {
        display: table;
        width: 100%;
      }
        #banner .header span {
          display: table-cell;
          padding: 3.6% 0;
          font-size: 16px;
          font-size: 4.266vw;
          font-weight: bold;
          vertical-align: middle;
        }
          #banner .header span em {
            font-size: 10px;
            font-size: 2.666vw;
            font-style: normal;
            font-weight: normal;
          }
    #banner .content {
      margin-top: 0.333vw;
    }
      #banner .content > .wrap {

      }
        #banner .swiper-container {

        }
          #banner .swiper-wrapper {

          }
            #banner .swiper-slide {
              /*margin-top:  2.4vw;*/
              padding: 0.666vw 0;
            }
/*            #banner .swiper-slide:first-child {
              margin-top: 0;
            }*/
              #banner .swiper-slide a {
                display: block;
                width: 80vw;
                margin: 0 auto;
                border: 1px solid #ccc;
                border-radius: 0 0 0.8vw 0.8vw;
                -moz-border-radius: 0 0 0.8vw 0.8vw;
                -webkit-border-radius: 0 0 0.8vw 0.8vw;
                box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
                -moz-box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
                -webkit-box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
              }
                #banner .swiper-slide a > .wrap {
                  position: relative;
                  display: block;
                  min-height: 52vw;
                  padding-bottom: 12vw;
                }
                  #banner .swiper-slide .image {
                    display: block;
                  }
                  #banner .swiper-slide .image img.pc {
                    display: none;
                  }
                  #banner .swiper-slide .description {
                    display: block;
                    padding: 0 4vw;
                    padding-top: 3vw;
                    font-size: 12px;
                    font-size: 3.2vw;
                    color: #000;
                    line-height: 1.5;
                  }
                  #banner .swiper-slide .button {
                    position: absolute;
                    right: 4vw;
                    bottom: 2vw;            }
                    #banner .swiper-slide .button em {
                      position: relative;
                      display: table;
                      width: 24vw;
                      height: 8vw;
                      background-color: #eee;
                      float: right;
                    }
                    #banner .swiper-slide .button em:after {
                      content: '';
                      position: absolute;
                      right: 3.3vw;
                      top: 50%;
                      width: 1.6vw;
                      height: 2.4vw;
                      margin-top: -1.2vw;
                      background-image: url(../IMAGES/arrow_red.png);
                      background-repeat: no-repeat;
                      background-position: right;
                      background-size: auto 2.4vw;
                    }
                      #banner .swiper-slide .button em i {
                        display: table-cell;
                        padding-left: 3.3vw;
                        font-size: 12px;
                        font-size: 3.2vw;
                        font-style: normal;
                        color: #000;
                        line-height: 1.1;
                        vertical-align: middle;
                      }





/** -------------------------------
 * newPanel
 */
#newPanel {
  clear: both;
  padding-bottom: 15%;
}
    #newPanel .nim {
      margin-top: 15%;
    }
      #newPanel .nim > .wrap {
        padding-top: 123.733%;
        background-image: url(../IMAGES/TH/nim_sp.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
    #newPanel .miryoku {
      margin-top: 18%;
      padding-bottom: 6%;
    }
      #newPanel .miryoku > .wrap {
        padding-top: 126.666%;
        background-image: url(../IMAGES/TH/miryoku_sp.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
    #newPanel .item {
      margin-top: 20%;
    }
      #newPanel .item > .wrap {
        position: relative;
        background-repeat: no-repeat;
        background-position: top;
        background-size: contain;
      }
      #newPanel .item.propilot > .wrap {
        padding-top: 200.88%;
        background-image: url(../IMAGES/TH/sp_img_propilot.jpg);
      }
      #newPanel .item.sos > .wrap {
        padding-top: 180.66%;
        background-image: url(../IMAGES/TH/sp_img_sos.jpg);
      }
      #newPanel .item.driving > .wrap {
        padding-top: 160.33%;
        background-image: url(../IMAGES/TH/sp_img_driving.jpg);
      }
      #newPanel .item.space > .wrap {
        padding-top: 166.666%;
        background-image: url(../IMAGES/TH/sp_img_space.jpg);
      }
      #newPanel .item.parking > .wrap {
        padding-top: 175.2%;
        background-image: url(../IMAGES/TH/sp_img_parking.jpg);
      }
      #newPanel .item.color > .wrap {
        padding-top: 180.8%;
        background-image: url(../IMAGES/TH/sp_img_color_2.jpg);
      }
        #newPanel .link {
          display: block;
          padding: 0 4vw;
          padding-top: 6vw;
        }
          #newPanel .link a {
            display: block;
            width: 100%;
          }
            #newPanel .link a .pc {
              display: none;
            }
    #newPanel .notice {
      margin: 0 auto;
      margin-top: 3%;
      /*padding: 0 3.667%;*/
    }
    #newPanel .notice.pc {
		display: none;
	}
    #newPanel .notice .description {
      font-size: 1.2em;
      text-align: left;
      padding: 1.0em;
    }
    #newPanel .notice .description a {
      color: #666;
      border-bottom: 1px solid;
      text-decoration: none;
    }





/** -------------------------------
 * concept
 */
#concept {
  clear: both;
  margin-top: 15%;
}
  #concept .item {
    position: relative;
    /*background-color: #000;*/
  }
    #concept .item .bg {
      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
    }
      #concept .item > .wrap .loader {
        position: absolute;
        left: 0;
        top: 0;
      }
     /* concept:item01 */
    #concept .item01 > .wrap {
      position: relative;
      width: 100%;
      padding-top: 55.5%;
      background-image: url(../MP4/movie01.jpg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      overflow: hidden;
    }
      #concept .item01 .movie {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
      }
    /* concept:item02 */
    #concept .item02 > .wrap {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
      padding-top: 50%;
      background-image: url(../MP4/movie02.jpg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      overflow: hidden;
    }
      #concept .item02 .movie {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
      }
/*    #concept .item02 .bg { background-image: url(../IMAGES/SP/concept02_img.jpg); }
    #concept .item02 > .wrap {
      position: relative;
      width: 100%;
      padding-top: 76%;
    }
      #concept .item02 .lead {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
      #concept .item02 .lead { background-image: url(../IMAGES/SP/concept02_lead.png); }*/





/** -------------------------------
 * nim
 */
#nim {
  clear: both;
}
  #nim > .wrap {
    padding: 10.666% 0;
    background-color: #fff;
  }
    #nim .title {
      width: 77.333%;
      margin: 0 auto;
    }
      #nim .title span {
        display: block;
        padding-top: 7.02%;
        background-image: url(../IMAGES/nim_logo.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
    #nim .description {
      display: none;
    }





/** -------------------------------
 * panel
 */
#panel {
  clear: both;
}
  #panel > .wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
  }
    /*#panel .bg {
      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      z-index: 0;
      overflow: hidden;
    }
      #panel .bg span {
        display: block;
        width: 100%;
        padding-top: 234%;
        background-image: url(../IMAGES/SP/panel_bg.jpg);
        background-repeat: no-repeat;
        background-position: top;
        background-size: cover;
      }*/
    #panel .item {
      position: relative;
      z-index: 1;
    }
      #panel .item > .wrap {

      }
        #panel .image {

        }
          #panel .image span {
            display: block;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
          }
          #panel .item01 .image span {
            padding-top: 56.933%;
            background-image: url(../IMAGES/SP/panel_img01.jpg);
          }
          #panel .item02 .image span {
            padding-top: 56.933%;
            background-image: url(../IMAGES/SP/panel_img03.jpg);
          }
          #panel .item03 .image span {
            padding-top: 56.933%;
            background-image: url(../IMAGES/SP/panel_img04.jpg);
          }
        #panel .content {
          position: relative;
          padding-top: 38.666%;
        }
          #panel .content > .wrap {
            position: absolute;
            left: 0;
            top: 30px;
            width: 100%;
          }
          #panel .content.show > .wrap {
            transition: 0.55s ease-out;
            -o-transition: 0.55s ease-out;
            -moz-transition: 0.55s ease-out;
            -webkit-transition: 0.55s ease-out;
            top: 0;
          }
            #panel .content .inner {
              padding: 4vw;
            }
              #panel .content .lead {
                font-size: 14px;
                font-size: 3.733vw;
                font-weight: bold;
                color: #000;
                line-height: 1.5;
                transition: 0.75s ease-out;
                -o-transition: 0.75s ease-out;
                -moz-transition: 0.75s ease-out;
                -webkit-transition: 0.75s ease-out;
                opacity: 0;
              }
              #panel .content.show .lead {
                opacity: 1;
              }
              #panel .content .copy {
                margin-top: 0.2%;
                font-size: 14px;
                font-size: 3.733vw;
                font-weight: bold;
                color: #000;
                line-height: 1.5;
                transition: 0.75s ease-out;
                -o-transition: 0.75s ease-out;
                -moz-transition: 0.75s ease-out;
                -webkit-transition: 0.75s ease-out;
                opacity: 0;
              }
              #panel .content.show .copy {
                opacity: 1;
              }
              #panel .content .button {
                position: relative;
                display: table;
                width: 23.2vw;
                height: 5.6vw;
                margin-top: 3.6%;
                border: 1px solid #555;
                transition: 0.75s ease-out;
                -o-transition: 0.75s ease-out;
                -moz-transition: 0.75s ease-out;
                -webkit-transition: 0.75s ease-out;
                opacity: 0;
              }
              #panel .content.show .button {
                opacity: 1;
              }
              #panel .content .button:after {
                content: '';
                position: absolute;
                right: 1.333vw;
                top: 50%;
                display: block;
                width: 1.333vw;
                height: 2vw;
                margin-top: -1vw;
                background-image: url(../IMAGES/arrow_red.png);
                background-repeat: no-repeat;
                background-position: right;
                background-size: auto 2vw;
              }
                #panel .content .button span.pc {
                  display: none;
                }
                #panel .content .button span {
                  display: table-cell;
                  padding: 0 2.4vw;
                  font-size: 11px;
                  font-size: 2.933vw;
                  font-weight: bold;
                  color: #000;
                  line-height: 1.1;
                  vertical-align: middle;
                }





/** -------------------------------
 * section | gradeRanking
 */
.section#gradeRanking {
  /*display: none;*/
}
  .section#gradeRanking > .wrap {}
    .section#gradeRanking .content {
      margin-top: 0.333vw;
    }
      .section#gradeRanking .content > .wrap {

      }
        .section#gradeRanking .swiper-container {

        }
          .section#gradeRanking .swiper-wrapper {

          }
            .section#gradeRanking .swiper-slide {
              width: 100%;
              /*margin-top: 4vw;*/
            }
              .section#gradeRanking .content .item {
                position: relative;
                display: block;
                width: 80vw;
                margin: 0 auto;
                padding-top: 30%;
                color: #000;
              }
                .section#gradeRanking .content .item .image {
                  position: absolute;
                  left: 0;
                  top: 6.933vw;
                  right: 0;
                  display: block;
                  height: 24vw;
                  background-repeat: no-repeat;
                  background-position: left top;
                  background-size: contain;
                }
                .section#gradeRanking .content .item01 .image { background-image: url(../IMAGES/SP/gradeRanking_img01.jpg); }
                .section#gradeRanking .content .item02 .image { background-image: url(../IMAGES/SP/gradeRanking_img02.jpg); }
                .section#gradeRanking .content .item03 .image { background-image: url(../IMAGES/SP/gradeRanking_img03.jpg); }
                .section#gradeRanking .content .item .num {
                  position: absolute;
                  left: 0;
                  top: 0;
                  display: table;
                  width: 6.933vw;
                  height: 6.933vw;
                  background-color: #fff;
                  border: 1px solid #b4b4b4;
                }
                  .section#gradeRanking .content .item .num em {
                    display: table-cell;
                    font-size: 16px;
                    font-size: 4.266vw;
                    font-style: normal;
                    font-weight: bold;
                    color: #666;
                    line-height: 1.1;
                    text-align: center;
                    vertical-align: middle;
                  }
                .section#gradeRanking .content .item dl {
                  position: absolute;
                  left: 50%;
                  top: 6%;
                }
                  .section#gradeRanking .content .item dt {
                    font-size: 12px;
                    font-size: 3.2vw;
                    font-weight: bold;
                    line-height: 1.5;
                  }
                  .section#gradeRanking .content .item dd {
                    margin-top: 4%;
                    font-size: 13px;
                    font-size: 3.466vw;
                    line-height: 1.5;
                  }
                    .section#gradeRanking .content .item dd b {
                      font-weight: bold;
                    }
              .section#gradeRanking .content .simulation {
                position: relative;
                display: block;
                width: 40.667%;
                margin-left: 50%;
                margin-top: 2.7%;
                padding-right: 3%;
                background-color: #eee;
                color: #000;
              }
                .section#gradeRanking .content .simulation span {
                  display: block;
                  padding: 6% 8%;
                  background-image: url(../IMAGES/arrow_red.png);
                  background-repeat: no-repeat;
                  background-position: right;
                  background-size: auto 2.4vw;
                  font-size: 10px;
                  font-size: 2.666vw;
                }
/*          .section#gradeRanking .swiper-button-prev,
          .section#gradeRanking .swiper-button-next,
          .section#gradeRanking .swiper-pagination {
            display: none;
          }*/
          .section#gradeRanking .swiper-button-prev {
            left: 2.4vw;
            top: 13vw;
            width: 3.2vw;
            height: 4.666vw;
            margin-top: 0;
            background-image: url(../IMAGES/swiper_prev_red.png);
            background-size: contain;
          }
          .section#gradeRanking .swiper-button-prev.swiper-button-disabled {
            background-image: url(../IMAGES/swiper_prev_gray.png);
            opacity: 0.25;
          }
          .section#gradeRanking .swiper-button-next {
            right: 2.4vw;
            top: 13vw;
            width: 3.2vw;
            height: 4.666vw;
            margin-top: 0;
            background-image: url(../IMAGES/swiper_next_red.png);
            background-size: contain;
          }
          .section#gradeRanking .swiper-button-next.swiper-button-disabled {
            background-image: url(../IMAGES/swiper_next_gray.png);
            opacity: 0.25;
          }
    .section#gradeRanking .link {
      clear: both;
      margin-top: 10%;
    }
      .section#gradeRanking .link ul {
        display: table;
        margin: 0 auto;
      }
        .section#gradeRanking .link li {
          display: table-cell;
          padding: 0 5.3vw;
        }
        .section#gradeRanking .link li:first-child {
          border-right: 1px solid #c1c1c1;
        }
          .section#gradeRanking .link a {
            display: block;
            padding: 0.5vw 0;
          }
            .section#gradeRanking .link span {
              display: block;
              padding-right: 4.8vw;
              background-image: url(../IMAGES/arrow_red.png);
              background-repeat: no-repeat;
              background-position: right;
              background-size: auto 3.066vw;
              font-size: 13px;
              font-size: 3.466vw;
              color: #333;
              line-height: 1.1;
              white-space: nowrap;
            }


/** -------------------------------
 * section | information
 */
.section#information {
  margin-top: 2%;
}
  .section#information > .wrap {}
    .section#information .content {
      margin-top: 0.333vw;
    }
      .section#information .content > .wrap {

      }
        .section#information .swiper-container {

        }
          .section#information .swiper-wrapper {

          }
            .section#information .swiper-slide {
              /*display: none;*/
              padding: 0.666vw 0;
              /*margin-top: 2.4vw;*/
            }
/*            .section#information .swiper-slide:nth-child(1),
            .section#information .swiper-slide:nth-child(2),
            .section#information .swiper-slide:nth-child(3) {
              display: block;
            }*/
              .section#information .swiper-slide a {
                display: block;
                width: 80vw;
                margin: 0 auto;
                border: 1px solid #ccc;
                border-radius: 0 0 0.8vw 0.8vw;
                -moz-border-radius: 0 0 0.8vw 0.8vw;
                -webkit-border-radius: 0 0 0.8vw 0.8vw;
                box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
                -moz-box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
                -webkit-box-shadow: 0 0 1.333vw rgba(0,0,0,0.2);
              }
                .section#information .swiper-slide a > .wrap {
                  position: relative;
                  display: block;
                  min-height: 52vw;
                  padding-bottom: 10vw;
                }
                  .section#information .swiper-slide .image {
                    display: block;
                    /*padding-top: 49.664%;
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: cover;*/
                  }
                  /*.section#information .swiper-slide.item04 .image { background-image: url(../IMAGES/SP/information_img04.jpg); }
                  .section#information .swiper-slide.item05 .image { background-image: url(../IMAGES/SP/information_img05.jpg); }
                  .section#information .swiper-slide.item06 .image { background-image: url(../IMAGES/SP/information_img06.jpg); }
                  .section#information .swiper-slide.item07 .image { background-image: url(../IMAGES/SP/information_img07.jpg); }
                  .section#information .swiper-slide.item08 .image { background-image: url(../IMAGES/SP/information_img08.jpg); }
                  .section#information .swiper-slide.item09 .image { background-image: url(../IMAGES/SP/information_img09.jpg); }
                  .section#information .swiper-slide.item10 .image { background-image: url(../IMAGES/SP/information_img10.jpg); }
                  .section#information .swiper-slide.item11 .image { background-image: url(../IMAGES/SP/information_img11.jpg); }
                  .section#information .swiper-slide.item12 .image { background-image: url(../IMAGES/SP/information_img12.jpg); }*/
                  .section#information .swiper-slide .image img.pc {
                    display: none;
                  }
                  .section#information .swiper-slide .description {
                    display: block;
                    padding: 0 4vw;
                    padding-top: 3vw;
                    font-size: 12px;
                    font-size: 3.2vw;
                    color: #000;
                    line-height: 1.5;
                  }
                  .section#information .swiper-slide .button {
                    position: absolute;
                    right: 4vw;
                    bottom: 2vw;            }
                    .section#information .swiper-slide .button em {
                      position: relative;
                      display: table;
                      width: 24vw;
                      height: 8vw;
                      background-color: #eee;
                      float: right;
                    }
                    .section#information .swiper-slide .button em:after {
                      content: '';
                      position: absolute;
                      right: 3.3vw;
                      top: 50%;
                      width: 1.6vw;
                      height: 2.4vw;
                      margin-top: -1.2vw;
                      background-image: url(../IMAGES/arrow_red.png);
                      background-repeat: no-repeat;
                      background-position: right;
                      background-size: auto 2.4vw;
                    }
                      .section#information .swiper-slide .button em i {
                        display: table-cell;
                        padding-left: 3.3vw;
                        font-size: 12px;
                        font-size: 3.2vw;
                        font-style: normal;
                        color: #000;
                        line-height: 1.1;
                        vertical-align: middle;
                      }
        .section#information .swiper-button-prev {
          display: none;
        }
        .section#information .swiper-button-next {
          display: none;
        }
        .section#information .swiper-pagination {
          display: none;
        }


/** -------------------------------
 * section | ranking
 */
.section#ranking {}
  .section#ranking > .wrap {}
    .section#ranking .content {
      margin-top:6.4%;
    }
    .section#ranking .content.grade {
      margin-top: 0;
    }
      .section#ranking .content .category {
        position: relative;
        padding: 0 4%;
      }
        .section#ranking .content .category h2 {
          position: relative;
          display: block;
          width: 100%;
          padding-top: 4.4vw;
          border-top: 1px solid #c2c2c2;
        }
        .section#ranking .content.grade .category h2 {
          padding-top: 2.4vw;
          border-top: none;
        }
          .section#ranking .content .category span {
            font-size: 12px;
            font-size: 3.2vw;
            font-weight: bold;
            color: #666;
            line-height: 1.1;
          }
      .section#ranking .content .inner {
        margin-top: 4.4vw;
      }
        .section#ranking .content .inner > .wrap {

        }
          .section#ranking .swiper-container {

          }
            .section#ranking .swiper-wrapper {

            }
              .section#ranking .swiper-slide {
                width: 100%;
              }
                .section#ranking .content .item {
                  position: relative;
                  display: block;
                  width: 80vw;
                  margin: 0 auto;
                  padding-top: 28vw;
                  color: #000;
                }
                  .section#ranking .content .item .image {
                    position: absolute;
                    left: 0;
                    top: 6.933vw;
                    bottom: 0;
                    display: block;
                    width: 30%;
                    background-repeat: no-repeat;
                    background-position: left top;
                    background-size: contain;
                  }
                  .section#ranking .content.grade .item01 .image { background-image: url(../IMAGES/ranking_grade_img01.jpg); }
                  .section#ranking .content.grade .item02 .image { background-image: url(../IMAGES/ranking_grade_img02.jpg); }
                  .section#ranking .content.grade .item03 .image { background-image: url(../IMAGES/ranking_grade_img03.jpg); }
                  .section#ranking .content.option .item01 .image { background-image: url(../IMAGES/ranking_option_img01.jpg); }
                  .section#ranking .content.option .item02 .image { background-image: url(../IMAGES/ranking_option_img02.jpg); }
                  .section#ranking .content.option .item03 .image { background-image: url(../IMAGES/ranking_option_img03.jpg); }
                  .section#ranking .content.color .item01 .image { background-image: url(../IMAGES/ranking_color_img01.jpg); }
                  .section#ranking .content.color .item02 .image { background-image: url(../IMAGES/ranking_color_img02.jpg); }
                  .section#ranking .content.color .item03 .image { background-image: url(../IMAGES/ranking_color_img03.jpg); }
                  .section#ranking .content .item .num {
                    position: absolute;
                    left: 0;
                    top: 0;
                    display: table;
                    width: 6.933vw;
                    height: 6.933vw;
                    background-color: #fff;
                    border: 1px solid #b4b4b4;
                  }
                    .section#ranking .content .item .num em {
                      display: table-cell;
                      font-size: 16px;
                      font-size: 4.266vw;
                      font-style: normal;
                      font-weight: bold;
                      color: #666;
                      line-height: 1.1;
                      text-align: center;
                      vertical-align: middle;
                    }
                  .section#ranking .content .item .label {
                    position: absolute;
                    left: 37.5%;
                    top: 6.933vw;
                    /*padding-right: 6%;*/
                    font-size: 12px;
                    font-size: 3.2vw;
                    line-height: 1.5;
                  }
/*          .section#ranking .swiper-button-prev,
          .section#ranking .swiper-button-next,
          .section#ranking .swiper-pagination {
            display: none;
          }*/
            .section#ranking .swiper-button-prev {
              left: 2.4vw;
              top: 12vw;
              width: 3.2vw;
              height: 4.666vw;
              margin-top: 0;
              background-image: url(../IMAGES/swiper_prev_red.png);
              background-size: contain;
            }
            .section#ranking .swiper-button-prev.swiper-button-disabled {
              background-image: url(../IMAGES/swiper_prev_gray.png);
              opacity: 0.25;
            }
            .section#ranking .swiper-button-next {
              right: 2.4vw;
              top: 12vw;
              width: 3.2vw;
              height: 4.666vw;
              margin-top: 0;
              background-image: url(../IMAGES/swiper_next_red.png);
              background-size: contain;
            }
            .section#ranking .swiper-button-next.swiper-button-disabled {
              background-image: url(../IMAGES/swiper_next_gray.png);
              opacity: 0.25;
            }
      .section#ranking .content .link {
        clear: both;
        margin-top: 2%;
        padding: 0 4%;
      }
        .section#ranking .content .link a {
          position: relative;
          display: table;
          width: 44.4vw;
          height: 7.466vw;
          background-color: #eee;
          float: right;
        }
        .section#ranking .content .link a:after {
          content: '';
          position: absolute;
          right: 2.4vw;
          top: 50%;
          display: block;
          width: 2vw;
          height: 2.4vw;
          margin-top: -1.2vw;
          background-image: url(../IMAGES/arrow_red.png);
          background-repeat: no-repeat;
          background-position: right;
          background-size: auto 2.4vw;
        }
          .section#ranking .content .link span {
            display: table-cell;
            padding: 0 3.2vw;
            font-size: 12px;
            font-size: 3.2vw;
            color: #333;
            line-height: 1.1;
            white-space: nowrap;
            vertical-align: middle;
          }


/** -------------------------------
 * section | editions
 */
.section#editions {}
  .section#editions > .wrap {}
    .section#editions .content {
      margin-top: -4%;
      padding: 0 4%;
    }
      .section#editions .content ul {

      }
        .section#editions .content li {
          display: block;
          width: 48%;
          margin-left: 4%;
          margin-top: 6%;
          float: left;
        }
        .section#editions .content li:nth-child(odd) {
          margin-left: 0;
        }
          .section#editions .content a {
            display: block;
            width: 100%;
          }
            .section#editions .content .image {
              position: relative;
              display: block;
              padding-top: 56.25%;
              background-repeat: no-repeat;
              background-size: cover;
            }
            .section#editions .content .image.outline:after {
              content: '';
              position: absolute;
              left: 0;
              top: 0;
              right: 0;
              bottom: 0;
              display: block;
              border: 0.99px solid #ddd;
            }
            .section#editions .content .item01 .image { background-image: url(../IMAGES/editions_img01.jpg); }
            .section#editions .content .item02 .image { background-image: url(../IMAGES/editions_img02.jpg); }
            .section#editions .content .item03 .image { background-image: url(../IMAGES/editions_img03.jpg); }
            .section#editions .content .item04 .image { background-image: url(../IMAGES/editions_img04.jpg); }
            .section#editions .content .item05 .image { background-image: url(../IMAGES/editions_img05.jpg); }
            .section#editions .content .label {
              display: block;
              margin-top: 3.8vw;
            }
              .section#editions .content .label b {
                display: block;
                font-size: 11px;
                font-size: 2.933vw;
                font-weight: bold;
                color: #666;
                line-height: 1.1;
              }
              .section#editions .content .label em {
                display: block;
                margin-top: 2.5%;
                font-size: 12px;
                font-size: 3.2vw;
                font-style: normal;
                color: #000;
                line-height: 1.1;
              }
                .section#editions .content .label em i {
                  padding-right: 3vw;
                  background-image: url(../IMAGES/arrow_red.png);
                  background-repeat: no-repeat;
                  background-position: right;
                  background-size: auto 2.4vw;
                  font-style: normal;
                }
            .section#editions .content .button {
              display: none;
            }



/** -------------------------------
 * section | driversVoice
 */
.section#driversVoice {
  /*display: none;*/
}
  .section#driversVoice > .wrap {}
    .section#driversVoice .header {

    }
      .section#driversVoice .header p {
        font-size: 12px;
        font-size: 3.2vw;
        line-height: 1.75;
        text-align: justify;
      }
    .section#driversVoice .content {
      margin-top: 5.6vw;
    }
      .section#driversVoice .content > .wrap {

      }
        .section#driversVoice .swiper-container {

        }
          .section#driversVoice .swiper-wrapper {

          }
            .section#driversVoice .swiper-slide {
              width: 100%;
              /*margin-top: 4vw;*/
            }
              .section#driversVoice .content .item {
                position: relative;
                display: block;
                width: 80vw;
                margin: 0 auto;
                color: #000;
              }
                .section#driversVoice .content .item .label {
                  font-size: 15px;
                  font-size: 4vw;
                  font-weight: bold;
                }
                .section#driversVoice .content .item .text {
                  height: 20.796vw;
                  margin-top: 2vw;
                  font-size: 13px;
                  font-size: 3.466vw;
                  line-height: 2.0;
                  /*text-align: justify;*/
                  overflow: hidden;
                }
                  .section#driversVoice .content .item .text .point {

                  }
                  .section#driversVoice .content .item .text .detail {
                    display: none;
                  }
                  .section#driversVoice .content .item.show .text .point {
                    display: none;
                  }
                  .section#driversVoice .content .item.show .text .detail {
                    display: inline;
                  }
                .section#driversVoice .content .item .author {
                  margin-top: 3.6vw;
                  font-size: 12px;
                  font-size: 3.2vw;
                }
                .section#driversVoice .content .item .btn {
                  display: table;
                  margin-top: 5vw;
                  background-image: url(../IMAGES/down_red.png);
                  background-repeat: no-repeat;
                  background-position: right;
                  background-size: 3vw auto;
                }
                .section#driversVoice .content .item.show .btn {
                  background-image: url(../IMAGES/up_red.png);
                }
                  .section#driversVoice .content .item .btn span {
                    display: table-cell;
                    padding-right: 5vw;
                    font-size: 13px;
                    font-size: 3.466vw;
                    text-decoration: underline;
                  }

          .section#driversVoice .swiper-button-prev {
            left: 2.4vw;
            top: 16vw;
            width: 3.2vw;
            height: 4.666vw;
            margin-top: 0;
            background-image: url(../IMAGES/swiper_prev_red.png);
            background-size: contain;
          }
          .section#driversVoice .swiper-button-prev.swiper-button-disabled {
            background-image: url(../IMAGES/swiper_prev_gray.png);
            opacity: 0.25;
          }
          .section#driversVoice .swiper-button-next {
            right: 2.4vw;
            top: 16vw;
            width: 3.2vw;
            height: 4.666vw;
            margin-top: 0;
            background-image: url(../IMAGES/swiper_next_red.png);
            background-size: contain;
          }
          .section#driversVoice .swiper-button-next.swiper-button-disabled {
            background-image: url(../IMAGES/swiper_next_gray.png);
            opacity: 0.25;
          }
    .section#driversVoice .link {
      clear: both;
      margin-top: 6vw;
      padding: 0 4%;
    }
      .section#driversVoice .link a {
        position: relative;
        display: table;
        width: 44.4vw;
        height: 7.466vw;
        background-color: #eee;
        float: right;
      }
      .section#driversVoice .link a:after {
        content: '';
        position: absolute;
        right: 2.4vw;
        top: 50%;
        display: block;
        width: 2vw;
        height: 2.4vw;
        margin-top: -1.2vw;
        background-image: url(../IMAGES/arrow_red.png);
        background-repeat: no-repeat;
        background-position: right;
        background-size: auto 2.4vw;
      }
        .section#driversVoice .link span {
          display: table-cell;
          padding: 0 3.2vw;
          font-size: 12px;
          font-size: 3.2vw;
          color: #333;
          line-height: 1.1;
          white-space: nowrap;
          vertical-align: middle;
        }

/** -------------------------------
 * section | comparison
 */
.section#comparison {}
  .section#comparison > .wrap {}
    .section#comparison .content {
      margin-top: 2.4%;
      padding: 0 4%;
    }
      .section#comparison .content ul {

      }
        .section#comparison .content li {
          display: block;
          width: 48%;
          margin-left: 4%;
          float: left;
        }
        .section#comparison .content li:first-child {
          margin-left: 0;
        }
          .section#comparison .content a {
            display: block;
            width: 100%;
          }
            .section#comparison .content .image {
              display: block;
              padding-top: 56.25%;
              background-repeat: no-repeat;
              background-size: cover;
            }
            .section#comparison .content .item01 .image { background-image: url(../IMAGES/comparison_img01.jpg); }
            .section#comparison .content .item02 .image { background-image: url(../IMAGES/comparison_img02.jpg); }
            .section#comparison .content .item03 .image { background-image: url(../IMAGES/comparison_img03.jpg); }
            .section#comparison .content .button {
              position: relative;
              display: table;
              margin-top: 5%;
            }
            .section#comparison .content .button:after {
              content: '';
              position: absolute;
              right: 0;
              top: 50%;
              display: block;
              width: 1.466vw;
              height: 2vw;
              margin-top: -1vw;
              background-image: url(../IMAGES/arrow_red.png);
              background-repeat: no-repeat;
              background-position: right;
              background-size: auto 2vw;
            }
              .section#comparison .content .button em {
                display: table-cell;
                padding-right: 3vw;
                font-size: 12px;
                font-size: 3.2vw;
                color: #333;
                line-height: 1.1;
                white-space: nowrap;
                vertical-align: middle;
              }



/** -------------------------------
 * section | facilities
 */
.section#facilities {}





/** -------------------------------
 * detailContents
 */
#detailContents {
  clear: both;
  margin-top: 11.7%;
}
  #detailContents > .wrap {
    padding: 0 4%;
    padding-bottom: 10.4%;
  }
    #detailContents .header {

    }
      #detailContents .header h1 {

      }
        #detailContents .header span {
          font-size: 14px;
          font-size: 3.733vw;
          font-weight: bold;
          line-height: 1.1;
          vertical-align: middle;
        }
    #detailContents .content {
      padding-top: 4.5vw;
    }
      #detailContents .content ul {
        border-top: 1px solid #ccc;
      }
        #detailContents .content li {
          display: block;
          border-bottom: 1px solid #ccc;
        }
          #detailContents .content a {
            display: table;
            width: 100%;
            height: 10.666vw;
          }
            #detailContents .content span {
              display: table-cell;
              padding-right: 3.6%;
              vertical-align: middle;
            }
              #detailContents .content em {
                display: block;
                background-image: url(../IMAGES/arrow_red.png);
                background-repeat: no-repeat;
                background-position: right;
                background-size: auto 2.666vw;
                font-size: 14px;
                font-size: 3.733vw;
                color: #333;
                line-height: 1.1;
              }



/** -------------------------------
 * vlpTaxCap1908
 */
p.vlpTaxCap1908 {
	color: #c3002f;
	font-size: 3.2vw;
	line-height: 1.5;
	margin-top: 13%;
	padding: 0 3.667%;
}


/** -------------------------------
 * ASV++
 */
 #asv {
 	margin-left: 4%;
 	margin-right: 4%;
  margin-bottom: 15%;
 }

 #asv .inner {
 	border-top: 1px solid #e0e0e0;
 	padding-top: calc(30/375 * 100vw);
 	box-sizing: border-box;
 	display: block;
 }

 #asv .icon {
 	width: 100%;
 }

 #asv .icon img {
 	width: 100%;
 }

 #asv .description {
 	width: 100%;
 	font-size: 14px;
 	font-size: 3.733vw;
 	word-break: break-all;
     margin-top: 2em;
 }

 #asv .note {
 	width: 100%;
 	margin-top: 2em;
 	font-size: 12px;
 	font-size: 3.2vw;
 	word-break: break-all;
 }

 #asv .description::after,
 #asv .inner::after {
 	display: block;
 	clear: both;
 	content: "";
 }
