@charset "utf-8";


/* ************************************************************
　leftcol・rightcol
************************************************************* */

/* 共通
----------------------------------------------- */
#leftcol p, #rightcol p { margin: 0 0 5px 0; }
#bloc-login, #bloc-tel, #bloc-deliv, #bloc-calendar, #bloc-rank {
    width: 141px;
    margin: 0 0 10px 0;
    padding: 0 7px 5px 7px;
    border: 1px solid #999999;
    background: url( ../img/tpl/main/side_bk.gif) left top repeat-x;
}
#bloc-cat .title, #bloc-tel .title, #bloc-deliv .title, #bloc-calendar .title, #bloc-login .title, #bloc-rank .title {
    height: 35px;
    padding: 0;
    margin: 0 -7px 8px -7px;
    text-indent: -9999px;
    border-bottom: 1px solid #999999;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: url(../img/tpl/main/side_title.gif);
}
#bloc-cat .title { background-position: 0 0; margin: 0; border-bottom: none; }
#bloc-tel .title { background-position: 0 -35px; }
#bloc-deliv .title { background-position: 0 -70px; }
#bloc-calendar .title { background-position: 0 -105px; }
#bloc-login .title { background-position: 0 -140px; }
#bloc-rank .title { background-position: 0 -175px; }


/* 商品カテゴリ
----------------------------------------------- */
#bloc-cat { width: 155px; margin: 0 0 10px 0; padding: 0; }
#bloc-cat ul { list-style: none; margin: 0; border-top: 1px solid #999999; }
#bloc-cat li { text-indent: -9999px;  }
#bloc-cat li a {
    display: block;
    width: 155px;
    height: 40px;
    background-repeat: no-repeat;
    background-image: url(../img/tpl/main/side_navi.gif) ;
}

/* ボタン */
#cat1 a { height: 40px; background-position: 0 0; }
#cat1 a:hover { background-position: -155px 0; }
#cat2 a { background-position: 0 -40px; }
#cat2 a:hover { background-position: -155px -40px; }
#cat3 a { height: 40px; background-position: 0 -80px; }
#cat3 a:hover { background-position: -155px -80px; }
#cat4 a { height: 40px; background-position: 0 -120px; }
#cat4 a:hover { background-position: -155px -120px; }
#cat5 a { height: 40px; background-position: 0 -160px; }
#cat5 a:hover { background-position: -155px -160px; }


/* サブナビ
----------------------------------------------- */
* {
    margin:0;
    padding:0
}

#accordion {
    margin:0;
    padding:0
    width:150px;
    margin:25px auto;
    background-image:url( ../img/tpl/product.gif);
    background-repeat:no-repeat;
    padding-top:20px;
}

.accordion {
    width:150px;
        font:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font:12px Verdana,Arial;
    color:#033
}

.accordion dt {
    width:150px;
        border:2px solid #e2e2e2;
    padding:6px 0 6px 3px;
    font-weight:bold;
    margin-top:5px;
    cursor:pointer;
}

.accordion dd {
    overflow:hidden;
    background:#fff
}

#accordion ul{
    margin:0;
    padding:0;
    margin-left:10px;
}

#accordion li{
    list-style:none;
    width:140px;
    height:20px;
    margin-top:10px;
    border-bottom:dotted 1px #3E3A39;
    font-size:12px;
    color:#009AE3;
}

#accordion a {
    color:#009AE3;
    text-decoration: none;
}

#accordion a:hover{
    color:#F30;
}

#accordion li span {
    float:right;
    font-size:10px;
    color:#009AE3;
    clear:both;
}


/* カレンダー
----------------------------------------------- */
#bloc-calendar table {
    width: 141px;
  font-size: 11px;
  border-collapse: collapse;
  margin: 0 0 10px 0;
  text-align:center;
  border-top: 1px solid #efefef;
  border-left: 1px solid #efefef;
  background: #ffffff;
}
#bloc-calendar caption { color: #333333; margin: 0; text-align: center; }
#bloc-calendar th, #bloc-calendar td {
    padding: 0;
    border-right: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}
#bloc-calendar th { background: #D2D2D2; }
#bloc-calendar th.sat { color: #0000FF; }
#bloc-calendar th.sun { color: #ff0000; }
#bloc-calendar td.off { background: #FFC0FF; color: #cc0000; }
#bloc-calendar td.sat.off { color: #0000FF; }

