@charset 'utf-8';


/* hmj-anchor */
.hmj-anchor {
	display: table;
	height: 100%;
	position: fixed;
	top: 0;
	right: 12px;
	z-index: 10000;
}
@media screen and (max-width:1076px) {
	#hmj-anchor {display: none !important;}
}
.hmj-anchor.stuck {
	width: 36px;
	left: inherit !important;
}
.hmj-anchor-list {
	list-style: none;
	display: table-cell;
	padding: 0 0 12px;
	vertical-align: bottom;
}
.hmj-anchor-list > li {
	width: 36px;
	height: 36px;
	margin-top: 2px;
	margin-bottom: 2px;
}
.hmj-anchor-list > li > a {
	display: block;
	width: 36px;
	height: 36px;
	background-position: 0 0;
	background-repeat: no-repeat;
	font-size: 0;
	line-height: 0;
}
.hmj-anchor-list .top > a {
	background-image: url(/motor-lineup/layout/contents/201304/img/btn-anchor-top.png);
}
.hmj-anchor-list .list > a {
	background-image: url(/motor-lineup/layout/contents/201304/img/btn-anchor-list.png);
}
.hmj-anchor-list .list > a.close {
	background-image: url(/motor-lineup/layout/contents/201304/img/btn-anchor-close.png);
}
.hmj-anchor-list .bottom > a {
	background-image: url(/motor-lineup/layout/contents/201304/img/btn-anchor-bottom.png);
}
.hmj-anchor-list .list {
	position: relative;
}
.hmj-anchor-list .list ul {
	display: none;
	list-style: none;
	width: auto;
	height: auto;
	padding: 0;
	position: absolute;
	right: 48px;
	bottom: 0;
	border: 1px solid #cecece;
	border-radius: 4px;
	background-color: rgba(241,241,241,0.9);
	box-shadow: 0 0 8px rgba(0,0,0,0.2);
}
.hmj-anchor-list .list li {
	border-bottom: 1px solid #cecece;
	white-space: nowrap;
}
.hmj-anchor-list .list li a {
	display: block;
	padding: 8px 12px;
	font-weight: bold;
	font-size: 116.667%;
}
.hmj-anchor-list .list ul.open {
	display: block;
}


/*Wide*/

