@charset "utf-8";

/* +++++++++++++++++++++++++++++++

 common.css

+++++++++++++++++++++++++++++++ */

/* reset */
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* layout */
body {
    background: #fff;
    font:normal 13px/1.4 "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", helvetica, arial, sans-serif;
    color: #222;
}

a {
    color: #222;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
a.link {
    text-decoration: underline;
}
a.link:hover { text-decoration: none; }

img { vertical-align: bottom; }
p { margin: 1em 0; }

input,
textarea,
pre,
button {
    font:normal 13px/1.4 "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", helvetica, arial, sans-serif;
}

/* headline */
h1, h2, h3, h4, h5 {
    font-size: 20px;
}
/*
ヘッダー
-----------------------------------*/
header.global .inner {
    width: 1200px;
    margin: 0 auto;
}

/* タグライン */
#tagline {
    float: left;
    margin: 10px 0 0;
    font-size: 10px;
    font-weight: normal;
}

/* 関連サイト */
header .relation_site { float: right; }
header .relation_site li {
    float: left;
    margin-left: 1px;
}
header .relation_site li:first-child a {
    display: block;
    background :#555;
}
header .relation_site li:first-child a:hover { background :#de0010; }
header .relation_site li:last-child a:hover img {
    filter: alpha(opacity=60);
    opacity: 0.6;
}
/* ソーシャル */
header .social {
    float: right;
    margin: 3px 10px;
}
header .social li {
    float: left;
    overflow: hidden;
    height: 25px;
    margin-left: 1px;
}
header .social li:first-child { margin-left: 0; }
header .social a:hover img {
    position: relative;
      top: -25px;
}

/* ユーザーサポートリンク */
header .support { float: right; }
header .support li {
    float: left;
    margin-top: 10px;
    font-size: 11px;
}
header .support li:before {
    content: "｜";
}
header .support li:first-child:before { content: " "; }

/* ロゴ */
#logo {
    float: left;
    clear: left;
     margin: 20px 0;
}

/* PRタグ */
.tag_pr {
    float: left;
    margin: 25px 0 0 20px;
}
.tag_pr li {
    float: left;
    margin-left: 5px;
    padding: 3px 5px 2px;
    border: 1px solid #de0010;
    color: #de0010;
    font-size: 12px;
}
.tag_pr li:first-child { margin-left: 0; }
/* 161206遠藤 リンクにするため<A>指定追加 */
.tag_pr a {
    color: #de0010;
    text-decoration: none;
}

/* カートボタン */
header .button_cart { float: right; }

/* お問い合わせ・検索 */
header .inner > .wrap {
    float: right;
    width: 400px;
    margin-right: 20px;
}
header .tel {
    float: right;
    margin: 0;
    padding-left: 20px;
    background: url(../images/common/ico_header_tel.png) no-repeat left center;
    font-size: 16px;
    font-weight: bold;
}
header .tel span {
    margin-left: 5px;
    font-size: 11px;
    font-weight: normal;
}

/* 検索エリア */
header .search {
    position: relative;
    float: right;
    width: 398px;
    margin-top: 5px;
    padding: 2px 0;
    border: 1px solid #a7a7a7;
}
header .search .wrap_select {
    float: left;
    width: 115px;
    border: none;
}
header .search select {
    box-sizing: border-box;
    height: 25px;
    padding: 2px 5px 1px;
}
header .search input[type=text] {
/*    width: 220px;*/
    width: 350px;
    height: 20px;
    padding: 3px 5px 2px;
    border-color: #fff #fff #fff #a7a7a7;
    border-style: solid;
    border-width: 1px;
    
}

header .search .button_ico_search {
    float: right;
    overflow: hidden;
    width: 16px;
    height: 16px;
    margin: 3px 5px 0 0;
    border: none;
    background: url(../images/common/ico_search.png) no-repeat left top;
    color: #fff;
    font-size: 0;
    vertical-align: middle;
}

/* オートコンプリート */
#auto_complete {
    position: absolute;
    top: 31px;
    right: 0;
    width: 240px;
    padding: 10px 10px 0;
    border: 1px solid #a7a7a7;
    background: #fff;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, .5);
    z-index: 999;
}
#auto_complete .list_keyword {
    margin-bottom: 15px;
    border-bottom: 1px solid #d3d3d3;
}
#auto_complete li { margin-bottom: 10px; }
#auto_complete .list_keyword li {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#auto_complete .list_keyword a { color: #666; }
#auto_complete .list_keyword strong {
    margin-right: 1em;
    color: #222;
    font-weight: normal;
}
#auto_complete .image {
    float: left;
    width: 80px;
    height: 80px;
}
#auto_complete a:hover .image {
    filter: alpha(opacity=60);
    opacity: 0.6;
}
#auto_complete .text {
    min-height: 80px;
    margin: 0 0 15px 90px;
    
}
#auto_complete .text span {
    display: block;
    margin-top: 5px;
}



/*
グローバルナビ
-----------------------------------*/
nav.global {
    position: relative;
    padding-top: 4px;
    border-bottom: 3px solid #de0010;
    background: #e9e9e9;
}