#bloc-calendar .holiday { font-size: 10px; line-height: 140%; }
#bloc-calendar .holiday span { font-size: 24px; color: #FFC0FF; margin: 0 3px 0 0; }



/* お電話でのご注文・お問い合わせ
----------------------------------------------- */
#bloc-tel strong { color: #ff0000; font-size: 13px; }
#bloc-tel span { margin: 0 0 0 30px; }



/* お届け・お支払い方法
----------------------------------------------- */
#bloc-deliv {  }


/* ログイン
----------------------------------------------- */
#bloc-login p { margin: 0; }
#bloc-login p.memory { margin: 0 0 10px 0; }
#bloc-login input { margin: 0; padding: 0; }
#bloc-login hr { clear: both; }

#bloc-login .btn { width: 129px; padding: 0; margin: 5px 0 10px 6px; text-indent: -9999px; }
#bloc-login .btn a {
    display: block;
    width: 129px;
    height: 29px;
    background-repeat: no-repeat;
    background-image: url(../img/tpl/main/btn_login.gif) ;
}

/* ボタン */
#btn-login a { background-position: 0 0; }
#btn-login a:hover { background-position: -129px 0; }
#btn-logout a { background-position: 0 -29px; }
#btn-logout a:hover { background-position: -129px -29px; }
#btn-member a { background-position: 0 -58px; }
#btn-member a:hover { background-position: -129px -58px; }
#btn-mypage a { background-position: 0 -87px; }
#btn-mypage a:hover { background-position: -129px -87px; }


/* ランキング
----------------------------------------------- */
#bloc-rank a { text-decoration: underline; }
#bloc-rank a:hover { text-decoration: none; }
.rank-item { font-size: 10px; line-height: 130%; }
.rank-item a { font-size: 12px; line-height: 140%; }
.rank-item img { border: 1px solid #dadada; margin: 0 0 0 30px; }
#rightcol .rank-item p { margin: 0 0 10px 0; }
.rank-no {
    padding: 0;
    margin: 0;
    width: 40px;
    float: left;
    height: 30px;
    display: block;
    text-indent: -9999px;
    background-repeat: no-repeat;
    background-image: url(../img/tpl/i_rank.gif) ;
}

#bloc-rank #rank1 .rank-no { background-position: 0 5px; }
#bloc-rank #rank2 .rank-no { background-position: 0 -85px; }
#bloc-rank #rank3 .rank-no { background-position: 0 -175px; }
#bloc-rank #rank4 .rank-no { background-position: 0 -265px; }
#bloc-rank #rank5 .rank-no { background-position: 0 -355px; }



/* 検索
----------------------------------------------- */
#bloc-search { padding: 0;}
#bloc-search input { padding: 0; margin: 0; }


/* カゴの中
----------------------------------------------- */
#btn-cartin { padding-bottom: 0; padding-left: 70px; }
#btn-cartin a {
    display: block;
    width: 90px;
    height: 20px;
    //background: url(../img/tpl/btn_cartin02.gif) 0 0 no-repeat;
}
#btn-cartin a:hover { background-color: #FFFFFF; }
#btn-cartin a:hover img { visibility: hidden; }


/* SSL
----------------------------------------------- */
#bloc-ssl p { text-align: center; }


/* mobile bana
----------------------------------------------- */
#bloc-mobile {
    width:150px;
        height:120px;
    padding-top:20px;
        margin-bottom:20px;
}


/* 問い合わせブロック
----------------------------------------------- */
#block-contact-banner div.banner{
  padding:0;
  margin-bottom:10px;
}

/* 注目のFAQ(よくいただくご質問)
----------------------------------------------- */
#block-best-faq {
  border: 1px solid #c8c8c8;
  line-height: 1.8em;
}
#block-best-faq h2.block-title {
  color: #FFFFFF;
  padding: 1px;
}
#block-best-faq ul {
  overflow: auto;
  height: 112px;
}

#block-best-faq li {
  font-size: 12px;
  border-bottom: 1px dotted #c8c8c8;
  margin: 8px 20px;
  padding: 0 0 3px 0;
  font-weight: normal;
}
#block-best-faq li a {
  text-decoration:none !important;
  color:#666 !important;
}

/* ご質問カテゴリー一覧
----------------------------------------------- */
#block-faq-category {
  border: 1px solid #009844;
  margin-bottom: 20px;
}
#block-faq-category h2.block-title {
  background: #777777;
  color: #FFFFFF;
  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
  padding: 3px 0;
}
#block-faq-category li div.title a {
  display: block;
  font-size: 13px;
  border-top: 1px solid #009844;
  padding: 12px 10px;
  position: relative;
  color:#333;
}
#block-faq-category li div.title a:hover {
  text-decoration: none;
  background: #fff000;
  color: #009844;
}

