@charset "UTF-8";



/**
 * HONDA N-BOX Modulo X
 *
 * index.css
 * @version  1.0  (updated: 2015.06.24)
 */



/* --------------------------------
	スタイリング
-------------------------------- */

/* 共通 ---------- */

.section {background: url(../../../common/image_common/bg_line01.png) center top no-repeat;}
.section .article h4 { font-weight: bold;}

/* 00 ---------- */

#section_00 {}
#section_00.section {background: none;}
#section_00 .container { width: 900px; margin: 0 auto;}
#section_00 h2 { padding: 18px 0 0;}

/* main ---------- */

#section_main { width: 910px; margin: 40px auto 0;}
#section_main .slideGallery_01 { position: relative; width: 910px; height: 528px; margin: 40px 0 0;}
#section_main .slideGallery_01 .slide { position: absolute; top: 0; left: 0; z-index: 10;}
#section_main .slideGallery_01 .slide p.lead { padding: 15px 0 0 36px;}
#section_main .slideGallery_01 ul.nav li { position: absolute; width: 44px; height: 44px; z-index: 11;}
#section_main .slideGallery_01 ul.nav li.next { top: 196px; right: 3px;}
#section_main .slideGallery_01 ul.nav li.prev { top: 196px; left: 10px;}
#section_main .slideGallery_01 ul.pager { position: absolute; bottom: 40px; left: 815px; z-index: 11;}
#section_main .slideGallery_01 ul.pager li.nav_3 { margin: 0;}
#section_main .slideGallery_01 ul.pager li.nav_6 { margin: 0;}
#section_main .slideGallery_01 div.cap { position: absolute; bottom: -7px; width: 900px; z-index: 11; text-align:right; font-size:60%;}

/* 01 ---------- */

#section_01 { padding: 30px 0 0; }
#section_01 .container { width: 900px; margin: 0 auto;}
#section_01 h2 { padding: 30px 0 20px 0;}
#section_01 h3 { padding: 0;}
#section_01 h4 { padding: 20px 0 0 0;}
#section_01 .article_04 h4 {text-indent: -0.8em;padding-left: 0.8em}
#section_01 .article { width: 900px; margin: 0 auto; padding: 35px; background: url(../../../common/image_common/bg_line01.png) center top no-repeat;}
#section_01 .content p.lead { padding: 15px 0 0;line-height: 1.83}
#section_01 .content p.btnMore { padding: 54px 0 0; text-align: right;}
#section_01 div.img { float: left; width: 535px;}
#section_01 p.cap { float: left; width: 535px; text-align:right; font-size:80%; padding-top:5px;}
#section_01 .article_01 {background: none;padding-top: 0;}
#section_01 * .content {float: right; width: 330px;}
#section_01 .article_01 .content { padding: 40px 0 0;}
#section_01 .article_02 .content { padding: 75px 0 0;}
#section_01 .article_03 .content { padding: 50px 0 0;}
#section_01 .article_04 .content { padding: 75px 0 0;}
#section_01 .article_05 .content { padding: 75px 0 0;}

/* 02 ---------- */

#section_02 { padding: 30px 0 50px 0;}
#section_02 h2 {padding-bottom: 20px; padding-top:18px;}
#section_02 .container { width: 900px; margin: 0 auto;}
#section_02 .container:first-child {padding: 0 35px 90px; margin-bottom: 7px; background:url(../../../common/image_common/bg_line01.png) center bottom no-repeat;}
#section_02 .container p.cap {padding: 12px 0 0}
#section_02 .content { float: right; padding-left: 5px}
#section_02 .content p {margin-bottom: 8px;}


/* イメージ */
#section_02 .colorGallery { position: relative; width: 880px; height: 500px; margin: 10px auto 0; }
#section_02 .colorGallery .slide { position: absolute; top: 0; left: 0; display: none;}

/* カラー選択ナビ */
#section_02 .colorGallery .colorSelector { position: absolute; top: 470px; left: 100px;  width: 720px; }
#section_02 .colorGallery .colorSelector p.h { float: left; width: 60px; height: 18px; margin: 0 11px 0 0; background: url(../image/sec_02_gallery_color.png) no-repeat; font-size: 1px; text-indent: -9999px;}
#section_02 .colorGallery .colorSelector ul.nav { width: 700px; margin: 0 auto 0 10px;}
#section_02 .colorGallery .colorSelector ul.nav li { float: left; width: 127px; height: 32px; margin: 0 10px 0 0; font-size: 1px; text-indent: -9999px;}

#section_02 .colorGallery .colorSelector ul.nav li a { outline: none; display: block; height: 32px; background: url(../image/sec_02_gallery_color.png) no-repeat;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_01 a { background-position: 0px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_02 a { background-position: -137px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_03 a { background-position: -270px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_04 a { background-position: -404px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_05 a { background-position: -538px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_06 a { background-position: -450px 0px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_07 a { background-position: -540px 0px;}

#section_02 .colorGallery .colorSelector ul.nav li.nav_01 a:hover { background-position: 0px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_02 a:hover { background-position: -137px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_03 a:hover { background-position: -270px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_04 a:hover { background-position: -404px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_05 a:hover { background-position: -538px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_06 a:hover { background-position: -538px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_07 a:hover { background-position: -540px -48px;}

#section_02 .colorGallery .colorSelector ul.nav li.nav_01 a.js_current { background-position: 0px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_02 a.js_current { background-position: -137px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_03 a.js_current { background-position: -270px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_04 a.js_current { background-position: -404px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_05 a.js_current { background-position: -538px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_06 a.js_current { background-position: -450px -48px;}
#section_02 .colorGallery .colorSelector ul.nav li.nav_07 a.js_current { background-position: -540px -48px;}

#section_02 .colorGallery p.note { position: absolute; top: 532px; left: 500px; }
#section_02 .colorGallery p.info { position: absolute; top: 470px; left: 0;}

#section_02 .noteArea.noteArea_01 { width:auto; background: none; margin: 10px 0 0 120px; padding: 0;}

#section_02 p.bnr01 { padding: 27px 0 50px 142px;}
#section_02 p.bnr01+p{padding-left: 12px;}