@charset "UTF-8";

/* ブラウザ毎の差異をリセット */
@import "reset.css";
/* ベースのスタイルをインポート */
@import "base.css";



/***********************************************
 * ヘッダー
 ***********************************************/
#head-wrapper {
  border-top: 5px solid #009844;
}
h1 {position: absolute;top:21px;left:20px;}
#tagline {position: absolute;top:5px;left:20px;font-size: 11px;}

/*-------- vi2016 --------*/
#head-vilink {
  position: absolute;
  top: 21px;
  left: 200px;
}

/*-------- ログイン --------*/
#head-login {
  position: absolute;
  bottom: 0;
  right: 0;
  text-align: right;
}
#head-login h2 {margin: 0 0 10px;}
#head-login a {
  background: url(../img/icon/arrow_right_orange.gif) left center no-repeat;
  padding: 0 0 0 15px;
  text-decoration: none;
  color: #666666;
}
#head-login a:hover {color: #FF3366;}
#head-login label {color: #E50012;font-weight: bold;}
#head-login p {margin: 0 0 5px;}
#head-login input[type=image] {margin-bottom: -3px;}
#welcome-message {font-size: 1.2em;}


/*-------- ナビゲーション --------*/
/*#global-navi {
  background: #009844;
  padding: 2px 0 4px;
}
#global-navi ul {
  width: 1012px;
  margin: 0 auto;
}
#global-navi li {
  width: 167px;
  height: 27px;
  float: left;
  margin-left: 2px;
}
#global-navi li.first {margin-left: 0;}
#global-navi li.last {margin-left: 0;float:right;}
#global-navi a {
  display: block;
  width: 167px;
  height: 27px;
  text-indent: -9999em;
  background-image: url(../img/background/bg_global_navi.gif);
}
#navi-item-products a {background-position: 0px 0px;}
#navi-item-products a:hover {background-position: 0px -33px;}
#navi-item-diy a {background-position: -169px 0px;}
#navi-item-diy a:hover {background-position: -169px -33px;}
#navi-item-shopping a {background-position: -338px 0px;}
#navi-item-shopping a:hover {background-position: -338px -33px;}
#navi-item-support a {background-position: -507px 0px;}
#navi-item-support a:hover {background-position: -507px -33px;}
#navi-item-company a {background-position: -676px 0px;}
#navi-item-company a:hover {background-position: -676px -33px;}
#navi-item-registor a {background-position: -845px 0px;}
#navi-item-registor a:hover {background-position: -845px -33px;}
#navi-item-mypage a {background-position: -1014px 0px;}
#navi-item-mypage a:hover {background-position: -1014px -33px;}

*/

/***********************************************
 * フッター
 ***********************************************/
#foot-wrapper {
  background: url(../img/background/bg_page_foot.gif) bottom center repeat-x #FFFFFF;
}
#foot a {text-decoration: none;color: #666666;}
#foot a:hover {color: #FF3366;}
#foot-menu-primary {
  border-bottom: 1px solid #009844;
  margin: 0 0 1em;
  padding: 0 0 1em;
  text-align: center;
}
#foot-menu-primary li {
  display: inline;
  padding: 0 1em;
}
#foot-message {
  position: absolute;
  bottom: 0;
  right: 0;
}
address {
  position: absolute;
  bottom: 5px;
  color: #FFFFFF;
}
#totop {
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 16px;
}



/***********************************************
 * ページ
 ***********************************************/
#body-wrapper {
  border-bottom: 1px solid #B3B3B3;
  background: url(../img/background/bg_page_body.gif) 0 0 repeat-x #FFFFFF;
}
#body {
  background: url(../img/background/bg_body_inner.png) top center repeat-y transparent;
}


/*-------- フロントページ --------*/
#main-inner-column-first, #main-inner-column-second {width: 330px;}



/***********************************************
 * ブロック
 ***********************************************/
.block {margin: 0 0 10px;}

/*-------- フロントページフラッシュエリア --------*/
#flash-area-main {width: 667px;float: left;}
#flash-area-sub {width: 330px;float: right;}


