@charset "UTF-8";
/**************************************/
/* CSS file For shane ODAWARA         */
/* FileName: about_use.css            */
/* date: 2024.12.24                   */
/**************************************/
/* -------------- */
/* ご利用について */
/* -------------- */

#about-use .page-current p {
	left: 463px;
}
.service p {
	padding: 0;
	margin: 0;
}
p.service-description {
	font-size: 250%;
	margin: 50px 0;
	text-align: center;
	color: #320e14;
}
h4.service-title {
	margin-top: 30px;
	padding: 0.5% 0;
	text-align: center;
	font-size: 200%;
	color: #fff;
	background: #508855;
}
.service-inner {
    background: #ddf0dd;
	padding-bottom: 3%;
}
p.service-text {
	padding: 3% 2% 4%;
	width: 78%;
	margin: 0 8%;
	font-size: 140%;
	color: #3a0e14;
	text-align: center;
	font-weight: bold;
}
.service-float-box {
	width: 94%;
	margin: 0 3% 2%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.service-float-box .service-text-box {
	height: 200px;
	padding: 2%;
	margin: 0 2% 2%;
	background: #fff;
}
@media screen and (min-width:821px) {
	.service-float-box .service-text-box {
		width: 46%;
	}
}
@media screen and (max-width:820px) {
	.service-float-box .service-text-box {
		width: 96%;
	}
	@media screen and (max-width:374px) {
		.service-float-box .service-text-box {
			height: 220px;
		}
	}
}
.service-text-box h5 {
	color:#ff3300;
	font-size: 160%;
	margin: 0 0 1% 0;
	font-weight: bold;
}
.service-text-box ul {
	margin: 0;
	padding-left: 25px;
}
.service-text-box li {
	font-size: 130%;
	list-style: square;
	margin-top: 2%;
	font-weight: bold;
}
.service-text-box li:first-child {
	margin-top: 0;
}
.service-text-box p {
	font-size: 130%;
	font-weight: bold;
}
.service-text-box p.service-text-box-p-4 {
	font-size: 160%;
	font-weight: bold;
}
@media screen and (max-width:320px) {
	.service-text-box li ,
	.service-text-box p {
		font-size: 110%;
	}
	.service-text-box p.service-text-box-p-4 {
		font-size: 130%;
	}
}
.coment-blue {
	color: #3300ff;
}
.coment-orange {
	color: #ff3300;
}

/* 利用までの流れ service-flow */
.service-flow {
	margin-top: 10%;
}

.service-flow-wrap {
	width: 100%;
	background: #ddf0dd;
	display: flex;
	flex-wrap: wrap;
}
.service-flow-wrap section {
	width: 100%;
}
.service-flow-wrap section h4 {
	background: #508855;
	margin: 0;
	padding: 1% 3%;
	width: 100%;
	
}

.service-flow-wrap section ul {
	padding: 2% 3% 2% 6%;
}
@media screen and (max-width: 414px) {
	.service-flow-wrap section ul {
		padding: 2% 5% 2% 10%;
	}
}

.service-flow-wrap section ul li {
	font-size: 130%;
}


/* 利用料 */
.service-price {
	margin-top: 10%;
	margin-bottom: 15%;
}
.price-wrap {
    background: #ddf0dd;
    border-radius: 10px;
    padding: 3%;
    border: none;
}
.price-wrap p {
	font-size: 160%;
	padding: 0 4%;
}
.table-wrap {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	margin: 2%;
}

.table-wrap table {
	border-top: solid 1px;
	border-left: solid 1px;
	border-spacing: 0;
}

@media screen and (min-width: 981px) {
	.table-wrap {
		-webkit-justify-content: space-around;
		justify-content: space-around;
	}
	.table-wrap .table-box1 {
		width: 95%;
		max-width: 520px;
		margin-right: 5%;
	}
	.table-wrap .table-box2 {
		width: 100%;
		max-width: 460px;
	}
}
@media screen and (min-width: 931px) and (max-width: 980px) {
	.table-wrap {
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	.table-wrap .table-box1 {
		width: 95%;
		max-width: 470px;
		margin: 0;
	}
	.table-wrap .table-box2 {
		width: 100%;
		max-width: 370px;
		margin-right: 0;
	}
}
@media screen and (max-width: 930px) {
	.table-wrap {
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	.table-wrap .table-box1 {
		width: 100%;
		max-width: 930px;
		margin-bottom: 3%;
	}
	.table-wrap .table-box2 {
		width: 100%;
		max-width: 930px;
	}
	.table-wrap .table-box1 table {
		width: 100%;
		max-width: 930px;
		margin-bottom: 3%;
	}
	.table-wrap .table-box2 table {
		width: 100%;
		max-width: 930px;
	}
}
.table-wrap .table-box1 th ,
.table-wrap .table-box2 th {
	border-bottom: solid 1px;
	border-right: solid 1px;
	background: #508855;
	text-align: center;
	font-size: 120%;
	font-weight: bold;
	padding: 2%;
}
.table-wrap .table-box1 td ,
.table-wrap .table-box2 td {
	border-bottom: solid 1px;
	border-right: solid 1px;
	padding: 2% 3%;
}
.table-wrap .table-box2 td.td-price {
	text-align: right;
	padding-right: 2%;
}
.price-wrap p.coment {
	font-size: 120%;
	padding: 0;
}
