/* Y'S GEAR : /mc/wear/tairaracing/css/layout.css */


.mfp-figure:after {
	background: #fff !important;
}

/*======================================================================*
 *  [ contentsWidth ] 
 *======================================================================*/

.contentsWidth {
	color: #666;
	font-size: 1.5rem;
	text-align: center;
}

@media screen and (max-width: 980px) {
	.contentsWidth { padding: 0 !important; }
} /* */


/*======================================================================*
 *  [ brand ] 
 *======================================================================*/

.brand {
	background: #e60012;
	padding: 70px 20px;
}

@media screen and (max-width: 568px) {
	.brand { padding: 40px 10px; }
	.brand img { width: 280px; }
} /* */


/*======================================================================*
 *  [ item ] 
 *======================================================================*/

/* [ flex ] */
.flex {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
.flex.row-rt { /* 横：右から */
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

@media screen and (max-width: 568px) {
	.flex.spbk { display: block; }
} /* */

/* [ item ] */
.item { padding: 60px 20px; }
.item.bg { background: #f4f4f4; }
.item > div { margin: 40px -10px; }

@media screen and (max-width: 568px) {
	.item { padding: 40px 10px; }
	.item > div { margin: 30px 0; }
} /* */

/* [ 商品名 ] */
.item h2 {
	position: relative;
	margin-bottom: 40px;
	padding-bottom: 12px;
	color: #000;
	font-size: 2.6rem;
	font-family:
		"游ゴシック体", "Yu Gothic", YuGothic, 
		"メイリオ", Meiryo, 
		"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 
		"ＭＳ Ｐゴシック", "MS PGothic", 
		sans-serif;
	line-height: 1;
	text-align: center;
}
.item h2::after {
	position: absolute;
	width: 100px;
	height: 3px;
	left: 50%;
	bottom: 0;
	margin-left: -50px;
	background: #e60012;
	content: "";
}

@media screen and (max-width: 568px) {
	.item h2 { margin-bottom: 30px; }
} /* */

/* [ 商品画像 ] */
.item figure {
	position: relative;
	width: 60%;
	max-width: 400px;
	margin: 0 10px;
	box-sizing: border-box;
}
.item figcaption {
	position: absolute;
	top: 0;
	right: 0;
	padding: 5px 10px;
	background: #666;
	color: #fff;
	font-weight: bold;
	font-family:
		"游ゴシック体", "Yu Gothic", YuGothic, 
		"メイリオ", Meiryo, 
		"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 
		"ＭＳ Ｐゴシック", "MS PGothic", 
		sans-serif;
}
.item.bg figcaption { left: 0; right: auto; }

@media screen and (max-width: 568px) {
	.item figure {
		width: auto;
		max-width: 100%;
		margin-bottom: 15px;
	}
	.item figcaption {
		top: auto;
		right: 0 !important;
		bottom: 0;
		left: auto !important;
	}
} /* */

/* [ 商品詳細 ] */
.item .detail {
	width: 40%;
	max-width: 300px;
	margin: 0 10px;
	box-sizing: border-box;
}

.item .detail dl {
	margin-bottom: 20px;
	border-bottom: 1px solid #d2d2d2;
}
.item .detail dt {
	margin-bottom: 5px;
	color: #000;
	font-size: 1.3rem;
	font-weight: bold;
}
.item .detail dd { margin-bottom: 20px; }
.item .detail dd span { display: inline-block; }

.item .detail > b {
	color: #000;
	font-size: 1.4rem;
	font-family:
		Verdana, 
		sans-serif;
}
.item .zoom {
	margin-top: 10px;
	padding: 0 8px;
}
.item .zoom li { padding: 0 7px; }
.item .zoom li div { position: relative; }
.item .zoom li div::after {
	position: absolute;
	width: 16px;
	height: 16px;
	right: 0;
	bottom: 0;
	content: url(../img/zoom.svg);
}
.item .zoom li img { width: 100%; }
.item .zoom li span {
	display: block;
	margin-top: 5px;
	font-size: 1.3rem;
}

@media screen and (max-width: 568px) {
	.item .detail {
		width: 100%;
		max-width: 100%;
		margin: 0;
		font-size: 1.4rem;
	}
	
	.item .detail ul {
		margin-top: 10px;
		padding: 0 3px;
	}
	.item .detail li span { font-size: 1.2rem; }
} /* */

/* [ ボタン ] */
.item a.btn {
	display: inline-block;
	padding: 12px 40px;
	border-radius: 40px;
	background: #000;
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	font-family:
		"游ゴシック体", "Yu Gothic", YuGothic, 
		"メイリオ", Meiryo, 
		"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 
		"ＭＳ Ｐゴシック", "MS PGothic", 
		sans-serif;
}
.item a.btn:hover, 
.item a.btn:active {
	background: #e60012;
	color: #fff !important;
}
.item .btn::after {
	display: inline-block;
	width: 12px;
	height: 9px;
	margin: 0 0 2px 10px;
	background: url(../img/arrow.png) center center;
	background-size: 100% auto;
	vertical-align: middle;
	content: "";
}

