@charset "UTF-8";

/*===================================================================
	青森つばめプロパン　ショートメッセージサービスページCSS

===================================================================*/

/*-----------------------------
キャッチフレーズ
------------------------------*/
.bl_sms_catch_wrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 10%;
}

.bl_sms_catch_content_wrapper {
	margin-top: 2%;
}

/*-----------------------------
キャッチテキスト
------------------------------*/
.bl_sms_catch_content {
	font-size: 1.5em !important;
	line-height: 180%;
}
@media screen and (max-width: 687px) {
	.bl_sms_catch_content {
		font-size: 1.15em !important;
		line-height: 1.25 !important;
	}
}

/*-----------------------------
注釈
------------------------------*/
.bl_sms_catch_content_note {
	font-size: 0.8em !important;
	line-height: 140%;
}
@media screen and (max-width: 687px) {
	.bl_sms_catch_content_note {
		font-size: 0.75em !important;
	}
}

/*-----------------------------
スマホコンビニ払いについて
------------------------------*/
.bl_sms_service_wrapper {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	justify-content: center;
	align-items: center;
	margin-top: 4%;
	margin-bottom: 4%;
	padding-top: 4%;
	padding-bottom: 4%;
}

.bl_sms_service_ttl {
	font-size: 2em !important;
	line-height: 180%;
}
@media screen and (max-width: 687px) {
	.bl_sms_service_ttl {
		font-size: 1.5em !important;
	}
}

.bl_sms_service_content {
	font-size: 1.5em !important;
	line-height: 1.8;
}
@media screen and (max-width: 687px) {
	.bl_sms_service_content {
		font-size: 1em !important;
	}
}

/*-----------------------------
SMS登録から支払いの流れ
------------------------------*/

.bl_sms_flow_kaisen {
	display: flex;
}

@media screen and (max-width: 687px) {
	.bl_sms_flow_kaisen {
		flex-direction: column;
	}
}

.bl_sms_flow_wrapper {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	justify-content: center;
	align-items: center;
}

@media screen and (max-width: 687px) {
	.bl_sms_flow_wrapper {
		gap: 0;
	}
}

.bl_sms_flow_ttl {
	text-align: center;
	font-size: 1.75em;
	margin-top: 2%;
	color: #002b62;
	font-weight: 700;
}
@media screen and (max-width: 687px) {
	.bl_sms_flow_ttl {
		font-size: 1.3em !important;
		line-height: 1.5;
	}
}

.bl_sms_flow_dl_table_wrapper {
	margin-top: 2% !important;
	margin-bottom: 1% !important;
	width: 50%;
}
@media screen and (max-width: 687px) {
	.bl_sms_flow_dl_table_wrapper {
		width: 100%;
	}
}

.bl_sms_flow_dl_table {
	align-items: center;
}

.bl_sms_flow_dl_table > dt {
	width: 100%;
}

.bl_sms_flow_dl_table > dd {
	width: 100%;
	padding-top: 1.25em;
	padding-bottom: 1.25em;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	background-color: #c2e6fb;
}
@media screen and (max-width: 687px) {
	.bl_sms_flow_dl_table > dd {
		padding-top: 0.5em;
		padding-bottom: 0.5em;
	}
}

.bl_sms_flow_kaisenNo {
	font-size: 2.5em !important;
	line-height: 180%;
	text-align: center;
	width: 100%;
	font-family: din-2014, sans-serif;
	font-weight: 700;
	font-style: normal;
	color: #002b62;
}
@media screen and (max-width: 687px) {
	.bl_sms_flow_kaisenNo {
		font-size: 2em !important;
	}
}

.bl_sms_flow_caption_wrapper {
	margin-bottom: 4%;
}

.bl_sms_flow_caption {
	font-size: 1.25em !important;
	line-height: 180%;
	color: #002b62;
	font-weight: 700;
}
@media screen and (max-width: 687px) {
	.bl_sms_flow_caption {
		font-size: 1em !important;
	}
}

/*-----------------------------
登録フォーム
------------------------------*/
.bl_sms_register_dl_table_wrapper {
	margin-top: 2% !important;
	margin-bottom: 1% !important;
	width: 60%;
	margin-left: auto !important;
	margin-right: auto !important;
}
@media screen and (max-width: 687px) {
	.bl_sms_register_dl_table_wrapper {
		width: 100%;
	}
}

.bl_sms_register_dl_table {
	align-items: center;
}

.bl_sms_register_dl_table > dt {
	width: 100%;
}

.bl_sms_register_dl_table > dd {
	width: 100%;
	padding-top: 1.25em;
	padding-bottom: 1.25em;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
}

.bl_sms_register_info {
	font-size: 1.25em !important;
	line-height: 180%;
	text-align: center;
	width: 100%;
}
@media screen and (max-width: 687px) {
	.bl_sms_register_info {
		font-size: 1em !important;
	}
}

/*-----------------------------
登録前確認
------------------------------*/
.bl_sms_register_confirm_wrapper {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	justify-content: center;
	align-items: center;
}

.bl_sms_register_confirm_txt {
	font-size: 1em !important;
	line-height: 180%;
	font-weight: 700;
	color: #002b62;
	background-color: #fff799;
	padding-top: 1em;
	padding-bottom: 1em;
	padding-left: 2em;
	padding-right: 2em;
}
@media screen and (max-width: 687px) {
	.bl_sms_register_confirm_txt {
		padding-left: 1.25em;
		padding-right: 1.25em;
	}
}

/*-----------------------------
セクション区切り線
------------------------------*/
.bl_sms_section_line {
	border-top: 2px solid #002b62;
	border-bottom: 2px solid #002b62;
}

/*-----------------------------
よくある質問
------------------------------*/
@media screen and (max-width: 687px) {
	.el_qaList dt {
		align-items: flex-start !important;
	}
	.el_qaList dd {
		align-items: flex-start !important;
	}
}

/*-----------------------------
プライバシーポリシーリンク
------------------------------*/
@media screen and (max-width: 687px) {
	.bl-ppLink {
		font-size: 0.8em !important;
	}
}

/*-----------------------------
申込チェック
------------------------------*/
@media screen and (max-width: 687px) {
	#check-sms > span > label {
		display: flex;
		align-items: center;
	}

	#check-sms > span > label > input[type="checkbox"] {
		width: 1em;
		margin-right: 1em;
	}
}

/*-----------------------------
坂下石油ガスチェック
------------------------------*/
@media screen and (max-width: 687px) {
	#customer-check > span > label {
		display: flex;
		align-items: center;
	}

	#customer-check > span > label > input[type="checkbox"] {
		width: 1em;
		margin-right: 1em;
	}
	#customer-check > span > label > span {
		line-height: 1.5 !important;
	}
}