@charset "UTF-8";



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



/* --------------------------------
	性能
-------------------------------- */

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



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

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

#section_01 .article_01 { padding: 0 0 0 69px; background: url(../image/sec_01_01_bg.jpg) no-repeat right top;}

#section_01 .article_01 .block_01 { padding: 38px 0 0;}
#section_01 .article_01 .block_01 p.nenpi { padding: 15px 0 0;}

#section_01 .article_01 .block_02 { padding: 40px 0 0;}
#section_01 .article_01 .block_02 p.nenpi { padding: 12px 0 0;}

#section_01 .article_01 .block_03 { padding: 45px 0 0;}
#section_01 .article_01 .block_03 p.nenpi { padding: 12px 0 0;}

#section_01 .article_01 .block h5 { font-weight: bold; padding: 2px 0 0;}
#section_01 .article_01 .block h5 sup { vertical-align: top; font-size: 10px;}

#section_01 .article_01 ul.note { padding: 36px 0 0 1px;}

#section_01 .article_02 { width: 906px; height: 376px; margin: 55px 0 0 47px; background: url(../image/sec_01_02_bg.png) no-repeat;}
#section_01 .article_02 h3 { padding: 24px 0 0 23px;}
#section_01 .article_02 .wrap { padding: 16px 23px 0;}
#section_01 .article_02 .content { float: right; width: 456px;}
#section_01 .article_02 .content .block_02 { padding: 17px 0 0;}
#section_01 .article_02 .content .block_02 p.img { float: right; width: 119px; padding: 0 19px 0 0;}
#section_01 .article_02 .content .block_02 h4 { padding: 16px 0 0;}
#section_01 .article_02 .content .block h5 { padding: 13px 0 0; font-weight: bold;}
#section_01 .article_02 .content p.link { text-align: right; padding: 25px 0 0;}

#section_01 .article_02 p.img { float: left; width: 375px;}

#section_01 p.btnMore { padding: 17px 50px 0 0; text-align: right;}


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

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

#section_02 .article_01 { width: 860px; margin: 0 auto; padding: 38px 0 0;}

#section_02 .article_01 .block_01 { float: left; width: 418px;}
#section_02 .article_01 .block_02 { float: right; width: 412px;}

#section_02 .article_01 .block h4 { text-align: center; font-weight: bold;}
#section_02 .article_01 .block p.lead { padding: 4px 27px 0;}

#section_02 .article_02 { position: relative; width: 1000px; height: 658px; margin: 70px 0 0;}
#section_02 .article_02 h3 { padding: 0 0 0 70px;}
#section_02 .article_02 p.img_01 { padding: 45px 0 0;}

#section_02 .article_02 .block_01 { position: absolute; top: 121px; left: 535px;}
#section_02 .article_02 .block_02 { position: absolute; top: 316px; left: 535px;}
#section_02 .article_02 .block_03 { position: absolute; top: 452px; left: 452px; width: 490px;}

#section_02 .article_02 .block_03 p.img { float: right; width: 160px;}
#section_02 .article_02 .block_03 h4 { padding: 35px 0 0;}

#section_02 .article_02 .block h5 { padding: 11px 0 0 1px; font-weight: bold;}
#section_02 .article_02 .block h5 img { vertical-align: top; position: relative; top: 5px; left: 5px;}

#section_02 .article_02 p.btnMore { position: absolute; top: 633px; right: 50px;}

#section_02 .article_03 { padding: 76px 0 0;}
#section_02 .article_03 h3 { padding: 0 0 0 72px;}

#section_02 .article_03 .inner { width: 906px; height: 672px; margin: 16px 0 0 49px; background: url(../image/sec_02_03_bg.png) no-repeat;}
#section_02 .article_03 .inner .block_01 { padding: 24px 0 0 23px;}
#section_02 .article_03 .inner .block_01 .gallery { position: relative; width: 860px; height: 276px; margin: 13px 0 0; overflow: hidden;}
#section_02 .article_03 .inner .block_01 .gallery .img { position: absolute; top: 0; left: -171px;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li { position: absolute; width: 44px; height: 44px; z-index: 11;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li.right { top: 118px; right: 3px;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li.left { top: 118px; left: 3px;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li a { outline: none; display: block; height: 44px; font-size: 1px; text-indent: -9999px;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li a.js_disable { visibility: hidden; cursor: default;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li.right a { background: url(../../../common/image_common/gallery_btn_next.png) no-repeat;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li.left a { background: url(../../../common/image_common/gallery_btn_prev.png) no-repeat;}
#section_02 .article_03 .inner .block_01 .gallery ul.nav li a:hover { background-position: 0 -44px;}
#section_02 .article_03 .inner .block_01 p.note { text-align: right; padding: 3px 23px 0 0;}