nav.global .primary {
    width: 1200px;
    margin: 0 auto;
}
nav.global .primary > li {
    float: left;
    width: 145px;
    margin-bottom: -3px;
    padding: 0 4px 0 6px;
    border-bottom: 3px solid #de0010;
    background: url(../images/common/bg_nav.png) no-repeat left 6px;
}
nav.global .primary > li:hover .name {
    background: #da020d;
    color: #fff;
}
nav.global .primary #other_menu {
    width: 108px;
    height: 38px;
    padding: 0 0 0 2px;
    background: none;
}
nav.global #menu {
    position: relative;
    top: 4px;
    padding: 10px 0 9px 30px;
    border-radius: 3px 3px 0 0;
    background: #393939 url(../images/common/ico_menu.png) no-repeat 8px center;
    color: #fff;
    font-size: 11px;
}
nav.global .name {
    height: 26px;
    padding-top: 12px;
    font-size: 12px;
    text-align: center;
}

/* ドロップダウン*/
nav.global .secondary {
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    display: none;
    padding: 15px 0;
    background: #e9e9e9;
    z-index: 100;
}
nav.global li:hover .secondary { display: block; }

/* カテゴリ一覧 */
nav.global .category {
    float: left;
}
nav.global .category li {
    float: left;
    margin-left: 15px;
}
nav.global .category li:first-child { margin-left: 0; }
nav.global .category a {
    display: block;
    width: 120px;
    height: 120px;
    padding-top: 20px;
    border-radius: 4px;
    background: #fff;
    font-size: 12px;
    text-align: center;
}
nav.global .category a:hover {
    background: #d3d3d3;
}



nav.global .category img {
    display: block;
    margin: 0 auto 20px;
}

/* おすすめ商品 */
nav.global .recommend {
    float: left;
    margin-left: 15px;
    background: url(../images/common/bg_header_recommend.png) no-repeat left center;
}
nav.global .recommend p {
    margin: 0 0 8px 15px;
    color: #333;
    font-size: 12px;
    line-height: 1.1;
}
nav.global .recommend li {
    position: relative;
    float: left;
    width: 100px;
    margin-left: 15px;
}
nav.global .recommend a {
    display: table;
    width: 100px;
    height: 100px;
}
nav.global .recommend a:hover { text-decoration: none; }
nav.global .recommend .image {
    position: absolute;
    top: 0;
    left: 0;
    display: table;
    width: 100px;
    height: 100px;
    background: #fff;
}
nav.global .recommend .image span {
    display: table-cell;
    width: 100px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
}
nav.global .recommend img {
    max-width: 100px;
    max-height: 100px;
}
nav.global .recommend .wrap {
    position: relative;
    top: 0;
    left: 0;
    display: table-cell;
    width: 80px;
    height: 100px;
    padding: 0 10px;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    font-size: 12px;
    vertical-align: middle;
    filter: alpha(opacity=0);
    opacity: 0;
}
nav.global .recommend a:hover .wrap {
    filter: alpha(opacity=100);
    opacity: 1;
}
nav.global .recommend .price {
    display: block;
    width: 80px;
    font-size: 11px;
}

/* 170308カート内閲覧履歴：遠藤 */
.rireki .recommend {
    float: left;
    margin-left: 15px;
}
.rireki .recommend p {
    margin: 0 0 8px 15px;
    color: #333;
    font-size: 12px;
    line-height: 1.1;
}
.rireki .recommend li {
    position: relative;
    float: left;
    width: 100px;
    margin-left: 15px;
}
.rireki .recommend a {
    display: table;
    width: 100px;
    height: 100px;
}
.rireki .recommend a:hover { text-decoration: none; }
.rireki .recommend .image {
    position: absolute;
    top: 0;
    left: 0;
    display: table;
    width: 100px;
    height: 100px;
    background: #fff;
}
.rireki .recommend .image span {
    display: table-cell;
    width: 100px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
}
.rireki .recommend img {
    max-width: 100px;
    max-height: 100px;
}
.rireki .recommend .wrap {
    position: relative;
    top: 0;
    left: 0;
    display: table-cell;
    width: 80px;
    height: 100px;
    padding: 0 10px;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    font-size: 12px;
    vertical-align: middle;
    filter: alpha(opacity=0);
    opacity: 0;
}
.rireki .recommend a:hover .wrap {
    filter: alpha(opacity=100);
    opacity: 1;
}
.rireki .recommend .price {
    display: block;
    width: 80px;
    font-size: 11px;
}

/* 各種メニュー */
#other_menu .inner {
    display: table;
}
nav.global .block {
    display: table-cell;
    width: 240px;
    border-left: 1px solid #fff;
}
nav.global .block dl {
    margin: 0 10px 20px;
    padding: 0;
    color: #222;
}
nav.global .block dl:last-child { margin-bottom: 0; }
nav.global .block dt {
    margin: 0;
    font-weight: bold;
}
nav.global .block dt img { margin-right: 5px; }
nav.global .block dd {
    margin: 6px 0 0;
    font-size: 12px;
}
nav.global .block a { color: #222; }

/*
汎用レイアウト
-----------------------------------*/
main {
    display: block;
    width: 1200px;
    margin: 0 auto;
}

#main {
    float: right;
    width: 950px;
    margin-top: 30px;
}
#side {
    float: left;
    width: 220px;
    margin-top: 30px;
}
.box {
    position: relative;
    overflow: hidden;
    margin-top: 60px;
}
.box:first-child { margin-top: 0; }

