@charset "UTF-8";
/* CSS Document */
@media (max-width: 1200px){
	header h1 img{
		width: 320px;
	}
	.header_in nav ul li{
		min-width: 90px;
		font-size: 0.7rem;
	}
	.header_in nav ul li a span{
		font-size: 140%;
	}
	.header_top_flex h2.tel{
		width: 180px;
	}

}
@media (max-width: 959px){
	.pc{
		display: none !important;
	}
	.top_copy {
		background-size: 350px;
	}
	.top_copy h2{
		left: 0;
	}
	.wrapper{
		background-size: 40% , 230px;
	}
	.txt_box h3{
		bottom: 40px;
	}
	.news_wrap{
		padding: 50px 10px;
	}
	.contents_img figure{
		width: calc(100% / 2 - 20px);
	}
	.greeting_flex{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.greeting_wrap .greeting_txt{
		width: 80%;
		max-width: 600px;
	}
	.flex_center{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.topic{
		width: calc(100% - 20px);
		flex-direction: column;
		height: auto;
	}
	.topic div{
		margin-bottom: 50px;
	}
	.topic div img{
		width: 90%;
		max-width: 500px;
		display: block;
		margin: auto;
	}
	.bg_no01,.bg_no02,.bg_no03{
		padding: 15px 0 15px 50px;
	}
	.topic div p{
		padding: 10px;
	}
	.photo_flex{
		flex-direction: column;
	}
	footer{
		padding: 50px 10px 10px;
	}
	.footer_in{
		padding-left: 10px;
		padding-right: 10px;
	}
	.subtitle{
		height: 300px;
	}
	.mailform{
		padding: 30px 10px;
	}
	input[type='text'] ,input[type='date'] , textarea{
		width: 100% !important;
	}
	#mailform table th,
	#mailform table td{
		display: block;
		width: 100%;
	}
	.aircon_hikaku dl{
		width: 100%;
	}
	.aircon_ba{
		flex-direction: column;
		justify-content: center;
	}
	.bg_aircon{
		padding: 10px;
	}
	.flex_menu{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flex_menu .in_text{
		width:100%;
	}
	.price_wrap{
		width: 100%;
		max-width: 700px;
	}
	.price_wrap dl{
		width: 100%;
	}
	.aircon_hikaku dl{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.services_nav ul li{
		height: 140px;
	}
	.services_nav ul li img{
		width: 80px;
		height: 80px;
		padding: 10px;
	}


}
@media (max-width: 750px){
	.tbpc{
		display: none !important;
	}
	.flexbox{
		display: block;
	}
	header h1{
		font-size: 2em;
	}
	header h1 img{
		width: 80%;
		padding-top: 5px;
	}
	.top_copy{
		background-size: 70%;
	}
	.top_copy h2{
		font-size: 2em;
	}
	.sp-slide img{
		width: 80%;
	}
	.wrapper{
		background-size: 200px , 230px;
	}
	.txt_box h2{
		font-size: 1.2em;
	}
	.txt_box h3{
		font-size: 2.9em;
	}
	.contents_in{
		width: calc(100% - 20px);
		margin: auto;	
		padding: 20px 10px;
	}
	

	/* 新着情報 ================================================== */
	.news{
		display: block;
		height: 150px;
	}
	.news h3{
		padding: 0.5em 0;
	}
	/* 各コンテンツ ================================================== */
	
	.topic{
		flex-direction: column;
		height: auto;
	}

	.greeting_wrap .greeting_txt{
		width: 100%;
		left: 0;
		bottom: 0;
		max-width: 600px;
		padding: 20px 10px;
	}
	.greeting_img{
		width: 100%;
		max-width: 400px;
	}
	/* お悩み　==================== */
	.top_onayami{
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.top_onayami div{
		width: 100%;
		max-width: 400px;
	}

	.rec_wrap{
		background-size: 180%;
		padding: 20px;
	}
	.rec_wrap .rec_txt{
		width: 100%;
	}
	footer h2{
		font-size:1.5em;
	}
	.footer_in p.phone_buttom{
		width: 300px;
		text-align: left;
	}
	footer h2 img{
		display: block;
		width: 80%;
		max-width: 400px;
		margin: auto;
	}
	.button_01{
		width: 90%;
		max-width: 320px;
		min-width: 250px;
	}
	.footer_address p{
		padding-left: 10px;
	}
	.sub_copy{
		top:45%;
	}
	.sub_copy h2{
		font-size: 1.5rem;
	}
	
	.picup{
		width: 100%;
		align-content: stretch;
		padding: 20px;
	}
	#mailform{
		padding: 20px 10px;
	}
	
	
	
	.aircon_hikaku img{
		width: 100%;
	}
	.connect{
		flex-direction: column;
		justify-content: center;
		align-content: center;
	}
	.flex_photo02{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flex_photo02 div{
		width: 100%;
		max-width: 300px;
	}
	.flow_flex{
		flex-direction: column;
		height: inherit;
	}
	.flow_img img{
		width: 100%;
		height: 200px;
		object-fit: cover;
	}
	/* ビフォーアフター==================================================  */
	.ba_wrapper .box{
		margin-bottom: 50px;
	}
	.before_after{
		flex-direction: column;
		justify-content: center;
	}
	.before_after .ba_img{
		max-width: 380px;
		width: 100%;
	}
	.ba_wrapper .ba_middle img{
		max-width: 380px;
		width: 100%;
	}
	
	.contents_top img{
		height: 120px;
		width: 120px;
	}
	.services_nav ul li{
		font-size: 0.8em;
	}
	.services_nav ul li img{
		width: 65px;
		height: 65px;
		padding: 5px;
	}
	.services_nav ul li:hover img{
		padding: 0;
	}

}
@media (max-width: 450px){
	.button_02{
		font-size: 0.9em;
	}
	.contents_img{
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.contents_img figure{
		width: calc(100% - 20px);
	}
	.footer_in p.phone_buttom{
		text-align: left;
		font-size:1.5em;
		padding: 20px 0;
		line-height: 180%;
	}
	.rec_wrap .rec_txt p{
	}
	.gaiyou th{
		padding: 0.5em;
		width: 5em;
	}
	.gaiyou td{
		padding: 0.5em 0.5em 0.5em 1.5em;
	}
	.taiou p.txt_l{
		width: 90%;
	}
	.qa details summary{
		height: inherit;
		min-height: 80px;
	}
	.qa details{
		padding: 10px 5px;
	}
	.qa details summary h4{
		width: 75%;
		left: 10px;
		padding-right: 25px;
		line-height: 120%;
	}
	.price_wrap dl{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.price_wrap dt{
		width: 100%;
	}
	.ba_inner{
		max-width: 400px;
		width: 95%;
	}
	
	.contents_top h2{
		font-size: 1.1em;
	}
	.contents_top img{
		height: 90px;
		width: 90px;
	}
	p.midashi02{
		font-size: 1.1em;
	}
	.menu_wrap{
		line-height: 180%;
	}
	.services_nav ul {
		flex-wrap: wrap;
	}
	.services_nav ul li{
		width: calc(100% / 3);
	}

}