@media screen and (min-width:738px) {

    .sp {
        display: none;
    }

    /* ------------------------------
 * core.css
 * Mar 2, 2015
 * Honda Mortorcycle Core Style
------------------------------ */

    /* ------------------------------
 * OVERWRITE
------------------------------ */

    body {
        min-width: 1000px !important;
        font-family: 'Hiragino kaku Gothic ProN', 'Meiryo', 'MS PGothic', sans-serif !important;
        font-size: 75% !important;
    }

    #contents {
        width: 100% !important;
    }

    /* ------------------------------
 * INITIALIZE
------------------------------ */

    article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
        display: block;
    }

    audio, canvas, video {
        display: inline-block;
    }

    audio:not([controls]) {
        display: none;
        height: 0;
    }

    [hidden] {
        display: none;
    }

    html {
        height: 100%;
        overflow-y: scroll;
        font-family: sans-serif;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    }

    body {
        height: 100%;
        margin: 0;
        position: relative;
    }

    a:focus {
        outline: thin dotted;
    }

    a:active, a:hover {
        outline: 0;
    }

    h1, h2, h3, h4, h5, h6 {
        margin: 0;
    }

    p, ul, ol, dl, dd {
        margin: 0;
    }

    abbr[title] {
        border-bottom: 1px dotted;
    }

    b, strong {
        font-weight: bold;
    }

    address, cite, dfn, em {
        font-style: normal;
    }

    hr {
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        height: 0;
    }

    mark {
        background: #ff0;
        color: #000;
    }

    code, kbd, pre, samp {
        font-family: monospace, serif;
        font-size: 1em;
    }

    pre {
        white-space: pre-wrap;
    }

    q {
        quotes: none;
    }

    small {
        font-size: 80%;
    }

    sub, sup {
        position: relative;
        font-size: 75%;
        line-height: 0;
        vertical-align: baseline;
    }

    sup {
        top: -0.5em;
    }

    sub {
        bottom: -0.25em;
    }

    img {
        border: 0;
        vertical-align: middle;
    }

    svg:not(:root) {
        overflow: hidden;
    }

    figure {
        margin: 0;
    }

    fieldset {
        margin: 0;
        padding: 0;
        border: none;
    }

    legend {
        padding: 0;
        border: 0;
    }

    button, input, select, textarea {
        margin: 0;
        font-family: inherit;
        font-size: 100%;
    }

    button, input {
        line-height: normal;
    }

    button, select {
        text-transform: none;
    }

    button, html input[type="button"], input[type="reset"], input[type="submit"] {
        -webkit-appearance: button;
        cursor: pointer;
    }

    button[disabled], html input[disabled] {
        cursor: default;
    }

    input[type="checkbox"], input[type="radio"] {
        box-sizing: border-box;
        padding: 0;
    }

    input[type="search"] {
        -webkit-appearance: textfield;
        -moz-box-sizing: content-box;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }

    input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
        -webkit-appearance: none;
    }

    button::-moz-focus-inner, input::-moz-focus-inner {
        padding: 0;
        border: 0;
    }

    textarea {
        overflow: auto;
        vertical-align: top;
        resize: vertical;
    }

    table {
        margin: 0;
        border-collapse: collapse;
        border-spacing: 0;
    }

    caption {
        text-align: left;
    }

    tbody th, tbody td {
        font-weight: normal;
        text-align: left;
        vertical-align: top;
    }

    /* ------------------------------
 * HELPER
------------------------------ */

    * clearfix */ .clearfix, .parent, .hmj-contents {
        *zoom: 1;
    }

    .clearfix:before, .clearfix:after,
    .parent:before, .parent:after,
    .hmj-contents:before, .hmj-contents:after {
        display: table;
        content: ' ';
    }

    .clearfix:after, .parent:after, .hmj-contents:after {
        clear: both;
    }

    /* float */

    .prepend {
        float: left;
        *display: inline;
    }

    .append {
        float: right;
        *display: inline;
    }

    /* inline-block */

    .boxes {
        display: table;
        table-layout: fixed;
        width: 100%;
        word-spacing: -1em;
    }

    .box {
        display: inline-block;
        vertical-align: top;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    /* table */

    .row {
        display: table;
        width: 100%;
        table-layout: fixed;
    }

    .cell {
        display: table-cell;
        vertical-align: middle;
        *display: inline;
        *zoom: 1;
    }

    /* width */

    .col1-1 {
        width: 100%;
    }

    .col1-2 {
        width: 50%;
    }

    .col1-3 {
        width: 33.333%;
    }

    .col2-3 {
        width: 66.666%;
    }

    .col1-4 {
        width: 25%;
    }

    .col3-4 {
        width: 75%;
    }

    .col1-5 {
        width: 20%;
    }

    .col2-5 {
        width: 40%;
    }

    .col3-5 {
        width: 30%;
    }

    .col4-5 {
        width: 80%;
    }

    .col1-6 {
        width: 16.666%;
    }

    .col5-6 {
        width: 83.333%;
    }

    /* spacing */

    .ptn, .pvn, .pan {
        padding-top: 0;
    }

    .pts, .pvs, .pas {
        padding-top: 5px;
    }

    .ptm, .pvm, .pam {
        padding-top: 10px;
    }

    .ptl, .pvl, .pal {
        padding-top: 20px;
    }

    .prn, .phn, .pan {
        padding-right: 0;
    }

    .prs, .phs, .pas {
        padding-right: 5px;
    }

    .prm, .phm, .pam {
        padding-right: 10px;
    }

    .prl, .phl, .pal {
        padding-right: 20px;
    }

    .pbn, .pvn, .pan {
        padding-bottom: 0;
    }

    .pbs, .pvs, .pas {
        padding-bottom: 5px;
    }

    .pbm, .pvm, .pam {
        padding-bottom: 10px;
    }

    .pbl, .pvl, .pal {
        padding-bottom: 20px;
    }

    .pln, .phn, .pan {
        padding-left: 0;
    }

    .pls, .phs, .pas {
        padding-left: 5px;
    }

    .plm, .phm, .pam {
        padding-left: 10px;
    }

    .pll, .phl, .pal {
        padding-left: 20px;
    }

    .mtn, .mvn, .man {
        margin-top: 0;
    }

    .mts, .mvs, .mas {
        margin-top: 5px;
    }

    .mtm, .mvm, .mam {
        margin-top: 10px;
    }

    .mtl, .mvl, .mal {
        margin-top: 20px;
    }

    .mrn, .mhn, .man {
        margin-right: 0;
    }

    .mrs, .mhs, .mas {
        margin-right: 5px;
    }

    .mrm, .mhm, .mam {
        margin-right: 10px;
    }

    .mrl, .mhl, .mal {
        margin-right: 20px;
    }

    .mbn, .mvn, .man {
        margin-bottom: 0;
    }

    .mbs, .mvs, .mas {
        margin-bottom: 5px;
    }

    .mbm, .mvm, .mam {
        margin-bottom: 10px;
    }

    .mbl, .mvl, .mal {
        margin-bottom: 20px;
    }

    .mln, .mhn, .man {
        margin-left: 0;
    }

    .mls, .mhs, .mas {
        margin-left: 5px;
    }

    .mlm, .mhm, .mam {
        margin-left: 10px;
    }

    .mll, .mhl, .mal {
        margin-left: 20px;
    }

    .mra, .mha {
        margin-right: auto;
    }

    .mla, .mha {
        margin-left: auto;
    }

    .mtxl {
        margin-top: 40px;
    }

    .mbxl {
        margin-bottom: 40px;
    }

    /* alignment */

    .ltr {
        text-align: left;
    }

    .ctr {
        text-align: center;
    }

    .rtl {
        text-align: right;
    }

    .top {
        vertical-align: top;
    }

    .mid {
        vertical-align: middle;
    }

    .btm {
        vertical-align: bottom;
    }

    /* typography */

    body {
        font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic W3', 'Meiryo', 'MS PGothic', sans-serif;
    }

    a:link, a:visited {
        color: #1275a8;
        text-decoration: none;
    }

    a:hover, a:active {
        color: #1275a8;
        text-decoration: underline;
    }

    .attention {
        color: #c00 !important;
    }

    .note {
        list-style: none;
        padding-left: 1em !important;
        color: #777;
        font-size: 80%;
        text-indent: -1em;
    }

    .small {
        color: #777;
        font-size: 80%;
    }

    .footnote {
        color: #777;
        font-size: 80%;
    }

    .footnote th {
        padding-right: 0.8em;
        white-space: nowrap;
    }

    .label {
        border: 1px solid #cecece;
        border-radius: 2px;
        background-color: #f1f1f1;
        background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(187, 187, 187, 0.1));
        background-origin: border-box;
        text-shadow: 0 0 1px rgba(255, 255, 255, 0.2);
    }

    .label > span {
        display: block;
        padding: 0.4em 0.4em 0.3em;
        border: 1px solid #fff;
        border-radius: 2px;
    }

    .indent {
        padding-left: 1em;
        text-indent: -1em;
    }

    ul.indent {
        list-style: none;
        padding-left: 0;
        text-indent: 0;
    }

    ul.indent li {
        list-style: none;
        padding-left: 1em;
        text-indent: -1em;
    }

    .uline {
        text-decoration: underline;
    }

    /* ------------------------------
 * COMPONENT
------------------------------ */

    .hmj-contents .btn,
    .btn-primary,
    .btn-important {
        display: inline-block;
        padding: 0.6em 2em 0.4em;
        border: 1px solid #bbb;
        border-radius: 28px;
        color: #fff !important;
        background-color: #666;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-bg-gradiation.png);
        background-position: 0 50%;
        background-repeat: repeat-x;
        font-weight: bold;
        font-size: 14px;
        letter-spacing: -0.05em;
        line-height: 1;
        text-align: center;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
        -webkit-transition: 0.15s;
        -moz-transition: 0.15s;
        -ms-transition: 0.15s;
        transition: 0.15s;
        *display: inline;
        *zoom: 1;
    }

    .hmj-document .btn:hover, .hmj-document .btn:focus, .hmj-document .btn:active .btn-primary:hover, .btn-primary:focus, .btn-primary:active,
    .btn-important:hover, .btn-important:focus, .btn-important:active {
        background-color: #444;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-bg-gradiation-invert.png);
        text-decoration: none !important;
        text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.4);
        box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
    }

    .btn-primary {
        border-color: #039;
        background-color: #06c;
    }

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background-color: #069;
    }

    .btn-important {
        border-color: #900;
        background-color: #c00;
    }

    .btn-important:hover, .btn-important:focus, .btn-important:active {
        background-color: #b00;
    }

    .stuck {
        width: 100%;
        position: fixed !important;
        top: 0;
        left: 0;
        z-index: 10000;
    }

    .hmj-slide {
        position: relative;
        overflow: hidden;
    }

    .hmj-slide > img {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
    }

    .hmj-slide img.current {
        z-index: 2;
    }

    .hmj-slide .nav {
        display: block;
    }

    .hmj-slide .nav li {
        display: inline-block;
        position: absolute;
        top: 50%;
        z-index: 100;
    }

    .hmj-slide .nav a {
        display: block;
        width: 60px;
        height: 60px;
        background-position: 0 0;
        background-repeat: no-repeat;
        overflow: hidden;
        font-size: 0;
        line-height: 0;
    }

    .hmj-slide .nav a:hover,
    .hmj-slide .nav a:focus {
        background-position: 0 100%;
    }

    .hmj-slide .nav .prev {
        left: 0;
    }

    .hmj-slide .nav .next {
        right: 0;
    }

    .hmj-slide .nav .prev a {
        background-image: url(/motor-lineup/layout/contents/201901/img/a-btn-prev.png);
    }

    .hmj-slide .nav .next a {
        background-image: url(/motor-lineup/layout/contents/201901/img/a-btn-next.png);
    }

    .hmj-slide .pagenation {
        display: table;
        table-layout: fixed;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        text-align: center;
        word-spacing: -1em;
        z-index: 100;
    }

    .hmj-slide .pagenation a {
        display: inline-block;
        width: 12px;
        height: 12px;
        margin: 0 4px;
        border-radius: 12px;
        border: 1px solid #bbb;
        background-color: #d9d9d9;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-bg-gradiation-min.png);
        background-position: 0 0;
        background-repeat: repeat-x;
        font-size: 0;
        line-height: 0;
        word-spacing: normal;
        -webkit-transition: 0.1s;
        -moz-transition: 0.1s;
        -ms-transition: 0.1s;
        transition: 0.1s;
    }

    .hmj-slide .pagenation a:hover {
        border-color: #999;
        background-color: #cecece;
    }

    .hmj-slide .pagenation .current {
        border-color: #900;
        background-color: #c00;
    }

    /*SUPER CUB Anniversary*/

    .cub_aniv {
        position: absolute;
        z-index: 3;
    }

    /* ticker */

    #htmj-ticker {
        display: n one;


        /* placeholder */
    }

    .hmj-topics {
        width: 100%;
        margin-top: -7px;
        padding-top: 12px;
        padding-bottom: 12px;
        border-bottom: 1px solid #cecece;
        background-color: #f1f1f1;
        background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.1));
        box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    }

    .hmj-topics .articles {
        width: 980px;
        height: 1.5em;
        margin: auto;
        overflow: hidden;
    }

    .hmj-topics ul {
        list-style: none;
        width: 100%;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .hmj-topics .articles li {
        display: table;
        width: 100%;
        height: 1.285em;
        position: relative;
        overflow: hidden;
        font-weight: bold;
        font-size: 116.667%;
        line-height: 1.285;
        word-spacing: -1em;
        white-space: nowrap;
        *display: block;
    }

    .hmj-topics .articles .date,
    .hmj-topics .articles .category,
    .hmj-topics .articles .text,
    .hmj-topics .articles a {
        display: inline-block;
        text-align: left;
        vertical-align: middle;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .hmj-topics .articles .date {
        padding-right: 10px;
    }

    .hmj-topics .articles li .text,
    .hmj-topics .articles li a {
        padding-right: 12px;
        padding-left: 12px;
    }

    #hmj-overlay.disabled,
    #hmj-modal.disabled {
        display: none;
    }

    #hmj-overlay {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        background-color: #000;
        z-index: 99997;
        opacity: 0.8;
    }

    #hmj-modal {
        display: table;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 99998;
    }

    #hmj-modal.stuck {
        position: fixed;
    }

    #hmj-modal-window {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
        *layout-grid-line: 100%;
    }

    #hmj-modal-box {
        position: relative;
        display: inline-block;
        margin: auto;
        padding: 20px;
        background-color: #fff;
        *display: inline;
        *zoom: 1;
    }

    #hmj-modal-contents {
        position: relative;
        z-index: 99999;
    }

    #hmj-modal-box .close,
    #hmj-modal-box .next,
    #hmj-modal-box .prev {
        position: absolute;
        z-index: 99999;
        background-position: 50% 50%;
        background-repeat: no-repeat;
    }

    #hmj-modal-box .close span,
    #hmj-modal-box .next span,
    #hmj-modal-box .prev span {
        position: absolute;
        top: -1px;
        display: block;
        width: 1px;
        height: 1px;
        overflow: hidden;
    }

    #hmj-modal-box .close {
        top: 30px;
        right: 30px;
        width: 28px;
        height: 28px;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-btn-modal-close.png);
    }

    #hmj-modal-box .next,
    #hmj-modal-box .prev {
        top: 50%;
        width: 50px;
        height: 45px;
    }

    #hmj-modal-box .next {
        right: 20px;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-btn-modal-next.png);
    }

    #hmj-modal-box .prev {
        left: 20px;
        background-image: url(/motor-lineup/layout/contents/201901/img/a-btn-modal-prev.png);
    }

    /**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */

    #jquery-overlay {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99998;
        width: 100%;
        height: 500px;
    }

    #jquery-lightbox {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 99999;
        text-align: center;
        line-height: 0;
    }

    #jquery-lightbox a img {
        border: none;
    }

    #lightbox-container-image-box {
        position: relative;
        background-color: #fff;
        width: 250px;
        height: 250px;
        margin: 0 auto;
    }

    #lightbox-container-image {
        padding: 10px;
    }

    #lightbox-loading {
        position: absolute;
        top: 40%;
        left: 0%;
        height: 25%;
        width: 100%;
        text-align: center;
        line-height: 0;
    }

    #lightbox-nav {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 10;
    }

    #lightbox-container-image-box > #lightbox-nav {
        left: 0;
    }

    #lightbox-nav a {
        outline: none;
    }

    #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
        width: 49%;
        height: 100%;
        zoom: 1;
        display: block;
    }

    #lightbox-nav-btnPrev {
        left: 0;
        float: left;
    }

    #lightbox-nav-btnNext {
        right: 0;
        float: right;
    }

    #lightbox-container-image-data-box {
        font: 10px Verdana, Helvetica, sans-serif;
        background-color: #fff;
        margin: 0 auto;
        line-height: 1.4em;
        overflow: auto;
        width: 100%;
        padding: 0 10px 0;
    }

    #lightbox-container-image-data {
        padding: 0 10px;
        color: #666;
    }

    #lightbox-container-image-data #lightbox-image-details {
        width: 70%;
        float: left;
        text-align: left;
    }

    #lightbox-image-details-caption {
        font-weight: bold;
    }

    #lightbox-image-details-currentNumber {
        display: block;
        clear: left;
        padding-bottom: 1.0em;
    }

    #lightbox-secNav-btnClose {
        width: 66px;
        float: right;
        padding-bottom: 0.7em;
    }

    .btn-sticker {
        position: absolute;
        left: 324px;
    }

    /* ------------------------------
 * LAYOUT
------------------------------ */

    /* common
------------------------------ */

    .hmj-contents {
        width: 980px;
        margin-right: auto;
        margin-left: auto;
    }