/*-------- フロントページメニュー --------*/
#block-front-menu li {float: left;}
#block-front-menu li.first {margin: 0 7px 0 0;}
#block-front-menu li.last {float: right;}


/*-------- 取り扱い製品カテゴリー --------*/
#block-product-category h2.block-title {
  margin: 0 0 5px;
}
#block-product-category .block-content {
  background: #009844;
  padding: 8px 0 0 10px;
}
#block-product-category li {
  float:left;
  height: 60px;
  margin: 0 6px 6px 0;
}


/*-------- おすすめコンテンツ --------*/
#block-recommend-contents ul {padding: 5px 0 0 20px;}
#block-recommend-contents li {
  float: left;
  margin: 0 16px 5px 0;
  line-height: 62px;
  height: 62px;
}


/*-------- Twitter --------*/
#block-twitter .block-content {
  padding: 10px;
  border: 1px solid #B3B3B3;
  background: #F2F2F2;
}
#block-twitter li {
  font-size: 11px;
  line-height: 1.3em;
  margin: 0 0 10px;
  padding: 10px 0;
  border-bottom: 1px dotted #B3B3B3;
}
#block-twitter #twitter-profile .float-right {width: 245px;}


/*-------- 注目の新製品 --------*/
#block-new-products .block-content {
  padding: 10px;
  border: 1px solid #B3B3B3;
  background: #F2F2F2;
}
#new-products-slider-left {float: left;}
#new-products-slider-right {float: right;}
#new-products-slider-body {float: left;}
.new-products-slider-item {
  float: left;
  width: 160px;
  border-right: 1px dotted #B3B3B3;
}
.new-products-slider-item.last {
  border: none;
}
.new-products-slider-item .inner {padding: 10px 15px;}
.new-products-slider-item .image, .new-products-slider-item .code {margin-bottom: 5px;}
.new-products-slider-item .body {line-height: 1.3em;}


/*-------- クルマいじりのネタ帖 --------*/
#block-diy-contents .block-content {
  border: 1px solid #B3B3B3;
  background: #F2F2F2;
}
.diy-contents-row {padding: 10px 0 10px 7px;}
.diy-contents-item {
  float: left;
  height: 240px;
  width: 130px;
  border-right: 1px dotted #B3B3B3;
}
.diy-contents-item.last {border: none;}
.diy-contents-item .inner {padding: 0 15px;}
.diy-contents-item .image, .diy-contents-item .icon {margin-bottom: 5px;}
.diy-contents-item .body {line-height: 1.3em;}


/*-------- イベント情報・更新情報＆お知らせ --------*/
#block-event .block-content, #block-news .block-content {
  padding: 0 10px 10px;
  border: 1px solid #B3B3B3;
  background: #F2F2F2;
}
#block-event li, #block-news li {
  line-height: 1.3em;
  padding: 10px 0;
  border-bottom: 1px dotted #B3B3B3;
}
#block-event li .date, #block-news li .date {font-weight: bold;}
#block-event li .body, #block-news li .body {padding-left: 15px;background: url(../img/icon/arrow_right_red.gif) left 0.5em no-repeat;}

/* 更新情報＆お知らせのみ */
#block-news .block-content {padding: 0;}
#block-news ul {padding: 0 10px 10px;}
#block-news dl {padding: 10px 0 0 2px;}
#block-news dt, #block-news dd {
  float: left;
  height: 24px;
  text-indent: -9999em;
}
#block-news dd a {
  display: block;
  height: 24px;
  background-image: url(../img/button/btn_news_subscribe.gif);
}
#block-news dt {width: 72px;background-image: url(../img/button/btn_news_subscribe.gif);}
#news-subscribe-mail {width: 101px;}
#news-subscribe-mail a {width: 101px;background-position: -72px 0;}
#news-subscribe-rss {width: 55px;}
#news-subscribe-rss a {width: 55px;background-position: -173px 0;}
#news-subscribe-about {width: 96px;}
#news-subscribe-about a {width: 96px;background-position: -228px 0;}


/*-------- 右サイドバナー --------*/
#block-side-banner li {margin: 0 0 5px;padding: 0;line-height: 1;}