@charset "UTF-8";
/*------------------------------------------------------------
	CASCADING STYLE SHEETS 3 - BRAND PAGE
	COPYRIGHT : 1997-2019 SPACE PROJECT
	BUILD : 2019-05-30T18:41:00+09:00
------------------------------------------------------------*/

/*------------------------------------------------------------
	FONT SIZE	12pt 1em (16pt 0.75 em)
	18pt	1.50 em		16pt	1.33 em		15pt	1.25 em
	14pt	1.17 em		11pt	0.92 em		10.5pt	0.88 em
	10pt	0.83 em		9pt		0.75 em
------------------------------------------------------------*/

/*------------------------------------------------------------
	BANNER
------------------------------------------------------------*/
#proBanner {
	clear: both;
	width: 1004px;
	margin: 28px auto 0 auto;
	padding: 0px 0px;
	text-align: left;
}
#proBanner:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
#proBanner div.bannerContainer {
	float: left;
	position: relative;
	width: 492px;
	padding: 2px;
	margin-bottom: 20px;
}
#proBanner div.bannerContainer.div1 {
	width: 1000px;
}
#proBanner div.bannerContainer.div2 {
	width: 492px;
}
#proBanner div.bannerContainer.div3 {
	width: 325px;
}
#proBanner div.bannerContainer.div3mult2 {
	width: 662px;
}
#proBanner div.bannerContainer.div4 {
	width: 241px;
}
#proBanner div.margin {
	margin-right: 8px;
}
#proBanner div.bannerContainer img {
	padding: 8px;
	border: 1px solid #dddddd;
}
#proBanner div.bannerContainer a:hover img {
	opacity: 0.8;
	-ms-filter: "alpha(opacity=80)"; /* ie8 */
	cursor: pointer;
}
#proBanner div.bannerContainer p {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 160px;
	height: 0px;
	overflow: hidden;
	padding-top: 160px;
	line-height: 200%;
}
#proBanner div.bannerContainer p.ribbonPuzzlebox {
	background: url(/common/idx/ribbon_puzzlebox.png) no-repeat 0px 0px;
}
#proBanner div.bannerContainer p.ribbonAteliergh {
	background: url(/common/idx/ribbon_ateliergh.png) no-repeat 0px 0px;
}
#proBanner div.bannerContainer p.ribbonDemomovie {
	background: url(/common/idx/ribbon_demomovie.png) no-repeat 0px 0px;
}
#proBanner div.bannerContainer p.ribbonTrial {
	background: url(/common/idx/ribbon_trial.png) no-repeat 0px 0px;
}
#proBanner div.bannerContainer p.ribbonOnsale {
	background: url(/common/idx/ribbon_onsale.png) no-repeat 0px 0px;
}
#proBanner div.bannerContainer p.ribbonDownloadOnsale {
	background: url(/common/idx/ribbon_downloadOnsale.png) no-repeat 0px 0px;
}
/*------------------------------------------------------------
	BRAND INDEX
------------------------------------------------------------*/
#contentsContainer #brandListContainer {
	position: relative;
	overflow: hidden;
	width: 980px;
	margin: 0px 0px 20px 5px;
	padding: 15px 10px 5px 10px;
	background: #ffffff;
	border: 1px solid #dddddd;
}
#brandList {
	height: 80px;
	padding: 0px;
}
#brandList li {
	list-style-type: none;
	display: block;
	float: left;
	position: relative;
	margin-left: 0px;
	text-align: center;
	margin: 0 6px 0px 6px;
	border: 1px solid #dddddd;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	box-shadow: 0 0 6px #dddddd;
	-webkit-box-shadow: 0 0 6px #dddddd;
	-moz-box-shadow: 0 0 6px #dddddd;
}
#brandList li:hover {
	background: linear-gradient(#ffffff, #edf4fc);
	border-color: #d4e1f9;
	box-shadow: 0 0 6px #d4e1f9;
	-webkit-box-shadow: 0 0 6px #d4e1f9;
	-moz-box-shadow: 0 0 6px #d4e1f9;
}
#brandList li a {
	display: block;
	width: 126px;
	height: 0px;
	overflow: hidden;
	padding-top: 48px;
	background: url(/common/ui/menu_brandIndexVertical@fs.png) no-repeat 0 top;
	background-size: 96px 528px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#brandList li a {
		background-image: url(/common/ui/menu_brandIndexVertical@fs@2x.png);
	}
}
#brandList #brand_janis a {
	background-position: center 0;
}
#brandList #brand_speed a {
	background-position: center -48px;
}
#brandList #brand_ciel a {
	background-position: center -96px;
}
#brandList #brand_aniseed a {
	background-position: center -144px;
}
#brandList #brand_noa a {
	background-position: center -192px;
}
#brandList #brand_puzzlebox a {
	background-position: center -240px;
}
#brandList #brand_hourglass a {
	background-position: center -288px;
}
#brandList #brand_ateliergh a {
	background-position: center -336px;
}
#brandList #brand_airrip a {
	background-position: center -384px;
}
#brandList #brand_raptor a {
	background-position: center -432px;
}
#brandList #brand_soleil a {
	background-position: center -480px;
}
#brandList li span.brandName {
	position: absolute;
	top: 55px;
	display: block;
	width: 126px;
	text-align: center;
	font-size: 0.88em;
	letter-spacing: 0.05em;
	color: #cccccc;
}
#brandListContainer ul.listDlproducts li {
	margin-bottom: 24px;
}
#brandListContainer ul.listSpecialPrice li a,
#brandListContainer ul.listSpecialPrice li span.brandName {
	width: 149px;
}
/*------------------------------------------------------------
	CONTENTS STYLES
------------------------------------------------------------*/
#contentsContainer div.product {
	float: left;
	position: relative;
	width: 475px;
	margin: 0px 4px 20px 4px;
	padding: 10px;
	background-color: #ffffff;
	border: 1px solid #dddddd;
}
#contentsContainer div.product img {
	border: 1px solid #eeeeee;
}
#contentsContainer > hr {
	clear: both;
	margin: 0px;
	padding: 0px;
	border: 0px solid #ffffff;
} 
div.infomations {
	float: right;
	width: 315px;
}
div.infomations h4 {
	font-size: 1.17em;
	margin-bottom: 10px;
	padding: 4px 0px 4px 20px;
	color: #666666;
	border-top: 1px solid #eeeeee;
	border-bottom: 1px solid #eeeeee;
	background: #f9f9f9 url(/common/ui/background_contentsHeader.png) no-repeat 3px center;
}
div.infomations h4.small {
	font-size: 0.92em;
	padding: 6px 0px 5px 20px;
}
div.infomations h4 span.small {
	font-size: 0.88em;
}
div.infomations h4 small {
	font-size: 0.88em;
}
div.infomations h4 span.ruby {
	font-size: 0.88em;
}
div.infomations h4 span.ruby:before {
	content: "（";
}
div.infomations h4 span.ruby:after {
	content: "）";
}
div.infomations p.proGenre {
	margin: 0px 0px 10px 10px;
	font-size: 0.83em;
}
div.infomations p.proGenreSmall {
	margin: 0px 0px 10px 10px;
	font-size: 0.75em;
}
div.infomations dl.proData {
	margin-left: 10px;
}
div.infomations dl.proData:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
div.infomations dl.proData dt {
	float: left;
}
div.infomations dl.proData dd:before {
	content: "：";
}
div.infomations dl.proFormat {
	position: absolute;
	top: 90px;
	width: 315px;
	margin-left: 10px;
}
div.infomations dl.proFormat:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
div.infomations dl.proFormat dt {
	float: left;
	width: 96px;
	height: 0px;
	margin-right: 20px;
	margin-bottom: 3px;
	padding-top: 24px;
	overflow: hidden;
	line-height: 200%;
	background: #fefefe url(/common/ui/icon_mediaKind@fs.png) no-repeat 0px 0px;
	background-size: 190px 78px;
	border: 1px solid #eeeeee;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations dl.proFormat dt {
		background-image: url(/common/ui/icon_mediaKind@fs@2x.png);
	}
}
div.infomations dl.proFormat dt.pkg {
	background-position: 1px -1px;
}
div.infomations dl.proFormat dt.sp {
	background-position: 1px -27px;
}
div.infomations dl.proFormat dt.dl {
	background-position: 1px -53px;
}
div.infomations dl.proFormat dt.pkg_discontinued {
	background-color: #f7f7f7;
	background-position: -94px -1px;
}
div.infomations dl.proFormat dt.sp_discontinued {
	background-color: #f7f7f7;
	background-position: -94px -27px;
}
div.infomations dl.proFormat dt.dl_discontinued {
	background-color: #f7f7f7;
	background-position: -94px -53px;
}
/*
div.infomations dl.proFormat dt.pkg_discontinued {
	opacity: 0.7;
}
div.infomations dl.proFormat dt.sp_discontinued {
	opacity: 0.7;
}
div.infomations dl.proFormat dt.dl_discontinued {
	opacity: 0.7;
}
div.infomations dl.proFormat dt.pkg_discontinued + dd {
	opacity: 0.5;
}
div.infomations dl.proFormat dt.sp_discontinued + dd {
	opacity: 0.5;
}
div.infomations dl.proFormat dt.dl_discontinued + dd {
	opacity: 0.5;
}
*/
div.infomations dl.proFormat dd {
	width: 190px;
	height: 0px;
	margin-bottom: 4px;
	padding-top: 25px;
	overflow: hidden;
	line-height: 200%;
	background: url(/common/ui/icon_windowsKind@fs.png) no-repeat 0px 0px;
	background-size: 190px 450px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations dl.proFormat dd {
		background-image: url(/common/ui/icon_windowsKind@fs@2x.png);
	}
}
/*
div.infomations dl.proFormat dt.pkg_discontinued + dd,
div.infomations dl.proFormat dt.sp_discontinued + dd,
div.infomations dl.proFormat dt.dl_discontinued + dd {
	background-image: url(/common/ui/icon_windowsKind@fs.png);
}
*/
div.infomations dl.proFormat dd.win95 {
	background-position: 0px 0px;
}
div.infomations dl.proFormat dd.win95-98 {
	background-position: 0px -25px;
}
div.infomations dl.proFormat dd.win95-98-me {
	background-position: 0px -50px;
}
div.infomations dl.proFormat dd.win95-98-2000 {
	background-position: 0px -75px;
}
div.infomations dl.proFormat dd.win95-98-me-2000 {
	background-position: 0px -100px;
}
div.infomations dl.proFormat dd.win95-98-me-2000-xp {
	background-position: 0px -125px;
}
div.infomations dl.proFormat dd.win98-me-2000-xp {
	background-position: 0px -150px;
}
div.infomations dl.proFormat dd.win98-me-2000-xp-vista {
	background-position: 0px -175px;
}
div.infomations dl.proFormat dd.win2000-xp-vista {
	background-position: 0px -200px;
}
div.infomations dl.proFormat dd.xp-vista {
	background-position: 0px -225px;
}
div.infomations dl.proFormat dd.xp-vista-7 {
	background-position: 0px -250px;
}
div.infomations dl.proFormat dd.xp-vista-7-8 {
	background-position: 0px -275px;
}
div.infomations dl.proFormat dd.win7-8 {
	background-position: 0px -300px;
}
div.infomations dl.proFormat dd.vista-7-8 {
	background-position: 0px -325px;
}
div.infomations dl.proFormat dd.vista-7-8-81 {
	background-position: 0px -350px;
}
div.infomations dl.proFormat dd.vista-7-8-81-10 {
	background-position: 0px -375px;
}
div.infomations dl.proFormat dd.vista-7-8-10 {
	background-position: 0px -400px;
}
div.infomations dl.proFormat dd.win7-8-81-10 {
	background-position: 0px -425px;
}
div.infomations dl.proFormat dt.pkg_discontinued + dd.pc9801 {
	background: url(/common/ui/icon_windowsKind_pc9801@fs.png) no-repeat 0px 0px;
	background-size: 190px 25px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations dl.proFormat dt.pkg_discontinued + dd.pc9801 {
		background-image: url(/common/ui/icon_windowsKind_pc9801@fs@2x.png);
	}
}
div.infomations span.proSupport a,
div.infomations span.gotoInfo a {
	position: absolute;
	bottom: 10px;
	width: 144px;
	height: 0px;
	margin-left: 10px;
	padding-top: 20px;
	overflow: hidden;
	line-height: 300%;
	background: url(/common/ui/button_productLink@fs.png) no-repeat 0 0;
	background-size: 584px 44px;
	border: 1px solid #ddd;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations span.proSupport a, div.infomations span.gotoInfo a {
		background-image: url(/common/ui/button_productLink@fs@2x.png);
	}
}
div.infomations span.proSupport a {
	background-position: 0px -1px;
}
div.infomations span.proSupport a:hover {
	background-position: 0px -23px;
	border-color: #ce312d;
}
div.infomations span.gotoInfo a {
	right: 10px;
	background-position: -146px -1px;
}
div.infomations span.gotoInfo a:hover {
	background-position: -146px -23px;
	border-color: #e8a400;
}
/*------------------------------------------------------------
	DVD-VIDEO STYLES
------------------------------------------------------------*/
div.infomations dl.proFormat dt.pkg_video {
	float: left;
	width: 96px;
	height: 0px;
	margin-right: 20px;
	margin-bottom: 3px;
	padding-top: 24px;
	overflow: hidden;
	line-height: 200%;
	background: #fefefe url(/common/ui/icon_videoFormat@fs.png) no-repeat 1px -1px;
	background-size: 190px 26px;
	border: 1px solid #eeeeee;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;

}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations dl.proFormat dt.pkg_video {
		background-image: url(/common/ui/icon_videoFormat@fs@2x.png);
	}
}
div.infomations dl.proFormat dd.dvdvideo {
	width: 190px;
	height: 0px;
	margin-bottom: 4px;
	padding-top: 25px;
	overflow: hidden;
	line-height: 200%;
	background: url(/common/ui/icon_videoKind@fs.png) no-repeat 0px 0px;
	background-size: 190px 26px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.infomations dl.proFormat dd.dvdvideo {
		background-image: url(/common/ui/icon_videoKind@fs@2x.png);
	}
}
/*------------------------------------------------------------
	ANNOUNCEMENT
------------------------------------------------------------*/
#contentsContainer div.dataColumn h4 {
	font-size: 1.25em;
	line-height: 1.2em;
