@charset "utf-8";

:root {
	--siteWidth:560px;
	--headerHeight:60px;
	--bottomNavHeight:55px;

	--textColor:#333333;/* テキスト基本色 */
	--textColorSub:#;/* サブテキスト色 */
}

.textColorSub {
	var:(--textColorSub);
}

body {
	background:#ffffff;
	background-size:100% auto;
	font-weight:normal;
	color:var(--textColor);
	z-index:0;
}
a { color:var(--textColor); }

.pageContents .pageTitle {
	padding:3em 0.5em;
	text-align:center;
	/*font-family: 'Noto Sans JP', sans-serif;*/
}
	.pageContents .pageTitle h1,
	.pageContents .pageTitle p {
		font-size:1.3em;
		line-height:1.2;
	}



.mainImage {
	position:relative;
	/*background:url(../img/main_image.jpg) top center no-repeat;*/
	background-size:100% auto;
	box-sizing:border-box;
	width:100%;
	overflow:hidden;
}
@media only screen and (max-width:560px) {
	.mainImage {
		font-size:2.7vw;
	}
}
.mainImageContents {
	position:absolute;
	top:50%; left:0; right:0;
	transform:translateY(-50%);
	width:100%;
	margin:auto;
	text-align:center;
}
.mainImageContents .object1 {
	margin-bottom:0.5em;
}
.mainImageContents .words {
	font-size:1.2em;
	line-height:1.4;
	background:#ffffff;
	border-radius:1em;
	padding:0.5em 0;
	margin:0 1em;
	font-weight:900;
}

.topContents {
	position:relative;
	margin-bottom:3em;
}
@media only screen and (max-width:560px) {
	.topContents {
		font-size:2.7vw;
	}
}

.topContents .typing  {
	font-size:4em;
	position:absolute;
	background:linear-gradient( to bottom,  #34dbff 0%, #00f0ff 100% );
	-webkit-background-clip: text;
	color: transparent;
}
.topContents .typing.text1 {
	top:1.8%; left:12%;
	writing-mode:vertical-rl;
}
.topContents .typing.text2 {
	top:1.8%; left:12%;
	writing-mode:vertical-rl;
}
.topContents .typing.text3 {
	top:28.6%; right:14%;
	writing-mode:vertical-rl;
}
.topContents .typing.text1 span,
.topContents .typing.text2 span,
.topContents .typing.text3 span {
	font-weight:900;
}
.topContents .text4 {
	position:absolute;
	top:42.6%; left:15.5%;
	width:40%;
}
.topContents .text5 {
	position:absolute;
	top:49.2%; right:2%;
	width:48.7%;
}
.topContents .text6 {
	position:absolute;
	top:58.3%; left:6.1%;
	width:60.7%;
}
.topContents .text7 {
	position:absolute;
	bottom:22.4%; left:0;
}
.topContents .text8 {
	position:absolute;
	bottom:2.3%; left:0;
}
}


body.system {
}
body.system .pageTitle {
}
.systemContents {
	padding:0 2%;
}
@media only screen and (max-width:560px) {
	.systemContents {
		font-size:3vw;
	}
}
.systemContents h2 {
	font-size:1.4em;
	line-height:2.2;
	display:inline-block;
	background:linear-gradient(to bottom, rgba(62,201,247,0.9) 0%,rgba(27,164,235,0.9) 100%);
	border-radius:1.1em;
	padding:0 4em;
	margin-bottom:1.2em;
	color:#ffffff;
}
.systemContents .taxText {
	background:#f4f4f4;
	border-radius:1.5em;
	padding:0.8em 0;
	margin:0 2% 1em;
	text-align:center;
	color:#333333;
/*
	border:solid 1px #999999;
	padding:0.8em 0;
	margin:0 2% 1em;
	text-align:center;
	color:#4e4e4e;
*/
}

.systemContents .hourly {
	background:url(../img/system_hourly_bg.jpg) center top no-repeat;
	background-size:cover;
	border-radius:2em;
	padding:2.2em 4%;
	text-align:center;
}
.systemContents .hourly h2 {
	font-size:1.4em;
	line-height:2.2;
	display:inline-block;
	background:linear-gradient(to bottom, rgba(62,201,247,0.9) 0%,rgba(27,164,235,0.9) 100%);
	border-radius:1.1em;
	padding:0 4em;
	margin-bottom:1.2em;
	color:#ffffff;
}
.systemContents .hourly dl {
	line-height:1;
	display:flex;
	align-items:center;
	background:url(../img/system_hourly_fee_bg.png) left top no-repeat;
	background-size:100% auto;
	border-radius:1.4em;
	margin-top:0.8em;
}
.systemContents .hourly dl dt {
	width:35%;
	padding:1em 0;
	color:#ffffff;
}
	.systemContents .hourly dl dt span {
		display:block;
	}
	.systemContents .hourly dl dt span:first-child {
		font-size:1.8em;
	}
	.systemContents .hourly dl dt span:last-child {
		font-size:0.9em;
	}

.systemContents .hourly dl dd {
	width:65%;
	padding:1em 0;
	color:#585858;
}
	.systemContents .hourly dl dd .value {
		font-size:1.8em;
	}

.systemContents .hourlyNotice {
	margin:1em;
}
.systemContents .freeOption {
	font-size:1.15em;
	line-height:1.3;
	background:linear-gradient(to bottom, #deb34b 0%,#977d22 100%);
	border-radius:1.2em;
	padding:0.8em 0;
	margin-bottom:1.5em;
	text-align:center;
	color:#ffffff;
}







.systemContents .systemOption {
	background:url(../img/system_option_bg.jpg) center top no-repeat;
	background-size:cover;
	border-radius:2em;
	padding:2.2em 4% 1em;
	margin-bottom:3em;
	text-align:center;
}
.systemContents .systemOption .optionWrap {
	background-color:#f3f3f3;
	border-radius:1em;
	padding:1em 3%;
	margin-bottom:1em;
}
.systemContents .systemOption h3 {
	font-size:0.9em;
	line-height:2.2;
	background:#fff;
	border-radius:1.6em;
	margin-bottom:1.2em;
}
	.systemContents .systemOption h3 span {
		font-size:1.4em;
	}

.systemContents .systemOption ul {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.systemContents .systemOption ul li {
	font-size:1.1em;
	line-height:2.2;
	background: linear-gradient(to right, #ebc8ff 0%,#ffddff 100%);
	border-radius:1em;
	box-sizing:border-box;
	min-width:8em;
	padding:0 1.5em;
	margin:0 0.2em 0.5em 0.2em;
}
@media only screen and (max-width:px) {
	.systemContents .systemOption ul li {
		font-size:2.6vw;
	}
}