@charset "UTF-8";



/**
 * HONDA N-ONE
 *
 * index.css
 * @version  1.0  (updated: 2012.10.23)
 */



/* --------------------------------
	性能 - 安全性能
-------------------------------- */

/* skybox ---------- */

a#skybox_close { top: -40px !important;}


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

#section_01 { padding: 0 0 56px; background: url(../image/sec_01_bg.png) repeat-x left bottom;}
#section_01 .container { width: 900px; margin: 0 auto;}
#section_01 h2 { padding: 48px 0 0;}

#section_01 .article h4 { font-weight: bold;}

#section_01 .article_01 { width: 900px; margin: 43px 0 0;}
#section_01 .article_01 .content .col_01 { float: left; width: 506px; padding: 0 0 0 20px;}
#section_01 .article_01 .content .col_01 h4 { padding: 5px 0 0 105px;}
#section_01 .article_01 .content .col_01 p.bnr { padding: 16px 0 7px 105px;}
#section_01 .article_01 .content .txt { float: left; width: 348px; padding: 10px 0 12px 26px;}
#section_01 .article_01 .content .txt p.note { padding: 8px 0 0;}
#section_01 .article_01 .gallery { position: relative; width: 900px; height: 176px; background: url(../image/sec_01_01_gallery_bg.jpg) no-repeat;}
#section_01 .article_01 .gallery .slide { position: absolute; top: 0; left: 0; display: none;}

#section_01 .article_02 { width: 863px; padding: 40px 0 0 17px;}
#section_01 .article_02 .content { float: right; width: 417px;}
#section_01 .article_02 .content h4 { padding: 20px 0 0;}
#section_01 .article_02 .content p.note { line-height: 1.4; padding: 10px 0 0;}
#section_01 .article_02 .gallery { float: left; width: 395px; height: 294px; padding: 22px 0 0 23px; background: url(../image/sec_01_02_gallery_bg.png) no-repeat;}
#section_01 .article_02 .gallery .galleryContent { position: relative; width: 372px; height: 268px;}
#section_01 .article_02 .gallery .default { background: url(../../image/sec_03_02_gallery_img_default.jpg) no-repeat;}
#section_01 .article_02 .gallery .galleryContent .slide { position: absolute; top: 0; left: 0; display: none;}

#section_01 .article_03 { width: 863px; padding: 34px 0 0 17px;}
#section_01 .article_03 .content { float: right; width: 417px; padding: 60px 0 0;}
#section_01 .article_03 .content h4 { padding: 20px 0 0;}
#section_01 .article_03 .gallery { float: left; width: 395px; height: 294px; padding: 22px 0 0 23px; background: url(../image/sec_01_03_gallery_bg.png) no-repeat;}
#section_01 .article_03 .gallery .galleryContent { position: relative; width: 372px; height: 268px;}
#section_01 .article_03 .gallery .default { background: url(../../image/sec_03_03_gallery_img_default.jpg) no-repeat;}
#section_01 .article_03 .gallery .galleryContent .slide { position: absolute; top: 0; left: 0; display: none;}

#section_01 .article_03 .gallery ul.galleryNav { padding: 14px 0 0;}
#section_01 .article_03 .gallery ul.galleryNav li { float: left; width: 186px; height: 47px; font-size: 1px; text-indent: -9999px;}
#section_01 .article_03 .gallery ul.galleryNav li a { outline: none; display: block; height: 47px; background: url(../image/sec_01_03_gallery_nav.png) no-repeat;}
#section_01 .article_03 .gallery ul.galleryNav li.nav_02 a { background-position: -186px 0;}
#section_01 .article_03 .gallery ul.galleryNav li.nav_01 a:hover { background-position: 0 -47px;}
#section_01 .article_03 .gallery ul.galleryNav li.nav_02 a:hover { background-position: -186px -47px;}
#section_01 .article_03 .gallery ul.galleryNav li.nav_01 a.js_current { background-position: 0 -47px;}
#section_01 .article_03 .gallery ul.galleryNav li.nav_02 a.js_current { background-position: -186px -47px;}

#section_01 .article_04 { width: 863px; padding: 34px 0 0 17px;}
#section_01 .article_04 .content { float: right; width: 537px; padding: 20px 0 0;}
#section_01 .article_04 .content h4 { padding: 20px 0 0;}
#section_01 .article_04 p.img { float: left; width: 298px;}


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

#section_02 { background: url(../image/sec_02_bg.png) repeat-x left bottom;}
#section_02 .container { width: 1000px; margin: 0 auto;}
#section_02 h2 { padding: 53px 0 0 50px;}

#section_02 .article h4 { font-weight: bold;}

