@charset "utf-8";
/* モバイル版CSSとの差分 */
/* スマホ～タブレットサイズ間差分 ******************************** */
@media screen and (min-width: 499px) {
	/* 共通スタイル  ///////////////////////*/
	/* サイト横幅(タブレット) */
	.rescue-lp {
		max-width: 699px;
	}
	/* 共通お問い合わせボタン */
	.contact-button {
		min-width: 20rem;
		margin: 2.4rem;
		height: 14rem;
	}
	/* セクションのタイトル */
	.section-title {
		font-size: 2.4rem;
	}
	/* セクションタイトルのアイコン */
	.section-title::before {
		width: 4rem;
		height: 4rem;
	}
	/* セクション内のサブタイトル */
	.section-sub-title {
		font-size: 2.4rem;
	}
	/* セクション内のイメージ */
	.section-img {
		max-width: 48rem;
	}
	/* セクション内の文章 */
	.section-lead {
		text-align: center;
		padding: 1.6rem 0 0;
	}
	/* もっとみるテキスト */
	.see-more {
		width: 24rem;
		margin: 0 auto;
		text-align: center;
	}
	/* headerエリア -------------------------*/
	/* ヘッダーの固定部分 */
	.lp-header__top-area {
		max-width: 699px;
	}
	/* サイトのロゴ */
	.site_logo {
		width: 32rem;
	}
	/* ヘッダー内の横並び要素 */
	.lp-header__flex-container {
		justify-content: center;
	}
	
	.lp-main-contents .lp-header__flex-container{
	margin: 3.1vw auto;
}
	/* ヘッダー固定部分のお問い合わせボタン */
	.top-contact-button {
		font-size: 1.6rem;
		width: 32rem;
		height: 6.4rem;
		margin: 0.8rem;
	}
	.tcb-info {
		font-size: 1.3rem;
	}
	/* ヘッダーメインエリア */
	.lp-header__main-area {
		padding: 16rem 0.8rem 0 0.8rem;
	}
	.header-jump-link-area {
		display: flex;
		justify-content: space-around;
		margin-top: 30px;
		width: 92%;
	}
	/* キャッチコピーの見出し */
	.catch-title {
		font-size: 1.8rem;
	}
	/* キャッチコピーの見出し一部強調 */
	.catch-title-text-emphasis {
		font-size: 3.2rem;
	}
	/* キャッチコピー */
	.catch {
		font-size: 3.2rem;
	}
	/* キャッチコピーのリード文*/
	.catch-lead {
		font-size: 1.6rem;
	}
	/* イメージキャラクター画像のサイズ */
	.header-character-img {
		width: 14rem;
	}
	/* headerエリアここまで -------------------------*/
	/* 共通スタイルここまで  ////////////////////////////*/
	/* メインコンテンツ /////////////////////////////////*/
	/* お客様の疑問エリア -------------------------*/
	/* 吹き出し */
	.customer-question-text {
		font-size: 1.8rem;
		font-weight: bold;
		padding: 2.4rem;
	}
	/* お客様のイメージ画像 */
	.customer-img {
		width: 16rem;
	}
	/* かんばんの救急車アピールテキスト */
	.service-appeal-statement {
		font-size: 1.8rem;
	}
	/* かんばんの救急車アピールテキスト一部強調 */
	.service-appeal-statement--emphasis {
		font-size: 1.8rem;
	}
	/* メインコンテンツ内のキャラクター画像のサイズ */
	.main-contents-character-img {
		width: 9.6rem;
	}
	/* かんばんの救急車が選ばれる理由エリア -------------*/
	/* 施工事例エリア-------------------------------------- */
	/* beforeのタイトル */
	.before-construction {
		font-size: 1.8rem;
	}
	/* afterのタイトル */
	.after-construction {
		font-size: 1.8rem;
	}
	/* お客様の声エリア---------------------------------- */
	.customer-feedback {
		max-width: 32rem;
		width: 100%;
		margin: 0 auto;
	}
	/* ご注文完了までの流れエリア ---------------------- */
	.order-flow-area__contact-link-area {
		display: flex;
		justify-content: space-around;
	}
	/* お問い合わせアピールエリア -----------------------*/
	/* メインコンテンツここまで /////////////////////////////////*/
}
/* スマホ～タブレットサイズ間 差分ここまで ******************************** */
/* タブレット～PCサイズ間 差分   ******************************************/
@media screen and (min-width: 699px) {
	body {
		font-size: 1.8rem;
	}
	/* 共通スタイル  //////////////////////////////////*/
	.mobile-br {
		display: none;
	}
	/* サイト横幅(タブレット~PC) */
	.rescue-lp {
		max-width: 1280px;
		margin: 0 auto;
	}
	/* 共通お問い合わせボタン */
	.contact-button {
		min-width: 20rem;
		max-width: 48rem;
	}
	/* ページ内リンクボタン */
	.header-jump-link-area {
		width: 80%;
	}
	/* 電話でのお問い合わせボタンマウスオーバー */
	.contact-button--phone:hover {
		background-color: rgb(241, 143, 158);
	}
	/* WEBからのお問い合わせボタンマウスオーバー */
	.contact-button--web:hover {
		background-color: #95c1fa;
	}
	/* セクションのタイトル */
	.section-title {
		font-size: 3.2rem;
	}
	/* セクションタイトルのアイコン */
	.section-title::before {
		width: 4.8rem;
		height: 4.8rem;
	}
	.section-lead {
		max-width: 80rem;
		min-width: 32rem;
		margin: 0 auto;
	}
	/* headerエリア -------------------------*/
	/* ヘッダーの固定部分 */
	.lp-header__top-area {
		max-width: 1280px;
	}
	/* ヘッダー固定部分のお問い合わせボタン */
	.top-contact-button {
		font-size: 2rem;
		height: 8rem;
	}
	.tcb-info {
		font-size: 1.8rem;
	}
	/* ヘッダーメインエリア */
	.lp-header__main-area {
		background-image: url("../images/header-img-pc.png");
		padding-top: 24rem;
	}
	.header-jump-link-area {
		display: flex;
		justify-content: space-around;
	}
	/* キャッチコピーの見出し */
	.catch-title {
		font-size: 2.4rem;
		line-height: 4rem;
	}
	/* キャッチコピーの見出し一部強調 */
	.catch-title-text-emphasis {
		font-size: 3.2rem;
	}
	/* キャッチコピー */
	.catch {
		font-size: 4rem;
	}
	.catch-title-img {
		max-width: 48rem;
		width: 100%;
	}
	/* キャッチコピーのリード文*/
	.catch-lead {
		font-size: 2rem;
	}
	/* イメージキャラクター画像のサイズ */
	.header-character-img {
		width: 18rem;
	}
	/* headerエリアここまで -------------------------*/
	/* 共通スタイルここまで  ////////////////////////////*/
	/* メインコンテンツ /////////////////////////////////*/
	/* お客様の疑問エリア -------------------------*/
	/* 吹き出し */
	.customer-question-text {
		font-size: 2rem;
	}
	/* お客様のイメージ画像 */
	.customer-img {
		width: 16rem;
	}
	/* かんばんの救急車アピールテキスト */
	.service-appeal-statement {
		font-size: 1.8rem;
	}
	/* かんばんの救急車アピールテキスト一部強調 */
	.service-appeal-statement--emphasis {
		font-size: 3.2rem;
	}
	/* メインコンテンツ内のキャラクター画像のサイズ */
	.main-contents-character-img {
		width: 12rem;
	}
	/* かんばんの救急車が選ばれる理由エリア -------------*/
	/* 施工事例エリア-------------------------------------- */
	/* beforeのタイトル */
	.before-construction {
		font-size: 2rem;
	}
	/* afterのタイトル */
	.after-construction {
		font-size: 2rem;
	}
	.arrow-img {
		display: inherit;
	}
	/* お客様の声エリア---------------------------------- */
	.customer-feedback {
		max-width: 32rem;
		width: 100%;
		margin: 0 auto;
	}
	.coustomer-feedback-area__flex-container {
		display: flex;
		justify-content: space-around;
	}
	/* ご注文完了までの流れエリア ---------------------- */
	.order-flow-area__contact-link-area {
		display: flex;
		justify-content: space-around;
	}
	.order-flow-area-lead {
		font-size: 2rem;
		font-weight: bold;
	}
	.order-flow {
		display: flex;
		align-items: center;
		padding: 1.6rem;
	}
	.order-flow-title {
		display: none;
	}
	.order-flow-lead {
		font-weight: bold;
		text-align: left;
		margin: 0 4rem 0 4rem;
	}
	.step-img {
		margin: 0 3.2rem 0 3.2rem;
	}
	/* お問い合わせアピールエリア -----------------------*/
	.contact-appeal-area {
		text-align: center;
		padding: 2.4rem;
	}
	.contact-appeal-catch {
		font-size: 1.8rem;
		color: #fafafa;
		font-weight: bold;
	}
	.contact-appeal-character {
		width: 16rem;
		margin: 0 auto;
	}
	/* メインコンテンツここまで /////////////////////////////////*/
	.construction-examples-flex-container {
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
}
/* タブレット～PCサイズ間 差分ここまで   **************************/
/* PCサイズ 差分 *********************************************/
@media screen and (min-width: 999px) {
	/* 共通お問い合わせボタン */
	/* pc sp 表示切替 */
	.sp-only {
		display: none;
	}
	.pc-only {
		display: block;
	}
	/* サイト横幅(PC最大) */
	.rescue-lp {
		max-width: 100%;
		margin: 0 auto;
	}
	.lp-main-contents {
		max-width: 1280px;
		margin: 0 auto;
	}
	.contact-button {
		font-size: 2rem;
		min-width: 24rem;
		height: 14rem;
		margin: 0 3.2rem;
	}
	/* ページ内リンクボタン */
	.header-jump-link-area {
		margin: 3rem auto 0;
		max-width: 1280px;
	}
	.jump-button {
		width: 32%;
	}
	/* headerエリア -------------------------*/
	/* ヘッダーの固定部分 */
	.lp-header__top-area {
		display: flex;
		justify-content: space-between;
		align-items: center;
		max-width: 100%;
		height: 10rem;
	}
	.lp-header__flex-container {
		margin: 1.6rem;
		min-width: 24rem;
	}
	
	.lp-main-contents .lp-header__flex-container{
	margin: 30px auto;
}
	/* サイトのロゴ */
	.site_logo {
		width: 40rem;
		margin: 1.6rem;
	}
	/* ヘッダーメインエリア */
	.lp-header__main-area {
		padding-top: 14rem;
	}
	/* ヘッダー固定部分のお問い合わせボタン */
	.top-contact-button {
		font-size: 2.4rem;
		max-width: auto;
		width: 32rem;
		;
		min-width: 24rem;
		margin-left: 3rem;
	}
	.tcb-info {
		font-size: 2.4rem;
	}
	/* キャッチコピーの見出し */
	.catch-title {
		font-size: 2.8rem;
		line-height: 5.6rem;
	}
	/* キャッチコピーの見出し一部強調 */
	.catch-title-text-emphasis {
		font-size: 4.8rem;
	}
	/* キャッチコピー */
	.catch {
		font-size: 4.8rem;
		margin-top: 2rem;
	}
	/* キャッチコピーのリード文*/
	.catch-lead {
		font-size: 2.4rem;
	}
	.header-jump-link-area {
		display: flex;
		justify-content: center;
	}
	.header-image-character-area {
		justify-content: center;
	}
	/* イメージキャラクター画像のサイズ */
	.header-character-img {
		margin: 2.4rem 8rem;
	}
	/* headerエリアここまで -------------------------*/
	/* お客様の疑問エリア -------------------------*/
	/* 吹き出し */
	.customer-question-text {
		font-size: 3.2rem;
	}
	/* お客様のイメージ画像 */
	.customer-img {
		width: 24rem;
	}
	/* かんばんの救急車アピールテキスト */
	.service-appeal-statement {
		font-size: 2rem;
	}
	/* かんばんの救急車アピールテキスト一部強調 */
	.service-appeal-statement--emphasis {
		font-size: 4rem;
	}
	/* メインコンテンツ内のキャラクター画像のサイズ */
	.main-contents-character-img {
		width: 16rem;
	}
	/* 施工事例の画像サイズ */
	.construction-examples {
		width: 40rem;
	}
}

/* PCサイズ 差分2 *********************************************/
@media screen and (min-width: 1025px) {
	.top-contact-button {
		font-size: 2.8rem;
	}
}