/* hmj-nav
------------------------------ */
#hmj-nav {
	position: relative;
	padding-bottom: 7px;
	background: url(/motor-lineup/layout/contents/201304/img/a-bg-nav.png) repeat-x 0 100%;
}
.hmj-nav {
	border-top: 1px solid #e1e1e1;
	border-bottom: 1px solid #cecece;
	background-color: #f1f1f1;
	background-color: rgba(241,241,241,0.9);
}
.hmj-nav .hmj-contents {
	*display: block;
}
.hmj-nav .logo {
	float: left;
	width: 20%;
	*display: inline;
}
.hmj-nav .logo img {
	vertical-align: middle;
}
.hmj-nav .nav {
	float: left;
	list-style: none;
	display: table;
	table-layout: fixed;
	width: 80%;
	padding: 5px 0;
	text-align: right;
	word-spacing: -1em;
	*display: inline;
}
.hmj-nav .nav li {
	display: inline-block;
	/* width: 121px; */
	border: 1px solid #c3c3c3;
	border-left: 0;
	vertical-align: middle;
	word-spacing: normal;
	*display: inline;
	*zoom: 1;
}
.hmj-nav .nav li:first-child {
	border: 1px solid #c3c3c3;
}
.hmj-nav .nav a {
	display: block;
	/* width: 100px; */
	padding: 10px 15px;
	border-left: 1px solid #fff;
	color: #000;
	background-color: #f1f1f1;
	background-image: url(/motor-lineup/layout/contents/201304/img/a-bg-gradiation.png);
	background-repeat: repeat-x;
	background-position: 0 0;
	font-weight: bold;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	-webkit-transition: 0.2s;
	   -moz-transition: 0.2s;
	    -ms-transition: 0.2s;
	        transition: 0.2s;
	}
	.hmj-nav .nav a:hover,
	.hmj-nav .nav a:focus,
	.hmj-nav .nav a:active {
		background-color: #dedede;
		background-image: url(/motor-lineup/layout/contents/201304/img/a-bg-gradiation-invert.png);
		-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.1);
		box-shadow: 0 0 4px rgba(0,0,0,0.1);
		text-shadow: 0 0 4px rgba(255,255,255,0.8);
	}
	.hmj-nav .nav a.current {
		background-color: #dedede;
		background-image: url(/motor-lineup/layout/contents/201304/img/a-bg-gradiation-invert.png);
		-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.1);
		box-shadow: inset 0 0 4px rgba(0,0,0,0.1);
		text-shadow: 0 0 4px rgba(255,255,255,0.8);
	}