/* 画像 */
.box_image {
    margin: 20px 0;
    text-align: center;
}
.image > img {
    max-width: 100%;
    max-height: 100%;
}

/* テキスト */
.text {
    margin: 20px;
}

/* インデントつきリスト */
.list_indent li {
    margin-top: 1em;
    padding-left: 1em;
    text-indent: -1em;
}
.list_indent li:first-child { margin-top: 0; }

/*
メッセージボックス
-----------------------------------*/
/* 背景色のみ */
.box_message {
    margin-bottom: 10px;
    padding: 15px;
    background: #fffcf2;
}
.box_message p { margin: 0 0 10px; }
.box_message p:last-child { margin-bottom: 0; }

/* ボーダーあり */
.box_notes {
    margin-bottom: 10px;
    padding: 15px 20px;
    border: 1px solid #ffbf00;
    background: #fff9e6;
}


/*
パンくず
-----------------------------------*/
#pkz {
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}
#pkz li {
    float: left;
    color: #7a7a7a;
    font-size: 11px;
}
#pkz li:before {
    margin: 0 2px;
    content: ">";
}
#pkz li:first-child:before {
    margin: 0;
    content: " ";
}

#pkz a {
    color: #7a7a7a;
    text-decoration: underline;
}

/*
#pkz li:first-child a {
    display: inline-block;
    width: 15px;
    height: 13px;
    background: url(../images/common/ico_top.png) no-repeat left top;
    color: #fff;
    font-size: 0;
    vertical-align: top;
}
*/

/*
見出し
-----------------------------------*/
.headline01 {
    margin: 0 0 20px;
    padding: 20px 0 15px;
    background: #e9e9e9;
    border-bottom: 2px solid #d3d3d3;
    color: #e53340;
    font-size: 24px;
    text-align: center;
}
.headline01 .ruby {
    display: block;
    color: #222;
    font-size: 11px;
    font-weight: normal;
}
.headline_image01 { margin: 0 0 20px; }
.heading01 {
    margin: 0 0 20px;
    font-size: 20px;
}

.heading02 {
    margin: 0 0 20px;
    padding: 0 10px 15px;
    border-bottom: 2px solid #393939;
    font-size: 20px;
}
.heading03 {
    position: relative;
    margin: 0 0 20px;
    padding: 15px 20px 14px;
    background: #393939;
    color: #fff;
    font-size: 17px;
}
.heading03 .supplement {
    position: absolute;
    top: 18px;
    right: 20px;
    font-size: 13px;
    font-weight: normal;
}
.sub_head01 {
    margin: 0 20px 20px;
    font-size: 17px;
}
/*170308遠藤*/
.heading04 {
    margin: 0 0 20px;
    padding: 10px 20px;
    background: #e9e9e9;
    font-size: 17px;
    font-weight: bold;
}


/* サイド */
.side_heading01 {
    margin: 0;
    padding: 15px 10px 14px;
    border-top: 2px solid #de0010;
    background: #f4f4f4;
    font-size: 15px;
    text-align: center;
}

/*
商品、バナー一覧：４列
-----------------------------------*/
.list_item {
    width: 966px;
}
.list_item > li {
    position: relative;
    float: left;
    width: 225px;
    margin: 30px 15px 0 0;
}
.list_item li:nth-child(-n +4) { margin-top: 0; }
.list_item li:nth-child(4n+1) { clear: left; }
.list_item .image {
    display: table-cell;
    width: 225px;
    height: 225px;
    text-align: center;
    vertical-align: middle;
}
.list_item .image img { max-width: 225px; }
.list_item .caption {
    margin: 10px 0 0;
    font-size: 12px;
}
.list_item .price {
    margin: 5px 0 0;
    font-size: 15px;
    font-weight: bold;
}

.list_item a:hover img {
    filter: alpha(opacity=60);
    opacity: 0.6;
}
/* タグ */
.list_item .tag {
    position: absolute;
    top: 0;
    left: 0;
}
.list_item .tag li { float: left; }
.list_item .tag img { vertical-align: top; }

/*
商品一覧：タイル型
-----------------------------------*/
.list_item.view_tile .item {
    position: relative;
    float: left;
    width: 225px;
    margin: 30px 15px 0 0;
}
.list_item.view_tile a {
    display: block;
    border: 1px solid #e9e9e9;
}
.list_item.view_tile a:hover {
    border-top-color: #de0010;
    text-decoration: none;
}
.list_item.view_tile a:hover:after {
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    display: block;
    height: 1px;
    background: #de0010;
    content: " ";
}
.list_item.view_tile .image {
    width: 223px;
    height: 223px;
    margin-bottom: 10px;
}
.list_item.view_tile .image img { max-width: 223px; }
.list_item.view_tile .tag_feature {
    min-height: 20px;
    margin: 10px;
}
.list_item.view_tile .tag_tile2dan {
    min-height: 42px;
    margin: 10px;
}
.list_item.view_tile p { margin: 0 10px 10px; }

