@charset "utf-8";
/* ===================================================================
CSS information
file name  :block.css
style info :ブロック用
=================================================================== */
/*-----------------------------------------------
ブロック共通
----------------------------------------------- */
.title_block {
    color: #FFF;
    font-size: 130%;
    font-weight: normal;
    margin: 0;
    padding: 10px;
    background-color: #333333;
    text-align: left;
    text-overflow: ellipsis;
    clear: both;
}

/*-----------------------------------------------
オススメ商品
----------------------------------------------- */
#recommend_area {
    padding-top: 10px;
    margin-bottom: 20px;
}
#recommend_area li {
    width: 290px;
}
.recommendblock {
    width: 270px;
    padding: 5px 10px 5px 8px;
    margin: 0 auto;
    clear: both;
}
.recommendblock img {
    width: 80px;
    float: left;
}
.recommendblock .productContents {
    width: 68%;
    float: right;
    text-align: left;
}
.recommendblock .productContents p {
    clear: both;
}
.recommendblock .productContents p.comment {
    width: 17em;
    height: 3.7em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    clear: both;
}
.recommendblock .sale_price {
    clear: both;
    float: right;
    text-align: right;
}
#recommend_area div.moveWrap {
    width: 290px;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    -webkit-box-sizing: border-box;
}

#recommend_area ul.moveWrapBG {
    margin: 0;
    padding: 0;
    display: inline-block;
    position: relative;
    width: 100%;
    height: auto;
    visibility: hidden;
    -webkit-box-sizing: border-box;
}
#recommend_area div.slideMask {
    margin: 0 auto;
    padding: 0;
    margin-right: 1px;
    position: absolute;
    top: 0;
    left: 0;
    border: 4px #FFF solid;
    -webkit-box-sizing: border-box;
}
#recommend_area div.moveWrap>ul.move {
    width: 10000px;
    margin: 0;
    padding: 0;
    position: relative;
    left: 0;
    top: 0;
    list-style: none;
    -webkit-transition: all 0.6s ease-in-out;
    -webkit-transform: translate3d(0,0,0);
    margin: 0;
    padding: 0;
    display: none;
}
#recommend_area div.moveWrap>ul.move li.slideUnit {
    width: 290px!important;
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    text-align: center;
    -webkit-box-sizing: border-box;
}
#recommend_area li.slideUnit>div {
    padding: 4px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    -webkit-box-sizing: border-box;
}
#recommend_area div.flickSlideBottom {
    width: 100%;
    margin-top: 5px;
    border-top: #DBDBDB solid 1px;
    background: -moz-linear-gradient(center top, #FFFFFF 0%,#DEE4EA 95%,#FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF),color-stop(0.95, #DEE4EA),color-stop(0, #FFFFFF));
    border-bottom-right-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    moz-border-bottom-left-radius: 8px;
}
#recommend_area div.flickSlideBottom div.bottomLeft,
#recommend_area div.flickSlideBottom div.bottomRight {
    display: table-cell;
    -webkit-box-sizing: border-box;
    -webkit-box-shadow: rgba(0, 0, 0, 0.0976562) 0px 1px 3px, rgba(255, 255, 255, 1) 0px 0px 0px inset;
    vertical-align: middle;
    padding: 0 10px;
}
#recommend_area div.flickSlideBottom div.bottomRight {
    font-size: 16px;
    font-weight: bold;
    color: #7F7F7F;
    background-color: transparent;
    border-bottom-right-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-bottom-right-radius: 8px;
    border-left: #DBDBDB solid 1px;
}
#recommend_area div.flickSlideBottom div.bottomLeft {
    font-size: 16px;
    font-weight: bold;
    color: #7F7F7F;
    background-color: transparent;
    border-bottom-left-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-bottom-left-radius: 8px;
    border-right: #DBDBDB solid 1px;
}
#recommend_area div.flickSlideBottom div.bottomLeft:after {
    font-size: 10px;
    padding: 5px;
    text-align: left;
    display: table-cell;
}
#recommend_area div.flickSlideBottom div.bottomLeft:before {
    margin-top: 2px;
    padding: 5px;
    text-align: left;
    display: table-cell;
}
#recommend_area div.flickSlideBottom div.bottomRight:before {
    font-size: 10px;
    padding: 5px;
    text-align: right;
    display: table-cell;
}
#recommend_area div.flickSlideBottom div.bottomRight:after {
    margin-top: 2px;
    padding: 5px;
    text-align: right;
    display: table-cell;
}
#recommend_area div.flickSlideBottom ul.slidePager {
    width: 100%;
    margin: 0;
    padding: 0;
    display: table-cell;
    text-align: center;
}
#recommend_area div.flickSlideBottom ul.slidePager li.slidePagerPointer {
    font-size: 10px;
    width: 6px;
    height: 6px;
    margin: 12px 6px 6px 6px;
    display: inline-block;
    background-color: #CCC;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
}
#recommend_area div.flickSlideBottom ul.slidePager li.slidePagerPointer.active {
    background-color: #333;
}

