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

/* Tablet */
@media (max-width: 959px){
	.pc{
		display: none !important;}
	.pc_2{
		display: none !important;}

	#splash_logo img{
		max-width: 350px;
	}
	.top_copy img{
		max-width: 350px;
	}
	.phone a{
		text-align: right;
		vertical-align: middle;
	}
	.sp-slide h2{
		font-size: 2em !important;
		max-width: 700px!important;
		width: 90%;
		line-height: 180%;
	}
	.news{
		height:auto;
		margin: 0 10px;
		flex-direction: column;
		justify-content: flex-start;
		padding: 15px;
	}
	.news h3{
		width: 100%;
		border-right: none;
		margin-bottom: 15px;
	}

	.greeting_img{
		width: 100%;
		max-width: 350px;
		height: auto;
	}
	.greeting_txt{
		width: 100%;
		padding: 15px;
	}

	.menu_link{
		margin-bottom: 20px;
	}
	.contents_link{
		height: inherit;
	}
	.link_button{
		width: 250px;
		height: 250px;
	}
	.subtitle{
		height: 250px;
	}
	.gallery_wraper{
		padding: 10px;
	}
	/*最後の行の隙間を解消*/
	.gallery_wraper::before{
		width:calc(95% / 2);
	}
	.gallery_wraper::after{
		width:calc(95% / 2);
	}
	.photo_in{
		width:calc(95% / 2);
		background-color: #fff;
		margin-bottom: 10px;
		border-radius: 10px;
		padding: 10px;
		position: relative;
		overflow: hidden;
	}
	.photo_in img{
		display: block;
		width: 280px;
		height: 280px;
		border-radius: 10px;
		object-fit: contain;
		margin: auto;
	}
	.service{
		padding: 1em 10px;
	}
	.tel_button{
		width: 95%;
	}
	input[type='text'] ,input[type='date'] , textarea{
		width: 100% !important;
	}
	#mailform table th,
	#mailform table td{
		display: block;
		width: 100%;
	}
}


/* sp */
@media (max-width: 750px){
	.pctb{
		display: none !important;
	}
	#splash_logo img{
		max-width: 250px;
	}
	.site-header img{
		padding: 5px;
		margin: auto;
	}
	
	.sp-slide h2{
		text-align: left;
		line-height: 150%;
		font-size: 1.25em !important;
		max-width: 500px!important;
		width: 90%;
		margin: auto;
	}
	.top_copy img{
		max-width: 250px;
	}

	.news h2{
		font-size:1.5em;
		padding-left: 1em;
	}
	.flex_center{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	h3.midashi_main{
		font-size: 1.5em;
	}
	h3.midashi_main span{
		font-size: 70%;
	}
	/* カルーセルスライダー　==================== */
	.carousel div{
		height: 180px;
	}
	
	/* コンテンツリンク　==================== */
	.grid{
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	figure.effect-chico{
		width: 90%;
	}
	figure.effect-chico p {
		position: absolute;
		bottom: 40px;
		font-size: 0.9em;
		margin: 0 auto;
		opacity: 1;
		transform: scale(1);
	}

	.flex-center{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	header h1,.header-change h1{
		padding-left: 20px;
	}
	header h1 img,.header-change h1 img{
		height: inherit;
		height: 60px;
		margin: auto;
	}
	.flex_greeting{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	
	.menu_link{
		margin: 0 auto;
		width: 90%;
		max-width: 700px;
		margin-bottom: 50px;
	}
	.link_flex{
		height: inherit;
		flex-direction: column;
		padding: 5px;
	}
	.link_contents{
		width: 250px;
		height: 230px;
		overflow: hidden;
	}
	.contact_icon{
		justify-content: center;
		align-items: center;
		margin: auto;
	}
	
	.icon_child{
		margin:10px;
	}
	.contact_icon .icon_child a{
		width: 95%;
	}
	.footer_in img{
		display: block;
		width: 80%;
		max-width: 280px;
		margin: auto;
		padding-bottom: 15px;
	}
	.footer_in p{
		display: block;
		vertical-align:middle;
		width: 80%;
		max-width: 280px;
		margin: auto
	}
	.img_bg{
		background-position: center;
	}
	.subtitle h2{
		font-size: 1.5em;
		width: 90%;
		text-align: center;
	}
	
	.imgbox{
		display: block;
	}
	.imgbox img{
		width: 100%;
	}

	.gallery_wraper{
		justify-content: center;
	}
	/*最後の行の隙間を解消*/
	.gallery_wraper::before{
		width: 320px;
	}
	.gallery_wraper::after{
		width: 320px;
	}
	.photo_in{
		width: 320px;
		background-color: #fff;
		margin-bottom: 10px;
		border-radius: 10px;
		padding: 10px;
		position: relative;
		overflow: hidden;
	}
	.footer_in{
		padding: 10px;
	}
	.slogan #text{
		font-size: 3em;
	}
	.info table {
		width: 100%;
	}
	.info table th{
		display: block;
		width: 100%;
		border-bottom: none;
	}
	.info table td{
		display: block;
		width: 100%;
	}
	.info map{
		width: 100%;
	}
	.flex_basic{
		flex-direction: column;
		align-items: center;
		justify-content:center;
	}
	.flex_basic div img{
		display: block;
		width: 95%;
		max-width: 400px;
		margin: auto;
		height: 250px;
	}
	.work figure{
		width: calc(100% / 2);
	}
	img.op_img{
		width: 95%;
		max-width: 500px;
	}
	img.op_img02{
		width: 95%;
		max-width: 350px;
	}
	.flex_day{
		display: block;
		padding: 10px;
	}
	.flex_day .day_img{
		display: flex;
	}
	.flex_day .day_img {
		width: 100%;
	}
	.flex_day .day_img img{
		width: 100%;
	}
	.day p{
		padding: 1em;
		font-size: 1em;
		line-height: 200%;
	}
	.flow_wrap02,.flow_wrap03{
		width: calc(100% - 30px);
		margin: 0 auto 50px;
		padding: 0.5em;
	}
	.flow_wrap02 dl,.flow_wrap03 dl{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flow_wrap02 dd,.flow_wrap03 dd{
		padding: 0.5em;
	}
	.button_flow{
		display: block;
		width: 100%;
		max-width: 400px;
		margin: 0 auto 0.5em;
	}


}
@media (max-width: 450px){
	.slogan #text{
		font-size: 2.5em;
	}
	.flex_day .day_img img{
		padding: 5px;
	}
	.day dl{
		flex-direction: column;
		align-items: flex-start;
		padding-left: 10px;
	}
	.day dl dt{
		text-align: left;
	}
	
	
}