/* nav_top
------------------------------ */
.hmj-nav .nav .nav_top {
    height: 30px;
    border: none;
    background-color: #f2f2f2;
    background-image: none !important;
    border-right: 1px solid #c3c3c3;
}

.hmj-nav .nav .nav_top a {
    border: none;
    background-color: #f2f2f2;
    background-color: #f2f2f2 !important;
    background-image: none !important;
}
.hmj-nav .nav .nav_top a.current {
    box-shadow: none;
}

.hmj-nav .nav .nav_top a:hover,
.hmj-nav .nav .nav_top a:focus,
.hmj-nav .nav .nav_top a:active {
    border: none;
    background-color: #f2f2f2;
    background-image: none !important;
    box-shadow: none;
    color: #d2d2d1;
}


/* hmj-nav-flat
------------------------------ */
#hmj-nav-flat {
	position: relative;
	padding-bottom: 7px;
	background: url(/motor-lineup/layout/contents/201304/img/a-bg-nav.png) repeat-x 0 100%;
}
.hmj-nav-flat {
	border-top: 1px solid #e1e1e1;
	border-bottom: 1px solid #cecece;
	background-color: #f1f1f1;
	background-color: rgba(241,241,241,0.9);
}
.hmj-nav-flat .hmj-contents {
	*display: block;
}
.hmj-nav-flat .logo {
	float: left;
	width: 20%;
	*display: inline;
}
.hmj-nav-flat .logo img {
	vertical-align: middle;
}
.hmj-nav-flat .nav {
	float: left;
	list-style: none;
	display: table;
	table-layout: fixed;
	width: 80%;
	padding: 5px 0;
	text-align: right;
	word-spacing: -1em;
	*display: inline;
}
.hmj-nav-flat .nav li {
	display: inline-block;
	/* width: 121px; */
	border: 1px solid #c3c3c3;
	border-left: 0;
	vertical-align: middle;
	word-spacing: normal;
	*display: inline;
	*zoom: 1;
	background-image: url(/motor-lineup/layout/contents/201304/img/a-bg-gradiation.png);
}
.hmj-nav-flat .nav li:first-child {
	border-left: 1px solid #b6b6b6;
}

.hmj-nav-flat .nav .nav-top {
	border: none;
	background-color: none;
	background-image: none !important;
	border-right: 1px solid #c3c3c3;
}

