@charset "utf-8";



/*** main contents ***/
.main .mainContents {
	margin-left: 10px;
	margin-right: 10px;
	padding-bottom: 20px;
}

.main h1 {
	color: #000;
	font-size: 13px;
	margin-bottom: 10px;
	padding-top: 10px;
}



/*----------------------------------------------------
 parts block
----------------------------------------------------*/

/*** news ***/
.main .mainContents ul.news {
	font-size: 12px;
}

.main .mainContents ul.news li {
	margin-bottom: 10px;
}

.main .mainContents ul.news li:last-child {
	margin-bottom: 0px;
}

.main .mainContents ul.news li dl dt {
}

.main .mainContents ul.news li dl dd span {
	color: #cc0000;
}

.clubkai .main .mainContents ul.news {
	border-bottom: 1px dotted #ccc;
	padding-bottom: 10px;
}


/*** ログイン ***/
.loginForm input {
	width: 96%;
	border: 1px solid #ccc;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.initialRegistration {
	border-top: 1px solid #ccc;
	padding-top: 20px;
}

.initialRegistration h1 {
	padding-top: 0px;
}



/*** item list ***/
.item,
.item-2,
.item-noArw {
	border-bottom: 1px dotted #ccc;
}

.item a {
	/*display: block;*/
	display: table;
	padding-top: 10px;
	padding-bottom: 10px;
	background-image: url(/contents_file/s/common/img/arrow_next_big.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 10px auto;
	width: 100%;
}

.item p.photo,
.item .detail,
.item-2 p.photo,
.item-2 .detail,
.item-noArw p.photo,
.item-noArw .detail,
.item-cart p.photo,
.item-cart .detail {
	/*float: left;*/
}

.item .detail,
.item-2 .detail,
.item-noArw .detail  {
	/*width: 206px;*/
	display: table-cell;
	padding-right: 15px;
}

.item p.photo  {
	/*margin-right: 10px;*/
	padding-right: 10px;
	position: relative;
	display: table-cell;
	width: 98px;
}

.item p.photo span {
	display: table-cell;
	width: 12px;
	height: 12px;
	background-color: #333333;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	position: absolute;
	top: 0px;
	left: 0px;
	color: #FFF;
	font-weight: bold;
	text-align: center;
	font-size: 9px;
	line-height: 1.4;
	vertical-align: middle;
}

.item .detail p,
.item-2 .detail p,
.item-noArw .detail p,
.item-cart .detail p {
	line-height: 1.3;
}

/* 黒太字 */
.notice-b {
	margin-bottom: 5px;
	font-weight: bold;
	line-height: 1.3;
}

/* 赤太字 */
.notice-r {
	color: #cc0000;
	font-weight: bold;
	line-height: 1.3;
}

/* 赤字(普通) */
.nomal-r {
	color: #cc0000;
	line-height: 1.3;
}

.item .detail .text,
.item-2 .detail .text {
	margin-bottom: 10px;
}


/** item-2 **/
.item-2 {
	padding-top: 10px;
	padding-bottom: 10px;
}

.item-2 a {
	display: block;
	/*background-image: url(/contents_file/s/common/img/arrow_item.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 10px auto;*/
}

.item-2 p.photo {
	margin-right: 5px;
	position: relative;
	/*border: 1px solid #F00;*/
}

.item-2 p.photo span {
	display: table-cell;
	width: 12px;
	height: 12px;
	background-color: #333333;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	position: absolute;
	top: 0px;
	left: 0px;
	color: #FFF;
	font-weight: bold;
	text-align: center;
	font-size: 9px;
	line-height: 1.4;
}

.item-2 .item-2inner {
	width: 50%;
	float: left;
}

.item-2 .item-2inner .detail {
	font-size: 10px;
	width: 82px;
}


/** item-noArw **/
.item-noArw {
	padding-top: 10px;
	padding-bottom: 10px;
}

.item-noArw p.photo {
	margin-right: 10px;
}

.item-noArw p.cartBtn button.cartin {
	margin-right: 10px;
	width: 150px;
	height: 25px;
	font-size: 12px;
	line-height: 1.6;
}


/** item-cart **/
.item-cartBox .item-cart {
	border-bottom: 1px solid #ccc;
	padding-top: 10px;
	padding-bottom: 10px;
}

.item-cartBox .item-cart:first-child {
	border-top: 1px solid #ccc;
}

.item-cartBox .item-cart p.photo {
	margin-right: 10px;
}

.item-cartBox .item-cart .detail {
	position: relative;
	width: 220px;
}

.item-cartBox .item-cart .detail p {
	width: 155px;
}

.item-cartBox .item-cart .detail p.text {
	margin-bottom: 5px;
}

.item-cartBox .item-cart .detail .inputQuantity {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 48px;
}

.item-cartBox .item-cart .detail .inputQuantity p {
	line-height: 1.5;
	width: auto;
}

.item-cartBox .item-cart .detail .inputQuantity input {
	width: 48px;
	/*height: 30px;*/
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
}

.item-cartBox .item-cart .detail .cartBtm-detail {
	border-top: 1px dotted #ccc;
	padding-top: 6px;
	clear: both;
	display: table;
	margin-top: 10px;
}

.item-cartBox .item-cart .detail .cartBtm-detail p.delete {
	/*display: table-cell;
	width: 40px;
	vertical-align: middle;*/
}

.item-cartBox .item-cart .detail .cartBtm-detail p.subtotal {
	display: table-cell;
	width: 100%;
	text-align: right;
	vertical-align: middle;
	height: 25px;
}

.item-cartBox .item-cart .detail .cartBtm-detail p.subtotal span {
	font-weight: bold;
	margin-left: 10px;
}



/** pagenation link **/
.pagelink {
	text-align: center;
}

.pagelink.upperlink {
	border-bottom: 1px dotted #ccc;
	padding-bottom: 10px;
}

.pagelink.lowerlink {
	padding-top: 10px;
	padding-bottom: 20px;
}

.pagelink .prevlink {
	float: left;
	display: inline-block;
}

.pagelink .nextlink {
	float: right;
	display: inline-block;
}

.pagelink .prevlink a,
.pagelink .nextlink a {
	display: block;
}

.pagelink .prevlink a {
	background-image: url(/contents_file/s/common/img/arrow_prev.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 6px auto;
	padding-left: 10px;
}

.pagelink .nextlink a {
	background-image: url(/contents_file/s/common/img/arrow_next.png);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 6px auto;
	padding-right: 10px;
}

.pagelink .pagecount {
	display: inline-block;
}



/** common carousel **/
.common-carousel {
	position: relative;
}

.common-carousel .common-carouselInner {
	overflow: hidden;

}

.common-carousel .common-carouselInner ul {
	/* for Animation */
	-webkit-transition: margin-left 0.4s ease-out;
	-moz-transition: margin-left 0.4s ease-out;
	-o-transition: margin-left 0.4s ease-out;
	transition: margin-left 0.4s ease-out;
}

.common-carousel .common-carouselInner ul li {
	width: 145px;
	float: left;
	/*border: 1px solid #F00;*/
}

.common-carousel .common-carouselInner ul li a {
	display: block;
}

.common-carousel .common-carouselInner ul li a dl {
}

.common-carousel .common-carouselInner ul li a dl dt.photo {
	float: left;
}

.common-carousel .common-carouselInner ul li a dl dd.detail {
	float: left;
	width: 82px;
	font-size: 10px;
}

.common-carousel .common-carouselInner ul li a dl dd.detail p.price {
	font-weight: bold;
}

.common-carousel p.prev {
	position: absolute;
	left: -10px;
	top: 50%;
	margin-top: -27px;
	cursor: pointer;
}

.common-carousel p.next {
	position: absolute;
	right: -10px;
	top: 50%;
	margin-top: -27px;
	cursor: pointer;
}



/*** table style ***/
table {
	width: 100%;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	margin-top: 10px;
}

table th,
table td {
	padding: 6px 10px;
}

table th {
	font-weight: normal;
	text-align: left;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background-color: #f2f2f2;
	width: 40%;
	min-width: 35%;
	max-width: 60%;	
}

table td {
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/* ボーダーなし */
table.noBorder {
	border: none;
}

table.noBorder th,
table.noBorder td {
	border: none;
}

/* th 強調 */
table th.emphasis {
	background-color: #b2b2b2;
}

/* td テキスト右寄せ */
table.td-r td {
	text-align: right;
}




/*** form style ***/

/** 1列配置 **/
.form-1line {
	margin-bottom: 10px;
}

.form-1line input {
	width: 100%;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border: 1px solid #ccc;
	height: 30px;
	margin-bottom: 10px;
}

/** 共通指定 **/
form input[type=text],
form input[type=password],
form textarea {
	padding: 8px 3px;
	width: 97.4%;
	border: 1px solid #ccc;
}

form input[type=text] {
	/*margin-bottom: 8px;*/
}

form textarea {
	min-height: 60px;
}


form select {
	width: 100%;
	height: 32px;
}

form dd select {
	margin-bottom: 15px;
}

form input[type=checkbox],
form input[type=radio] {
	vertical-align: middle;
	margin-top: -1px;
}

form h1 {
	margin-bottom: 5px;
	padding-top: 0px;
}

/* 郵便番号 */
.postal_code #postal_code1,
.postal_code #postal_code2 {
	width: 30%;
}

/* 電話番号3分割 */
.tel-3 input {
	width: 70px !important;
}

/* お届け先 追加・変更 */
table.address-list td.num {
	vertical-align: middle;

}

table.address-list .address {
	width: 100% !important;
}

table.address-list td.buttons {
	vertical-align: middle;
}

table.address-list .buttons button.change,
table.address-list .buttons button.delete {
	width: 120px;
}

/* 新しい住所を追加ボタン */
button.newAddress {
	height: 30px;
	width: 160px;
}



/*** ※印の指定 ***/
.note,
ul.note {
	text-indent: -1em;
	padding-left: 1em;
	margin-top: 10px;
}

ul.note li {
	line-height: 1.5;
	margin-bottom: 5px;
}

ul.note li:last-child {
	margin-bottom: 0px;
}


/*----------------------------------------------------
 elements
----------------------------------------------------*/

/*** text color ***/
.cautions {
	color: #cc0000;
}

/*** background color ***/
.bg-gray {
	background-color: #f2f2f2;
}

/*** border gray ***/
.border-gray {
	border: 1px solid #ccc;
}

/*** title bgcolor ***/
.main h1.title-common,
.main h1.title-custom {
	padding-left: 10px;
	color: #fff;
	padding-top: 4px;
	padding-bottom: 4px;
}

/** 共通グレー帯 **/
.main h1.title-common {
	background-color: #666666;
	
}

/** ストア 赤帯 **/
.store .main h1.title-custom {
	background-color: #b82f00;
}

/** クラブカイ オレンジ帯 **/
.clubkai .main h1.title-custom {
	/* clubkai */
	background-color: #e2712b;
}

/** list button 「一覧へ」ボタン **/
p.listBtn a {
	display: inline-block;
	float: right;
	background-image: url(/contents_file/s/common/img/arrow_next.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 6px auto;
	padding-left: 10px;
	margin-top: 10px;
}


/*** button style ***/

/** 中央一つ 大 **/
.centerBtn {
	text-align: center;
	width: 300px;
	margin-left: auto;
	margin-right: auto;
}

.centerBtn button,
.centerBtn a {
	width: 300px;
	height: 30px;
	letter-spacing: 0.1em;
	font-size: 13px;
}

.centerBtn a {
	display: table-cell;
	vertical-align: middle;
	width: 300px;
}

/** 二個二列配置 **/
.btn-2line {
	width: 300px;
	margin-top: 20px;
}

.btn-2line .leftBtn {
	float: left;
}

.btn-2line .rightBtn {
	float: right;
}

.btn-2line button,
.btn-2line a {
	display: block;
	width: 145px;
	height: 30px;
	font-size: 12px;
}

.btn-2line a {
	display: table-cell;
	vertical-align: middle;
	width: 145px;
}


/** ボタンカラー指定 **/

/* 共通 グレーボタン */
.btnGray {
	background-color: #666666;
	background-image: url(/contents_file/s/common/img/btnbg.png);
	background-position: left top;
	background-repeat: repeat;
	background-size: 5px 5px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	color: #FFF;
	font-weight: bold;
}

/* ストア 赤ボタン */
.btnRed {
	background-color: #b82f00;
	background-image: url(/contents_file/s/common/img/btnbg.png);
	background-position: left top;
	background-repeat: repeat;
	background-size: 5px 5px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	color: #FFF;
	font-weight: bold;
}

/* クラブカイ オレンジボタン */
.btnOrange {
	background-color: #e2712b;
	background-image: url(/contents_file/s/common/img/btnbg.png);
	background-position: left top;
	background-repeat: repeat;
	background-size: 5px 5px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	color: #FFF;
	font-weight: bold;
}


/* カートアイコンあり */
button span.cart {
	background-image: url(/contents_file/s/common/img/ic_cart.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 17px auto;
	display: inline-block;
	padding-left: 23px;
}


/* 削除ボタン */
button.delete, 
button.change {
	width: 40px;
	height: 25px;
	padding: 1px 3px;
	
}

/* レビューボタン */
.review {
	width: 104px;
	height: 25px;
}


/* buttonタグ以外 aリンク使用のボタン */
a.btnGray,
a.btnRed,
a.btnOrange {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	line-height: 0.9;
	color: #FFF;
	font-weight: bold;
}