.list_item.view_tile .name {
    height: 64px;
    font-size: 13px;
    font-weight: bold;
}
.list_item.view_tile .data {
    margin: 0 10px 10px;
    font-size: 11px;
}
.list_item.view_tile .price {
    color: #de0010;
    font-size: 19px;
    font-weight: bold;
}
.list_item.view_tile .price span {
    margin-left: 5px;
    font-size: 11px;
    font-weight: normal;
}
.list_item.view_tile .stock {
    margin: -10px 10px 5px;
    font-size: 12px;
}
.list_item.view_tile .stock strong { color: #de0010; }
.list_item.view_tile a:hover .more01 { color: #de0010; }
.list_item.view_tile  a:hover .more01:after { background-position: -200px -100px; }
.list_item.view_tile a:hover .more01:hover {
    filter: alpha(opacity=100);
    opacity: 1;
}

/*
商品一覧：リスト型
-----------------------------------*/
.list_item.view_list a {
    position: relative;
    display: table;
    width: 917px;
    margin-top: 15px;
    padding-right: 31px;
    border: 1px solid #e9e9e9;
    background: #e9e9e9;
}
.list_item.view_list a:after {
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 8px;
    height: 15px;
    margin-top: -7px;
    background: url(../images/common/sprite_arrow.png) no-repeat left top;
    content: " ";
}
.list_item.view_list a:hover {
    border-left-color: #de0010;
    text-decoration: none;
}
.list_item.view_list a:hover:before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    display: block;
    width: 2px;
    background: #de0010;
    content: " ";
}
.list_item.view_list a:hover:after { background-position: -200px -50px; }
.list_item.view_list .box_image,
.list_item.view_list .box_data,
.list_item.view_list .box_price {
    display: table-cell;
    background: #fff;
    vertical-align: middle;
}
.list_item.view_list .box_image {
    width: 135px;
    margin: 0;
    padding: 10px;
}
.list_item.view_list .image {
    position: relative;
    width: 135px;
    height: 135px;
}
.list_item.view_list .image img { max-width: 135px; }
.list_item.view_list .box_data {
    width: 545px;
    padding: 10px 20px 10px 5px;
    vertical-align: top;
}
.list_item.view_list .box_data p { margin: 0 0 10px; }
.list_item.view_list .box_data .name {
    font-size: 14px;
    font-weight: bold;
    height: 35px;
}
.list_item.view_list .box_data li {
    float: left;
    margin-right: 3px;
}
.list_item.view_list .data {
    font-size: 10px;
    margin-bottom: 10px;
}
.list_item.view_list .data li { margin-right: 10px; }
.list_item.view_list .box_price {
    width: 160px;
    padding: 10px 20px;
    background: #f4f4f4;
}
.list_item.view_list .code {
    margin: 0 0 15px;
    font-size: 10px;
}
.list_item.view_list .price {
    margin: 0;
    color :#de0010;
    font-weight: bold;
    font-size: 19px;
}
.list_item.view_list .price span {
    font-size: 11px;
    font-weight: normal;
}
.list_item.view_list .postage {
    margin: 0 0 15px;
    color :#de0010;
    font-size: 11px;
}
.list_item.view_list .option {
    margin: 0;
    font-size:12px;
    line-height: 1.2;
}

/*
テキストリンクリスト
-----------------------------------*/
.list_text li {
    margin-right: 20px;
}
.list_text a {
    position: relative;
    display: block;
    margin-bottom: 10px;
    padding: 15px 30px 14px 13px;
    border-left: 2px solid #fff;
    background: #fff;
}
.list_text a:after {
    position: absolute;
    top: 50%;
    right: 15px;
    display: block;
    width: 6px;
    height: 10px;
    margin-top: -5px;
    background: url(../images/common/sprite_arrow.png) no-repeat -200px top;
    content: " ";
}

.list_text a:hover {
    border-left-color: #de0000;
    text-decoration: none;
    color: #e53340;
}
.list_text a:hover:after { background-position: -200px -100px; }

/*
フォームパーツ
-----------------------------------*/
input[type=text] {
    padding: 5px 8px 4px;
    border: 1px solid #d3d3d3;
    font-size: 13px;
}

textarea {
    width: 90%;
    height: 100px;
    padding: 5px 8px 4px;
    border: 1px solid #d3d3d3;
    font-size: 13px;
}

/* label */
label {
    position: relative;
    display: inline-block;
}
label:hover { cursor: pointer; }
label input {
    position: absolute;
    filter: alpha(opacity=0);
    opacity: 0;
}

/* チェックボックス */
.type_check { padding-left: 20px; }
.type_check:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 16px;
    height: 16px;
    background: url(../images/common/sprite_label.png) no-repeat 0 -150px;
    content: " ";
}
.type_check.checked:before { background-position: -50px -150px; }

.type_check_already { padding-left: 20px; }
.type_check_already:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 16px;
    height: 16px;
    background: url(../images/common/sprite_label.png) no-repeat -50px -150px;
    content: " ";
}

