
/*--------------------------------------------------------------------------------
　＊料金計算＊
-----------------------------------------------------------------------------------*/
@charset "UTF-8";
@media screen and (min-width: 769px) {

.sp {display: none !important;}



/*注意事項*/
#notice {
	background: #ffd59f;
	color:#c30;
	padding: 1.25rem 1.5rem;
	margin-top: 1.5rem;
}

/*利用条件*/
#joken {
	margin: 3rem 0;
}

/*見出し*/
#joken h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*パラグラフ*/
#joken p {
	padding: 1.5rem 1rem;
}

/*親枠*/
#joken div {
	display: flex;
	flex-direction: row;
	margin: 0 0 1.5rem;
}

/*子枠*/
#joken div div {
	width: calc(100% / 3);
	margin: 0 0.75rem;
	background:#e5e6e7;
	padding: 1rem;
	border-radius: 0.75rem;
	flex-direction: column;
}
#joken div div p {
	padding: 0 0.75rem;
	font-weight: 600;
	letter-spacing: 2px;
}

/*入力F*/
#joken div div input {
	padding: 0.75rem;
	display: inline-block;
}

/*オプション　親枠*/
#joken .opt {
	margin: 0 0.75rem;
	background:#e5e6e7;
	padding: 1rem 1.5rem;
	border-radius: 0.75rem;
}

/*オプション　子枠*/
#joken .opt ul li {
	font-weight: 600;
	font-size: 0.9rem;
}
#joken .opt ul li input {
	padding: 0;
	width: 35px;
	height: 35px;
	margin-right: 0.25rem;
	box-shadow: 1px 1px 8px #aaa;
}
#joken .opt ul li span {
	margin-left: 1.5rem;
	font-size: 1.5em;
	color:#930;
	font-family: Arial, Helvetica, sans-serif;
}

/*計算*/
#joken .calc {
	margin: 1.5rem 0.75rem;
	background:#b39b7d;
	padding: 2rem 0.5rem;
	border-radius: 0.75rem;
}
#joken .calc input {
	margin: auto;
	padding: 1rem 8rem;
	border-radius: 3rem;
}



/*料金算出*/
#kekka {
	margin: 3rem 0;
}

/*見出し*/
#kekka h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*結果テーブル*/
#kekka div table {
	margin: 2rem 1.5rem;
	width:90%
}
#kekka div table th {
	background: #fdebdb;
	font-weight: 600;
	text-align: center;
	vertical-align: middle;
}
#kekka div table td span {
	font-size: 1.6rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-right: 0.3rem;
}
#kekka div table td.optList span {
	font-size: 1.2rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-left: 1.5rem;
	margin-right: 0.3rem;
}

/*そして、仮申込みへ*/
#kekka .kari {
	margin: 1.5rem 0.75rem;
	background:#b53939;
	padding: 4em 0.5rem;
	border-radius: 0.75rem;
	text-align: center;
}
#kekka .kari input {
	margin: auto;
	padding: 1rem 8rem;
	border-radius: 3rem;
}















}
/*--------------------------------------------------------------------------------
　▼　VIEWPORT定義
-----------------------------------------------------------------------------------*/

/*====================================▼　タブレット・モード　/　760pxで最適化　▼======================================*/
@media screen and (max-width: 960px) {

	/*注意事項*/
#notice {
	background: #ffd59f;
	color:#c30;
	padding: 1.25rem 1.5rem;
	margin-top: 1.5rem;
}

/*利用条件*/
#joken {
	margin: 3rem 0;
}

/*見出し*/
#joken h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*パラグラフ*/
#joken p {
	padding: 1.5rem 1rem;
}

/*親枠*/
#joken div {
	display: flex;
	flex-direction: row;
	margin: 0 0 1.5rem;
}

/*子枠*/
#joken div div {
	width: calc(100% / 3);
	margin: 0 0.75rem;
	background:#e5e6e7;
	padding: 1rem;
	border-radius: 0.75rem;
	flex-direction: column;
}
#joken div div p {
	padding: 0 0.75rem;
	font-weight: 600;
	letter-spacing: 2px;
}

/*入力F*/
#joken div div input {
	padding: 0.75rem;
	display: inline-block;
}

/*オプション　親枠*/
#joken .opt {
	margin: 0 0.75rem;
	background:#e5e6e7;
	padding: 1rem 1.5rem;
	border-radius: 0.75rem;
}

