@charset "UTF-8";



/**
 * HONDA N-BOX SLASH
 *
 * index.css
 * @version  1.0  (updated: 2015.10.05)
 */



/* --------------------------------
	インテリア
-------------------------------- */
/* 01 ---------- */
#section_01 .container_01 { padding-bottom: 28px; background: #f0f0f0; }
#section_01 .container_02 { padding-top: 0; padding-bottom: 185px; background: url(../image/bg_gray_black.png) #f0f0f0 center bottom no-repeat; }

.section_01_gallery { position: relative; overflow: hidden; width: 100%; height: 498px; text-align: left; background: url(../image/section_01_gallery_bg.png) center 0 repeat-y; }
.section_01_gallery ul,
.section_01_gallery ul li { display: inline; float: left; overflow: hidden; background: url(../image/section_01_gallery_img_bg.png) center 0 no-repeat;}
.section_01_gallery ul li.mainActive img { opacity: 1; filter: alpha(opacity=100); }
.section_01_gallery ul li img { display: none; width: 100%; opacity: 0.4; filter: alpha(opacity=40); }

.section_01_gallery_base { position: absolute; top: 0; }
.section_01_gallery_wrap { position: absolute; top: 0; overflow: hidden; }
.slider_prev,
.slider_next { position: absolute; z-index: 100; top: 50%; overflow: hidden; width: 56px; height: 56px; margin-top: -28px; cursor: pointer; }

