@charset "UTF-8";
/* CSS Document */

@media (max-width: 1200px){
	.site-header h1 img{
		height: 50px;
	}
	header nav ul li{
		margin-right: 5px;
	}
	.firstview h2.catch{
		position: absolute;
		top: auto;
		bottom: 10%;
		left: 100px;
		text-shadow: 1px 1px #fff,-1px -1px #fff,1px -1px #fff,-1px 1px #fff,0 1px #fff,1px 0 #fff,-1px 0 #fff,0 -1px #fff;
	}
	.firstview .main02{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 35%;
	}

	.firstview .main03{
		position: absolute;
		top: 100px;
		left: 0;
		width: 35%;
	}
	.txt_level01{
		position: relative;
		font-size: 1.5rem;
		padding: 10px 0;
		margin-left: 0;
	}
	.txt_level01::after{
		position: absolute;
		content: " ";
		display: block;
		border-bottom: solid #00a3f5 5px;
		bottom: -5px;
		left: 0;
		width: 2em;
	}
	.news{
		padding: 0 10px;
	}

	.greeting p{
		margin-top: 30px;
	}
	.subtitle h2{
		left: 50px;
		font-size: 2.5em;
	}
	.breadcrumb-box{
		left: 50px;
	}
	.bg_servics01,.bg_servics02,.bg_servics03,.bg_servics04,.bg_servics05{
		background-size: 100%;
	}
}