/*-----------------------------------------------
カテゴリリスト（アコーディオン）
----------------------------------------------- */
#category_area {
    margin-bottom: 20px;
}
#categorytree ul {
	margin-top: -10px;
    clear: both;
}
#categorytree li {
	border-bottom: solid 1px #e9e9e9;
	padding: 15px 10px 15px 20px;
    overflow: hidden;
}
#categorytree li a {
    display: block;
}
#categorytree li ul {
}
#categorytree li ul li {
	border-bottom: none;
	padding: 15px 0 0 10px;
}
#categorytree .category_header.plus,
#categorytree .category_header.minus {
	float: right;
}
#categorytree .category_header.plus > a,
#categorytree .category_header.minus > a {
}
#categorytree .category_body {
	float: left;
}
/*レベル調整*/
#categorytree .level1 .category_header {
    width: 1.5em;
}
#categorytree .level1 .category_body {
    width: 86.5%;
}
#categorytree .level2 .category_header {
    width: 1.5em;
    margin-left: 2em;
}
#categorytree .level2 .category_body {
    width: 79%;
}
#categorytree .level3 .category_header {
    width: 1.5em;
    margin-left: 3.4em;
}
#categorytree .level3 .category_body {
    width: 71.5%;
}
#categorytree .level4 .category_header {
    width: 1.5em;
    margin-left: 4.8em;
}
#categorytree .level4 .category_body {
    width: 64%;
}
#categorytree .level5 .category_header {
    margin-left: 6.2em;
}
#categorytree .level5 .category_body {
    width: 56%;
}

/*リンクカラー*/
#categorytree .category_body a:link,
#categorytree .category_body a:visited {
    color: #39C;
    text-decoration: none;
    cursor: pointer;
}
#categorytree .category_header.plus a,
#categorytree .category_header.minus a {
}


/*-----------------------------------------------
news
----------------------------------------------- */
#news_area {
    margin-bottom: 20px;
}
#news_area ul {
	margin-top: -10px;
}
#news_area ul li {
	padding: 10px 20px;
    font-size: calc(1rem - 3px);
    border-bottom: solid 1px #e9e9e9;
}
#news_area .news_date {
	clear: both;
    font-size: calc(1rem - 5px);
}
.news_detail h2 {
    padding-left: 0;
}
p.news_close a,
p.news_close a:hover {
	color: #000;
    display: block;
    margin: 10px 0 5px;
    border: 1px solid #A9ABAD;
    border-radius: 5px;
    padding: 5px;
}
p.news_close {
    text-align: center;
}

/* ===============================================
▼カレンダー
=============================================== */

