@charset "UTF-8";
/* CSS Document */

/*改行しない*/
.nowrap {
    white-space: nowrap;
}
/*両端揃え*/
.txt_justify{
    text-align: justify;
}
/*テキスト下揃え*/
.baseline {
    vertical-align: baseline;
}
/*中央揃え*/
.txt_center {
    text-align: center;
}

/*---------- sec01 メインビジュアル ----------*/
.wrap_hero {
    position: relative;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}
.wrap_hero .hero_img img {
    width: 100%;
}
.wrap_hero .hero_copy {
    position: absolute;
    left: 6.11%;/* 88 / 1440 */
    top: 8.85%;/*  62 / 700 */
    margin: 0;
}
.wrap_hero .hero_copy .hero_copy_en {
    margin-left: 0.08em;
}
.wrap_hero .hero_logo {
    position: absolute;
    left: 5.83%;/*  84 / 1440 */
    top: 74.57%;/* 522 / 700 */
    width: 7.15%;/* 103 / 1440 */
    margin: 0;
}

/*---------- sec02 ご購入サポート ----------*/
.support_box {
    background-color: #eeeeef;
}
.support_price {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
}
.support_price_item {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
}
.support_price_item .support_label {
    background-color: #0066b3;
    display: flex;
    align-items: center;
    justify-content: center;
}
.support_price_item .support_value {
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.support_plus {
    display: flex;
    align-items: center;
    justify-content: center;
}
.support_note {
    text-align: center;
    line-height: 1.67;
}
.support_xdrive {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
}

/*---------- sec03 ラインアップ ----------*/
.car_photo {
    display: block;
    position: relative;
}
.car_photo img {
    width: 100%;
}
/*写真内の左上シリーズナンバー*/
.car_photo .series_num {
    position: absolute;
    left: 4.04%;/* 19 / 470 */
    top: 3.98%;/* 14 / 352 */
    margin: 0;
    color: #fff;
    font-weight: 200;
    line-height: 1;
}
/*写真内の注記*/
.car_photo .photo_note {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.55%;
    margin: 0;
    color: #fff;
    text-align: center;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

/*---------- バリューローン ----------*/
.loan_box {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    background-color: #eeeeef;
}
.loan_box .loan_label {
    background-color: #717071;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.loan_box .loan_body {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    flex: 1;
}
.loan_box .loan_value {
    text-align: center;
    white-space: nowrap;
}

/*---------- sec04 Black Package ----------*/
/*メインカットの上端までは白、以降が黒背景*/
.sec04 .bp_body {
    background-color: #0e0000;
    color: #fff;
}
.bp_main {
    position: relative;
}
.bp_main img {
    width: 100%;
}
.bp_main .series_num {
    position: absolute;
    left: 2.35%;/* 24 / 1020 */
    top: 5.6%;/*  28 / 500 */
    margin: 0;
    color: #fff;
    font-weight: 200;
    line-height: 1;
}
.bp_main .bp_wordmark {
    position: absolute;
    left: 2.94%;/* 30 / 1020 */
    right: 0;
    bottom: 3.2%;
    margin: 0;
    color: rgba(255,255,255,.45);
    font-weight: 200;
    line-height: 1;
    letter-spacing: 0.34em;
    white-space: nowrap;
    overflow: hidden;
}
.sec04 .loan_box {
    background-color: #fff;
}
.sec04 .loan_box .loan_value,
.sec04 .loan_box .loan_count {
    color: #262626;
}
.sec04 .note_all_15px,
.sec04 .bp_photo_note {
    color: #fff;
}

/*写真キャプション（本文注釈より一段小さく）*/
.hero_note,
.bp_photo_note {
    font-size: 14px;
    letter-spacing: 0.02em;
}

/*---------- sec05 注釈 ----------*/
.wrap_note {
    border-top: #e6e6e6 1px solid;
}

/*---------- sec06 ディーラー ----------*/
.sec06 {
    background-color: #f2f2f2;
    max-width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wrap_footer {
    background-color: #fff;
    max-width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-top: 1px solid #000;
}
.dealer_shop_name {
    display: flex;
    align-items: center;
}
.dealer_shop_name .icon_m {
    width: 2.4em;
    margin-left: 1.35em;
    margin-right: 0;
}
.dealer_txt_all_16px table {
    border-collapse: collapse;
}
.dealer_txt_all_16px td {
    vertical-align: top;
}
.dealer_txt_all_16px td:first-child {
    padding-right: 0.5em;
    white-space: nowrap;
}

/*---------- ボタン ----------*/
.button_gray {
    display: inline-block;
    width: 100%;
    text-align: center;
    cursor: pointer;
    margin-top: auto;
    background-color: #4d4d4d;
    color: #fff;
    /*アニメーションの指定*/
    transition: all .2s;
}
.button_gray:hover,/*ボタンの色が変わる*/
.button_gray:active {
    background-color: #262626;
}

.button_line {
    display: inline-block;
    width: 100%;
    text-align: center;
    outline: #262626 1px solid;
    background-color: #fff;
}
.button_line:hover,/*ボタンの色が変わる*/
.button_line:active {
    outline: #262626 2px solid;
}

/*footer コピーライト*/
.footer_copyright {
	color: #262626;
	display: block;
	text-align: center;
	padding-top: 26px;
	padding-bottom: 30px;
}

/*page top リンク */
.top_link {
    display: block;
    text-align: right;
}
#page_top a{
    color: #262626;
    cursor: pointer;
    display: inline-block;
    position: relative;
    text-align: right;
    text-decoration: none;
    font-size: 1.6rem;
    line-height: 2.9rem;
    padding-right: 3em;
    /*アニメーションの指定*/
    transition: all .2s;
}
#page_top a::after {
    content: '';
    width: 0.8em;
    height: 0.8em;
    border: 0;
    border-top: solid 1px #262626;
    border-right: solid 1px #262626;
    position: absolute;
    top: 50%;
    right: 0.9em;
    margin-top: -0.2em;
    transform: rotate(315deg);
    transition: all .2s;
}
#page_top a:hover,
#page_top a:active {
    color: #666;
}
#page_top a:hover::after,
#page_top a:active::after{
    border-top: solid 1px #666;
    border-right: solid 1px #666;
}