.hmj-nav-flat .nav a {
	border-left: 1px solid #fff;
	display: block;
	/* width: 100px; */
	padding: 10px 20px;
	color: #000;
	font-weight: bold;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	-webkit-transition: 0.2s;
	   -moz-transition: 0.2s;
	    -ms-transition: 0.2s;
	        transition: 0.2s;
	}
	.hmj-nav-flat .nav a:hover,
	.hmj-nav-flat .nav a:focus,
	.hmj-nav-flat .nav a:active {
		background-color: #dedede;
		-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.1);
		box-shadow: 0 0 4px rgba(0,0,0,0.1);
		text-shadow: 0 0 4px rgba(255,255,255,0.8);
	}
	.hmj-nav-flat .nav a.current {
		background-color: #dedede;
		-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.1);
		box-shadow: inset 0 0 4px rgba(0,0,0,0.1);
		text-shadow: 0 0 4px rgba(255,255,255,0.8);
	}

    /* hmj-body
------------------------------ */

    .hmj-body .entry-title,
    .hmj-body .section-title {
        padding-top: 60px;
        border-bottom: 1px solid #c3c3c3;
    }

    .hmj-body .entry-title img,
    .hmj-body .section-title img {
        display: block;
        border-bottom: 1px solid #8d8d8d;
    }

    .hmj-body .section {
        font-size: 116.667%;
    }

    /* hmj-footer
------------------------------ */

    .hmj-footer {
        padding-bottom: 16px;
        font-size: 83.334%;
        line-height: 1.6;
    }

    .hmj-support {
        width: 980px;
        margin: auto;
        padding-top: 48px;
        padding-bottom: 24px;
    }

    .hmj-support .hmj-contents {
        display: table;
        table-layout: fixed;
        width: 980px;
    }

    .hmj-support .section {
        display: table-cell;
        width: 25%;
        padding: 12px 10px;
        border-left: 1px solid #c5c5c5;
        background-color: #e4e4e4;
        vertical-align: top;
        *display: inline;
        *zoom: 1;
    }

    .hmj-support .section:first-child {
        border-left-color: transparent;
        border-left-width: 0;
    }

    .hmj-support .label {
        padding: 0;
        border: none;
        background: transparent;
        color: #000;
        font-size: 14px;
        line-height: 1;
        text-align: center;
        text-decoration: underline;
    }

    .hmj-support .label span {
        display: inline;
        border: none;
    }

    .hmj-support .description {
        padding: 0 0.5em;
        min-height: 5em;
    }

    .hmj-support .description p {
        margin-top: 1em;
        font-size: 12px;
        line-height: 1.333;
    }

    .hmj-support .button {
        padding: 1em 0.5em 0;
        text-align: center;
    }

    .hmj-support .btn {
        min-width: 140px;
        padding-right: 1em;
        padding-left: 1em;
        background-color: #6a6a6a;
        font-size: 14px;
        white-space: nowrap;
    }

    .hmj-footer .tools {
        display: table;
        table-layout: fixed;
        width: 100%;
        border-bottom: 1px solid #ebebeb;
        *display: block;
    }

    .hmj-footer .tools .breadcrumb,
    .hmj-footer .tools .pagetop {
        display: table-cell;
        vertical-align: middle;
        *display: inline;
        *zoom: 1;
    }

    .hmj-footer .tools .breadcrumb {
        width: 924px;
        padding-left: 14px;
    }

    .hmj-footer .tools .breadcrumb a,
    .hmj-footer .tools .breadcrumb .separator,
    .hmj-footer .tools .breadcrumb b {
        display: inline-block;
        margin-right: 0.5em;
        *display: inline;
        *zoom: 1;
    }

    .hmj-footer .tools .breadcrumb .separator {
        color: #999;
        font-size: 12px;
    }

    .hmj-footer .tools .pagetop {
        width: 35px;
        border-left: 1px solid #ebebeb;
    }

    .hmj-footer .tools .pagetop a {
        display: block;
    }

    .hmj-footer .tools .pagetop a:hover,
    .hmj-footer .tools .pagetop a:focus {
        background-image: linear-gradient(rgba(209, 209, 209, 0.1), rgba(255, 255, 255, 0.1));
    }

    .hmj-sitemap .hmj-contents {
        width: 974px;
        border: 3px solid #ebebeb;
        border-radius: 4px;
        background-color: #fefefe;
    }

    .hmj-sitemap .toc {
        display: table;
        table-layout: fixed;
        width: 100%;
        *display: block;
    }

    .hmj-sitemap .links {
        display: table-cell;
        width: 25%;
        padding: 14px 16px;
        vertical-align: top;
        *display: inline;
        *zoom: 1;
    }

    .hmj-sitemap .links a {
        color: #333;
        -webkit-transition: 0.2s;
        -moz-transition: 0.2s;
        -ms-transition: 0.2s;
        transition: 0.2s;
    }

    .hmj-sitemap .links a:hover,
    .hmj-sitemap .links a:focus {
        color: #000;
    }

    .hmj-sitemap .links h2 {
        padding-bottom: 0.334em;
        font-size: 120%;
        line-height: 1.334;
    }

    .hmj-sitemap .links ul + h2 {
        margin-top: 1em;
    }

    .hmj-sitemap .links h2,
    .hmj-sitemap .links h2 a {
        color: #333;
    }

    .hmj-sitemap .links ul {
        list-style: none;
        padding: 0;
    }

    /* styling
------------------------------ */

    .hmj-styling {
        padding: 48px 0 96p x;


        /* 	background: url(/motor-lineup/layout/contents/201901/img/bg-styling.jpg) repeat-x 0 0; */
    }

    .hmj-styling .hmj-contents {
        padding-bottom: 23px;
    }

    .hmj-styling .hmj-slide {
        width: 806px;
        height: 424px;
        margin: auto;
    }

    .photolibrary {
        display: table;
        table-layout: fixed;
        width: 1002px;
        margin-top: 24px;
        word-spacing: -1em;
    }

    .photolibrary a {
        display: inline-block;
        width: 312px;
        margin-right: 22px;
        margin-bottom: 22px;
        position: relative;
    }

    .photolibrary a:after {
        display: block;
        width: 36px;
        height: 36px;
        position: absolute;
        right: 4px;
        bottom: 4px;
        background: url(/motor-lineup/layout/contents/201901/img/icn-maximize.png) no-repeat 0 0;
        content: ' ';
    }

    /* type
------------------------------ */

    .type-colors .hmj-slide {
        height: 418px;
    }

    .type-colors .pagenation {
        width: 100%;
    }

    .limited {
        border: 1px solid #9d9d9d;
        padding: 1px;
        text-align: center;
        width: 100px;
    }

    .ended {
        border: 1px solid #9d9d9d;
        padding: 1px;
        text-align: center;
        width: 100px;
        color: #fff;
        background-color: #9d9d9d;
    }

    /* performance
------------------------------ */

    .performance-table {
        padding-top: 40px;
    }

    .performance-table-alt {
        width: 800px;
        margin: auto;
        padding-top: 40px;
    }

    .performance-table .table-caption,
    .performance-table-alt .table-caption {
        margin-bottom: 4px;
        color: #f8f8f8;
        background-color: #666;
    }

    .performance-table .table-caption h3,
    .performance-table .table-caption p,
    .performance-table-alt .table-caption h3,
    .performance-table-alt .table-caption p {
        padding: 0.5em;
    }

    .performance-table .table-caption h3,
    .performance-table-alt .table-caption h3 {
        font-weight: bold;
    }

    .performance-table table {
        width: 49%;
        table-layout: fixed;
    }

    .performance-table tbody th,
    .performance-table tbody td,
    .performance-table-alt tbody th,
    .performance-table-alt tbody td {
        padding: 0.3em 0.5em;
        color: #444;
        vertical-align: middle;
    }

    .performance-table tbody th,
    .performance-table-alt tbody th {
        border-left: 1px solid #fff;
        border-bottom: 1px solid #fff;
        background-color: #eee;
        font-weight: bold;
    }

    .performance-table tbody td,
    .performance-table-alt tbody td {
        border-bottom: 1px solid #dadada;
        text-align: center;
    }

    .performance-table tbody td + td,
    .performance-table-alt tbody td + td {
        border-left: 1px solid #dadada;
    }

    .performance-table .fuel-consumption-rate th,
    .performance-table-alt .fuel-consumption-rate th {
        background-color: #ead9e7;
    }

    .performance-table .fuel-consumption-rate td,
    .performance-table-alt .fuel-consumption-rate td {
        background-color: #fbe8f7;
    }

    /* overwrite */

    .performance-table .footnote th, .performance-table .footnote td,
    .performance-table-alt .footnote th, .performance-table-alt .footnote td {
        padding: 0;
        border: none;
        color: #777;
        background-color: transparent;
        font-weight: normal;
        text-align: left;
        vertical-align: top;
    }

    .performance-table .footnote th,
    .performance-table-alt .footnote th {
        padding-right: 0.8em;
    }

    /* home
------------------------------ */

    /* hmj-billboard */

    .hmj-billboard {}

    .hmj-billboard .colors {
        float: left;
        width: 70%;
        *display: inline;
    }

    .hmj-billboard .hmj-slide {
        width: 676px;
        height: 436px;
    }

    .colors .pagenation {
        display: block;
        width: 676px;
        padding-left: 74px;
        background: url(/motor-lineup/layout/contents/201901/img/ttl-colorchip.png) no-repeat 0 100%;
        text-align: left;
        word-spacing: normal;
    }

    .colors .pagenation .title {
        vertical-align: bottom;
    }

    .colors .pagenation a {
        width: 36px;
        height: 18px;
        margin: 0;
        overflow: hidden;
        border-radius: 0;
        border: 0;
        background-color: transparent;
        background-image: url(/motor-lineup/layout/contents/201901/img/bg-colorchip.png);
        background-repeat: no-repeat;
        vertical-align: middle;
        transition: 0;
    }

    .colors .pagenation .color01 {
        background-position: 0 0;
    }

    .colors .pagenation .color02 {
        background-position: -40px 0;
    }

    .colors .pagenation .color03 {
        background-position: -80px 0;
    }

    .colors .pagenation .color04 {
        background-position: -120px 0;
    }

    .colors .pagenation .color05 {
        background-position: -160px 0;
    }

    .colors .pagenation .color06 {
        background-position: -200px 0;
    }

    .colors .pagenation .color07 {
        background-position: -240px 0;
    }

    .colors .pagenation .color08 {
        background-position: -280px 0;
    }

    .colors .pagenation .color09 {
        background-position: -320px 0;
    }

    .colors .pagenation .color10 {
        background-position: -360px 0;
    }

    /* hover */

    .colors .pagenation .color01:hover {
        background-position: 0 -18px;
    }

    .colors .pagenation .color02:hover {
        background-position: -40px -18px;
    }

    .colors .pagenation .color03:hover {
        background-position: -80px -18px;
    }

    .colors .pagenation .color04:hover {
        background-position: -120px -18px;
    }

    .colors .pagenation .color05:hover {
        background-position: -160px -18px;
    }

    .colors .pagenation .color06:hover {
        background-position: -200px -18px;
    }

    .colors .pagenation .color07:hover {
        background-position: -240px -18px;
    }

    .colors .pagenation .color08:hover {
        background-position: -280px -18px;
    }

    .colors .pagenation .color09:hover {
        background-position: -320px -18px;
    }

    .colors .pagenation .color10:hover {
        background-position: -360px -18px;
    }

    /* current */

    .colors .pagenation .color01.current {
        background-position: 0 -36px;
    }

    .colors .pagenation .color02.current {
        background-position: -40px -36px;
    }

    .colors .pagenation .color03.current {
        background-position: -80px -36px;
    }

    .colors .pagenation .color04.current {
        background-position: -120px -36px;
    }

    .colors .pagenation .color05.current {
        background-position: -160px -36px;
    }

    .colors .pagenation .color06.current {
        background-position: -200px -36px;
    }

    .colors .pagenation .color07.current {
        background-position: -240px -36px;
    }

    .colors .pagenation .color08.current {
        background-position: -280px -36px;
    }

    .colors .pagenation .color09.current {
        background-position: -320px -36px;
    }

    .colors .pagenation .color10.current {
        background-position: -360px -36px;
    }

    .colors .pagenationS {
        display: block;
        width: 676px;
        padding-left: 74px;
        background: url(/motor-lineup/layout/contents/201901/img/ttl-colorchip.png) no-repeat 0 100%;
        text-align: left;
        word-spacing: normal;
    }

    .colors .pagenationS .title {
        vertical-align: bottom;
    }

    .colors .pagenationS a {
        width: 36px;
        height: 18px;
        margin: 0;
        overflow: hidden;
        border-radius: 0;
        border: 0;
        background-color: transparent;
        background-image: url(/motor-lineup/layout/contents/201901/img/bg-colorchip.png);
        background-repeat: no-repeat;
        vertical-align: middle;
        transition: 0;
    }

    .colors .pagenationS .color01 {
        background-position: 0 0;
    }

    .colors .pagenationS .color02 {
        background-position: -40px 0;
    }

    .colors .pagenationS .color03 {
        background-position: -80px 0;
    }

    .colors .pagenationS .color04 {
        background-position: -120px 0;
    }

    .colors .pagenationS .color05 {
        background-position: -160px 0;
    }

    .colors .pagenationS .color06 {
        background-position: -200px 0;
    }

    .colors .pagenationS .color07 {
        background-position: -240px 0;
    }

    .colors .pagenationS .color08 {
        background-position: -280px 0;
    }

    .colors .pagenationS .color09 {
        background-position: -320px 0;
    }

    .colors .pagenationS .color10 {
        background-position: -360px 0;
    }

    /* hover */

    .colors .pagenationS .color01:hover {
        background-position: 0 -18px;
    }

    .colors .pagenationS .color02:hover {
        background-position: -40px -18px;
    }

    .colors .pagenationS .color03:hover {
        background-position: -80px -18px;
    }

    .colors .pagenationS .color04:hover {
        background-position: -120px -18px;
    }

    .colors .pagenationS .color05:hover {
        background-position: -160px -18px;
    }

    .colors .pagenationS .color06:hover {
        background-position: -200px -18px;
    }

    .colors .pagenationS .color07:hover {
        background-position: -240px -18px;
    }

    .colors .pagenationS .color08:hover {
        background-position: -280px -18px;
    }

    .colors .pagenationS .color09:hover {
        background-position: -320px -18px;
    }

    .colors .pagenationS .color10:hover {
        background-position: -360px -18px;
    }

    /* current */

    .colors .pagenationS .color01.current {
        background-position: 0 -36px;
    }

    .colors .pagenationS .color02.current {
        background-position: -40px -36px;
    }

    .colors .pagenationS .color03.current {
        background-position: -80px -36px;
    }

    .colors .pagenationS .color04.current {
        background-position: -120px -36px;
    }

    .colors .pagenationS .color05.current {
        background-position: -160px -36px;
    }

    .colors .pagenationS .color06.current {
        background-position: -200px -36px;
    }

    .colors .pagenationS .color07.current {
        background-position: -240px -36px;
    }

    .colors .pagenationS .color08.current {
        background-position: -280px -36px;
    }

    .colors .pagenationS .color09.current {
        background-position: -320px -36px;
    }

    .colors .pagenationS .color10.current {
        background-position: -360px -36px;
    }

    #placeholder {
        margin-left: 4px;
    }

    #placeholder1 {
        margin-left: 4px;
    }

    .hmj-billboard .summary {
        float: right;
        width: 245px;
        margin-top: 24px;
        margin-bottom: 24px;
        *display: inline;
    }

    .hmj-billboard .buttons {
        list-style: none;
        width: 244px;
        height: 96px;
        margin-top: 24px;
        padding: 1px 0;
        background: url(/motor-lineup/layout/contents/201901/img/bg-home-button.png) no-repeat 0 0;
    }

    .hmj-billboard .buttons li,
    .hmj-billboard .buttons a,
    .hmj-billboard .buttons img {
        display: block;
    }

    .hmj-billboard .buttons li {
        margin: 0 1px;
    }

    .hmj-billboard .actions {
        display: table;
        table-layout: fixed;
        width: 246px;
        margin: auto;
        padding-top: 24px;
        padding-bottom: 24px;
        text-align: center;
        word-spacing: -1em;
        *display: block;
    }

    .hmj-billboard .actions a {
        display: inline-block;
        width: 68px;
        padding: 0 7px;
        vertical-align: text-top;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .hmj-billboard .social {
        display: table;
        table-layout: fixed;
        width: 232px;
        margin: auto;
        margin-top: 12px;
        *display: block;
    }

    .hmj-billboard .social .button {
        display: table-cell;
        width: 50%;
        vertical-align: middle;
        *display: inline;
        *width: 49%;
        *zoom: 1;
    }

    .scooters-campaign {
        margin-top: 72px;
        position: relative;
    }

    .scooters-campaign .text {
        width: 260px;
        position: absolute;
        top: 293px;
        left: 720px;
    }

    .bikelife {
        padding: 48px 24px 36px;
        border: 1px solid #d1d1d1;
    }

    .bikelife .features {
        display: table;
        width: 100%;
        padding-top: 16px;
        word-spacing: -1em;
        *display: block;
    }

    .bikelife .figure {
        display: inline-block;
        width: 160px;
        padding: 8px;
        vertical-align: top;
        font-size: 10px;
        text-align: center;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .bikelife .figure .caption {
        display: block;
    }

    .bikelife .figure5 {
        display: inline-block;
        width: 180px;
        padding: 8px;
        vertical-align: top;
        font-size: 10px;
        text-align: center;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .bikelife .figure5 .caption {
        display: block;
    }

    .bikelife .summary p {
        padding-top: 24px;
        padding-bottom: 12px;
    }

    .bikelife2 {
        padding: 48px 24px 36px;
        border: 1px solid #d1d1d1;
    }

    .bikelife2 .features {
        display: table;
        width: 100%;
        padding-top: 16px;
        word-spacing: -1em;
        *display: block;
    }

    .bikelife2 .figure {
        display: inline-block;
        width: 160px;
        padding: 8px;
        vertical-align: top;
        font-size: 10px;
        text-align: center;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .bikelife2 .figure .caption {
        display: block;
    }

    .bikelife2 .figure5 {
        display: inline-block;
        width: 180px;
        padding: 8px;
        vertical-align: top;
        font-size: 10px;
        text-align: center;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
    }

    .bikelife2 .figure5 .caption {
        display: block;
    }

    .bikelife2 .summary p {
        padding-top: 24px;
        padding-bottom: 12px;
    }

    .performance-pgmfi {}

    .performance-pgmfi .pgmfi-header {
        min-height: 218px;
        padding-left: 238px;
        background-repeat: no-repeat;
        background-position: 0 0;
    }

    .performance-pgmfi .pgmfi-header h2 {
        padding-top: 36px;
        color: #f6ac00;
        font-size: 1.67em;
        line-height: 1;
    }

    .performance-pgmfi .pgmfi-header h3 {
        font-size: 1.33em;
        line-height: 1;
    }

    .performance-pgmfi .pgmfi-header p {
        padding-top: 0.5em;
    }

    .performance-pgmfi .pgmfi-header .text {
        width: 610px;
    }

    .performance-pgmfi .pgmfi-body .box {
        width: 470px;
        padding-top: 30px;
    }

    .performance-pgmfi .pgmfi-body .icon {
        float: left;
        padding-right: 15px;
    }

    .performance-pgmfi .pgmfi-body .box h4 {
        color: #f6ac00;
        font-size: 1.33em;
        line-height: 1;
    }

    .performance-pgmfi .pgmfi-body .box p {
        padding-top: 0.2em;
    }

    .performance-pgmfi .pgmfi-body .box h4,
    .performance-pgmfi .pgmfi-body .box p {
        overflow: hidden;
    }

}

/*Middle*/

/*
@media screen and (max-width:979px) and (min-width:737px) {

    .pc {
        display: none;
    }

    body {
        min-width: 100% !important;
        font-family: 'Hiragino kaku Gothic ProN', 'Meiryo', 'MS PGothic', sans-serif !important;
        font-size: 75% !important;
    }

    .hmj-contents {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }

}
*/

/*Narrow*/

@media screen and (max-width:736px) {

    .pc {
        display: none;
    }

    .wid30 {
        width: 30%;
    }

    .ctr {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    .mtl {
        margin-top: 2em;
    }

    body {
        width: 100%;
        font-family: 'Hiragino kaku Gothic ProN', 'Meiryo', 'MS PGothic', sans-serif !important;
        font-size: 100% !important;
        margin: 0;
        padding: 0;
    }

    img {
        width: 100%;
        height: auto;
    }

    .hmj-document {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .hmj-contents {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }

    .main-billboard-data-sp {
        padding: 0.75em;
        text-align: center;
        background-color: #f2f2f2;
    }

    .hmj-billboard {
        width: 100%;
    }

    header {
        padding: 10px;
        border-top: 1px solid #e1e1e1;
        border-bottom: 1px solid #cecece;
        background-color: rgba(241, 241, 241, 0.9);
    }

    header .logo {
        font-size: 2em;
        margin: 0 0 0 0.5em;
        height: 40px;
        width: 4.2em;
    }

    #nav-drawer {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        position: relative;
    }

    .nav-unshown {
        display: none;
    }

    /*アイコンのスペース*/
    #nav-open {
        display: inline-block;
        width: 30px;
        height: 22px;
        vertical-align: middle;
    }

    /*ハンバーガーアイコンをCSSだけで表現*/
    #nav-open span, #nav-open span:before, #nav-open span:after {
        position: absolute;
        height: 3px;
        /*線の太さ*/
        width: 25px;
        /*長さ*/
        border-radius: 3px;
        background: #555;
        display: block;
        content: '';
        cursor: pointer;
    }

    #nav-open span:before {
        bottom: -8px;
    }

    #nav-open span:after {
        bottom: -16px;
    }

    /*閉じる用の薄黒カバー*/
    #nav-close {
        display: none;
        /*はじめは隠しておく*/
        position: fixed;
        z-index: 99;
        top: 0;
        /*全体に広がるように*/
        left: 0;
        width: 100%;
        height: 100%;
        background: black;
        opacity: 0;
        transition: .3s ease-in-out;
    }

    /*中身*/
    #nav-content {
        overflow: auto;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99999;
        /*最前面に*/
        width: 90%;
        /*右側に隙間を作る（閉じるカバーを表示）*/
        max-width: 330px;
        /*最大幅（調整してください）*/
        height: 100%;
        background: #fff;
        /*背景色*/
        transition: .3s ease-in-out;
        /*滑らかに表示*/
        -webkit-transform: translateX(-105%);
        transform: translateX(-105%);
        /*左に隠しておく*/
    }

    /*チェックが入ったらもろもろ表示*/
    #nav-input:checked ~ #nav-close {
        display: block;
        /*カバーを表示*/
        opacity: .5;
    }

    #nav-input:checked ~ #nav-content {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        /*中身を表示（右へスライド）*/
        box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
    }

    .nav {
        padding-top: 2em;
    }

    .nav li {
        font-size: 1.25em;
        list-style: none;
        margin-bottom: 1.5em;
        border-bottom: 1px solid #eaeaea;
    }

    .note {
        list-style: none;
        padding-left: 1em !important;
        color: #777;
        font-size: 80%;
        text-indent: -1em;
    }

    .entry-title img {
        width: 60%;
    }

    .section h2 {
        width: 100%;
    }

    .type-colors .hmj-slide {
        height: auto;
    }

    .type-colors .hmj-slide {
        height: auto;
    }



    .hmj-support {
        width: 100%;
        margin: auto;
        padding-top: 48px;
        padding-bottom: 24px;
    }

    .hmj-support .section {
        display: block;
        padding: 12px 10px;
        border: 1px solid #c5c5c5;
        background-color: #e4e4e4;
        vertical-align: top;
    }

    .label {
        text-shadow: 0 0 1px rgba(255, 255, 255, 0.2);
    }

    .hmj-support .label {
        padding: 0;
        border: none;
        background: transparent;
        color: #000;
        font-size: 1.25em;
        line-height: 1;
        text-align: center;
        text-decoration: underline;
    }

    .hmj-support .button {
        padding: 1em 0.5em 0;
        text-align: center;
    }

    .hmj-contents .btn, .btn-primary, .btn-important {
        display: block;
        padding: 0.6em 2em 0.6em;
        border: 1px solid #bbb;
        border-radius: 28px;
        color: #fff !important;
        background-color: #666;
        background-image: url(/motor-lineup/layout/contents/201304/img/a-bg-gradiation.png);
        background-position: 0 50%;
        background-repeat: repeat-x;
        font-weight: bold;
        font-size: 1.25em;
        line-height: 1;
        text-align: center;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    }

    .hmj-support .btn {
        min-width: 80%;
        padding-right: 1em;
        padding-left: 1em;
        background-color: #6a6a6a;
        font-size: 1.25em;
        white-space: nowrap;
    }

    .hmj-sitemap .hmj-contents {
        width: 90%;
        border: 3px solid #ebebeb;
        border-radius: 4px;
        background-color: #fefefe;
    }

    .hmj-footer {
        padding-bottom: 16px;
        font-size: 83.334%;
        line-height: 1.6;
    }

    .hmj-footer .tools {
        display: table;
        table-layout: fixed;
        width: 100%;
        border-bottom: 1px solid #ebebeb;
    }

    .hmj-footer .tools .breadcrumb, .hmj-footer .tools .pagetop {
        display: table-cell;
        vertical-align: middle;
    }

    .hmj-footer .tools .breadcrumb {
        width: 100%;
        padding-left: 14px;
    }

    .hmj-footer .tools .breadcrumb a, .hmj-footer .tools .breadcrumb .separator, .hmj-footer .tools .breadcrumb b {
        display: inline-block;
        margin-right: 0.5em;
    }

    .hmj-footer .tools .breadcrumb .separator {
        color: #999;
        font-size: 0.75em;
    }

    .hmj-footer .tools .pagetop {
        width: 35px;
        border-left: 1px solid #ebebeb;
    }

    .hmj-sitemap .toc {
        display: table;
        table-layout: fixed;
        width: 100%;
    }

    .hmj-sitemap .links {
        display: block;
        padding: 0 16px;
        vertical-align: top;
    }

    .hmj-sitemap .links h2 {
        padding-bottom: 0.334em;
        font-size: 120%;
        line-height: 1.334;
    }

    .hmj-sitemap .links ul {
        list-style: none;
        padding: 0;
    }

    .hmj-sitemap .links a {
        color: #333;
        -webkit-transition: 0.2s;
        -moz-transition: 0.2s;
        -ms-transition: 0.2s;
        transition: 0.2s;
    }

    .hmj-anchor-list {
        display: none;
        border-top: 1px solid lightgray;
        border-bottom: 1px solid lightgray;
        padding-top: 1em;
        padding-bottom: 1em;
        width: 100%;
    }

    .hmj-anchor-list ul {}

    .hmj-anchor-list li {
        list-style: none;
    }

    a:link, a:visited {
        color: #1275a8;
        text-decoration: none;
    }

    #hmj-footer-support-links {
        text-align: center;
    }

    #hmj-footer-support-links img {
        width: 50%;
    }

    .performance-table-alt {
        width: 100%;
    }

    .performance-table-alt table {
        /*        border: 2px solid gray;*/
        width: 100%;
    }

    .performance-table-alt td {
        text-align: center;
        border-bottom: 1px solid lightgray;
        margin: 0;
        padding-top: 0.75em;
        padding-bottom: 0.75em;
    }

    .performance-table-alt th {
        /*        border-bottom: 2px solid lightgray;*/
        padding-top: 0.75em;
        padding-bottom: 0.75em;
        background-color: #eaeaea;
        margin-top: 0;
    }
    
    .tabletxt-s {font-size: 0.75em;}

    /*カラーチェンジ-表紙*/
    .color-name-sp {
        font-size: 0.75em;
    }

    .box-sp {
        display: flex;
        justify-content: center;
    }

    .color-mn4-sp {
        width: 50%;
        padding: 0.5em;
    }

    .color-mn4-sp p {
        -webkit-margin-before: 0.5em;
        -webkit-margin-after: 0;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
    }

    .on {
        display: block;
    }

    .off {
        display: none;
    }

    #bike-color ul {
        margin-left: 0;
        padding-left: 0;
    }

    #bike-color li {
        list-style: none;
    }
    

    .uline {
        border-bottom: 1px solid black;
    }

    .footnote {
        font-size: 0.75em;
    }

    .news-sp {
        border-top: 1px solid lightgray;
        border-bottom: 1px solid lightgray;
        width: 90%;
        display: block;
        margin-bottom: 0.5em;
        margin-top: 0.5em;
        margin-left: auto;
        margin-right: auto;
    }

    .news-sp ul {
        width: 100%;
        display: block;
        list-style-type: disc;
        -webkit-margin-before: 0.75em;
        -webkit-margin-after: 0.75em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        -webkit-padding-start: 0;
    }

    .news-sp li {
        list-style: none;
        font-size: 0.75em;
        margin-left: 0;
        padding-left: 0;
        margin-bottom: 1em;
        margin-top: 0.75em;
    }

    .news-date-sp {
        font-weight: 700;
        margin-right: 0.5em;
    }

    .news-sp a {
        color: black;
    }

    .links-top-sp img {
        width: 25%;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }

    .social-top-sp {
        margin-top: 1.5em;
        margin-bottom: 1.5em;
    }

    .tweet_btn-sp, fb_iine-sp {
        margin-left: 0.5em;
        margin-right: 0.5em;
    }

    .footnote td {
        text-align: left;
        margin: 0;
        
    }

    .footnote th {
        background-color: #FBE8F7;
        margin: 0;
        
    }

    .footnote table {
        margin: 0;
        padding: 0;
        
    }

    .footnote tr {
        margin: 0;
        padding: 0;
    }
}