#block-faq-category li div.title a:hover:after {
  border-top: solid 1px #009844;
  border-right: solid 1px #009844;
}

#block-faq-category li a:after {
  display: block;
  position: absolute;
  top: 50%;
  right: 12px;
  width: 9px;
  height: 9px;
  margin-top: -4px;
  border-top: solid 1px #333;
  border-right: solid 1px #333;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  content: "";
}


/* よく頂く質問(最新のFAQ)
----------------------------------------------- */
/*
#block-recent-faq {
  border: 1px solid #c8c8c8;
  padding: 1px;
}
#block-recent-faq h2.block-title {
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 1px solid #666666;
  margin-bottom: 10px;
}
#block-recent-faq li {
  border-bottom: 1px dashed #666666;
  margin-bottom: 5px;
}
#block-recent-faq li div.date {
  float: left;
}
#block-recent-faq li div.title {
  padding-left: 140px;
}
--
*/
#block-recent-faq {
  border: 1px solid #c8c8c8;
  b
}
#block-recent-faq h2.block-title {
  color: #FFFFFF;
  padding: 1px;
}
#block-recent-faq ul {
  padding:20px;
}

#block-recent-faq li {
  padding: 8px 12px;
}
#block-recent-faq li div.inner {
}
#block-recent-faq li div.title:before {
  position: absolute;
  top: 11px; left: 14px;
  background: url(../img/icon/parts.png) no-repeat 0 -34px;
  content: " ";
  display: block;
  width: 33px; height: 28px;
}

#block-recent-faq li div.title {
  display:block;
  font-size: 12px;
    color: #333;
    cursor:pointer;
    background: #eee;
    margin-bottom: 10px;
    padding: 15px 50px 15px 64px;
    position: relative;
}
#block-recent-faq li div.title:after {
  position: absolute;
  top: 16px; right: 16px;
  background: url(../img/icon/parts.png) no-repeat 0 0;
  content: " ";
  display: block;
  width: 18px; height: 17px;
}
#block-recent-faq li div.title:hover:after {
  position: absolute;
  top: 16px; right: 16px;
  background: url(../img/icon/parts.png) no-repeat 0 -17px;
  content: " ";
  display: block;
  width: 18px; height: 17px;
}

#block-recent-faq li div.answer:before {
  position: absolute;
  top: 11px; left: 14px;
  background: url(../img/icon/parts.png) no-repeat 0 -62px;
  content: " ";
  display: block;
  width: 33px; height: 28px;
}
#block-recent-faq li div.answer {
background:#fff000;
    color: #333;
    font-size: 12px;
    display:none;
    padding: 15px 15px 15px 64px;
    margin-bottom: 20px;
    position: relative;
}
#block-recent-faq li div.answer {
    margin-bottom: 10px;
}

#block-recent-faq li div.link a {
  font-size: 12px;
  display: block;
  padding: 5px 0;
  background: #e95513;
  color: #fff;
  width: 90px;
  float: right;
  text-align: center;
  clear: both;
  text-decoration:none;
}

#block-recent-faq li div.link a:hover {
    background: #333;
    color: #fff!important;
}




/* ************************************************************
　centercol
************************************************************* */

/* 共通
----------------------------------------------- */
.three-col h3 {
    width: 430px;
    text-indent: -9999px;
    margin: 0 0 8px 0;
    background-color: #FFFFFF;
    background-repeat: no-repeat;
    background-image: url(../img/tpl/th3_top.gif);
}
#bloc-recipe h3 { height: 60px; background-position: 0 0; }
#bloc-best h3 { height: 60px; background-position: 0 -60px; }
#bloc-news h3 { height: 40px; background-position: 0 -120px; }


