@charset "UTF-8";
/*------------------------------------------------------------
	CASCADING STYLE SHEETS 3 - MAIN LAYOUT
	COPYRIGHT : 1997-2019 SPACE PROJECT
	BUILD : 2019-10-10T13:28:02+09:00
------------------------------------------------------------*/

/*------------------------------------------------------------
	FONT SIZE	12pt 1em (16pt 0.75 em)
	18pt	1.5 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
------------------------------------------------------------*/

/*------------------------------------------------------------
	GLOBAL STYLES
------------------------------------------------------------*/
body {
	line-height: 1.5em;
	margin: 0px;
	padding: 0px;
	color: #888888;
	font-family: 'ヒラギノ丸ゴ Pro W4', 'Hiragino Maru Gothic Pro', 'メイリオ', Meiryo, Osaka, 'MS Pゴシック', 'MS P Gothic', sans-serif;
	font-size: 0.75em;
	text-align: center;
	background-color: #ffffff;
}
* h3, h4, h5, h6 {
	clear: both;
	position: relative;
}
* p {
	text-align: justify;
	text-justify: inter-ideograph;
}
* s {
	text-decoration: line-through;
}
* li {
	text-align: justify;
	text-justify: inter-ideograph;
}
* a {
	color: #cc3333;
	overflow: hidden;
	cursor: pointer;
}
* a:visited {
	color: #cc3333;
	overflow: hidden;
}
* a:hover {
	color: #cc3333;
	overflow: hidden;
}
* a:active {
	border-width: 0px;
	overflow: hidden;
}
* object {
	outline: none;
	overflow: hidden;
}
* video {
	outline: none;
	overflow: hidden;
}
* .clearFx:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
* .hidden {
	display: none;
}
.noborder {
	border-width: 0px !important;
}
/*------------------------------------------------------------
	HEADER STYLES
------------------------------------------------------------*/
#header {
	border-top: solid 4px #eeeeee;
}
#headerContainer {
	position: relative;
	width: 1000px;
	margin: 15px auto;
	padding: 0px 5px 25px 5px;
}
#headerContainer h1 a {
	display: block;
	float: left;
	width: 270px;
	height: 0px;
	overflow: hidden;
	padding-top: 30px;
	line-height: 200%;
	background: url(/common/ui/logotype_spaceproject@fs.png) no-repeat 0px 0px;
	background-size: 270px 60px;
}
#headerContainer h1 a:hover {
	background-position: 0px -30px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#headerContainer h1 a {
		background-image: url(/common/ui/logotype_spaceproject@fs@2x.png);
	}
}
#headerContainer h2 a {
	display: block;
	float: right;
	width: 110px;
	height: 0px;
	padding-top: 44px;
	margin-top: -6px;
	overflow: hidden;
	line-height: 300%;
	background: url(/common/ui/background_headerBrandLogotype2@fs.png) no-repeat 0 0;
	background-size: 110px 748px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#headerContainer h2 a {
		background-image: url(/common/ui/background_headerBrandLogotype2@fs@2x.png);
	}
}
#headerContainer h2 a:hover {
	opacity: 0.8;
	cursor: pointer;
}
#headerContainer h2.janis a {
	background-position: 0px 0px;
}
#headerContainer h2.speed a {
	background-position: 0px -44px;
}
#headerContainer h2.ciel a {
	background-position: 0px -88px;
}
#headerContainer h2.noa a {
	background-position: 0px -132px;
}
#headerContainer h2.puzzlebox a {
	background-position: 0px -176px;
}
#headerContainer h2.hourglass a {
	background-position: 0px -220px;
}
#headerContainer h2.ateliergh a {
	background-position: 0px -264px;
}
#headerContainer h2.aniseed a {
	background-position: 0px -308px;
}
#headerContainer h2.raptor a {
	background-position: 0px -352px;
}
#headerContainer h2.soleil a {
	background-position: 0px -396px;
}
#headerContainer h2.mina a {
	background-position: 0px -440px;
}
#headerContainer h2.sweet a {
	background-position: 0px -484px;
}
#headerContainer h2.deeps a {
	background-position: 0px -528px;
}
#headerContainer h2.spaceproject a {
	background-position: 0px -572px;
}
#headerContainer h2.airrip a {
	background-position: 0px -616px;
}
#headerContainer h2.repro a {
	background-position: 0px -660px;
}
#headerContainer h2.spjanis-republic a {
	background-position: 0px -704px;
}
#headerContainer h2.otherbrand a {
	display: none;
}
#headerContainer h2.otherbrand {
	display: none;
}
#headerContainer h2.downloadProducts {
	display: none;
}
#headerContainer h2.specialpriceProducts {
	display: none;
}
/*------------------------------------------------------------
	GLOBAL BANNER
------------------------------------------------------------*/
#globalBanner {
	clear: both;
	width: 1004px;
	margin: 28px auto 0 auto;
	padding: 0px 0px;
	text-align: left;
}
#globalBanner:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}
#globalBanner div.bannerContainer {
	float: left;
	position: relative;
	width: 1000px;
	padding: 2px;
	margin-bottom: 20px;
}
#globalBanner div.margin {
	margin-right: 8px;
}
#globalBanner div.bannerContainer img {
	padding: 8px;
	border: 1px solid #dddddd;
}
/*------------------------------------------------------------
	CONTENTS CONTAINER
------------------------------------------------------------*/
#mainContents {
	padding: 30px 0px 10px 0px;
	border-bottom: 1px solid #dddddd;
	background: #f9f9f9 url(/common/ui/background_contentsContainer.png) repeat-x center top;
}
#contentsContainer {
	clear: both;
	width: 1010px;
	min-height: 1px;
	height: auto;
	margin: 0px auto;
	text-align: left;
}
#contentsContainer:after {
	content: ".";
	display: block;
	clear: both;
	height: 0px;
	visibility: hidden;
}
#contentsContainer.brandIndex {
	margin-top: -15px;
}
/*------------------------------------------------------------
	HEADLINE
------------------------------------------------------------*/
#mainContents h3,
 #contentsContainer h3 {
	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 0;
	background-size: 1000px 720px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#mainContents h3 {
		background-image: url(/common/ui/headline@fs@2x.png);
	}
}
#mainContents h3#topics {
	background-position: 0 0;
}
#contentsContainer h3#brand {
	background-position: 0 -20px;
}
#contentsContainer h3#news {
	background-position: 0 -40px;
}
#contentsContainer h3#productList {
	background-position: 0 -60px;
}
#contentsContainer h3#aboutThisSite {
	background-position: 0 -80px;
}
#contentsContainer h3#privacyPolicy {
	background-position: 0 -100px;
}
#contentsContainer h3#contact {
	background-position: 0 -120px;
}
#contentsContainer h3#linkOfficial {
	background-position: 0 -140px;
}
#contentsContainer h3#linkDeveloper {
	background-position: 0 -160px;
}
#contentsContainer h3#linkPublisher {
	background-position: 0 -180px;
}
#contentsContainer h3#linkDistributor {
	background-position: 0 -200px;
}
#contentsContainer h3#supportFaq {
	background-position: 0 -220px;
}
#contentsContainer h3#supportContact {
	background-position: 0 -240px;
}
#contentsContainer h3#beforeAsking {
	background-position: 0 -260px;
}
#contentsContainer h3#formSupport {
	background-position: 0 -280px;
}
#contentsContainer h3#formPublicity {
	background-position: 0 -300px;
}
#contentsContainer h3#confirm {
	background-position: 0 -320px;
}
#contentsContainer h3#global {
	background-position: 0 -340px;
}
#contentsContainer h3#otherBrand {
	background-position: 0 -360px;
}
#contentsContainer h3#shoplist {
	background-position: 0 -600px;
}
#contentsContainer h3#android {
	background-position: 0 -660px;
}
#contentsContainer h3#productListNoIcon {
	background-position: 0 -680px;
}
#contentsContainer h3#announcement {
	background-position: 0 -700px;
}
/*------------------------------------------------------------
	HEADLINE - BRAND INDEX
------------------------------------------------------------*/
#mainContents h3.brandLogotype {
	width: 1000px;
	padding-top: 35px;
	background: url(/common/ui/headline_brandLogotype2@fs.png) no-repeat 0 0;
	background-size: 1000px 1120px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#mainContents h3.brandLogotype {
		background-image: url(/common/ui/headline_brandLogotype2@fs@2x.png);
	}
}
#mainContents h3#janis.noIcon {
	background-position: 0px 0px;
}
#mainContents h3#janis {
	background-position: 0px -35px;
}
#mainContents h3#speed.noIcon {
	background-position: 0px -70px;
}
#mainContents h3#speed {
	background-position: 0px -105px;
}
#mainContents h3#ciel.noIcon {
	background-position: 0px -140px;
}
#mainContents h3#ciel {
	background-position: 0px -175px;
}
#mainContents h3#noa.noIcon {
	background-position: 0px -210px;
}
#mainContents h3#noa {
	background-position: 0px -245px;
}
#mainContents h3#puzzlebox.noIcon {
	background-position: 0px -280px;
}
#mainContents h3#puzzlebox {
	background-position: 0px -315px;
}
#mainContents h3#hourglass.noIcon {
	background-position: 0px -350px;
}
#mainContents h3#hourglass {
	background-position: 0px -385px;
}
#mainContents h3#ateliergh.noIcon {
	background-position: 0px -420px;
}
#mainContents h3#ateliergh {
	background-position: 0px -455px;
}
#mainContents h3#aniseed.noIcon {
	background-position: 0px -490px;
}
#mainContents h3#aniseed {
	background-position: 0px -525px;
}
#mainContents h3#raptor.noIcon {
	background-position: 0px -560px;
}
#mainContents h3#raptor {
	background-position: 0px -595px;
}
#mainContents h3#soleil.noIcon {
	background-position: 0px -630px;
}
#mainContents h3#soleil {
	background-position: 0px -665px;
}
#mainContents h3#mina.noIcon {
	background-position: 0px -700px;
}
#mainContents h3#mina {
	background-position: 0px -735px;
}
#mainContents h3#sweet.noIcon {
	background-position: 0px -770px;
}
#mainContents h3#sweet {
	background-position: 0px -805px;
}
#mainContents h3#deeps.noIcon {
	background-position: 0px -840px;
}
#mainContents h3#deeps {
	background-position: 0px -875px;
}
#mainContents h3#spaceproject.noIcon {
	background-position: 0px -910px;
}
#mainContents h3#spaceproject {
	background-position: 0px -945px;
}
#mainContents h3#airrip.noIcon {
	background-position: 0px -980px;
}
#mainContents h3#airrip {
	background-position: 0px -1015px;
}
#mainContents h3#spjanis-republic.noIcon {
	background-position: 0px -1050px;
}
#mainContents h3#spjanis-republic {
	background-position: 0px -1085px;
}
#mainContents h3#repro {
	width: 1000px;
	padding-top: 35px;
	background: url(/common/ui/headline_brandLogotype_repro@fs.png) no-repeat 0 0;
	background-size: 1000px 70px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#mainContents h3#repro {
		background-image: url(/common/ui/headline_brandLogotype_repro@fs@2x.png);
	}
}
/*------------------------------------------------------------
	FOOTER STYLES
------------------------------------------------------------*/
#footer {
	position: relative;
	width: 1000px;
	height: 40px;
	margin: 0px auto;
	padding: 0px 5px;
}
#footer ul.footerMenu {
	display: block;
	float: left;
	margin-top: 14px;
	margin-left: 5px;
}
#footer ul.footerMenu li {
	list-style-type: none;
	display: block;
	float: left;
}
#footer ul.footerMenu li a {
	display: block;
	height: 0px;
	overflow: hidden;
	padding-top: 16px;
	margin-left: 15px;
	line-height: 300%;
	background: url(/common/ui/background_footermenu.png) no-repeat 0px 0px;
	background-size: 450px 64px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#footer ul.footerMenu li a {
		background-image: url(/common/ui/background_footermenu@fs@2x.png);
	}
}
#footer ul.footerMenu li.footerAbout a {
	width: 118px;
	background-position: 0px 0px;
}
#footer ul.footerMenu li.footerAbout a:hover {
	background-position: 0px -16px;
}
#footer ul.footerMenu li.footerSiteMap a {
	width: 86px;
	background-position: -118px 0px;
}
#footer ul.footerMenu li.footerSiteMap a:hover {
	background-position: -118px -16px;
}
#footer ul.footerMenu li.footerLink a {
	width: 50px;
	background-position: -204px 0px;
}
#footer ul.footerMenu li.footerLink a:hover {
	background-position: -204px -16px;
}
#footer ul.footerMenu li.footerRss a {
	width: 43px;
	background-position: -254px 0px;
}
#footer ul.footerMenu li.footerRss a:hover {
	background-position: -254px -16px;
}
#footer ul.footerMenu li.footerReturnTop a {
	width: 153px;
	background-position: -297px 0px;
}
#footer ul.footerMenu li.footerReturnTop a:hover {
	background-position: -297px -16px;
}
#footer ul.footerMenu li.copyright a {
	display: block;
	width: 400px;
	height: 0px;
	overflow: hidden;
	padding-top: 13px;
	margin-left: 5px;
	margin-right: 60px;
	line-height: 200%;
	background: url(/common/ui/background_footer.png) no-repeat 0px 0px;
	background-size: 400px 26px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#footer ul.footerMenu li.copyright a {
		background-image: url(/common/ui/background_footer@fs@2x.png);
	}
}
/*------------------------------------------------------------
	ATTESTATION CONTAINER STYLES
------------------------------------------------------------*/
#attestationContainer {
	display: none;
	position: relative;
}
#attestationContainer a:hover {
	cursor: pointer;
}
/*
#simpleModalAttestation {
	width: 680px;
	height: 300px;
	background: #ffffff url(/common/ui/attestation_background@fs.png) no-repeat 0px 0px;
	border: 1px solid #cccccc;
	border-top-color: #dddddd;
	background-size: 680px 300px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation {
		background-image: url(/common/ui/attestation_background@fs@2x.png);
	}
}
#simpleModalAttestation p.attestationWelcome {
	display: block;
	position: absolute;
	overflow: visible;
	top: 40px;
	left: 118px;
	z-index: 1;
	width: 444px;
	height: 0px;
	overflow: hidden;
	padding-top: 24px;
	line-height: 200%;
	background: url(/common/ui/attestation_welcome@fs.png) no-repeat 0px 0px;
	background-size: 444px 24px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation p.attestationWelcome {
		background-image: url(/common/ui/attestation_welcome@fs@2x.png);
	}
}
#simpleModalAttestation p.attestationCaution {
	display: block;
	position: absolute;
	top: 90px;
	left: 135px;
	z-index: 1;
	width: 410px;
	height: 0px;
	overflow: hidden;
	padding-top: 50px;
	line-height: 200%;
	background: url(/common/ui/attestation_caution@fs.png) no-repeat 0px 0px;
	background-size: 410px 50px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation p.attestationCaution {
		background-image: url(/common/ui/attestation_caution@fs@2x.png);
	}
}
#simpleModalAttestation p.attestationButton a {
	display: block;
	position: absolute;
	top: 170px;
	left: 220px;
	z-index: 3;
	width: 240px;
	height: 0px;
	overflow: hidden;
	margin-bottom: 10px;
	padding-top: 36px;
	line-height: 200%;
	background: url(/common/ui/attestation_button@fs.png) no-repeat 0px -1px;
	background-size: 240px 74px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
}
#simpleModalAttestation p.attestationButton a:hover {
	cursor: pointer;
	background-position: 0px -38px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation p.attestationButton a {
		background-image: url(/common/ui/attestation_button@fs@2x.png);
	}
}
#simpleModalAttestation p.attestationCharacter {
	display: block;
	position: absolute;
	top: -90px;
	left: -100px;
	z-index: 1;
	width: 880px;
	height: 0px;
	overflow: hidden;
	padding-top: 480px;
	line-height: 200%;
	background: url(/common/ui/background_entranceColumn01@fs.png) no-repeat 0px 0px;
}
#simpleModalAttestation p.attestationCharacter.background0 {
	background-image: url(/common/ui/background_entranceColumn01@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background1 {
	background-image: url(/common/ui/background_entranceColumn02@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background2 {
	background-image: url(/common/ui/background_entranceColumn03@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background3 {
	background-image: url(/common/ui/background_entranceColumn04@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background4 {
	background-image: url(/common/ui/background_entranceColumn05@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background5 {
	background-image: url(/common/ui/background_entranceColumn06@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background6 {
	background-image: url(/common/ui/background_entranceColumn07@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background7 {
	background-image: url(/common/ui/background_entranceColumn08@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background8 {
	background-image: url(/common/ui/background_entranceColumn09@fs.png);
}
#simpleModalAttestation p.attestationCharacter.background9 {
	background-image: url(/common/ui/background_entranceColumn10@fs.png);
}
*/
/*------------------------------------------------------------
	ATTESTATION CONTAINER STYLES - APP ADS
------------------------------------------------------------*/
#simpleModalAttestation {
	width: 880px;
	height: 440px;
	background: url(/common/attestation/attestation_android_specialprice@fs.png) no-repeat 0px 0px;
	background-size: 880px 440px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation {
		background-image: url(/common/attestation/attestation_android_specialprice@fs@2x.png);
	}
}
#simpleModalAttestation p.attestationWelcome,
#simpleModalAttestation p.attestationCaution,
#simpleModalAttestation p.attestationCharacter {
	display: none;
}
#simpleModalAttestation p.attestationButton a {
	z-index: 3;
	display: block;
	position: absolute;
	right: 34px;
	bottom: -416px;
	width: 210px;
	height: 0px;
	overflow: hidden;
	padding-top: 55px;
	line-height: 300%;
	background: #175794 url(/common/attestation/attestation_button@fs.png) no-repeat 0px 0px;
	background-size: 210px 55px;
	border-radius: 10px;
}
#simpleModalAttestation p.attestationButton a:hover {
	cursor: pointer;
	opacity: 0.7;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	#simpleModalAttestation p.attestationButton a {
		background-image: url(/common/attestation/attestation_button@fs@2x.png);
	}
}
/*------------------------------------------------------------
	EX APPS FOOTER
------------------------------------------------------------*/
body.exApps #footer ul.footerMenu li.copyright a {
	display: none;
}
body.exApps #footer ul.footerMenu li.copyrightBrand a {
	display: block;
	width: 400px;
	height: 0px;
	overflow: hidden;
	padding-top: 20px;
	line-height: 200%;
	margin: -15px 0 0 -20px;
	background: url(/common/ui/background_footer_exApps.png) no-repeat 0px 0px;
	background-size: 400px 200px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	body.exApps #footer ul.footerMenu li.copyrightBrand a {
		background-image: url(/common/ui/background_footer_exApps@fs@2x.png);
	}
}
body.exApps #footer ul.footerMenu li.janis a {
	background-position: 0px 0px;
}
body.exApps #footer ul.footerMenu li.speed a {
	background-position: 0px -20px;
}
body.exApps #footer ul.footerMenu li.ciel a {
	background-position: 0px -40px;
}
body.exApps #footer ul.footerMenu li.aniseed a {
	background-position: 0px -60px;
}
body.exApps #footer ul.footerMenu li.noa a {
	background-position: 0px -80px;
}
body.exApps #footer ul.footerMenu li.puzzlebox a {
	background-position: 0px -100px;
}
body.exApps #footer ul.footerMenu li.hourglass a {
	background-position: 0px -120px;
}
body.exApps #footer ul.footerMenu li.ateliergh a {
	background-position: 0px -140px;
}
body.exApps #footer ul.footerMenu li.airrip a {
	background-position: 0px -180px;
}
body.exApps #footer ul.footerMenu li.repro a {
	display: block;
	width: 400px;
	height: 0px;
	overflow: hidden;
	padding-top: 20px;
	line-height: 200%;
	margin: -15px 0 0 -20px;
	background: url(/common/ui/background_footer_exApps_repro@fs.png) no-repeat 0px 0px;
	background-size: 400px 20px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
	body.exApps #footer ul.footerMenu li.repro a {
		background-image: url(/common/ui/background_footer_exApps_repro@fs@2x.png);
	}
}
/*------------------------------------------------------------
	HEADER STYLES
------------------------------------------------------------*/
#fancybox-title {
	text-align: center;
	margin-top: 10px;
	padding: 10px 0 10px 0;
	background: url(/common/ui/background_fancybox_title.png) repeat 0 0;
	line-height: 150%;
	border: 1px solid #ffffff;
	border-radius: 10px;
}