@charset "UTF-8";
/* ========================================
	product
======================================== */
#product .main {
	float:left;
	width:732px;
}
#product #product_lst {
	float:left;
	width:708px;
	margin:0 0 20px 0;
	padding:0 10px;
	border-radius:4px;
	border:2px solid #cfcfcf;
	background:#fff;
}
#product #product_lst li {
	display:block;
	position:relative;
	padding:15px 10px;
	border-bottom:1px solid #c9c9c9;
}
#product #product_lst li:last-child {
	margin:0;
	border-bottom:none;
}
#product li p.img {
	float:left;
	width:245px;
	margin:0 20px 0 0;
}
#product li dl {
	float:left;
	width:420px;
}
#product li dt {
	margin:0 0 15px 0;
	color:#3f9fe9;
	font-size:16px;
	font-weight:bold;
	line-height:20px;
}
#product li dd.txt {
	padding:0 0 10px 0;
	line-height:1.5;
}
#product li dd.link {
	padding:0 0 2em 0;
}
#product #product_lst li dd.link li {
	float:left;
	margin:0 20px 0 0;
	border-bottom:none;
	text-align:left;
}
#product li dd.link li.official a {
	display:block;
	padding:8px 10px 8px 30px;
	border-radius:4px;
	background:url(../img/arrow_officiallink.png) no-repeat 10px center #3f9fe9;
	color:#fff;
}
#product li dd.link li.base a {
	display:block;
	padding:8px 10px 8px 30px;
	border-radius:4px;
	background:url(../img/arrow_officiallink.png) no-repeat 10px center #3f9fe9;
	color:#fff;
}
#product li dd.link li.official a:hover {
	background:url(../img/arrow_officiallink.png) no-repeat 10px center #0f5787;
}
#product li dd.link li.base a:hover {
	background:url(../img/arrow_officiallink.png) no-repeat 10px center #0f5787;
}
#product li dd.number {
	position:absolute;
	bottom:15px;
}
#product #product_lst .link li {
	padding:0;
}
/*detail*/
#product .productbnr {
	width:996px;
	margin:0 0 8px 0;
	border:2px solid #000;
}
#product #main {
	width:700px;
}
#product #main .ttlInfo {
	margin:0 0 8px 0;
	padding:15px 0 0 0;
	border-radius:4px;
	background:url(../img/bg_image.png) repeat left top;
	color:#fff;
}
#product #main .ttlInfo p.cat {
	float:left;
	width:140px;
	margin:0 10px 15px 10px;
	border-radius:4px;
	border:2px solid #6f6f6f;
	background:#2f2f2f;
}
#product #main .ttlInfo p.cat span {
	display:block;
	padding:5px 10px 3px 25px;
	line-height:16px;
	text-align:center;
}
#product #main .ttlInfo p.cat span.video {
	background:url(../img/icon_video.png) no-repeat 5px center;	
}
#product #main .ttlInfo p.cat span.music {
	background:url(../img/icon_music.png) no-repeat 5px center;	
}
#product #main .ttlInfo p.cat span.medal {
	background:url(../img/icon_medal.png) no-repeat 5px center;	
}
#product #main .ttlInfo p.cat span.prize {
	background:url(../img/icon_prize.png) no-repeat 5px center;	
}
#product #main dl {
	float:left;
	width:530px;
}
#product #main dt {
	float:left;
	width:390px;
	color:#fff;
	font-size:18px;
	font-weight:bold;
	line-height:29px;
}
#product #main dd.btn {
	float:right;
	width:110px;
	border-radius:8px;
}
#product #main dd.btn a {
	display:block;
	border-radius:4px;
	background:#3f9fe9;
	color:#fff;
	font-weight:bold;
	line-height:29px;
}
#product #main dd.btn a:hover {
	background:#0f5787;
}
#product #main dd.btn a span {
	padding:0 0 0 30px;
	background:url(../img/arrow_officiallink.png) no-repeat 10px center;
}
#product #main .copyright {
	clear:both;
	padding:5px;
	border-radius:0 0 4px 4px;
	background:url(../img/bg_title.png) repeat left top;
	font-size:10px;
	text-align:right;
}
#product #main .ttlBody {
	margin:0 0 8px 0;
	padding:15px 10px;
	border-radius:4px;
	border:2px solid #cfcfcf;
	background:#fff;
}
#product #main .ttlBody h2 {
	margin:0 0 12px 0;
	padding:0 0 0 10px;
	border-bottom:2px solid #bfdfff;
	color:#3f9fe9;
	font-size:18px;
	line-height:25px;
}
#product #main .ttlBody p {
	margin:0 0 18px 0;
	padding:0 0 0 10px;
	font-size:12px;
	line-height:1.5;
}
#product #main .ttlBody p.img {
	text-align:center;
	overflow:hidden;
}
#product .detail .side {
	width:292px;
}
#product .side .spec {
	width:268px;
	margin:0 0 8px 0;
	padding:10px;
	border-radius:4px;
	border:2px solid #cfcfcf;
	background:#fff;
}
#product .side .spec .img {
	margin:0 0 20px 0;
	border-radius:4px;
	border:2px solid #cfcfcf;
	background:url(../img/bg_spec.gif) repeat left top;
}
#product #contents .side .spec h2 {
	margin:0 0 12px 0;
	padding:0 0 0 10px;
	border-bottom:2px solid #bfdfff;
	color:#3f9fe9;
	font-size:18px;
	font-weight:bold;
	line-height:25px;
}
#product #contents .side .spec dt {
	margin:0 0 15px 0;
	padding:0 10px;
	color:#333;
	text-align:left;
}
#product #contents .side .spec dt span {
	color:#a0a0a0;
	font-size:10px;
}
#product #contents .side .spec dd {
	padding:0 10px;
}
#product #contents .side .spec dd p {
	margin:0 0 5px 0;
	padding:0 0 0 15px;
	background:url(../img/icon_square.gif) no-repeat left 3px;
	font-size:12px;
	line-height:1.5;
}
#product #contents .side .spec dd p.attention {
	padding:0;
	background:none;
	font-size:10px;
}
#product #contents .side li {
	margin:0 0 8px 0;
}
@media screen and (max-width: 760px) {
	#product .main {
		float:none;
		width:100%;
	}
	#product #contents h2 {
		margin:0 0 0 2%;
		font-size:18px;
		font-weight:bold;
	}
	#product #product_lst {
		float:none;
		width:96%;
		margin:0 0 8px 0;
		padding:0 2%;
		border-radius:0;
		border:none;
		border-top:2px solid #cfcfcf;
		border-bottom:2px solid #cfcfcf;
	}
	#product #product_lst p.img {
		width:30%;
		margin:0 2% 0 0;
	}
	#product #product_lst dl {
		float:none;
		width:100%;
	}
	#product .side #socialaccount h2 {
		margin:0;
		padding:20px 0 0 2%;
		border:none;
		background:#eee;
		font-size:18px;
		line-height:60px;
	}
	/*detail*/
	#product .productbnr {
		width:96%;
		margin:0 auto 8px auto;
	}
	#product #main {
		float:none;
		width:96%;
		margin:0 auto;
	}
	#product #main .ttlInfo {
		position:relative;
		padding:15px 0 0 0;
	}
	#product #main .ttlInfo p.cat {
		width:50%;
		margin:0 2% 5px 2%;
	}
	#product #main .ttlInfo p.cat span {
		padding:5px 0 3px 10%;
		font-size:10px;
		text-align:center;
	}
	#product #main dl {
		float:none;
		width:96%;
		margin:0 auto;
	}
	
	#product #main dt {
		width:100%;
		padding:1px 0 5px 0;
		line-height:1.5;
	}
	#product #main dd.btn {
		clear:both;
		float:none;
		width:100%;
		margin:0 0 15px 0;
		text-align:center;
	}
	#product #main .ttlBody {
		padding:15px 2%;
	}
	#product #main .ttlBody p {
		padding:0 0 0 2%;
	}
	#product .detail .side {
		width:96%;
		margin:0 auto;
	}
	#product .side .spec {
		width:96%;
		padding:10px 2%;
	}
	#product .side .spec .img {}
	#product #contents .side .spec dd {
		padding:0 2%;
	}
	#product #contents .side .link li a {
		display:block;
		width:96%;
		margin:0 auto;
		padding:0;
		border-radius:4px;
		border:2px solid #cfcfcf;
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 25%, #bfdfff 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#ffffff), color-stop(100%,#bfdfff)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  #ffffff 25%,#bfdfff 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  #ffffff 25%,#bfdfff 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  #ffffff 25%,#bfdfff 100%); /* IE10+ */
		background: linear-gradient(to bottom,  #ffffff 25%,#bfdfff 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfdfff',GradientType=0 ); /* IE6-9 */
		color:#3f9fe9;
		font-size:20px;
		font-weight:bold;
	}
	#product #contents .side li.shop span {
		padding:20px 0 20px 70px;
		background:url(../img/btnicon_shop.png) no-repeat 10px center;
		background-size:40px;
	}
	#product #contents .side li.ttl span {
		padding:20px 0 20px 70px;
		background:url(../img/btnicon_ttlsupport.png) no-repeat 10px center;
		background-size:40px;
	}
	#product #contents .side li.download span {
		padding:20px 0 20px 70px;
		background:url(../img/btnicon_download.png) no-repeat 10px center;
		background-size:40px;
	}
	
}