@charset "UTF-8";
@import url("fonts/stylesheet.css");

/* CSS Document */

img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

html {
	font-size: 62.5%;
}
body {
    font-family: "BMW Type", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "YuGothic", "Yu Gothic", "meiryo", "Helvetica", "arial", sans-serif;
    font-size: 1.6rem;
    font-weight: normal;
	line-height: 1.7;
	font-feature-settings: "palt" 1;
    -webkit-font-feature-settings: "palt"1;
    -moz-font-feature-settings: "palt"1;
	letter-spacing: 0.05em;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
    background-color: #fff;
	color: #262626;
}


/*可変テキスト
font-size: calc(X + ((1vw – Y)*Z));
X 文字サイズに指定したい最小値
Y 最小値を適用したい横幅の1%
Z （最大値を適用したい横幅の1% – 最小値を適用したい横幅の1%）× ◯ = 文字サイズの最大値と最小値の差
    360px-1245pxの場合 8.85
サイズ1違いが0.113
*/

/*---------- sec01 メインビジュアル ----------*/
/*可変 ヒーローコピー*/
.hero_copy {
    font-size: 24px;
    font-weight: 200;
    line-height: 1.2;
    letter-spacing: 0.04em;
    color: #fff;
}
@media (min-width: 360px) {
  .hero_copy {
    font-size: calc(24px + ((1vw - 3.6px)*4.972));
  }
}
@media (min-width: 1245px) {
  .hero_copy {
    font-size: 68px;
  }
}
/*可変 リード上の青見出し*/
.title_sub {
    font-size: 23px;
    line-height: 1.3;
    font-weight: 700;
    color: #0066b3;
    letter-spacing: -0.035em;
}
@media (min-width: 360px) {
  .title_sub {
    font-size: calc(23px + ((1vw - 3.6px)*3.729));
  }
}
@media (min-width: 1245px) {
  .title_sub {
    font-size: 56px;
  }
}
.title_sub .kome {
    font-size: 0.58em;
}
/*可変 30万円分*/
.title_main {
    font-size: 40px;
    line-height: 1.15;
    font-weight: 700;
    color: #0066b3;
    letter-spacing: -0.03em;
}
@media (min-width: 360px) {
  .title_main {
    font-size: calc(40px + ((1vw - 3.6px)*6.780));
  }
}
@media (min-width: 1245px) {
  .title_main {
    font-size: 100px;
  }
}
/*可変 オプション購入サポート*/
.title_main .title_main_sub {
    font-size: 25px;
}
@media (min-width: 360px) {
  .title_main .title_main_sub {
    font-size: calc(25px + ((1vw - 3.6px)*4.068));
  }
}
@media (min-width: 1245px) {
  .title_main .title_main_sub {
    font-size: 61px;
  }
}
/*可変 リード文*/
.lead {
    font-size: 15px;
    line-height: 1.55;
    font-weight: 700;
    text-align: center;
    letter-spacing: -0.02em;
}
@media (min-width: 360px) {
  .lead {
    font-size: calc(15px + ((1vw - 3.6px)*1.243));
  }
}
@media (min-width: 1245px) {
  .lead {
    font-size: 26px;
  }
}

/*---------- sec02 ご購入サポート ----------*/
/*可変 ボックス内ラベル*/
.support_label {
    font-size: 13px;
    line-height: 1.35;
    font-weight: 700;
    color: #fff;
    text-align: center;
}
@media (min-width: 360px) {
  .support_label {
    font-size: calc(13px + ((1vw - 3.6px)*0.226));
  }
}
@media (min-width: 1245px) {
  .support_label {
    font-size: 15px;
  }
}
/*可変 ボックス内の金額*/
.support_value {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0;
}
@media (min-width: 360px) {
  .support_value {
    font-size: calc(24px + ((1vw - 3.6px)*2.260));
  }
}
@media (min-width: 1245px) {
  .support_value {
    font-size: 44px;
  }
}
.support_value .unit {
    font-size: 0.57em;
}
.support_value .kome {
    font-size: 0.4em;
    vertical-align: super;
}
.support_value .tsukizuki {
    font-size: 0.4em;
    display: inline-block;
    line-height: 1.05;
    text-align: center;
    vertical-align: 0.1em;
    letter-spacing: 0;
}
/*可変 プラス記号*/
.support_plus {
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
}
@media (min-width: 360px) {
  .support_plus {
    font-size: calc(30px + ((1vw - 3.6px)*3.955));
  }
}
@media (min-width: 1245px) {
  .support_plus {
    font-size: 65px;
  }
}
/*可変 xDrive見出し*/
.support_headline {
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
    letter-spacing: 0;
}
@media (min-width: 360px) {
  .support_headline {
    font-size: calc(18px + ((1vw - 3.6px)*0.678));
  }
}
@media (min-width: 1245px) {
  .support_headline {
    font-size: 24px;
  }
}