/* クルマいじり注目レシピ
----------------------------------------------- */
#bloc-recipe { margin: 0 0 12px 0; padding: 0; }
#bloc-recipe a { font-weight: bold; }
.recipe-item { margin: 0 0 7px 0; padding: 0 0 7px 0; border-bottom: 1px dotted #999999; }
.recipe-item img {width: 90px;  float: left; margin: 0 10px 0 0; }
.recipe-item p { width: 330px; float: right; }


/* おすすめ商品
----------------------------------------------- */
#bloc-best { margin: 0 0 12px 0; padding: 0; }
#bloc-best a { font-weight: bold; }
.best-item { margin: 0 0 7px 0; padding: 0 0 7px 0; border-bottom: 1px dotted #999999; }
.best-pic { width: 90px; float: left; }
.best-text { width: 330px; float: right; }


/* ニュース
----------------------------------------------- */
#bloc-news { margin: 0 0 10px 0; padding: 0 0 10px 0; }
#bloc-news ul {
    width: 424px;
    padding: 0 3px 4px 3px;
    margin: 0 0 4px 0;
    list-style: none;
    clear: both;

}
#bloc-news li { padding: 4px 0 4px 100px; margin: 0; border-bottom: 1px dotted #999999;}
#bloc-news span { margin: 0 0 0 -100px; float: left; }

/* RSS */
#bloc-news #rss { width: 430px; height: 26px; text-align: right; }
#bloc-news #rss a { margin: 0 0 0 auto; }

/* ブログ
----------------------------------------------- */
#bloc-blog { padding: 0; }
#bloc-blog li {
    list-style: none;
    margin: 0 0 3px 0;
    padding: 0 0 3px 15px;
    border-bottom: 1px dotted #AAAAAA;
    background: url(../img/tpl/c_green.gif) 0 6px no-repeat;
}
#bloc-blog li.end { border-bottom: none; }


/* twitterウィジェット
----------------------------------------------- */
#twitterB h3 {
  font-size: 10px !important;
    color: #ffffff;
    background-color: #4aaf18;
    background-repeat: no-repeat;
    background-image: none;
    text-indent: 0px;
 }
 
/* like box
----------------------------------------------- */
#block-like {
	border:#CCC 1px solid;
 }

/* 検索フォーム
----------------------------------------------- */
#bloc-search{
    width:150px;
    height:60px;
    margin-bottom:30px;
}

#bloc-search dd img{
    margin-bottom:5px;
}

#btn-search img{
    margin-top:5px;
    margin-left:100px;
}

/***********************************************
 * トップページ
 ***********************************************/
.block {margin: 0 0 10px;}

/*-------- フロントページフラッシュエリア --------*/
#flash-area-main {width: 667px;float: left;}
#flash-area-sub {width: 330px;float: right;}
#flash-area-sub li{line-height:0; padding-bottom:7px;}
#flash-area-sub li.last{line-height:0; padding-bottom:0px;}
#flash-area-sub li img{vertical-align: bottom;}
#flash-area-sub li a{line-height:normal; padding-bottom:5px;}


/*-------- フロントページメニュー --------*/
#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;
}
#block-diy-contents .block-content  a {
  text-decoration:none;
}
.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;}

/*-------- 20160212ADD banner-main-top --------*/
#block-banner-main-top{ width: 1004px; padding: 0 10px; margin: 0 auto; margin-top: 10px; margin-bottom: 10px;}
#block-banner-main-top .block-content-3col{margin-bottom: 10px;}
#block-banner-main-top .block-content-4col{margin-bottom: 10px;}
#block-banner-main-top h2{ background-color: #3F4E46;color: #fff; font-size: 15px; margin-bottom: 10px;padding:10px;}
.block-content-3col li{ width: 330px; height: 120px; float: left; margin: 0 0 5px 0;}
.block-content-3col li.center { width: 330px; height: 120px; float: left; margin: 0 7px 5px 7px;}
.block-content-4col li{ width: 247px; height: 120px; float: left; margin: 0 5px 5px 0;}
.block-content-4col li.last { width: 247px; height: 120px; float: left; margin: 0 0 5px 0;}

/* ===============================================
▼カテゴリー
=============================================== */
#category2_area .bloc_body{
    background-color: #ffffff;
}

#category2_area li{
    padding-left: 5px;
}
#category2_area li.level2{
    border-bottom: solid 1px #ccc;
}
#category2_area li.level2 p{
    padding-left: 20px;
    margin: 7px 3px;
}
#category2_area li.level2 p {
    background: url("../img/icon/ico_arrow_01.gif") 2px 3px no-repeat;
}
#category2_area li.level2 li p {
    background: url("../img/icon/ico_level.gif") 7px 7px no-repeat;
}
#category2_area li a {
    display: block;
    padding: 0;
}
a.onlink:link {
    color: #f00;
    text-decoration: underline;
}
a.onlink:visited {
    color: #000;
}
a.onlink:hover {
    color: #f00;
}