#section_02 .article_01 { width: 930px; padding: 56px 0 0;}
#section_02 .article_01 .wrap .content { float: right; width: 417px;}
#section_02 .article_01 .wrap .content h4 { padding: 20px 0 0;}
#section_02 .article_01 .wrap p.img { float: left; width: 500px;}
#section_02 .article_01 .column { width: 866px; height: 243px; margin: 0 0 0 67px; background: url(../image/sec_02_01_col_bg.png) no-repeat;}
#section_02 .article_01 .column .content { float: right; width: 488px; padding: 40px 39px 0 0;}
#section_02 .article_01 .column .content h5 { font-weight: bold; padding: 10px 0 0;}

#section_02 .article_02 { width: 863px; padding: 35px 0 0 67px;}
#section_02 .article_02 .content { float: right; width: 417px; padding: 4px 0 0;}
#section_02 .article_02 .content h4 { padding: 20px 0 0;}
#section_02 .article_02 p.img { float: left; width: 418px;}

#section_02 .article_03 { width: 844px; padding: 63px 0 0 70px;}
#section_02 .article_03 .content h3 { float: left; width: 355px;}
#section_02 .article_03 .content h4,
#section_02 .article_03 .content p.desc { padding: 0 0 0 444px;}
#section_02 .article_03 .wrap { padding: 18px 0 0 18px;}
#section_02 .article_03 .wrap .block { float: left;}
#section_02 .article_03 .wrap .block_01 { width: 260px;}
#section_02 .article_03 .wrap .block_01 p.caption { padding: 12px 0 0 2px;}
#section_02 .article_03 .wrap .block_02 { width: 243px; padding: 0 0 0 27px;}
#section_02 .article_03 .wrap .block_02 p.caption { padding: 12px 12px 0 0;}
#section_02 .article_03 .wrap .block_03 { width: 264px; padding: 0 0 0 32px;}
#section_02 .article_03 .wrap .block_03 p.caption { padding: 12px 0 0 23px;}

#section_02 .article_04 { width: 863px; padding: 64px 0 0 67px;}
#section_02 .article_04 .content { float: right; width: 417px; padding: 12px 0 0;}
#section_02 .article_04 .content p.desc { padding: 20px 0 0;}
#section_02 .article_04 .content p.note { line-height: 1.4; padding: 10px 0 0;}
#section_02 .article_04 .content ul.note { line-height: 1.4; padding: 10px 0 0;}
#section_02 .article_04 .content ul.note li { padding: 2px 0;}
#section_02 .article_04 .content ul.note li img { vertical-align: top; position: relative; left: 5px;}
#section_02 .article_04 p.img { float: left; width: 418px; margin-bottom: 20px}
#section_02 .article_04 p.bnr { margin: 0 0 0 100px;}

#section_02 .article_05 { width: 863px; padding: 35px 0 0 67px;}
#section_02 .article_05 .content { float: right; width: 537px; padding: 34px 0 0;}
#section_02 .article_05 .content h4 { padding: 20px 0 0;}
#section_02 .article_05 p.img { float: left; width: 298px;}

#section_02 .article_06 { width: 883px; padding: 32px 0 0 67px;}
#section_02 .article_06 .content { float: right; width: 557px;}
#section_02 .article_06 .content h4 { padding: 22px 0 2px; line-height: 1.36;}
#section_02 .article_06 .content ul.note { line-height: 1.4; padding: 10px 0 0;}
#section_02 .article_06 .content ul.note li { padding: 2px 0;}
#section_02 .article_06 p.img { float: left; width: 298px; padding: 2px 0 0;}

#section_02 .article_07 { width: 862px; padding: 0 0 0 70px;}
#section_02 .article_07 .content { float: left; width: 415px; padding: 46px 0 0;}
#section_02 .article_07 p.desc { padding: 20px 0 0;}
#section_02 .article_07 p.img { float: right; width: 418px;}

#section_02 .article_08 { padding: 53px 0 0 70px;}
#section_02 .article_08 h3 { float: left; width: 408px; padding: 0 36px 0 2px;}
#section_02 .article_08 p.lead { padding: 0 80px 0 0;}
#section_02 .article_08 .column { width: 866px; margin: 24px 0 0; background: url(../image/sec_02_08_col_bg.png) no-repeat left bottom;}
#section_02 .article_08 .column .bg { width: 866px; padding: 28px 0 22px; background: url(../image/sec_02_08_col_bg_head.png) no-repeat;}
#section_02 .article_08 .column .block { float: left; width: 236px; padding: 0 0 0 59px;}
#section_02 .article_08 .column .block_01 { padding: 0 0 0 20px;}
#section_02 .article_08 .column .block h5 { color: #196993; font-weight: bold; min-height: 83px; height: auto !important; height: 83px;}
#section_02 .article_08 .column .block p.desc { line-height: 1.66;}
#section_02 .article_08 .column .block ul.note {}
#section_02 .article_08 .column .block ul.note li { padding: 12px 0 0;}
#section_02 .article_08 .column .block p.img { padding: 22px 0 0;}
#section_02 .article_08 .column .block p.caption { padding: 6px 0 0;}

#section_02 .noteArea { margin: 58px 0 0 50px;}