@charset "utf-8";
@import "level2.css";
/*====================================================================

shop.css

====================================================================*/
/*--------------------------------------------------------------------

--------------------------------------------------------------------*/

h3.text-title{
   height: 44px;
   line-height: 44px;
   font-weight: normal;
   padding-left: 10px;
   background: url(/jws/shop/img/h3-bg.png) no-repeat left top;
}

.align-center{text-align: center !important;}
.align-left{text-align: left !important;}
.align-right{text-align: right !important;}

hr.bdr{
   display: block;
   height: 1px;
   line-heigth: 1;
   text-indent: -9999px;
   overflow: hidden;
   border: none;
   border-top: solid 1px #ddd;
   margin: 30px 0;
}

.btns{
   text-align: center;
   margin-top: 20px;
   vertical-align: top;
   overflow: hidden;
   zoom: 1;
}
.btns .btn,
.btns input[type="button"]{
   display: inline-block;
   margin: 0 10px;
}
.btns .btn a,
.btns input[type="button"]{
   line-height: 1;
   font-size: 12px;
   text-align: center;
   text-decoration: none;
   padding: 10px 20px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}
.btns input[type="button"]{
   border: none;
   margin: 0;
   cursor: pointer;
   vertical-align: top;
   padding: 9px 20px 10px;
}
.btns .btn a{display: block;}

input[type="button"].submit,
.btn.cart a{
   background-color: #0182C4;
   color: #fff;
}
.btn.cart a:hover{
   background-color: #0d96dc;
}

.btn.back a{background-color: #333; color: #fff;}
.btn.back a:hover{background-color: #222;}

.btn.top a{background-color: #14B5C3; color: #fff;}
.btn.top a:hover{background-color: #0e99a5;}

.btn.link a{background-color: #14B5C3; color: #fff;}
.btn.link a:hover{background-color: #0e99a5;}

.btn.logout a{background-color: #999; color: #fff;}
.btn.logout a:hover{background-color: #888;}



.btns.inline,
.btns.inline .btn{
   margin: 0;
}


/*一覧*/
.product-items{}
.product-items ul{
   display: block;
   position: relative;
   vertical-align: top;
}
.product-items ul li{
   display: block;
   margin-right: 0px;
   vertical-align: top;
   overflow: hidden;
   margin-top: 30px;
   padding-bottom: 30px;
   border-bottom: solid 1px #ddd;
}
.product-items ul li:last-child{
   border: none;
}
.product-items .thumb{
   float: left;
   width: 200px;
}
.product-items .thumb .inner{
   text-align: center;
   background-color: #efefef;
   border: solid 1px #ddd;
   padding: 20px 0;
   margin-right: 20px;
}
.product-items .thumb img{
   display: inline-block;
}
.product-items .info{}
.product-items .info .title{
   font-size: 16px;
}
.product-items .info .btn{
   display: inline-block;
   margin-top: 10px;
}
.product-items .info .btn a{
   display: block;
   line-height: 1;
   font-size: 12px;
   text-align: center;
   text-decoration: none;
   padding: 10px 20px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}
.product-items .info .btn.cart a{
   background-color: #0182C4;
   color: #fff;
}
.product-items .info .btn.cart a:hover{
   background-color: #0d96dc;
}
.product-items .info .order-suspend-notice{
   margin-top: 10px;
   font-size: 13px;
   line-height: 1.6;
   color: #c00;
}


/*カート*/
.error{
   background-color: #f2dede;
   border: solid 1px #ebccd1;
   color: #a94442;
   padding: 10px 20px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}

.cart-content{}
.cart-content .title{}
.cart-content .title .btn{
   display: inline-block;
   cursor: pointer;
   font-size: 10px;
   line-height: 1;
   color: #fff;
   background-color: #555;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
   padding: 5px 10px;
   vertical-align: middle;
   text-decoration: none;
}
.cart-content .title .btn:hover{
   background-color: #444;
}

.cart-content .item-list table th,
.cart-content .item-list table td{}
.cart-content .item-list table th{
   text-align: center !important;
}


.cart-content .item-list .count-btn{
   display: inline-block;
   width: 20px;
   height: 20px;
   line-height: 20px;
   color: #fff;
   text-align: center;
   background: #333;
   cursor: pointer;
   vertical-align: middle;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
}
.cart-content .item-list .count-btn:hover{
   background: #555;
}

.cart-content .receiving-time{
   margin-top: 10px
}

.cart-content .caution{
   font-size: 10px;
}

.payment-method{
   padding-top: 20px;
}
.payment-method .item{
   margin-bottom: 10px;
}
.payment-method .item .description{
   display: none;
   margin: 10px 25px;
   background: #f7f7f7;
   padding: 15px 20px;
}

.cart-content .destination-list{}
.cart-content .destination-list.disabled{
   filter: alpha(opacity=50);
   -khtml-opacity: 0.5;
   -moz-opacity: 0.5;
   opacity:0.5;
}
.cart-content .destination-list .add{
   text-align: right;
}

#billing-list{
   display: none;
   overflow: hidden;
}
#billing-list .iziModal-wrap{
}
#billing-list .title{
   text-align: center;
   padding: 20px;
   border-bottom: solid 1px #ddd;
}
#billing-list .item{
   border-bottom: solid 1px #ddd;
}
#billing-list .item.item-base{
   display: none;
}

#billing-list .item a{
   position: relative;
   display: block;
   color: #555;
   text-decoration: none;
   padding: 20px 30px;
}
#billing-list .item a:hover{
   background: #fafafa;
}
#billing-list .item a .btn{
   display: block;
   position: absolute;
   right: 30px;
   top: 50%;
   margin-top: -20px;
   height: 40px;
   line-height: 40px;
   padding: 0 30px;
   background: #ddd;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   cursor: pointer;
}
#billing-list .item .date{
   font-size: 10px;
   color: #888;
}


/*マイページ*/
.head-link{
   border-bottom: dotted 1px #ddd;
   margin-bottom: 30px;
   padding-bottom: 10px;
   text-align: left;
}
.foot-link{
   border-top: dotted 1px #ddd;
   margin-top: 30px;
   padding-top: 10px;
   text-align: right;
}










/*--------------------------------------------------------------------
inline-mode
--------------------------------------------------------------------*/
html.inline-mode,
html.inline-mode #wrapper{
   height: auto;
   background: none;
}
html.inline-mode #head,
html.inline-mode #rightpane,
html.inline-mode #footer{
   display: none;
}
html.inline-mode #container,
html.inline-mode #contents,
html.inline-mode #leftpane,
html.inline-mode #boxbg{
   width: auto;
   float: none;
   margin: auto;
   background: none;
}
html.inline-mode #contents{padding-bottom: 30px;}
html.inline-mode #leftpane{border: none;padding-bottom: 0;}

html.inline-mode h2{display: none;}

html.inline-mode h3.text-title{
   background: none;
   text-align: center;
   border-bottom: solid 1px #ddd;
   padding-left: 0;
}

html.inline-mode .head-link{display: none;}

html.inline-mode .box,
html.inline-mode .box .cart-content table{
   width: auto !important;
   margin: auto;
}
html.inline-mode .box .cart-content h4.title{
   text-align: center;
   padding: 100px 0 !important;
   margin-top: 0 !important;
}
html.inline-mode .box .btns{
   text-align: center;
}
html.inline-mode .box .btns .btn{
   display: inline-block;
   width: 120px;
}
html.inline-mode .cart-content .error{
   margin: 20px 20px 0;
}

html.inline-mode .inline-hide{display: none !important;}
.inline-show{display: none;}
html.inline-mode .inline-show{display: block;}