/* ラジオボタン */
.type_radio { padding-left: 20px; }
.type_radio:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 17px;
    height: 17px;
    background: url(../images/common/sprite_label.png) no-repeat 0 -100px;
    content: " ";
}
.type_radio.checked:before { background-position: -50px -100px; }

/* インライン */
.list_inline li {
    display: inline-block;
    margin: 10px 10px 0 0;
}
.list_inline li:last-child { margin-left: 0; }

/* ブロック */
.list_block li { margin-top: 10px; }
.list_block li:first-child { margin-top: 0; }

.label_block label {
    display: block;
    margin-top: 10px;
    padding: 10px 15px 9px 38px;
    border-radius: 4px;
    background: #ddd;
}
.label_block label:first-child { margin-top; 0; }

.label_block label:before {
   top: 9px;
   left: 15px;
}
.label_block .checked { font-weight: bold; }


/* select */
.wrap_select {
    position: relative;
    overflow: hidden;
    padding-right: 20px;
    border: 1px solid #d3d3d3;
}
.wrap_select:before {
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 8px;
    height: 4px;
    margin-top: -2px;
    background: url(../images/common/sprite_arrow.png) no-repeat -150px -100px;
    content: " ";
    pointer-events: none;
}

.wrap_select select {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance: none;
    width: 120%;
    padding: 3px 0 2px 8px;
    border: none;
    background: #fff;
}
.wrap_select select::-ms-expand {
    display: none;
}

/* layout*/
.form .text { margin: 20px 0; }

/* table */
.table_form {
    width: 100%;
    border-bottom: 1px solid #d3d3d3;
}
.table_form + .table_form { margin-top: 20px; }
.table_form th,
.table_form td {
    padding: 10px;
    border-top: 1px solid #d3d3d3;
    font-weight: normal;
    text-align: left;
}
.table_form th {
    background: #f4f4f4;
}

/* 入力テーブル */
.form .table_form th { width: 230px; }
.form .table_form .primary { width: 80px; }
.form .table_form .secondary { width: 110px; }
.form .table_form td { width: 608px; }
.table_form td.icon {
    display: table-cell;
    width: 30px;
    background: #f4f4f4;
}
.table_form td p { margin: 10px; }
.table_form td p:first-child { margin: 0 0 10px; }
.table_form td p:last-child { margin-bottom: 0; }

.form input[type=text] {
    width: 382px;
    margin-right: 5px;
}
.form input.medium { width: 162px; }
.form input.short { width: 38px; }
.form .wrap_select { width: 160px; }

.form .reg {
    display: inline-block;
    margin-right: 5px;
    padding: 3px 5px 2px;
    background: #a7a7a7;
    color: #fff;
    font-size: 10px;
}