.pagination { bottom: 10px;left: 0;width: 100%;height: 15px;text-align: center;position: absolute;z-index: 200;}
.pagination a { margin: 0 5px;width: 15px;height: 15px;display: inline-block;overflow: hidden;background: #333;}
.pagination a.active { filter:alpha(opacity=100);opacity: 1;}

.slider_prev { left: 4px; background: url(../../../common/image_common/gallery_arw.png) 0 0 no-repeat; }
.slider_next { right: 4px; background: url(../../../common/image_common/gallery_arw.png) -56px 0 no-repeat; }

.pagination { position: absolute; z-index: 200; bottom: -1px; left: 0; width: 100%; height: 49px; margin: 0 0 0 -2px; text-align: center; }

.pagination a { display: inline-block; overflow: hidden; width: 188px; height: 49px; margin: 0 0 0 5px; background: #333; background: url(../image/interior_nav.png) 0 0 no-repeat; }
.pagination a.pn1 { background-position: 0 0; }
.pagination a.pn2 { background-position: -193px 0; }
.pagination a.pn3 { background-position: -386px 0; }
.pagination a.pn4 { background-position: -772px 0; }
.pagination a.pn5 { background-position: -579px 0; }
.pagination a.pn1:hover { background-position: 0 -50px; }
.pagination a.pn2:hover { background-position: -193px -50px; }
.pagination a.pn3:hover { background-position: -386px -50px; }
.pagination a.pn4:hover { background-position: -772px -50px; }
.pagination a.pn5:hover { background-position: -579px -50px; }
.pagination a.pn1.active { background-position: 0 -100px; }
.pagination a.pn2.active { background-position: -193px -100px; }
.pagination a.pn3.active { background-position: -386px -100px; }
.pagination a.pn4.active { background-position: -772px -100px; }
.pagination a.pn5.active { background-position: -579px -100px; }

.section_01_gallery_btn { margin: 20px 0 0; padding: 0 10px; }
.section_01_gallery_btn li { float: left; }

.section_01_btn_01 { width: 900px; padding: 25px 40px 0; margin: 0 auto; }


/* 02 ---------- */
#section_02 .container_01 { height: 1328px; padding: 0; padding-bottom: 340px; color: #fff; background: url(../image/bg_black_white.png) #000 center bottom no-repeat; }
#section_02 .container_01_bg { padding-top: 46px; background: url(../image/section_02_bg.jpg) center 0 no-repeat; }
#section_02 .container_02 { padding-top: 60px; padding-bottom: 185px; background: url(../image/section_02_bg_02.jpg) #fff center bottom no-repeat; }

/* cover */
.section_02_cover { width: 551px; margin: -18px 0 0; padding: 0 0 0 404px; }
.section_02_cover .section_lead { margin: 0; }
.section_02_cover span { margin: 10px 0 0; font-size: 10px; }
.section_02_cover span.option { font-size: 14px; }
.section_cover_movie { margin: 20px 0 0; height:87px;}
.section_02_cover .section_btn { margin-top: -72px; }
.section_cover_fostex { margin: 30px 0 0; }
.section_02_cover .section_btn2 { margin-top: -62px; }


/* vattery */
.section_02_battery { background: #000; width: 900px; margin: 180px auto 0; }
.section_02_box_txtArea { float: right; width: 410px; padding: 10px 0 0; }
.section_02_box_txtArea span span { display: inline !important; font-size: 10px !important; vertical-align: 1px;}
.section_02_box_img { float: left; width: 450px; }
.section_02_battery_kodawari{ margin: 80px 0 0; }

.section_02_btn_01 { margin-top: 30px; }
.section_02_btn_02 { margin-top: 20px; }

/* gallery */
.section_02_gallery { width: 900px; margin: 0 auto; }
.section_02_gallery_txtArea { float: left; width: 416px; padding: 114px 0 0 0; }
.section_02_gallery_img { float: right; width: 480px; position: relative; }
.section_02_gallery_img_list { position: absolute; top: 0; left: 0; }
.section_02_gallery_img .gallery_pager { position: absolute; top: 330px; left: 210px; }

/* item */
.section_02_item { display: table; width: 900px; margin: 80px auto 0; }
.section_02_gallery + .section_02_item { margin-top: 120px; }
.section_02_item_txtArea { display: table-cell; padding: 0 0 0 40px; vertical-align: middle; }
.section_02_item .section_lead { margin: 0; }
.section_02_item_img { display: table-cell; width: 450px; vertical-align: middle; position: relative; }
.section_02_item_img_anime { position: absolute; top: 0; left: 0; }

#section_02 .caution {width: 870px;margin: 20px auto 0;padding: 10px 15px;border: 1px solid #000;font-size: 10px;line-height: 1.9;text-align:left;}
#section_02 .caution span {font-size: 12px;}

/* 03 ---------- */
#section_03 { }
#section_03 .container { padding-bottom: 182px; background: url(../image/section_03_bg.png) #f0f0f0 center bottom no-repeat; }
.section_03_gallery { overflow: hidden; width: 980px; height: 420px; margin: 20px 0 0; position: relative; }
.section_03_gallery_list { position: absolute; top: 0; left: 0; }
.section_03_gallery_list_01 img { position: absolute; top: 0; left: 0; }
.section_03_gallery_btns { margin: 10px 0 0; padding: 0 0 0 40px; }
.section_03_gallery_btn { float: left; overflow: hidden; width: 175px; height: 57px; text-indent: -9999px; background: url(../image/ultrseat_nav.png) 0 0 no-repeat; }
.section_03_gallery_btn { margin: 0 0 0 6px; }
.section_03_gallery_btn:nth-child(1) { margin: 0; }
.section_03_gallery_btn:nth-child(2) { margin: 0 0 0 7px; }

.section_03_gallery_btn:hover { cursor: pointer; }
.section_03_gallery_btn_01 { background-position: 0 0; }
.section_03_gallery_btn_02 { background-position: -182px 0; }
.section_03_gallery_btn_03 { background-position: -363px 0; }
.section_03_gallery_btn_04 { background-position: -544px 0; }
.section_03_gallery_btn_05 { background-position: -725px 0; }

.section_03_gallery_btn_01:hover { background-position: 0 -59px; }
.section_03_gallery_btn_02:hover { background-position: -182px -59px; }
.section_03_gallery_btn_03:hover { background-position: -363px -59px; }
.section_03_gallery_btn_04:hover { background-position: -544px -59px; }
.section_03_gallery_btn_05:hover { background-position: -725px -59px; }

.section_03_gallery_btn_01.is-current { background-position: 0 -118px }
.section_03_gallery_btn_02.is-current { background-position: -182px -118px; }
.section_03_gallery_btn_03.is-current { background-position: -363px -118px; }
.section_03_gallery_btn_04.is-current { background-position: -544px -118px; }
.section_03_gallery_btn_05.is-current { background-position: -725px -118px; }

.section_03_gallery .gallery_pager { position: absolute; top: 368px; left: 40px; width: 66px; }

/* 04 ---------- */
#section_04 { }
#section_04 .container { }
.section_04_gallery { position: relative; width: 980px; height: 392px; margin: 45px 0 0; }
.section_04_gallery_list { position: absolute; top: 0; left: 0; }
.section_04_gallery .gallery_pager { position: absolute; top: 421px; left: 255px; }
.section_04_btn { margin: 42px 40px 0; }
.section_04_btn li { margin: 20px 0 0; }
.section_04_btn li:first-child { margin: 0; }

