@charset "UTF-8";

/* ======== 製品情報 ======== */

#productPage {
}

#productPage h2 {
	padding-top: 20px; 
	text-align: center;
}

#productPage h2 img {
	height: 35px;
	width: auto;
}

.productAll {
	margin-top: 20px;
}

.productBox h3 {
	text-align: center;
	line-height: 0;
}

.productBox h3.pc {
	display: none;
	visibility: hidden;
}

.productBox h3 img {
	height: 30px;
	width: auto;
}

.productBox .inner {
	padding: 20px;
	border: 5px solid #ffaa00;
	border-radius: 20px;
	background: rgba(0,0,0,0.8);
}

.productBox h4 {
	margin-bottom: 20px;
	text-align: center;
}

.productBox h4 img {
	width: 70%;
	height: auto;
}

.productBox dl {
	padding: 1em 0;
	font-size: 1.4em;
	background: url(../images/line.gif) left top repeat-x;
	background-size: 5px 1px;
	text-align: left;
}

.productBox dt {
	width:100%;
	color: #999;
	font-weight: 900;
}

.productBox dd span {
	padding: 0.1em 0.8em;
	color: #000;
	background: #ffaa00;
}

.productBox p.note {
	margin-top: 1em; 
	font-size: 1.2em;
	text-align: center;
}

.thumbArea {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

.thumbArea dl {
	margin: 0 10px;
}

.thumbArea dl.pk {
	width: 43%;
}

.thumbArea dl.app {
	width: 26%;
}

@media screen and (min-width: 768px) {
	#productPage {
		padding-top: 40px; 
	}
	#productPage h2 img {
		height: 39px;
	}
	.productAll {
		margin-top: 40px;
		display: flex;
		justify-content: space-between;
	}
	.productBox {
		width: 640px;
	}
	.productBox h3.sp {
		display: none;
		visibility: hidden;
	}
	.productBox h3.pc {
		display: block;
		visibility: visible;
	}
	.productBox h3 img {
		height: 60px;
	}
	.productBox .inner {
		padding: 20px 40px 40px;
	}
	.productBox h4 img {
		width: 50%;
		height: auto;
	}
	.productBox dl {
		display: flex;
	}
	.productBox dt {
		width: 30%;
	}
	.productBox dd {
		width: 70%;
	}
	.thumbArea {
		margin-top: 60px;
		width: 300px;
		display: block;
	}
	.thumbArea dl {
		margin: 0;
	}
	.thumbArea dl.pk {
		width: 100%;
	}
	.thumbArea dl.app {
		margin-top: 40px;
		width: 50%;
	}
}

#download {
	margin-top: 40px;
}

@media screen and (min-width: 768px) {
	#download {
		margin-top: 40px;
	}
}