@charset "UTF-8";

/***********************************************************************************
  固定フッター
***********************************************************************************/

#bottom .ad {
	border-top: 1px #ffffff solid;
}

/***********************************************************************************
  SNSリンク
***********************************************************************************/

.sns_buttons {
	height: 40px;
	text-align: center;
	overflow: hidden;
}

.sns_buttons .sns_share {
	margin: 10px 2px;
	display: inline-block;
	vertical-align: top;
}

.sns_buttons .sns_facebook {
	max-width: 85px;
}

.sns_buttons .sns_pocket {
	margin-left: -2px;
}

/***********************************************************************************
  広告
***********************************************************************************/

.ad {
	text-align: center;
}

.ad_160x600 {
	height: 600px;
}

.ad_300x50 {
	height: 50px;
}

.ad_320x100 {
	height: 100px;
}

/***********************************************************************************
  固定ヘッダー
***********************************************************************************/

#top form {
	white-space: nowrap;
	display: block;
}

#top form input[type=text] {
	padding-left: .5rem;
}

/***********************************************************************************
  メイン
***********************************************************************************/

main .top_navi {
	margin: 1rem 0 .5rem 0;
	color: #888888;
	font-size: 1.3rem;
	text-align: center;
}

main .top_navi a {
	margin: 0 .5rem;
	color: #888888;
	font-size: 1.3rem;
	display: inline-block;
}

/***********************************************************************************
  商品
***********************************************************************************/

.item .image {
	width: 20rem;
	height: 20rem;
	margin: 0 1.5rem 1.5rem 0;
	text-indent: -9999px;
	display: block;
	overflow: hidden;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border: 1px #cccccc solid;
	float: left;
}

.item .name {
	display: block;
}

.item .description {
	display: block;
}

.item .info {
	margin: 0 0 .5rem 0;
	padding: 0 0 0 9rem;
	position: relative;
}

.item .info h3 {
	width: 8rem;
	padding: .2rem 0;
	font-size: 1.2rem;
	line-height: 1.5;
	text-align: center;
	background-color: #eeeeee;
	border: 1px #cccccc solid;
	display: inline-block;
	position: absolute;
	top: 0px;
	left: 0px;
}

.item .search_buttons {
	margin: 0 0 1.5rem 0;
}

.item .search_buttons a {
	width: 8rem;
	margin: .8rem 1rem 0 0;
	padding: 1.8rem 0;
	font-size: 1.3rem;
	text-align: center;
	border: 1px #cccccc solid;
	display: inline-block;
}

.item::after {
	content: "";
	clear: both;
	display: block;
}

/***********************************************************************************
  商品シンプル
***********************************************************************************/

.item_simple {
	margin: 2.5rem 0 0 0;
	height: 11rem;
	overflow: hidden;
}

.item_simple .image {
	width: 10rem;
	height: 10rem;
}

.item_simple .name {
	margin: -0.2rem 0 0 0;
	max-height: 4.8rem;
	font-size: 1.6rem;
	overflow: hidden;
}

.item_simple .description {
	margin: 1rem 0 0 0;
	color: #888888;
	font-size: 1.3rem;
	line-height: 1.5;
}

/***********************************************************************************
  商品リスト
***********************************************************************************/

.item_list {
	padding: 2rem 0;
	border-bottom: 1px #dddddd solid;
}

.item_list .name {
	margin: 0 0 1rem 0;
	font-size: 1.6rem;
}

.item_list .description {
	max-height: 5.4rem;
	color: #888888;
	font-size: 1.3rem;
	line-height: 1.5;
	overflow: hidden;
	clear: both;
}

/***********************************************************************************
  商品詳細
***********************************************************************************/

.item_detail .title {
	margin-bottom: 2rem;
}

.item_detail .description {
	padding: 1.5rem 0;
	clear: both;
}

/***********************************************************************************
  クレジット
***********************************************************************************/

.credit {
	text-align: center;
}

.credit a {
	color: #555555;
}

/***********************************************************************************
  ページネーション
***********************************************************************************/

.pagination {
	margin: 0 0 1.5rem 0;
	padding: 1.6rem 0 2rem 0;
	text-align: center;
	border-bottom: 1px #cccccc solid;
}

.pagination::after {
	content: "";
	clear: both;
	display: block;
}

.pagination .num {
	margin: 1.5rem 0 0 0;
	font-size: 1.6rem;
	display: inline-block;
}

.pagination .prev,
.pagination .next {
	padding-top: .4rem;
	color: #111111;
	letter-spacing: .2rem;
	opacity: 0.9;
	display: inline-block;
}

.pagination .prev {
	float: left;
}

.pagination .next {
	float: right;
}

.pagination .prev::before {
	content: "";
	margin-right: 1.2rem;
	width: 4.5rem;
	height: 4.5rem;
	background: #111111 url(../img/arrow.png) no-repeat center;
	background-size: 3rem;
	border-radius: .2rem;
	transform: rotateZ(270deg);
	vertical-align: middle;
	display: inline-block;
}

.pagination .next::after {
	content: "";
	margin-left: 1.2rem;
	width: 4.5rem;
	height: 4.5rem;
	background: #111111 url(../img/arrow.png) no-repeat center;
	background-size: 3rem;
	border-radius: .2rem;
	transform: rotateZ(90deg);
	vertical-align: middle;
	display: inline-block;
}

.pagination span.prev,
.pagination span.next {
	opacity: 0.4;
}

.pagination span.prev::before,
.pagination span.next::after {
	opacity: 0.3;
}

/***********************************************************************************
  カレンダー
***********************************************************************************/

.calendar {
	margin: 2rem 0;
}

.calendar .subtitle {
	margin: 0 0 .5rem 0;
}

.calendar table {
	width: 100%;
}

.calendar th,
.calendar td {
	font-size: 1.5rem;
	text-align: center;
	white-space: nowrap;
	border: 1px #cccccc solid;
}

.calendar a,
.calendar span {
	padding: 1rem 0;
	display: block;
}

.calendar span {
	background-color: #eeeeee;
}

.calendar td span {
	color: #888888;
}