/* フォーム遷移ボタン */
.form .box_button {
    margin: 40px 0 0;
    padding: 20px 0;
    background: #f4f4f4;
    text-align: center;
}
.form .box_button .button:hover { border-top-color: #f4f4f4; }

.form + .box_button {
    margin-top: 30px;
    text-align: center;
}

/*
同意ボックス
-----------------------------------*/
.box_rule {
    padding: 20px;
    background: #f4f4f4;
}
.box_rule iframe {
    width: 100%;
    height: 265px;
    border: 1px solid #f4f4f4;
    background :#fff;
}
.box_rule_inner {
    padding: 15px 20px 0;
}
.box_rule p,
.box_rule_inner p { margin: 0 0 15px; }

.box_rule .box_button { margin-top: 20px; }
.box_rule .box_button .button:hover { border-top-color: #f4f4f4; }


/* 利用規約（SP版から移植） */
.box_rule .wrap {
    display: block;
    overflow: auto;
    height: 265px;
    margin: 20px 10px;
    border: none;
    background: #fff;
    -webkit-overflow-scrolling: touch;
}
.box_rule .list_block { margin: 10px; }
.box_rule .list_block label { border: 1px solid #fff; }


.box_rule2 .wrap {
    display: block;
    border: 1px;
    overflow: auto;
    height: 265px;
    margin: 20px 0px;
    border: #d3d3d3 solid 1px;
    background: #fff;
    -webkit-overflow-scrolling: touch;
}
/*
もっと見る
-----------------------------------*/
.more01 {
    position: relative;
    display: block;
    padding: 10px 0 9px;
    background: #f4f4f4;
    font-weight: bold;
    text-align: center;
}
.more02 {
    position: relative;
    display: block;
    padding: 10px 0 9px;
    background: #e9e9e9;
    text-align: center;
}
.more03 {
    position: relative;
    display: block;
    padding: 10px 0 9px;
    background: #fff;
    text-align: center;
}
.more01:after,
.more02:after,
.more03:after {
    position: absolute;
    top: 50%;
    right: 20px;
    display: block;
    width: 6px;
    height: 10px;
    margin-top: -5px;
    background: url(../images/common/sprite_arrow.png) no-repeat -200px top;
    content: " ";
}
.more01:hover,
.more02:hover,
.more03:hover {
    text-decoration: none;
    filter: alpha(opacity=60);
    opacity: 0.6;
}


/*
ページ移動リンク（前に戻るなど）
-----------------------------------*/
.link_back {
    position: absolute;
    top: 20px;
    right: 20px;
    display: block;
    padding: 15px 38px 14px 20px;
    background: #fff;
    font-size: 10px;
    text-align: center;
}
.link_back:after {
    position: absolute;
    top: 50%;
    right: 13px;
    display: block;
    width: 6px;
    height: 10px;
    margin-top: -5px;
    background: url(../images/common/sprite_arrow.png) no-repeat -200px top;
    content: " ";
}
.link_back:hover {
    color: #de0010;
    text-decoration: none;
}
.link_back:hover:after { background-position: -200px -100px; }

/*
ボタン
-----------------------------------*/
.button {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    width: 300px;
    padding: 15px 0 14px;
    border: none;
    border-radius: 4px;
    background: #f4f4f4;
    box-shadow: 0 2px #a7a7a7;
    font-size: 16px;
    text-align: center;
    vertical-align: bottom;
}
.button:hover {
    top: 2px;
    background: #e9e9e9;
    box-shadow: none;
    text-decoration: none;
}
/* 決定系ボタン */
.button_decision {
    background: #e53340;
    box-shadow: 0 2px #930c1e;
    color: #fff;
}
.button_decision:hover {
    background: #de0010;
}

/* 灰色ボタン */
.button_gray {
    background: #d3d3d3;
    box-shadow: 0 2px #7e7e7e;
}
.button_gray:hover {
    background: #a7a7a7;
}

/* 濃い灰色ボタン */
.button_dgray {
    background: #666;
    box-shadow: 0 2px #393939;
    color: #fff;
}
.button_dgray:hover {
    background: #4e4e4e;
}

/* カートに入れるボタン：ヘッダ */
header .button_cart {
    width: 150px;
    margin-top: 10px;
    padding-left: 20px;
    background: #e53340;
    box-shadow: 0 2px #930c1e;
    color: #fff;
    font-size: 14px;
}
header .button_cart:after {
    position: absolute;
    top: 50%;
    left: 10px;
    display: block;
    width: 26px;
    height: 22px;
    margin-top: -11px;
    background: url(../images/common/ico_cart.png) no-repeat left top;
    content: " ";
}
.button_cart:hover {
    background: #de0010;
}

/* 次へボタン */
.button_next:after {
    position: absolute;
    top: 50%;
    right: 20px;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin-top: -12px;
    background: #4e4e4e url(../images/common/sprite_arrow.png) no-repeat 8px  -45px;
    content: " ";
}
.button_decision.button_next:after { background: #fff url(../images/common/sprite_arrow.png) no-repeat -192px  -45px; }
.button_gray.button_next:after { background: #fff url(../images/common/sprite_arrow.png) no-repeat 8px  5px; }


/* 戻るボタン */
.button_prev:after {
    position: absolute;
    top: 50%;
    left: 20px;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin-top: -12px;
    background: #4e4e4e url(../images/common/sprite_arrow.png) no-repeat -42px  -45px;
    content: " ";
}

/* 小サイズボタン */
.button_small {
    width: auto;
    padding: 8px 10px 7px;
    font-size: 11px;
}


/* 横並びボタン */
.box_button.multiple { text-align: center; }
.box_button.multiple .button {
    margin: 0 20px;
}
/*
アイコン
-----------------------------------*/
.icon {
    padding: 3px 8px 2px;
    display: inline-block;
    background: #04436d;
    color: #fff;
    font-size: 10px;
}
.icon.garage { background: #de0010; }
.icon.online_only { background: #8f54b5; }

.icon.require {
    padding: 3px 5px 2px;
    background: #e53340;
    font-weight: normal;
}

/*
バナー
-----------------------------------*/
.box_banner { margin-bottom: 10px; }
.box_banner a {
    position: relative;
    float: left;
    width: 470px;
    margin-left: 10px;
}
.box_banner a:first-child { margin-left: 0; }
/*161212遠藤 size_large追加*/
.box_banner.size_large a { width: 950px; }
.box_banner.size_middle a { width: 470px; }
.box_banner.size_small a { width: 310px; }

.box_banner a:hover img {
    filter: alpha(opacity=60);
    opacity: 0.6;
}


/* もっと見るボタンを保持するもの */
.box_more a:hover img {
    filter: alpha(opacity=100);
    opacity: 1;
}
.box_more a:hover:before {
    position: absolute;
    top: 0;
    bottom: 0;
    display: block;
    width: 100%;
    background: rgba(0, 0, 0, .3);
    content: " ";
}
.box_more a:hover:after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 200px;
    height: 14px;
    margin: -15px 0 0 -100px;
    padding: 15px 0 14px;
    border: 1px solid #fff;
    border-radius: 4px;
    color :#fff;
    content: "詳細を見る";
    text-align: center;
}

/*
テキストバナー
-----------------------------------*/
.box_banner_txt {
    position: relative;
    margin: 20px 0;
    border: 1px solid #d3d3d3;
}
.box_banner_txt a {
    display: table;
    width: 906px;
    border: 6px solid #f4f4f4;
}
.box_banner_txt a:hover { text-decoration: none; }
.box_banner_txt .title,
.box_banner_txt .description {
    display: table-cell;
    vertical-align: middle;
}
.box_banner_txt .title {
    padding: 10px 50px 9px;
    color: #e53340;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}
.box_banner_txt a:hover .title {
    filter: alpha(opacity=60);
    opacity: 0.6;
}
.box_banner_txt .title .text {
    display: block;
    margin: 0;
    color: #222;
    font-size: 11px;
    font-weight: normal;
}
.box_banner_txt .title img {
    margin-right: 15px;
    vertical-align: middle;
}
.box_banner_txt .description {
    padding: 10px 10px 9px 0;
    font-size: 11px;
}
.box_banner_txt a:before {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    display: block;
    width: 30px;
    background: #e53340;
    content: " ";
}
.box_banner_txt a:after {
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 8px;
    height: 14px;
    margin-top: -7px;
    background: url(../images/common/sprite_arrow.png) no-repeat 0 -50px;
    content: " ";
}
.box_banner_txt a:hover:before { background :#ed7079; }
.box_banner_txt .icon {
    float: left;
    margin-right: 10px;
}

/*
サイドカラム
-----------------------------------*/
#side > div { margin-bottom: 20px; }
#side .primary li {
    position: relative;
    border-bottom: 1px solid #d3d3d3;
}
#side .primary li a {
    position: relative;
    display: block;
    padding: 10px 26px 9px 8px;
    border-left: 2px solid #fff;
    outline: none;
}
#side .primary li a:hover {
    border-left-color: #de0010;
    color: #e53340;
    text-decoration: none;
}
#side .primary .open .acc_trigger,
#side .primary .open .acc_trigger:hover,
#side .primary .open .acc_trigger.hover:hover { border-left-color: #e9e9e9; }
#side .primary li .acc_trigger:hover {
    text-decoration: underline;
}
#side .list_category li .acc_trigger:hover,
#side .list_category > li > a:hover {
    border-left-color: #fff;
    color: #e53340;
    text-decoration: underline;
}
#side .primary li .acc_trigger.hover:hover {
    color: #222;
    border-left-color: #fff;
    text-decoration: none;
}
#side .list_category > li > a {
    padding-left: 35px;
}
#side .primary i {
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -10px;
}

