@charset "UTF-8";
/*--------------------------------------
/* 全体
--------------------------------------*/
main {
  /*--------------------------------------
/* kv
--------------------------------------*/
  /*--------------------------------------
/* title
--------------------------------------*/
  /*------------------------------------------
 * cpSlider
------------------------------------------*/
  /*------------------------------------------
 * cpTitle
------------------------------------------*/ }
  main .oil {
    min-width: 1200px; }
  main .oil img {
    vertical-align: bottom; }
  @media (max-width: 767px) {
    main .oil {
      width: 100%;
      min-width: 100%;
      overflow: hidden; } }
  main .oilKv {
    width: 100%;
    min-width: 1200px;
    height: 289px;
    background-image: url(../img/kv_bg.png);
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden; }
  main .oilKvInner {
    width: 1200px;
    margin: 0 auto;
    height: 100%;
    background-image: url(../img/kv_pt2.png);
    background-position: top -18px center;
    background-repeat: no-repeat; }
  @media (max-width: 767px) {
    main .oilKv {
      min-width: 100%;
      height: 350px;
      background-image: url(../img/kv_bg_front_sp.png), url(../img/kv_bg_back_sp.png);
      background-repeat: no-repeat, repeat;
      background-size: cover, 151px;
      background-position: bottom right calc(50% - 240px), top left; }
    main .oilKvInner {
      width: 100%;
      background-image: url(../img/kv_pt2_sp.png);
      background-position: top 15px center;
      background-repeat: no-repeat;
      background-size: 306px; } }
  main .oilDesc {
    text-align: center;
    padding: 130px 0 85px;
    background: url(../img/desc_ico.png) no-repeat center top 59px; }
  main .oilDescTitle {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.64;
    letter-spacing: 1px;
    margin: 0 0 24px; }
  main .oilDescTitle span {
    color: #ff9000; }
  main .oilDesc p {
    font-size: 18px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 1px; }
  @media (max-width: 767px) {
    main .oilDesc {
      padding: 81px 28px 34px;
      background: url(../img/desc_ico_sp.png) no-repeat center top 25px/24px; }
    main .oilDescTitle {
      font-size: 20px;
      line-height: 1.4;
      letter-spacing: 2px;
      margin: 0 0 40px; }
    main .oilDescTitle span {
      font-size: 22px;
      letter-spacing: 2.8px; }
    main .oilDesc p {
      font-size: 13px;
      line-height: 1.7;
      letter-spacing: 1.3px;
      width: 68%;
      text-align: left; } }
  @media (max-width: 370px) {
    main .oilDesc p {
      font-size: 12px;
      width: 180px; } }
  main .oilShop {
    padding: 0 0 100px; }
  main .oilShopTitleWrap {
    height: 88px;
    background: url(../img/shop_title_bg.png) repeat-x left top;
    position: relative;
    text-align: center;
    padding-top: 22px;
    margin: 0 0 40px; }
  main .shopTitleStuff {
    position: absolute;
    bottom: 0;
    right: calc(50% - 578px); }
  main .oilShopDesc {
    font-size: 24px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 1px;
    text-align: center;
    margin: 0 0 63px; }
  main .shop .shopTabPc {
    border-left: none;
    width: 980px;
    margin: 0 auto 79px; }
  main .shop .shopTabPcItemList li a {
    background-image: url(../img/btn_yellow.png);
    background-size: 16px; }
  main .shop .shopTabPcItem {
    padding: 0 21px;
    height: 181px; }
  main .shop .shopTabPcItem:first-of-type {
    padding-left: 0; }
  main .shop .shopTabPcItem:last-of-type {
    padding-right: 0;
    border-right: 0; }
  main .oilShopAttention {
    width: 980px;
    border: 2px solid #ff9000;
    padding: 15px 0;
    margin: 0 auto 45px;
    background: url(../img/shop_ico.png) no-repeat center left 213px; }
  main .oilShopAttention p {
    font-size: 16px;
    line-height: 1.44;
    letter-spacing: 1px;
    text-align: left;
    margin: 0 auto 0 287px; }
  main .oilShopList {
    width: 840px;
    margin: 0 auto; }
  main .oilShopList > li {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding-left: 19px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 45px;
    margin-bottom: 45px; }
  main .oilShopList > li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0; }
  main .oilShopListInfo {
    width: calc(100% - 282px); }
  main .oilShopListBtn {
    width: 282px; }
  main .oilShopListTitle {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 1px;
    text-align: left;
    position: relative;
    margin: 0 0 24px; }
  main .oilShopListTitle:before {
    content: '';
    width: 6px;
    height: 30px;
    background-color: #ff9000;
    position: absolute;
    top: 0;
    left: -19px; }
  main .oilShopListAddress {
    font-size: 14px;
    line-height: 1.57;
    letter-spacing: 1.8px;
    text-align: left;
    margin: 0 0 11px; }
  main .oilShopListTel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  main .oilShopListTel dt {
    width: 123px;
    height: 25px;
    line-height: 25px;
    background-color: #ff9000;
    color: #fff;
    text-align: center;
    font-size: 14px; }
  main .oilShopListTel dd {
    width: calc(100% - 123px);
    color: #ff9000;
    text-align: left;
    font-size: 22px;
    padding-left: 31px;
    background: url(../img/tel_ico.png) no-repeat center left 11px; }
  main .oilShopListBtn a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 10px 0 0;
    width: 282px;
    height: 48px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15);
            box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15);
    background: url(../img/btn_red.png) no-repeat center left 58px/16px #fff;
    font-size: 13px;
    font-weight: 700;
    border-radius: 10px;
    padding: 4px 0 0;
    border: 1px solid #ccc; }
  main .oilShopListBtn a span {
    text-align: left;
    line-height: 1.3;
    letter-spacing: 0.9px;
    display: inline-block;
    width: 140px;
    position: relative;
    left: 10px; }
  @media (max-width: 767px) {
    main .oilShop {
      padding: 0 0 39px; }
    main .oilShopInner {
      padding: 0 14px; }
    main .oilShopTitleWrap {
      height: 59px;
      background: url(../img/shop_title_bg_sp.png) repeat-x left top/auto 100%;
      padding-top: 17px;
      margin: 0 0 24px; }
    main .oilShopTitle img {
      width: 113px; }
    main .shopTitleStuff {
      bottom: 59px;
      right: 0;
      width: 35%; }
    main .oilShopDesc {
      font-size: 13px;
      letter-spacing: 0;
      margin: 0 0 9px; }
    main .shopGeosearch {
      width: 226px;
      margin: 30px auto; }
    main .shopGeosearch div {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin: 10px 0 0;
      width: 282px;
      height: 48px;
      -webkit-box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15);
              box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15);
      background: url(../img/btn_red.png) no-repeat center left 58px/16px #fff;
      font-size: 13px;
      font-weight: 700;
      border-radius: 10px;
      padding: 4px 0 0;
      border: 1px solid #ccc;
      margin: 0 0 14px;
      width: 100%;
      height: 44px;
      background: url(../img/btn_red.png) no-repeat center left 43px/13px #fff;
      font-size: 12px;
      border-radius: 4px;
      padding: 0; }
    main .shopGeosearch div span {
      text-align: left;
      line-height: 1.3;
      letter-spacing: 0.9px;
      display: inline-block;
      width: 140px;
      position: relative;
      left: 10px;
      line-height: 1.17;
      letter-spacing: 0;
      width: 143px;
      left: 22px; }
    main .shop .shopTabSp {
      margin-bottom: 23px; }
    main .shop .shopTabSpItemList li a {
      background-image: url(../img/btn_yellow.png);
      background-size: 12px; }
    main .shop .shopTabSpItemTitle p {
      background-image: url(../img/plus-icn.png); }
    main .shop .shopTabSpItemTitle p.open {
      background-image: url(../img/minus-icn.png);
      background-size: 10.5px; }
    main .oilShopAttention {
      width: 100%;
      padding: 10px 10px 16px 64px;
      margin: 0 0 26px;
      background: url(../img/shop_ico_sp.png) no-repeat center left 14px/35px; }
    main .oilShopAttention p {
      font-size: 13px;
      line-height: 1.7;
      letter-spacing: 1.3px;
      width: 100%;
      margin: 0; }
    main .oilShopList {
      width: 100%;
      padding: 0; }
    main .oilShopList > li {
      width: 100%;
      display: block;
      padding-left: 13px;
      padding-bottom: 25px;
      margin-bottom: 25px; }
    main .oilShopListInfo {
      width: 100%;
      margin: 0 0 14px; }
    main .oilShopListBtn {
      width: auto;
      margin: 0 auto; }
    main .oilShopListTitle {
      font-size: 18px;
      line-height: 0.72;
      letter-spacing: 1px;
      margin: 0 0 19px; }
    main .oilShopListTitle:before {
      width: 5px;
      height: 21px;
      top: -4px;
      left: -13px; }
    main .oilShopListAddress {
      font-size: 10px;
      line-height: 1.6;
      letter-spacing: 1px;
      margin: 0 0 13px; }
    main .oilShopListTel {
      display: block; }
    main .oilShopListTel dt {
      width: 87px;
      height: 17px;
      line-height: 17px;
      font-size: 10px;
      display: none; }
    main .oilShopListTel dd {
      width: 100%;
      font-size: 13px;
      /*		background: url(../img/tel_ico_sp.png) no-repeat center left 7px/11px;
    	border: 1px solid #ccc;*/
      color: #fff;
      padding: 0;
      text-align: center;
      border-radius: 0px;
      margin-left: 0px; }
    main .oilShopListTel dd a {
      color: #fff;
      padding: 13px 5px 13px 0px;
      background: #EA203F;
      border-radius: 4px;
      -webkit-box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15);
              box-shadow: 0 1px 2px 0 rgba(4, 0, 0, 0.15); }
    main .oilShopListTel dd a:before {
      content: '';
      display: inline-block;
      vertical-align: middle;
      margin-right: 5px;
      background: url(../img/icon_sptel.png) 0 0 no-repeat;
      background-size: 100%;
      width: 29.5px;
      height: 13.5px;
      position: relative;
      top: -2px; }
    main .oilShopListBtn a {
      margin: 0 0 12px;
      width: 100%;
      height: 44px;
      font-size: 13px;
      border-radius: 4px;
      padding: 0;
      background: none; }
    main .oilShopListBtn a:before {
      content: '';
      display: inline-block;
      vertical-align: middle;
      margin-right: 10px;
      background: url(../img/btn_red.png) no-repeat center left;
      background-size: 100%;
      width: 13px;
      height: 13px; }
    main .oilShopListBtn a:last-of-type {
      margin-bottom: 0; }
    main .oilShopListBtn a span {
      line-height: 1.17;
      letter-spacing: 0;
      width: auto;
      left: 0px; }
    main .oilShopListBtn a span br {
      display: none; } }
  main .oilStep {
    background: url(../img/step_bg.png) top left;
    padding: 52px 0 98px; }
  main .oilStepInner {
    width: 980px;
    margin: 0 auto;
    position: relative; }
  main .oilStepTitle {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: 1.6px;
    text-align: center;
    color: #ff9000;
    margin: 0 0 74px; }
  main .oilStepTitle span {
    font-size: 60px;
    position: relative;
    top: 10px; }
  main .shopStepStuff {
    position: absolute;
    left: 9px;
    top: -105px; }
  main .oilStepList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    position: relative; }
  main .oilStepList li {
    width: 327px;
    height: 322px;
    padding: 30px 28px 0; }
  main .oilStepList li p {
    font-size: 14px;
    line-height: 1.57;
    text-align: justify;
    padding-right: 24px;
    letter-spacing: -0.8px; }
  main .oilStepList li:nth-of-type(1) {
    background: url(../img/step01.png) no-repeat; }
  main .oilStepList li:nth-of-type(2) {
    background: url(../img/step02.png) no-repeat; }
  main .oilStepList li:nth-of-type(3) {
    width: 300px;
    background: url(../img/step03.png) no-repeat; }
  main .oilStepList li:nth-of-type(3) p {
    padding-right: 0; }
  main .oilStepListTitle {
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 2.8px;
    text-align: center;
    color: #ff9000;
    margin: 0 0 164px; }
  @media (max-width: 767px) {
    main .oilStep {
      background: url(../img/step_bg.png) top left/66px;
      padding: 16px 0 46px; }
    main .oilStepInner {
      width: 100%;
      margin: 0 auto; }
    main .oilStepTitle {
      font-size: 22px;
      line-height: 1.64;
      letter-spacing: 1px;
      margin: 0 0 15px; }
    main .oilStepTitle span {
      font-size: 35px;
      top: 4px;
      left: 1px; }
    main .shopStepStuff {
      display: none; }
    main .oilStepList {
      display: block;
      width: 320px;
      margin: 0 auto; }
    main .oilStepList li {
      width: 100%;
      height: 178px;
      padding: 22px 14px 2px;
      margin: 0 0 5px; }
    main .oilStepList li:nth-of-type(1) {
      background-image: url(../img/step01_sp.png);
      background-size: 100%; }
    main .oilStepList li:nth-of-type(2) {
      background-image: url(../img/step02_sp.png);
      background-size: 100%; }
    main .oilStepList li:nth-of-type(3) {
      background-image: url(../img/step03_sp.png);
      background-size: 100%;
      height: 158px;
      width: 100%; }
    main .oilStepList li p {
      font-size: 13px;
      line-height: 1.7;
      letter-spacing: 0.8px;
      width: 167px;
      float: right;
      padding: 0; }
    main .oilStepListTitle {
      font-size: 18px;
      letter-spacing: 1.9px;
      margin: 0 0 11px; } }
  @media (max-width: 370px) {
    main .oilStepTitle {
      font-size: 18px; }
    main .oilStepTitle span {
      font-size: 30px;
      left: 0; }
    main .oilStepList {
      width: 300px; }
    main .oilStepList li p {
      font-size: 12px;
      width: 160px; }
    main .oilStepListTitle {
      font-size: 18px;
      letter-spacing: 1.9px;
      margin: 0 0 11px; } }
  main .oilAttention {
    padding: 74px 0 26px; }
  main .oilAttentionInner {
    width: 980px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch; }
  main .shopAttentionStuff {
    display: none; }
  main .oilAttentionCaption {
    background: url(../img/attention_caption.png) no-repeat center top 30px;
    font-size: 16px;
    font-weight: 700;
    line-height: 2.06;
    letter-spacing: 1.6px;
    text-align: center;
    color: #ff9000;
    width: 171px;
    padding: 105px 0 0; }
  main .oilAttentionList {
    padding-left: 24px; }
  main .oilAttentionList li {
    font-size: 12px;
    line-height: 1.67;
    text-align: left;
    position: relative; }
  main .oilAttentionList li:before {
    content: '・';
    color: #ff9000;
    position: absolute;
    top: -4px;
    left: -21px;
    font-size: 16px; }
  @media (max-width: 767px) {
    main .oilAttention {
      padding: 0 0 28px; }
    main .oilAttentionInner {
      width: 100%;
      margin: 0 auto;
      display: block;
      position: relative; }
    main .shopAttentionStuff {
      display: block;
      width: 138px;
      position: absolute;
      top: -92px;
      left: 2%; }
    main .oilAttentionCaption {
      background: url(../img/attention_caption_sp.png) no-repeat center top 39px/46px;
      font-size: 12px;
      line-height: 1.25;
      letter-spacing: 1.2px;
      width: 100%;
      padding: 117px 0 20px; }
    main .oilAttentionList {
      width: 100%;
      padding: 0 13px 0 28px; }
    main .oilAttentionList li {
      font-size: 10px;
      line-height: 1.6;
      letter-spacing: 0; }
    main .oilAttentionList li:before {
      left: -20px;
      font-size: 16px; } }
  main .cpSlider {
    padding: 0 0 90px;
    overflow: hidden; }
  main .cpSlider .cpInner {
    width: 1040px;
    margin: 0 auto; }
  main .slick-list {
    overflow: visible; }
  main .slick-slide {
    opacity: 0.2; }
  main .slick-slide.slick-active {
    opacity: 1; }
  main .slick-slider .slick-next {
    right: -45px;
    top: 27%;
    background-image: url(https://www.jms-car.live/st-template/img/arw_slide_right.png);
    background-size: 100% 100%;
    width: 43px;
    height: 43px;
    z-index: 100; }
  main .slick-slider .slick-next.slick-disabled {
    display: none !important; }
  main .slick-slider .slick-next:before {
    content: none; }
  main .slick-slider .slick-prev {
    left: -45px;
    top: 27%;
    background-image: url(https://www.jms-car.live/st-template/img/arw_slide_left.png);
    background-size: 100% 100%;
    width: 43px;
    height: 43px;
    z-index: 100; }
  main .slick-slider .slick-prev.slick-disabled {
    display: none !important; }
  main .slick-slider .slick-prev:before {
    content: none; }
  main .slider {
    width: 100%;
    margin: 46px 0 0; }
  main .slider .slick-slide {
    margin: 0 16px; }
  main .slider img {
    margin-bottom: 13px;
    width: 100%; }
  main .slider p {
    font-size: 18px;
    line-height: 1.44;
    letter-spacing: 0.9px;
    text-align: justify;
    color: #000; }
  main .cpSliderTitle {
    font-size: 18px;
    line-height: 1.5;
    text-align: left;
    color: #000;
    font-weight: 700;
    margin-bottom: 11px; }
  @media (max-width: 767px) {
    main .slick-slide {
      opacity: 1; }
    main .cpSlider {
      padding: 39px 0 73px; }
    main .cpSlider .cpInner {
      width: 100%; }
    main .slider {
      margin: 27px 0 0; }
    main .slider .slick-slide {
      margin: 0 10px; }
    main .slider img {
      margin-bottom: 13px;
      width: 100%; }
    main .slider p {
      font-size: 17px;
      line-height: 1.44;
      letter-spacing: 0.9px; }
    main .cpSliderTitle {
      font-size: 17px;
      line-height: 1.5;
      margin-bottom: 11px; }
    main .slick-slider .slick-next {
      top: 19.2vw;
      right: 4.6667vw;
      width: 7.4667vw;
      height: 7.4667vw; }
    main .slick-slider .slick-prev {
      top: 19.2vw;
      left: 4.6667vw;
      width: 7.4667vw;
      height: 7.4667vw; } }
  main .cpCommonTitleWrap {
    text-align: center; }
  main .cpCommonTitle {
    font-size: 32px;
    line-height: 1;
    letter-spacing: 1.6px;
    text-align: center;
    color: #3C3C3C;
    display: inline-block;
    font-weight: bold;
    position: relative; }
  main .cpCommonTitle:before {
    content: '';
    width: 100%;
    height: 3px;
    background: #3C3C3C;
    position: absolute;
    bottom: -10px;
    left: -4px; }
  main .cpCommonTitle span {
    color: #e6002d; }
  main .cpCommonTitleSlider:before {
    left: 0; }
  @media (max-width: 767px) {
    main .cpCommonTitle {
      font-size: 23px;
      letter-spacing: 1.2px; }
    main .cpCommonTitle:before {
      height: 2px;
      bottom: -8px;
      left: -2px; }
    main .cpCommonTitleSlider:before {
      left: 0; } }
  @media (max-width: 370px) {
    main .cpCommonTitle {
      font-size: 18px; } }
/*# sourceMappingURL=style.css.map */