@charset "utf-8";
/* CSS Document */
body {color: #444; font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; line-height: 1.6; background: #fff;}
a {color: #fff; text-decoration: none; transition: all 0.5s ease 0s;}
a.tel {color: #444; text-decoration: underline;}
a::after {transition: all 0.5s ease 0s;}
.h-title {padding: 5px 0; color: #856F6F; text-align: center; background: #f4eae9;}
.h-logo {text-align: center;}
.header {display: flex; align-items: center; background: url(../images/h-bg.png) no-repeat center/cover; background-color: #efefef;}
.header-in {text-align: center;}
.header h1 {display: inline-block; background: rgba(144,201,197,0.8);}
.block h2 {color: #472E14; text-align: center; margin: 0 auto 50px; position: relative;}
.block h2::after {content: ""; position: absolute; bottom: -10px; left: 0; right: 0; width: 150px; margin: 0 auto; border-bottom: 2px solid #90C9C5;}
.three {background: #F5F5F5;}
.three-block > div {background: #fff; text-align: center; border: 1px solid #231815;}
.three-block div span {display: block; background: #856F6F; font-family: 'メイリオ', Meiryo; color: #F8F4EA;}
.three-block div strong {display: block; color: #462D13; font-size: 1.6rem; line-height: 70px; height: 70px; margin: 0 20px; background: url(../images/three-title.png) no-repeat; background-size: contain;}
.three-block div p {color: #fff; background: #D2B2B2; border-radius: 15px; line-height: 30px; font-size: 0.9rem; width: 140px; height: 30px; margin: -10px auto 30px;}
.three-block div div {margin-bottom: 20px;}
.three-block div img {vertical-align: bottom;}
.staff-block {display: flex; justify-content: center; /*justify-content: space-between;*/}
.staff-block div {text-align: center; padding: 10px; border: 1px solid #C9CACA;}
.staff-block div img {vertical-align: bottom;}
.staff-block div span {display: block; margin: 10px 0 0;}

.btn {width: 250px; margin: 30px auto -20px;}
.b-btn {display: block; width: 250px; height: 60px; line-height: 60px; color: #fff; text-align: center; background: #90C9C5; position: relative;}
.b-btn:hover {color: #90C9C5; background: #F5F5F5;}
.b-btn::after {content: ""; position: absolute; top: 27.5px; right: 20px; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);}
.b-btn:hover::after {border-top: 2px solid #90C9C5; border-right: 2px solid #90C9C5;}
.h-btn a {background: #856f6f;}
.b-btn:hover {color: #856f6f;}
.b-btn:hover::after {border-top: 2px solid #856f6f; border-right: 2px solid #856f6f;}

.feature {background: #F5F5F5;}
.feature-block {display: flex; justify-content: space-between;}
.feature-block div {text-align: center;}
.feature img {background: #fff;}
.feature span {display: block; color: #472E14;}
.service-block {display: flex; flex-wrap: wrap; justify-content: space-between;}
.service-block div {position: relative;}
.service-block div span {display: block; background: #D2B2B2; color: #fff; text-align: center;}
.plan {background: #F8F4EA;}
.plan strong {display: block; text-align: center; background: #D2B2B2; color: #fff;}
.plan dl {margin: 0 auto 50px; display: flex; flex-wrap: wrap; background: #fff;}
.plan dl dt, .plan dl dd {text-align: center;}
.plan dl dt {width: 30%;}
.plan dl dd {width: 35%;}
.plan dl dd:nth-of-type(1), .plan dl dd:nth-of-type(2) {font-weight: bold;}
.plan dl dd:nth-of-type(odd) {color: #64908E;}
.plan dl dd:nth-of-type(even) {color: #856F6F;}
.slider {text-align: center;}
.slider ul {display: flex; flex-wrap: wrap;}
/*.map {background: #F5F5F5;}*/
.map dl, .comp dl {display: flex; flex-wrap: wrap; align-items: center;}
.map dl dt, .comp dl dt {text-align: right; line-height: 50px; height: 50px; border-right: 1px solid #3E3A39;}
.map dl dt, .map dl dd, .comp dl dt, .comp dl dd {margin: 20px 0;}
.gmap {position: relative; width: 100%; height: 0;}
.gmap iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
footer {text-align: center;}
footer div {background: #D2B2B2; padding: 20px 0;}
footer div img {vertical-align: bottom;}
footer p {background: #472E14; padding: 15px 0; color: #fff;}

.job {text-align: center;}
.job img {vertical-align: bottom;}
.job .j-txt {background: #faf6f7;margin: 10px 0 0; padding: 10px 20px;}
.naiyo {background: #F8F4EA;}
.naiyo dl {line-height: 1.6; text-align: center; background: #fff;}
.naiyo dl dt {padding: 10px 0; background: #D2B2B2; color: #fff;}
.naiyo dl dd {padding: 10px 10px 20px;}
.naiyo dl dd span {display: block; padding: 5px 0; color: #666;}

@media print, screen and (min-width: 750px) {
	.sp {display: none;}
	.h-logo {padding: 50px 0;}
	.block {padding: 70px 0 100px;}
	.block h2 {font-size: 2.0rem;}
	.header {justify-content: flex-end; min-height: 600px;}
	.concept {width: 1200px; margin: 0 auto;}
	.header h1 {margin: 0; padding: 30px 50px;}
	.header-in {width: 50%;}
	.concept-block {display: flex;}
	.concept-block .c-img {z-index: 2;}
	.concept-block .c-txt {z-index: 1; position: relative; padding: 50px 40px 10px; line-height: 2.4;}
	.concept-block .c-txt::after {content: ""; z-index: -1; position: absolute; left: -20px; top: 20px; width: 100%; height: 100%; background: #faf6f7;}
	.three-block {display: flex; justify-content: space-between; max-width: 1200px; margin: 0 auto;}
	.three-block > div {width: 380px; margin: 35px 0px 0;}
	.three-block div span {font-size: 2.0rem; line-height: 75px; width: 70px; height: 70px; margin: -35px auto 10px;}
	.staff-block {max-width: 1200px; margin: 0 auto;}
	.staff-block div {width: 270px; margin: 0 10px; padding: 10px 0;}
	.feature-block {max-width: 1200px; margin: 0 auto;}
	.feature-block div {padding: 0 5px;}
	.feature-block div img {max-width: 100%; height: auto;}
	.feature-block div span {font-size: 0.8rem;}
	.service-block {max-width: 1200px; margin: 0 auto;}
	.service-block div {flex-basis: 24%;}
	.service-block div img {max-width: 100%; height: auto;}
	.service-block div span {width: 240px; height: 60px; line-height: 60px; position: absolute; bottom: -30px; left: 9%;}
	.plan strong {width: 580px; height: 80px; line-height: 80px; margin: 0 auto;}
	.plan dl {width: 580px;}
	.plan dl dt, .plan dl dd {height: 80px; line-height: 80px;}
	.slider ul {width: 700px; margin: 0 auto;}
	.slider ul li {font-size: 0.8rem; margin: 0 15px 10px 0;}
	.map dl, .comp dl {width: 580px; margin: 0 auto;}
	.map dl dt, .comp dl dt {width: 40%;}
	.map dl dd, .comp dl dd {width: 60%;}
	.map dl dt, .map dl dd, .comp dl dt, .comp dl dd {padding: 0 20px;}
	.gmap {padding-top: 35%;}
	footer p {font-size: 0.8rem;}
	.job, .naiyo dl {max-width: 580px; margin: 0 auto;}
}

@media print, screen and (max-width: 749px) {
	body {font-size: 0.8rem;}
	img {width: 100%; height: auto;}
	.h-logo {padding: 20px 0;}
	.h-logo img {width: 202.5px; height: auto;}
	.block {padding: 50px 0 50px;}
	.block h2 {font-size: 1.5rem;}
	.concept {width: 100%; height: auto;}
	.header {justify-content: center; width: 100%; min-height: 250px; margin: 0 0 20px;}
	.header h1 {padding: 15px 20px;}
	.header h1 img {width: 165px; height: auto;}
	.h-btn {position: absolute; left: 0%; right: 0%;}
	.b-btn {font-size: 1.0rem;}
	.concept-block .c-txt {line-height: 1.8; margin: 20px; padding: 20px; background: #faf6f7;}
	.three-block {margin: -25px 0 0; padding: 1px 0 0;}
	.three-block > div {margin: 60px 20px 0;}
	.three-block div span {font-size: 1.4rem; line-height: 50px; width: 50px; height: 50px; margin: -25px auto 10px;}
	.three-block > div img {display: none;}
	.staff-block {flex-wrap: wrap; margin: 0 20px 0px;}
	.staff-block div {width: 45%; margin: 0 5px;}
	.feature-block {flex-wrap: wrap; margin: 0 20px;}
	.feature-block div {width: 30%; margin: 0 0 10px;}
	.feature-block div span {font-size: 0.6rem;}
	.service-block {margin: 0 15px;}
	.service-block div {width: 50%; margin: 0 0 40px; padding: 0 5px;}
	.service-block div span {width: 80%; height: 40px; line-height: 40px; position: absolute; bottom: -20px; right: 10%;}
	.plan strong {height: 60px; line-height: 60px; margin: 0 20px;}
	.plan dl {margin: 0 20px 30px;}
	.plan dl dt, .plan dl dd {height: 60px; line-height: 60px;}
	.slider ul {margin: 0 20px;}
	.slider ul li {font-size: 0.6rem; margin: 0 10px 5px 0;}
	.map dl, .comp dl {width: 100%; padding: 0 20px;}
	.map dl dt, .comp dl dt {width: 30%;}
	.map dl dd, .comp dl dd {width: 70%;}
	.map dl dt, .map dl dd, .comp dl dt, .comp dl dd {padding: 0 10px;}
	.gmap {padding-top: 75%;}
	footer div img {width: 187px; height: auto;}
	footer p {font-size: 0.6rem;}
	.job, .naiyo dl {margin: 0 20px;}
}