﻿@charset "UTF-8";

/* ====================================
* File name: index.css
* Description: インデックススタイル
==================================== */

#indexImage { width: 950px; height: 280px; margin: 0 auto; padding: 23px 0;}
#indexImage .banner { list-style: none; float: left; margin: 0; padding: 0;}
#indexImage .banner li { margin: 0 0 10px 0; padding: 0;}
#imageSlider { overflow: hidden; float: right; width: 660px; height: 280px;}
#indexImage p { margin: 0; padding: 0;}
#indexLink { height: 207px; background: #ffe5b3;}
#indexLink ul { list-style: none; width: 946px; margin: 0 auto; padding: 11px 0 0 4px;}
#indexLink li { float: left; margin: 0; padding: 0;}

#content { width: 940px; padding: 41px 10px 0 10px;}
#mainContent { float: left; width: 680px;}
#campaign { float: right; width: 400px;}
#subContent { float: left; width: 240px;}
#extraContent { float: right; width: 210px; padding-top: 6px;}
#content h2 { margin: 0; padding: 0; background: none; border: none;}


/* #subContent
----------------------------- */
#news { margin-bottom: 25px;}
#news ul { list-style: none; margin: 0; padding: 0; line-height: 1.2;}
#news li { margin: 0; padding: 10px 0 10px 15px; background: url(../img/icon_arrow2.gif) no-repeat left 12px; border-bottom: 1px solid #c8c8c8;}
#news li .tag { margin-left: 5px; vertical-align: text-top;}
#news li a { text-decoration: none;}
#news li.image { margin: 10px -6px 0 -3px; padding: 0; background: url(../../img/bg_news2.gif) no-repeat left bottom; border: none;}
#news li.image div { padding: 15px 17px 17px 15px; background: url(../../img/bg_news1.gif) no-repeat left top; text-align: center;}
#news li.image img { margin-bottom: 5px;}
#news li.image a { font-weight: bold;}


/* #campaign
----------------------------- */
.topnews>a img { margin-bottom: 5px;}
.topnews a { font-weight: bold; text-decoration: none; line-height: 1.2;}
#campaign ul { width: 350px; margin: 0 auto; padding: 0 25px 5px 25px; background: url(../../img/bg_campaign2.gif) no-repeat left bottom;}
#campaign .topnews { width: 350px; margin: 0 auto 14px auto; padding: 10px 25px 0 25px; background: url(../../img/bg_campaign2.gif) no-repeat left bottom, url(../../img/bg_campaign.gif) repeat-y left top; position: relative;}
#campaign .caption { margin-top: 3px; height: 61px; line-height: 1.6;}
#campaign .readmore {position: absolute; bottom: 0; right: 19px;}
#campaign .scroll { background: url(../../img/bg_campaign2.gif) no-repeat left bottom, url(../../img/bg_campaign.gif) repeat-y left top; padding-bottom: 10px;}
#campaign .scroll ul { width: 340px; overflow: auto; margin: 0; background: none;}
#campaign li img { margin-right: 5px; vertical-align: top;}
#campaign li a { display: inline-block; width: 255px; padding-top: 0; padding-bottom: 0;}
#campaign .campaign_list { position: relative;}
#campaign .campaign_list .viewall { position: absolute; top: 13px; right: 20px;}


/* #extraContent
----------------------------- */
#extraContent ul { list-style: none; margin: 0; padding: 0; text-align: center;}
#extraContent li { margin: 0 0 6px 0; padding: 0;}
#extraContent #oyakudachi { padding-bottom: 2px; background: #b0cec2;}
#extraContent #mokuteki { margin: 10px 0 30px 0; padding-bottom: 7px; background: #ecf3e1;}
#extraContent #mokuteki ul { margin-top: 12px;}
#extraContent #mokuteki li { margin-bottom: 8px;}


/* clearfix
----------------------------- */
#indexImage:before,#indexImage:after,
#indexLink ul:before,#indexLink ul:after,
#content:before,#content:after { content:""; display:block;}
#indexImage:after,
#indexLink ul:after,
#content:after { clear:both;}
#indexImage,
#indexLink ul,
#content { zoom:1;} /* For IE 6/7 (trigger hasLayout) */