/*---------- sec03 ラインアップ ----------*/
/*可変 キャッチコピー*/
.catch {
    font-size: 21px;
    line-height: 1.4;
    font-weight: 200;
    text-align: center;
}
@media (min-width: 360px) {
  .catch {
    font-size: calc(21px + ((1vw - 3.6px)*2.825));
  }
}
@media (min-width: 1245px) {
  .catch {
    font-size: 46px;
  }
}
/*可変 車種見出し*/
h3 {
    font-size: 19px;
    line-height: 1.3;
    font-weight: 200;
    letter-spacing: 0;
}
@media (min-width: 360px) {
  h3 {
    font-size: calc(19px + ((1vw - 3.6px)*1.469));
  }
}
@media (min-width: 1245px) {
  h3 {
    font-size: 32px;
  }
}
/*可変 車種名*/
.car_model {
    font-size: 19px;
    line-height: 1.3;
    font-weight: 200;
    letter-spacing: 0;
}
@media (min-width: 360px) {
  .car_model {
    font-size: calc(19px + ((1vw - 3.6px)*1.130));
  }
}
@media (min-width: 1245px) {
  .car_model {
    font-size: 29px;
  }
}
/*可変 車両本体価格*/
.car_price {
    font-size: 19px;
    line-height: 1.3;
    font-weight: 200;
    letter-spacing: 0.02em;
}
@media (min-width: 360px) {
  .car_price {
    font-size: calc(19px + ((1vw - 3.6px)*0.904));
  }
}
@media (min-width: 1245px) {
  .car_price {
    font-size: 27px;
  }
}
.car_price .car_price_note {
    font-size: 0.60em;
}

/*---------- sec04 Black Package ----------*/
/*可変*/
.bp_catch {
    font-size: 20px;
    line-height: 1.4;
    font-weight: 200;
    text-align: center;
    letter-spacing: 0.08em;
}
@media (min-width: 360px) {
  .bp_catch {
    font-size: calc(20px + ((1vw - 3.6px)*2.034));
  }
}
@media (min-width: 1245px) {
  .bp_catch {
    font-size: 38px;
  }
}
/*可変*/
.bp_lead {
    font-size: 15px;
    line-height: 1.75;
    font-weight: 200;
    text-align: center;
    letter-spacing: 0.04em;
}
@media (min-width: 360px) {
  .bp_lead {
    font-size: calc(15px + ((1vw - 3.6px)*0.452));
  }
}
@media (min-width: 1245px) {
  .bp_lead {
    font-size: 19px;
  }
}
/*可変*/
.bp_model {
    font-size: 22px;
    line-height: 1.3;
    font-weight: 200;
    letter-spacing: 0;
}
@media (min-width: 360px) {
  .bp_model {
    font-size: calc(22px + ((1vw - 3.6px)*1.582));
  }
}
@media (min-width: 1245px) {
  .bp_model {
    font-size: 36px;
  }
}