/* 	margin-top: -10px; */
	margin-bottom: 10px;
	padding: 4px 0px 4px 25px;
	color: #666666;
	border-top: 1px solid #eeeeee;
	border-bottom: 1px solid #eeeeee;
	background: #f9f9f9 url(/common/ui/background_contentsHeader.png) no-repeat 3px center;
}
#contentsContainer div.dataColumn p + h4,
#contentsContainer div.dataColumn table + h4 {
	margin-top: 30px;
}
#contentsContainer div.dataColumn h5 {
	font-weight: bold;
	margin: 0 2em 0.5em 2em;
	line-height: 1.25em;
	text-align: justify;
	text-justify: inter-ideograph;		
}
#contentsContainer div.dataColumn p small {
	font-size: 0.92em;
}
#contentsContainer div.dataColumn table {
	width: 700px;
	font-size: 0.92em;
	margin-left: 3em;
	margin-bottom: 1em;
}
#contentsContainer div.dataColumn table th {
	font-weight: bold;
	padding-bottom: 5px;
}
#contentsContainer div.dataColumn table td {
	padding: 0px 20px 5px 0;
}
#contentsContainer div.dataColumn table.header td {
	padding-left: 1em;
}
#contentsContainer div.dataColumn table .caution {
	color: #cc3333;
}
/*------------------------------------------------------------
	DOWNLOAD SITE LIST
------------------------------------------------------------*/
#mainContents #shoplist {
	display: block;
	width: 1000px;
	height: 0px;
	overflow: hidden;
	margin: 0px auto 10px auto;
	padding: 20px 5px 0px 5px;
	text-align: center;
	line-height: 300%;
	background: url(/common/ui/headline@fs.png) no-repeat 0 -600px;
	background-size: 1000px 720px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#mainContents #shoplist {
		background-image: url(/common/ui/headline@fs@2x.png);
	}
}
#contentsContainer div.dataColumn {
	position: relative;
	overflow: hidden;
	width: 980px;
	margin: 0px 0px 40px 5px;
	padding: 15px 10px 10px 10px;
	background: #ffffff;
	border: 1px solid #dddddd;
}
#contentsContainer div.dataColumn:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
#contentsContainer div.dataColumn div.div4Columns {
	float: left;
	width: 237px;
	margin: 0px 8px 10px 0px;
	text-align: center;
}
#contentsContainer div.dataColumn + div.div4Columns {
	margin: 10px 8px 10px 0px;
}
#contentsContainer div.dataColumn p {
	margin: 0px 2em 15px 2em;
	line-height: 1.25em;
	text-align: justify;
	text-justify: inter-ideograph;
}
#contentsContainer div.dataColumn p.small {
	margin: 0px 1em 15px 2em;
	line-height: 1.25em;
	text-align: justify;
	text-justify: inter-ideograph;
	font-size: 0.92em;
}
#contentsContainer div.dataColumn p.imageCaptionSmall {
	margin: 0px;
	padding: 0px;
	text-align: center;
	font-size: 0.92em;
}
#contentsContainer div.dataColumn img {
	margin: 0px 1px 10px 1px;
	border: 1px solid #dddddd;
}
#contentsContainer div.dataColumn img.noborder {
	border-width: 0px;
}
#contentsContainer div.dataColumn a:visited img {
	border: 1px solid #dddddd;
}
#contentsContainer div.dataColumn a:hover img {
	opacity: 0.5;
	-ms-filter: "alpha(opacity=50)";
	cursor: pointer;
}
#contentsContainer div.dataColumn hr.solid {
	clear: both;
	margin-bottom: 10px;
	padding-top: 10px;
	border-top: 1px solid #eeeeee;
}
/*------------------------------------------------------------
	RETURN TOP
------------------------------------------------------------*/
#contentsContainer div.dataColumn p.returnTop {
	clear: both;
	margin: 0px 5px -4px 0px;
	padding-top: 10px;
	text-align: right;
}
#contentsContainer div.dataColumn p.returnTop a {
	padding-left: 12px;
	font-size: 0.83em;
	background: url(/common/ui/marker_returnTop.png) no-repeat left top;
	color: #999999;
}
#contentsContainer div.dataColumn p.returnTop a:hover {
	color: #cc3333;
	border-bottom-width: 0px;
}