#section_02 .article_03 .inner .block_02 { padding: 9px 0 0 23px;}
#section_02 .article_03 .inner .block_02 .wrap { padding: 14px 0 0;}
#section_02 .article_03 .inner .block_02 .set_01 { float: left; width: 420px; margin: 0 19px 0 0;}
#section_02 .article_03 .inner .block_02 .set_02 { float: left; width: 420px;}
#section_02 .article_03 .inner .block_02 .set p.caption { padding: 4px 0 0;}

#section_02 .article_03 .inner p.link { padding: 11px 20px 0 0; text-align: right;}


/* 03 ---------- */

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

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

#section_03 .article_01 { position: relative; width: 900px; height: 560px; margin: 38px 0 0 50px;}
#section_03 .article_01 h3 { padding: 0 0 0 20px;}
#section_03 .article_01 .img_01 { position: absolute; top: 32px; right: 0;}
#section_03 .article_01 p.lead { padding: 33px 0 0 20px; position: relative; z-index: 10;}
#section_03 .article_01 .content { width: 345px; padding: 19px 0 0 123px; position: relative; z-index: 10;}
#section_03 .article_01 .content p.note { padding: 12px 0 0;}
#section_03 .article_01 .gallery { position: absolute; top: 338px; left: 0; width: 900px; height: 176px; background: url(../image/sec_03_01_gallery_bg.jpg) no-repeat;}
#section_03 .article_01 .gallery .slide { position: absolute; top: 0; left: 0; display: none;}
#section_03 .article_01 p.link { position: absolute; bottom: 0; right: 20px;}

#section_03 .article_02 { width: 863px; padding: 54px 0 0 67px;}
#section_03 .article_02 .content { float: right; width: 412px; padding: 12px 0 0;}
#section_03 .article_02 .content h4 { padding: 23px 0 0;}
#section_03 .article_02 .content p.note { padding: 11px 0 0; line-height: 1.4;}
#section_03 .article_02 .gallery { float: left; width: 395px; height: 294px; padding: 22px 0 0 23px; background: url(../image/sec_03_02_gallery_bg.png) no-repeat;}
#section_03 .article_02 .gallery .galleryContent { position: relative; width: 372px; height: 268px;}
#section_03 .article_02 .gallery .default { background: url(../image/sec_03_02_gallery_img_10.jpg) no-repeat;}
#section_03 .article_02 .gallery .galleryContent .slide { position: absolute; top: 0; left: 0; display: none;}

#section_03 .article_02 p.link { text-align: right; position: relative; margin-top: -20px;}

#section_03 .article_03 { width: 863px; padding: 35px 0 0 67px;}
#section_03 .article_03 .content { float: right; width: 412px; padding: 77px 0 0;}
#section_03 .article_03 .content h4 { padding: 23px 0 0;}
#section_03 .article_03 .gallery { float: left; width: 395px; height: 294px; padding: 22px 0 0 23px; background: url(../image/sec_03_03_gallery_bg.png) no-repeat;}
#section_03 .article_03 .gallery .galleryContent { position: relative; width: 372px; height: 268px;}
#section_03 .article_03 .gallery .default { background: url(../image/sec_03_03_gallery_img_default.jpg) no-repeat;}
#section_03 .article_03 .gallery .galleryContent .slide { position: absolute; top: 0; left: 0; display: none;}

#section_03 .article_03 p.link { text-align: right; position: relative; margin-top: -21px;}

#section_03 .article_04 { width: 930px; padding: 38px 0 0;}
#section_03 .article_04 .content { float: right; width: 412px; padding: 60px 0 0;}
#section_03 .article_04 .content h4 { padding: 23px 0 0;}
#section_03 .article_04 p.img { float: left; width: 488px;}

#section_03 .article_05 { width: 863px; padding: 0 0 0 67px;}
#section_03 .article_05 .content { float: right; width: 412px; padding: 49px 0 0;}
#section_03 .article_05 .content h4 { padding: 23px 0 0;}
#section_03 .article_05 p.img { float: left; width: 418px;}
#section_03 .article_05 p.link { text-align: right; position: relative; margin-top: -20px;}

#section_03 .article_06_07_wrap { padding: 54px 68px 0 67px;}

#section_03 .article_06 { float: left; width: 422px; height: 454px; background: url(../image/sec_03_06_bg.png) no-repeat;}
#section_03 .article_06 h3 { padding: 21px 0 12px 23px;}
#section_03 .article_06 h4 { line-height: 1.36; padding: 0 23px; min-height: 57px; height: auto !important; height: 57px;}
#section_03 .article_06 p.img { padding: 0 0 0 23px;}

#section_03 .article_07 { float: right; width: 422px; height: 454px; background: url(../image/sec_03_07_bg.png) no-repeat;}
#section_03 .article_07 h3 { padding: 21px 0 12px 23px;}
#section_03 .article_07 h4 { line-height: 1.36; padding: 0 23px; min-height: 57px; height: auto !important; height: 57px;}
#section_03 .article_07 p.img { padding: 0 0 0 23px;}

#section_03 p.btnMore { padding: 16px 50px 0 0; text-align: right;}

#section_03 .noteArea { margin: 40px 0 0 50px;}