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

@media (max-width: 1200px){
	.pc{
		display: none !important;
	}
	.staff_wrap figure{
		width: calc(100% / 3 - 20px);
	}
}

/* Tablet */
@media (max-width: 959px){
	
	.site-header h1{
		margin-left: 10px;
	}

	.footer_wrap{
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.txt_copy01{
		width: 100%;
		font-size: 1.4em;
		padding: 50px 30px;
	}

	
	.card002{
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-bottom: 30px;
	}
	.card002 .img{
		text-align: center;
	}
	.card002 .img img{
		max-width: 600px;
	}

	.photo_flex{
		flex-wrap: wrap;
	}
	.photo_flex .img4-3{
		width: calc(100% / 2);
	}

	.subtitle{
		height: 300px;
	}
	.subtitle h2{
		width: 100%;
	}
	.subtitle h2 span{
		font-size: 200%;
	}
	
	.breadcrumb-box{
		font-size: 80%;
	}

	.contents_mail{
		padding: 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%;
	}
	.flow_inner{
		width:100%;
		max-width: 680px;
	}
	.flow_photo{
		width: 270px;
		height: 200px;
	}
	.flow_photo img{
		width: 270px;
		height: 200px;
	}
	.flow_link{
		flex-direction: column;
		justify-content: flex-start;
	}
	
	.reverse{
		flex-direction: column-reverse;
	}
	.staff_wrap{
		display: flex;
	}
	.staff_wrap figure{
		width: 100%;
		max-width: 700px;
		margin: 0 auto 30px;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}
	.staff_wrap figure img{
		width: 200px;
		height: 200px;
	}
	.timeline{
		padding: 0 15px;
	}
	
}

/* sp */
@media (max-width: 750px){
	.pctb{
		display: none !important;
	}
	.site-header h1 img{
		height: 80px;
	}
	.slide_wrap{
		height: 70vh;
		min-height: 600px;
	}
	.top_slider{
		left: 10px;
		width: calc(100% - 20px);
	}
	.top_slider .slider li{
		height: calc(70vh - 130px);
		min-height: 470px;
	}
	.txt_lv02{
		font-size: 2rem;
	}
	
	.txt_copy01{
		width: 100%;
		font-size: 1.2em;
		padding: 50px 10px;
		background-size: 100px auto;
	}
	
	.news{
		flex-direction: column;
		justify-content: center;
		align-content: center;
	}
	.news h3{
		border-right:none;
		padding: 10px;
	}
	.news_in{
		width: 100%;
		padding: 10px;
	}
	.footer_in p.phone_buttom{
		font-size: 1.6rem;
	}
	.icon_flex{
		flex-wrap: wrap;
	}
	.icon_flex li{
		width: calc(100% / 3 - 20px);
	}

	.top_link{
		position: absolute;
		bottom:0px;
		top: auto;
		right: 7px;
		z-index: 10;
		width: 150px;
		text-align: center;
		padding: 0 10px;
	}

	

	.area{
		background-size: 100%;
	}
	.area_in{
		width: 100%;
		background-color: rgba(255,255,255,0.49);
		padding: 10px;
	}
	.top_rec_flex{
		flex-direction: column-reverse;
		justify-content: center;
		align-items: center;
	}

	.footer_in ul{
		margin: auto;
		max-width: 300px;
	}
	p.catch_footer{
		font-size: 1.2em;
		padding: 10px;
	}
	.flex_contents{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	
	.subtitle h2{
		font-size: 1.2em;
	}
	.subtitle h2 span{
		font-size: 180%;
	}
	.card001{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.card001 .img{
		width: 90%;
		max-width: 350px;
	}
	.card001 .img img{
		aspect-ratio: 16 / 9;
	}
	
	.card003{
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-bottom: 30px;
	}
	.line01 table th::after{
		display: block;
		content: "";
		width: 2.5rem;
		height: 3px;
		background-color: #e170a4;
		position: absolute;
		top:calc(50% + 1rem);
		right:auto;
		left: 15px;
	}
	.line02 table th,.line02 table td{
		display: block;
		width: 100%;
	}
	.line02 table th{
		border-bottom: none;
		text-align: left;
		padding-bottom: 0;
	}
	.line02 table th::first-letter{
		color: #f3981d;
	}
	/* 流れ======================================== */
	.flow_inner{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flow_txt{
		width: 100%;
		margin-top: 30px;
	}
	.h_number{
		left: -50px;
	}

	
	/* メールフォーム======================================== */
	.contact_top ul{
		flex-direction: column;
	}
	.contact_top ul li{
		margin: 10px;
	}
	.contact_top ul li :last-child{
		margin: 10px;
	}
	.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%;
	}
	
	.anchor_link ul li{
		font-size: 0.8rem;
	}
	
	.flow_wrap02,.flow_wrap03{
		width: 100%;
		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;
	}



}
@media (max-width: 450px){
	.simple01 table th,.simple01 table td{
		display: block;
		width: 100%;
	}
	.simple01 table th{
		padding: 1em 1em 0.5em;
	}
	.simple01 table td{
		padding:0.5em 1em 1em;
	}
	.line01 table th{
		padding: 1rem 0.5rem;
		min-width: 4rem;
	}
	.line01 table td{
		padding: 1rem 0.5rem;
	}
	.line01 table th::after{
		left: 0.5rem;
	}
	.staff_wrap figure{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.flow_link{
		flex-direction: column;
	}
	.h_number{
		left: -20px;
		line-height: 70px;
		width: 70px;
	}
	.photo_flex{
		flex-direction: column;
	}
	.photo_flex .img4-3,.photo_flex .img{
		width: 100%;
		padding: 10px;
	}
	.timeline{
		width: calc(100% - 10px);
		margin: 0 auto 0 0;
	}


}