#side .secondary {
    margin: 0 10px 10px;
    background: #fff;
}
#side .secondary li { position: relative; }

#side .tertiary {
    position: absolute;
    top: 0;
    left: 200px;
    display: none;
    width: 420px;
    padding: 15px;
    background: #f4f4f4;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, .5);
    z-index: 10;
}
#side .secondary > li:hover .tertiary { display: block; }
#side .tertiary li {
    float: left;
    width: 130px;
    margin-left: 15px;
    border: none;
}
#side .primary .tertiary a { border-left: none; }
#side .primary .open {
    background: #e7e7e7;
}
#side .tertiary li:first-child { margin-left: 0; }
#side .tertiary .list_side a:hover img {
    filter: alpha(opacity=60);
    opacity: 0.6;
}
#side .tertiary .list_side .image {
    display: table-cell;
    width: 130px;
    height: 130px;
    background: #fff;
    text-align: center;
    vertical-align: middle;
}
#side .tertiary .list_side img { max-width: 130px; }
#side .tertiary li a { padding: 0; }
#side .tertiary img { margin: 0 0 5px; }
#side .tertiary p {
    word-break: keep-all;
    word-wrap: break-word;
    margin: 0;
}
#side .price { font-size: 12px; }
#side .tertiary .more03 {
    margin-bottom: 10px;
    font-size: 12px;
}
#side .tertiary .more03:hover {
    filter: alpha(opacity=100);
    opacity: 1;
}


#side .primary li a:after {
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 6px;
    height: 10px;
    margin-top: -5px;
    background: url(../images/common/sprite_arrow.png) no-repeat -200px 0;
    content: " ";
}
#side .primary li a:hover:after { background-position: -200px -100px; }
#side .tertiary li a:after { display: none; }


/* アコーディオン*/
#side .primary li span {
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    width: 18px;
    height: 18px;
    margin-top: -15px;
    border: 6px solid #fff;
    border-radius: 2px;
    background: #e9e9e9 url(../images/common/sprite_arrow.png) no-repeat -346px 7px;
    z-index: 5;
}
#side .primary li span:after {
    position: absolute;
    top: -1px;
    left: -1px;
    display: block;
    width: 18px;
    height: 18px;
    border: 1px solid #e9e9e9;
    border-radius: 2px;
    content: " ";
}
#side .primary li a span:hover {
    border-color: #fff;
    background: #e84d58 url(../images/common/sprite_arrow.png) no-repeat -346px -193px;
}
#side .primary li a span:hover:after { border-color: #fff; }
#side .primary .open span,
#side .primary .open a span:hover  {
    border-color: #e9e9e9;
    background: #fff url(../images/common/sprite_arrow.png) no-repeat -296px 7px;
}
#side .primary .open span:after,
#side .primary .open a span:hover:after  { border-color: #fff; }

