@charset "UTF-8";
/*------------------------------------------------------------
	CASCADING STYLE SHEETS 3 - RE-PRO
	COPYRIGHT : 1997-2019 SPACE PROJECT
	BUILD : 2019-09-27T23:55:32+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
------------------------------------------------------------*/

/*------------------------------------------------------------
	HEADER
------------------------------------------------------------*/
#header h2 {
	display: none;
}
/*------------------------------------------------------------
	BANNER
------------------------------------------------------------*/
#proBanner {
	clear: both;
	width: 1004px;
	margin: 28px auto 0 auto;
	padding: 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;
	cursor: pointer;
}
/*------------------------------------------------------------
	CONTENTS STYLES
------------------------------------------------------------*/
#contentsContainer div.dataColumn {
	position: relative;
	overflow: hidden;
	width: 980px;
	margin: 0px 0px 40px 5px;
	padding: 15px 10px 15px 10px;
	background: #ffffff url(/common/ui/background_dataColumn.png) repeat-x left bottom;
	border: 1px solid #dddddd;
}
#contentsContainer div.dataColumn:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
/*------------------------------------------------------------
	ANNOUNCEMENT
------------------------------------------------------------*/
#announcementContainer {
	position: relative;
	overflow: hidden;
	width: 980px;
	margin: 0px 0px 40px 5px;
	padding: 15px 10px 15px 10px;
	background: #ffffff;
	border: 1px solid #dddddd;
}
#announcementContainer 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;
}
#announcementContainer p {
	margin: 0px 2em 15px 2em;
	line-height: 1.25em;
	text-align: justify;
	text-justify: inter-ideograph;	
}
#announcementContainer h4 + p,
#announcementContainer p + h4,
#announcementContainer table + h4 {
	margin-top: 30px;
}
#announcementContainer h5 {
	font-weight: bold;
	margin: 0 2em 0.5em 2em;
	line-height: 1.25em;
	text-align: justify;
	text-justify: inter-ideograph;		
}
#announcementContainer p small {
	font-size: 0.92em;
}
#announcementContainer table {
	width: 700px;
	font-size: 0.92em;
	margin-left: 3em;
	margin-bottom: 1em;
}
#announcementContainer table th {
	font-weight: bold;
	padding-bottom: 5px;
}
#announcementContainer table td {
	padding: 0px 20px 5px 0;
}
#announcementContainer table.header td {
	padding-left: 1em;
}
#announcementContainer table .caution {
	color: #cc3333;
}
/*------------------------------------------------------------
	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;
	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: 108px;
	height: 0px;
	overflow: hidden;
	padding-top: 48px;
	background: url(/common/ui/menu_brandIndexVertical2@fs.png) no-repeat 0 top;
	background-size: 94px 576px;
}
@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_brandIndexVertical2@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 #brand_repro a {
	background-position: center -528px;
}
#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;
}
/*------------------------------------------------------------
	APP DESCRIPTIONS
------------------------------------------------------------*/
#contentsContainer img.productMainImage {
	float: right;
	border: 1px solid #cccccc;
}
#contentsContainer div.appDescriptionContainer {
	width: 565px;
	float: left;
}
div.appDescriptionContainer {
	position: relative;
	height: 220px;
	margin-bottom: 20px;
}
div.appDescriptionContainer h4 {
	font-size: 1.25em;
	margin-bottom: 16px;
	padding: 6px 0px 2px 22px;
	border-top: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	background: #f9f9f9 url(/common/ui/background_contentsHeader.png) no-repeat 6px center;
	color: #666666;
}
div.appDescriptionContainer h4 span.ruby {
	font-size: 0.83em;
}
div.appDescriptionContainer h4 span.ruby:before {
	content: "（";
}
div.appDescriptionContainer h4 span.ruby:after {
	content: ")";
	margin-right: 0.5em;
}
div.appDescriptionContainer h4 small {
	color: #999999;
	font-size: 0.83em;
}
div.appDescriptionText {
	float: left;
	width: 335px;
}
div.appDescriptionText p.mainCaption {
	font-size: 1.17em;
	margin-bottom: 10px;
	color: #ca3538;
}
div.appDescriptionText p {
	line-height: 1.25em;
	margin-left: 23px;
	margin-bottom: 0.5em;
}
div.appDescriptionText p.marginTop {
	margin-top: 20px;
}
div.appDescriptionText p.caution {
	margin-top: 15px;
	font-size: 0.83em;
	color: #ca3538;	
}
div.appDescriptionContainer table.appInfomations {
	float: right;
	width: 215px;
	padding: 0px;
	font-size: 0.83em;
	table-layout: auto;
	border-collapse: separate;
	border-spacing: 0;
	border-top: 1px solid #dddddd;
	border-left: 1px solid #dddddd;
}
div.appDescriptionContainer table.appInfomations th {
	width: 5em;
	padding: 3px 5px 3px 15px;
	text-align: left;
	background: url(/common/ui/marker_specList.png) no-repeat 5px 5px;
	border-bottom: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
	background-color: #f9f9f9;
}
div.appDescriptionContainer table.appInfomations td {
	padding: 3px 0px 3px 5px;
	line-height: 1.2em;
	text-align: left;
	border-right: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	color: #999999;
}
div.appDescriptionContainer table.appInfomations td span.campaign {
	color: #ca3538;
	font-size: 0.88em;
}
div.appDescriptionContainer p.appLinkContainer {
	clear: both;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 565px;
}
div.appDescriptionContainer p.appLinkContainer span a {
	float: left;
	display: block;
	width: 275px;
	height: 0;
	padding-top: 30px;
	line-height: 300%;
	overflow: hidden;
	background: url(/common/ui/button_androidLink3@fs.png) no-repeat 0 0;
	background-size: 275px 240px;
	border: 1px solid #cccccc;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;	
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	div.appDescriptionContainer p.appLinkContainer span a {
		background-image: url(/common/ui/button_androidLink3@fs@2x.png);
	}
}
div.appDescriptionContainer p.appLinkContainer span.windows a {
	background-position: 0 -30px;
	background-color: #e6a300;
	border-color: #e6a300;
}
div.appDescriptionContainer p.appLinkContainer span.windows a:hover {
	background-position: 0 0px;
	background-color: #ffffff;
	border-color: #cccccc;
}
div.appDescriptionContainer p.appLinkContainer span.android_repro a {
	background-position: 0px -90px;
	margin-left: 10px;
	background-color: #0073b9;
	border-color: #0073b9;
}
div.appDescriptionContainer p.appLinkContainer span.android_repro a:hover {
	background-position: 0px -60px;
	background-color: #ffffff;
	border-color: #cccccc;
}
div.appDescriptionContainer p.appLinkContainer span.android_ero1 a {
	background-position: 0px -150px;
	margin-left: 10px;
	background-color: #dd4229;
	border-color: #dd4229;
}
div.appDescriptionContainer p.appLinkContainer span.android_ero1 a:hover {
	background-position: 0px -120px;
	background-color: #ffffff;
	border-color: #cccccc;
}
div.appDescriptionContainer p.appLinkContainer span.android_speed a {
	background-position: 0px -210px;
	margin-left: 10px;
	background-color: #eb00ac;
	border-color: #eb00ac;
}
div.appDescriptionContainer p.appLinkContainer span.android_speed a:hover {
	background-position: 0px -180px;
	background-color: #ffffff;
	border-color: #cccccc;
}
/*------------------------------------------------------------
	GALLERY
------------------------------------------------------------*/
div.appImageContainer {
	clear: both;
}
div.appImageContainer h5 {
	font-size: 1.17em;
	margin-bottom: 10px;
	padding: 5px 0px 1px 22px;
	border-top: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	background: #f9f9f9 url(/common/ui/background_contentsHeader.png) no-repeat 6px center;
	color: #666666;
}
div.appImageContainer ul {
	list-style: none;
}
div.appImageContainer li {
	float: left;
}
div.appImageContainer ul.div4 li {
	margin-left: 8px;
}
div.appImageContainer ul.div5 li {
	margin-left: 7px;
}
div.appImageContainer ul li:first-child {
	margin-left: 0px;
}
div.appImageContainer li a img {
	border: 1px solid #cccccc;
}
div.appImageContainer li a img:hover {
	opacity: 0.8;
	cursor: pointer;
}
/*------------------------------------------------------------
	RETURN TOP
------------------------------------------------------------*/
#contentsContainer div.dataColumn p.returnTop {
	clear: both;
	margin: 0px 5px -4px 0px;
	padding-top: 20px;
	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;
}