#cart_area .btn,#cart_area .btn a,#container div#login_area .block_body .btn{text-align:center}
.side_column{overflow-x:hidden}
#main_column .block_body,.side_column .block_body{border:1px solid #ededed}
.side_column .block_body .box{border:1px solid #ededed;width:145px}
#container .block_outer{padding:0 15px 10px}
#container #main_column .block_outer{padding:0 0 20px}
#container .side_column .block_outer{padding:0 0 10px}#container .block_outer .block_body dl.formlist{margin-bottom:8px}
#container .block_outer .block_body dl.formlist dd{margin-bottom:5px}
#container .block_outer .block_body dl.formlist dt{margin-bottom:3px;padding-left:15px;background:url(../img/icon/ico_arrow_03.gif) left no-repeat;font-size:90%}
#container .block_outer .block_body dl.formlist span{vertical-align:top}
#calender_area h2,#cart h2,#cart_area h2,#category_area h2,#login_area h2,#search_area h2{font-size:90%;background-color:#ededed;text-align:center;color:#333;padding:10px;font-weight:200}
#news_area h2.title_block {padding: 5px 0; font-weight: normal; text-align: center; font-size: 100%; background: #2D2D2E; color: #fff;}
#news_area h2,#recommend_area h2{padding:5px;margin-bottom:5px;border-bottom:none;font-size:130%;color:#565954;letter-spacing:2px}
#top-newsarea .news_contents{padding:10px;max-height:260px;height:auto!important;height:260px;overflow:auto;overflow-y:scroll}
#top-newsarea dl.newslist{background-color:#FFF;padding:10px;border-bottom:dotted 1px #ededed}
#top-newsarea dl.newslist a{color:#00BDED}
#top-newsarea dl.newslist:last-child{background-color:#FFF;padding:10px}
#top-newsarea dl.newslist dt{margin-bottom:5px}
#top-newsarea dl.newslist dd{margin-bottom:10px;padding-bottom:10px}
#top-newsarea span.rss{padding:10px}
#top-newsarea span.rss img{vertical-align:middle}#cart_area .information{padding:10px}
#cart_area .postage{margin-top:10px;padding-top:10px;background:url(../img/background/line_dot_01.gif) top repeat-x}
#cart_area .postage .point_announce{padding:2px 0 2px 20px;/*background:url(../img/icon/ico_price.gif) left top no-repeat*/}#cart_area .btn{padding:10px 0;border-top:1px dotted #ededed}
#cart_area .btn a{padding:10px;background:#009ee7;color:#FFF;display:block;border-radius:5px;margin:10px;text-decoration:none;font-size:90%}
#category_area li{padding-left:5px}
#category_area li.level1{border-bottom:dotted 1px #ededed;list-style-type:disc!important}
#calender_area table,#guide_area{border:none}
#category_area li.level1 p{/*padding-left:20px*/;margin:7px 3px;/*background:url(../img/icon/ico_arrow_01.gif) 2px 3px no-repeat*/}
#category_area li.level1 li p{/*background:url(../img/icon/ico_level.gif) 7px 7px no-repeat*/ background: none;}
#category_area li a{display:block;padding:0;color: #333;}
#category_area li.onmark p a.onlink:before {font-family: FontAwesome; content: "¥f105"; margin-right: 4px; color: #00b200;}

#guide_area li{margin-bottom:5px;letter-spacing:-.05em}
ul.button_like li{margin:0;padding:0 0 1px;background-color:#eee}
ul.button_like li a{margin:0;padding:10px 15px 10px 10px;border-bottom:none;border-color:#EEEEEE;display:block;text-decoration:none;outline:0;color:#333}
ul.button_like li a:link:visited{text-decoration:none;color:#fff}
ul.button_like li a:link:hover{text-decoration:none;background-color:#333;color:#fff}ul.button_like li a:hover{color:#fff}
#container div#login_area .block_body{padding:10px}
#container div#login_area .block_body p{margin-bottom:5px}
#container .login_area dl.formlist{margin-bottom:8px;width:450px}
#container .login_area dl.formlist dt{margin-bottom:3px;padding-left:15px;color:#333;background:url(../img/icon/ico_arrow_03.gif) left no-repeat;width:110px;float:left;font-size:90%}
#container .login_area dl.formlist dd{margin-bottom:5px;float:right;width:300px;vertical-align:bottom;text-align:left}
#container div#login_area .block_body .mini{margin-top:5px;letter-spacing:-.01em}
#container div#search_area .block_body{padding:10px}
#container div#search_area .block_body .btn{text-align:center}
#calender_area{width:100%;margin:auto;text-align:right}
#calender_area tr{border:1px solid #ededed}
#calender_area table {margin: 3px auto;}
#calender_area table td{padding:8px;border:none}
#calender_area table th{padding:5px 0;text-align:center;border-color:#ededed}
#calender_area .tp_calender{border:1px solid}
#calender_area tbody td{border:1px solid #ededed;text-align:center}
#calender_area .nextDate{background-color:#51D1F2;color:#fff;font-weight:700}
#calender_area table .month{margin-bottom:5px;padding:5px;font-size:100%;text-align:center;background-color:#555;color:#fff}
#calender_area .delivery{color:#28B9DE;font-size:16px;font-weight:500;margin-right:10px}
#calender_area .information{margin-left:10px;color:#656565;font-size:16px;font-weight:500}
#recommend_area .block_body,#whobought_area .product_item{padding:5px 0 10px;border:none}
#recommend_area .block_body p,#whobought_area .product_item p{margin:0 0 5px}
#recommend_area .block_body img,#whobought_area .product_item img{margin:0 5px 0 0}
#recommend_area .block_body h3,
#whobought_area .product_item h3{font-size:100%;font-weight:400}
.side_column #recommend_area .product_item{margin-bottom:10px}
#main_column #recommend_area .block_body .productImage,#whobought_area .product_item .productImage{margin-bottom:10px;float:left;width:100%}
.side_column #recommend_area .block_body .productImage{float:none;text-align:center;width:auto}
#main_column #recommend_area .product_item,#whobought_area .product_item{float:left;width:18%;padding-left:1%;padding-right:1%}
#calender_area .off {
    color: #f00;
    background-color: #FEE;
    text-align:center
}
#calender_area .today {
    background-color: #B3E5FC;
    font-weight: bold;
}