/*
フッター
-----------------------------------*/
footer.global {
    position: relative;
    margin-top: 50px;
}

footer.global .inner {
    width: 1200px;
    margin: 0 auto;
}
footer.global .inner .title {
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: bold;
}
/* ページ上部へ戻る */
#page_top {
    position: fixed;
    bottom: 50px;
    left: 50%;
    margin: 0 0 0 620px;
}
#page_top a {
    position: relative;
    display: block;
    width: 50px;
    height: 33px;
    padding-top: 18px;
    border-radius: 50%;
    background: #393939;
    color: #fff;
    font-size: 12px;
    line-height: 1.1;
    text-align: center;
}
#page_top a:after {
    position: absolute;
    top: 10px;
    left: 50%;
    display: block;
    width: 15px;
    height: 6px;
    margin-left: -7px;
    background: url(../images/common/sprite_arrow.png) no-repeat -100px -50px;
    content :" "
}
#page_top a:hover {
    text-decoration: none;
    filter: alpha(opacity=60);
    opacity: 0.6;
}


/* フッター内サイトマップ */
footer .sitemap {
    background: #e9e9e9;
    font-size: 12px;
}
footer .sitemap ul {
    float: left;
    width: 200px;
    margin-top: 15px;
}
footer .sitemap li {
    margin-bottom: 15px;
}

/* ご利用ガイド */
footer.global .guide {
    margin: 15px auto 20px;
}
footer.global .guide li {
    float: left;
    width: 232px;
    margin-left: 10px;
}
footer.global .guide li:first-child { margin-left: 0; }
footer.global .guide a {
    position: relative;
    display: block;
    padding: 20px 20px 19px;
    border: 1px solid #d3d3d3;
    text-align: center;
}
footer.global .guide a:hover {
    text-decoration: none;
    filter: alpha(opacity=60);
    opacity: 0.6;
}
footer.global .guide img {
    position: absolute;
    top: 50%;
    left: 12px;
    margin-top: -11px;
}
footer.global .guide a:after {
    position: absolute;
    top: 50%;
    right: 20px;
    display: block;
    width: 6px;
    height: 10px;
    margin-top: -5px;
    background: url(../images/common/sprite_arrow.png) no-repeat -200px top;
    content: " ";
}

/* お支払い方法 */
footer.global .payment {
    margin-bottom: 20px;
}
footer.global .payment ul {
    display: table;
    width: 1200px;
    background: url(../images/common/bg_footer_payment.png) no-repeat right center;
}
footer.global .payment li {
    display: table-cell;
    width: 239px;
    padding-left: 1px;
    background: url(../images/common/bg_footer_payment.png) no-repeat left center;
    text-align: center;
    vertical-align: top;
}

footer.global .payment p {
    margin: 10px 0 0 10px;
    text-align: left;
}
footer.global .payment p img { margin: 0 10px; }

footer.global .payment .small {
    width: 78px;
    vertical-align: middle;
}
footer.global .payment .small div {
    width: 30px;
    height: 30px;
    margin: 10px auto;
    padding: 6px;
    border: 2px solid #d3d3d3;
    border-radius: 3px;
    background: #fff;
    color: #222;
    font-size: 14px;
    line-height: 16px;
}

footer.global .payment .small div.bank {
    border-color: #c3e2f8;
    color: #2490dd;
}
footer.global .payment .small div.cod {
    border-color: #f8d9b8;
    color: #f97f00;
}
footer.global .payment .small div.installment {
    border-color: #b5e2c0;
    color: #2eb350;
}


/* PR */
footer.global .pr {
    padding: 20px 0;
    background: #393939;
    color: #fff;
}
footer.global .pr li {
    float: left;
    width: 270px;
    padding-right: 30px;
}
footer.global .pr p {
    margin: 0;
    font-size: 10px;
}
footer.global .pr p:first-child {
    margin: 0 0 5px;
    font-size: 12px;
    font-weight: bold;
}

/* 著作権他 */
footer.global .copyright {
    float: left;
    margin: 20px 0 0;
}
footer.global .copyright a {
    float: left;
    margin-right: 15px;
}
footer.global .copyright p,
footer.global .copyright small {
    display: block;
    margin:  0;
    font-size: 11px;
    white-space: nowrap;
}

/* フッターサポートリンク */
footer.global .support {
    float: right;
    margin: 10px 0 15px;
}
footer.global .support li {
    display: inline-block;
}
footer.global .support li:before { content: "｜"; }
footer.global .support li:first-child:before { content: " "; }

/* フッターソーシャル */
footer.global .social {
    float: right;
    clear: right;
}
footer.global .social li {
    float: left;
    margin-left: 1px;
}
footer .social a:hover img {
    filter: alpha(opacity=60);
    opacity: 0.6;
}

/* clearfix */
header:after,
footer:after,
main:after,
section:after,
div:after,
ul:after,
ol:after,
dl:after,
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden;
}
header, footer, main, section, div, ul, ol, dl,.clearfix { display: inline-block; }
header, footer, main, section, div, ul, ol, dl, .clearfix { display: block; }