/*オプション　子枠*/
#joken .opt ul li {
	font-weight: 600;
	font-size: 0.9rem;
}
#joken .opt ul li input {
	padding: 0;
	width: 35px;
	height: 35px;
	margin-right: 0.25rem;
	box-shadow: 1px 1px 8px #aaa;
}
#joken .opt ul li span {
	margin-left: 1.5rem;
	font-size: 1.5em;
	color:#930;
	font-family: Arial, Helvetica, sans-serif;
}

/*計算*/
#joken .calc {
	margin: 1.5rem 0.75rem;
	background:#b39b7d;
	padding: 2rem 0.5rem;
	border-radius: 0.75rem;
}
#joken .calc input {
	margin: auto;
	padding: 1rem 8rem;
	border-radius: 3rem;
}



/*料金算出*/
#kekka {
	margin: 3rem 0;
}

/*見出し*/
#kekka h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*結果テーブル*/
#kekka div table {
	margin: 2rem 1.5rem;
	width:90%
}
#kekka div table th {
	background: #fdebdb;
	font-weight: 600;
	text-align: center;
	vertical-align: middle;
}
#kekka div table td span {
	font-size: 1.6rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-right: 0.3rem;
}
#kekka div table td.optList span {
	font-size: 1.2rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-left: 1.5rem;
	margin-right: 0.3rem;
}

/*そして、仮申込みへ*/
#kekka .kari {
	margin: 1.5rem 0.75rem;
	background:#b53939;
	padding: 4em 0.5rem;
	border-radius: 0.75rem;
	text-align: center;
}
#kekka .kari input {
	margin: auto;
	padding: 1rem 8rem;
	border-radius: 3rem;
}

}




/*====================================▼　スマートフォン・ランドスケープ・モード（横向き） /　580pxで最適化　▼======================================*/
@media only screen and (max-width:640px) {

}





/*====================================▼　スマートフォン・ポートレート・モード（縦向き） /　320pxで最適化　▼======================================*/
@media only screen and (max-width:480px) {

	/*注意事項*/
#notice {
	padding: 0.75rem 1.0rem;
	font-size:0.7rem;
}

/*利用条件*/
#joken {
	margin: 2.5rem 0;
}

/*見出し*/
#joken h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*パラグラフ*/
#joken p {
	padding: 1.5rem 0 0.5rem;
}

/*親枠*/
#joken div {
	flex-direction: column;
	margin: 0 0 1.5rem;
}

/*子枠*/
#joken div div {
	width: 90%;
	margin: 0.5rem 0;
	padding: 0.5rem 0.5rem 1.0rem;
	flex-direction: column;
}
#joken div div p {
	padding: 0 0.75rem;
	font-weight: 600;
	letter-spacing: 2px;
}

/*入力F*/
#joken div div input {
	padding: 0.75rem;
	display: inline-block;
}

/*オプション　親枠*/
#joken .opt {
	margin: 0;
	padding: 0.5rem;
	border-radius: 0.5rem;
}

/*オプション　子枠*/
#joken .opt ul li {
	font-size: 0.7rem;
}
#joken .opt ul li input {
	margin-right: 0;
}
#joken .opt ul li span {
	margin-left: 0.5rem;
	font-size: 1.0rem;
}

/*計算*/
#joken .calc {
	margin: 1.5rem 0.75rem;
	background:#b39b7d;
	padding: 2rem 0.5rem;
	border-radius: 0.75rem;
}
#joken .calc input {
	margin: auto;
	padding: 1rem 4rem;
	border-radius: 3rem;
}



/*料金算出*/
#kekka {
	margin: 3rem 0;
}

/*見出し*/
#kekka h2 {
	border-bottom: 2px solid #aaa;
	font-size:1.0rem
}

/*結果テーブル*/
#kekka div table {
	margin: 1rem 0;
	width:100%
}
#kekka div table th {
	background: #fdebdb;
	font-weight: 600;
	text-align: center;
	vertical-align: middle;
}
#kekka div table td span {
	font-size: 1.2rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-right: 0.3rem;
}
#kekka div table td.optList span {
	font-size: 1.0rem;
	font-weight: 600;
	font-family: Arial, Helvetica, sans-serif;
	color:#c30;
	margin-left: 1.5rem;
	margin-right: 0.3rem;
}

/*そして、仮申込みへ*/
#kekka .kari {
	margin: 1.5rem 0.75rem;
	background:#b53939;
	padding: 4em 0.5rem;
	border-radius: 0.75rem;
	text-align: center;
}
#kekka .kari input {
	margin: auto;
	padding: 1rem 4rem;
	border-radius: 3rem;
}
	
}