/* Tablet */
@media (max-width: 959px){
	.pc{
		display: none !important;}
	.btn_wrap{
		margin: 0 auto;
	}
	.tel_button{
		width: 100%;
		max-width: 700px;
		flex-direction: column;
	}
	.tel_button a{
		width: 100%;
		margin: 10px 0;
	}
	.firstview .main_bg01{
		display: none;
	}
	.firstview h2.catch{
		position: absolute;
		top: auto;
		bottom: 10%;
		left: 10%;
		font-size: 2.5em;
	}

	.firstview .main02{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 45%;
		max-width: 450px;
	}

	.firstview .main03{
		position: absolute;
		top: 100px;
		left: 0;
		width: 35%;
		max-width: 450px;
	}
	.greeting{
		flex-direction: column;
	}
	.f_revers{
		flex-direction: column-reverse;
	}
	.txt_wrap_left,.txt_wrap_right{
		width: 100%;
	}
	.greeting_in{
		width: 100%;
	}
	.greeting_in .txt_wrap{
		width: 100%;
		padding-bottom: 50px;
		height: inherit;
	}
	.bg_img01,.bg_img03,.bg_sub_img01,.bg_sub_img02,.bg_sub_img03{
		width: calc(100% - 30px);
		margin-right: 30px;
		height: 450px;
	}
	.bg_img02{
		width: calc(100% - 30px);
		margin-left: 30px;
		height: 450px;
	}
	.bg_point_r{
		background-position: right 30px bottom 150px;
		background-size: 200px;
	}
	.bg_point_l{
		background-position: left 30px bottom 100px;
		background-size: 200px;
	}
	.bg_point_r2{
		background-position: right 30px bottom 100px;
		background-size: 200px;
	}
	.bg_point_l2{
		background-position: right 20px bottom 20px, top 40% left 20px;
	}
	.icon_g{
		margin: auto;
	}
	.area_map,.area_map02{
		background-position: right 20% center;
	}
	.bottom_greeting{
		background-position: right;
	}

	.footer_in ul{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.footer_in ul li{
		margin-bottom: 15px;
	}
	/* サブタイトル======================================== */
	.sub_img01,.sub_img02,.sub_img03,.sub_img04,.sub_img05,.sub_img06{
		top:70px;
		right: 0;
		width: 90%;
		height: 200px;
	}
	.subtitle h2{
		top: auto;
		bottom: 0;
		left: 10%;
		transform: none;
		font-size: 2.2em;
	}
	.breadcrumb-box{
		width: auto;
		left: auto;
		right: 5px;
		top:270px;
		font-size: 90%;
	}
	.subtitle .sub01{
		display: none;
	}


	input[type='text'] ,input[type='date'] , textarea{
		width: 100% !important;
	}
	#mailform table th,
	#mailform table td{
		display: block;
		width: 100%;
	}
	/* ビフォーアフター ================================================== */	
	.before_after .ba_img{
		height: 230px;
	}
	.before_after .ba_img img.ba01{
		height: 230px;
	}
	.before_after .ba_img img.after01{
		height: 220px;
	}
	
	.flow_flex{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flow_inner{
		width: 100%;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.arrow01{
		transform: rotate(90deg);
	}
	.arrow02{
		display: block;
		width: calc(100%);
		margin: 0 0 0 auto;
		text-align: center;
		transform: rotate(90deg);
	}
	.arrow03{
		transform: rotate(90deg);
	}
}

/* sp */
@media (max-width: 750px){
	.pctb{
		display: none !important;
	}
	.copy_2em{
		font-size: 1.8em;
	}
	.firstview{
		max-width: 100%;
		overflow: hidden;
	}
	.firstview h2.catch{
		position: absolute;
		top: auto;
		bottom: 5%;
		left: 10%;
		font-size: 2em;
	}
	.firstview .main01{
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%,-50%);
		width: 95%;
		max-width: 850px;
	}

	.firstview .main02{
		position: absolute;
		bottom: 15%;
		right: 0;
		width: 55%;
	}

	.firstview .main03{
		position: absolute;
		top: 80px;
		left: 0;
		width: 55%;
	}

	.greeting p{
		margin-bottom: 30px;
	}

	.footer_in h2 img{
		width: 90%;
		max-width: 350px;
	}
	.bg_img01,.bg_img02,.bg_img03,.bg_sub_img01,.bg_sub_img02,.bg_sub_img03{
		height: 400px;
		background-position: center;
	}
	.footer_in{
		padding: 10px;
	}
	.footer_in ul{
		margin: auto;
	}
	.footer_in p{
		max-width: 350px;
	}
	.contents h2{
		font-size: 1.5em;
	}
	.subtitle h2{
		font-size: 2em;
	}
	/* テーブル======================================== */
	.line02 table th,.line02 table td{
		display: block;
		width: 100%;
		padding: 0.5em 1em;
		text-align: left;
	}
	.line02 table th{
		border-bottom: none;
	}
	.line02 table td{
		border-bottom: solid 2px #00a3f5;
	}
	
	.flex_contents{
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-bottom: 30px;
	}
	.flex_contents .txt{
		width: 100%;
	}
	.card002{
		flex-direction: column-reverse;
		justify-content: center;
		align-items: center;
	}
	.card002 .txt{
		width: 100%;
	}
	.card002 .img{
		text-align: center;
	}
	.card002 .img img{
		height: auto;
		width: 300px;
	}

	/* フロー======================================== */
	
	.flow_inner{
		width: 100%;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flow_txt{
		width: 100%;
	}
	
	.bg_point_l2{
		background-position: right 5px bottom 20px, top 30% left 5px;
		padding-bottom: 100px;
	}
	/* メールフォーム======================================== */
	.mailform{
		padding: 10px;
	}
	
	input[type='text'] ,input[type='date'] , textarea{
		width: 100% !important;
	}
	.tel_button{
		width: 100%;
		max-width: 600px;
	}
	.tel_button a{
		width: 100%;
	}
	/* ビフォーアフター==================================================  */
	.before_after{
		flex-direction: column;
	}
	.before_after .ba_img {
		max-width: 350px;
		width: 100%;
	}
	


}
@media (max-width: 450px){
	.copy_2em{
		font-size: 1.6em;
	}
	.firstview h2.catch{
		position: absolute;
		top: 220px;
		bottom: auto;
		left: auto;
		right: 15px;
		font-size: 1.5em;
	}
	.firstview .main01{
		position: absolute;
		top: auto;
		bottom: 20px;
		left: 10px;
		transform: none;
		width: 95%;
		max-width: 850px;
	}
	.news{
		width: 100%;
		border-radius: 0;
	}
	.news_inner{
		padding: 10px;
	}
	.txt_level01{
		font-size: 1.3em;
	}
	.bg_img01,.bg_img02,.bg_img03,.bg_sub_img01,.bg_sub_img02,.bg_sub_img03{
		height: 350px;
		background-position: center;
	}
	.bottom_greeting{
		width: 100%;
		border-radius: 0;
	}
	.bottom_greeting p{
		font-size: 1.1em;
		line-height: 200%;
	}

	/* サブタイトル*/
	.sub_img01,.sub_img02,.sub_img03,.sub_img04,.sub_img05,.sub_img06{
		width: 95%;
	}
	.subtitle h2{
		left: 5%;
		font-size: 1.8em;
	}

	#mailform{
		padding: 10px 0;
	}
	.question::after{
		display: none;
	}
	
	

}