/*Black Package のバリューローンは一回り大きい*/
.sec04 .loan_label {
    font-size: 16px;
}
@media (min-width: 360px) {
  .sec04 .loan_label {
    font-size: calc(16px + ((1vw - 3.6px)*0.678));
  }
}
@media (min-width: 1245px) {
  .sec04 .loan_label {
    font-size: 22px; 
  }
}
.sec04 .loan_value {
    font-size: 25px;
}
@media (min-width: 360px) {
  .sec04 .loan_value {
    font-size: calc(25px + ((1vw - 3.6px)*1.808));
  }
}
@media (min-width: 1245px) {
  .sec04 .loan_value {
    font-size: 41px; 
  }
}
.sec04 .loan_count {
    font-size: 13px;
}
@media (min-width: 360px) {
  .sec04 .loan_count {
    font-size: calc(13px + ((1vw - 3.6px)*0.452));
  }
}
@media (min-width: 1245px) {
  .sec04 .loan_count {
    font-size: 17px; 
  }
}

/*---------- バリューローン ----------*/
/*可変*/
.loan_label {
    font-size: 14px;
    line-height: 1.25;
    font-weight: 700;
    color: #fff;
    text-align: center;
}
@media (min-width: 360px) {
  .loan_label {
    font-size: calc(14px + ((1vw - 3.6px)*0.565));
  }
}
@media (min-width: 1245px) {
  .loan_label {
    font-size: 19px;
  }
}
.loan_label .loan_label_note {
    font-size: 0.58em;
    font-weight: 700;
    display: block;
    letter-spacing: 0;
}
/*可変*/
.loan_value {
    font-size: 21px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: 0;
    text-align: center;
}
@media (min-width: 360px) {
  .loan_value {
    font-size: calc(21px + ((1vw - 3.6px)*1.469));
  }
}
@media (min-width: 1245px) {
  .loan_value {
    font-size: 34px;
  }
}
.loan_value .unit {
    font-size: 0.65em;
}
.loan_value .kome {
    font-size: 0.38em;
    vertical-align: super;
}
.loan_value .tsukizuki {
    font-size: 0.47em;
}
/*可変*/
.loan_count {
    font-size: 11px;
    line-height: 1.35;
    font-weight: 200;
    letter-spacing: 0.02em;
}
@media (min-width: 360px) {
  .loan_count {
    font-size: calc(11px + ((1vw - 3.6px)*0.339));
  }
}
@media (min-width: 1245px) {
  .loan_count {
    font-size: 14px;
  }
}

/*---------- sec06 ディーラー ----------*/
/*可変*/
.dealer_label {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 200;
}
@media (min-width: 360px) {
  .dealer_label {
    font-size: calc(14px + ((1vw - 3.6px)*0.226));
  }
}
@media (min-width: 1245px) {
  .dealer_label {
    font-size: 16px;
  }
}
/*可変*/
.dealer_name {
    font-size: 33px;
    line-height: 1.4;
    font-weight: 700;
}
@media (min-width: 360px) {
  .dealer_name {
    font-size: calc(33px + ((1vw - 3.6px)*1.356));
  }
}
@media (min-width: 1245px) {
  .dealer_name {
    font-size: 45px;
  }
}
.dealer_name_sub {
    font-size: 15px;
    margin-left: 1.2em;
    font-weight: 200;
}
/*可変*/
.dealer_shop_name {
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
}
@media (min-width: 360px) {
  .dealer_shop_name {
    font-size: calc(19px + ((1vw - 3.6px)*0.565));
  }
}
@media (min-width: 1245px) {
  .dealer_shop_name {
    font-size: 24px;
  }
}

/*---------- 共通テキスト ----------*/
/*ボタンテキスト txtmin14-16*/
.button_txt{
        font-size: 14px;
        padding-bottom: 0.8em;
        padding-top: 0.8em;
        font-weight: 700;
}
@media (min-width: 640px) {
  .button_txt{
    font-size: calc(14px + ((1vw - 6.4px)*0.285));/*可変*/
  }
}
@media (min-width: 1340px) {
  .button_txt{
    font-size: 16px;
  }
}

.txt_all_17px{
    font-size: 17px;
    line-height: 1.55;
    font-weight: 200;
	letter-spacing: 0.03em;
    text-align: justify;
}
.note_all_15px {
    font-size: 15px;
    line-height: 1.45;
    font-weight: 200;
	letter-spacing: 0.03em;
    text-align: justify;
}
.dealer_txt_all_16px{
    font-size: 16px;
    line-height: 1.55;
    font-weight: 200;
	letter-spacing: 0.02em;
}
