@charset "UTF-8";

@media screen and (max-width: 768px){

#kv {
	width: 100%;
	height: 0;
	margin: 0 auto;
	padding: 0 0 96.25%;
	position: relative;
}
	#kv div.slick_box {
		width: 100%;
		padding: 0;
		margin: 0 auto;
		padding: 0;
	}
		#kv div.slick_box div {
			width: 100%;
			height: 25em;
			margin: 0 auto;
			padding: 0;
		}
			#kv div.slick_box div.kv_mask1 {
				background: url(../images/top/sp_kv1.jpg) center / auto 100% no-repeat;
			}
			#kv div.slick_box div.kv_mask2 {
				background: url(../images/top/sp_kv2.jpg) center / auto 100% no-repeat;
			}
			#kv div.slick_box div.kv_mask3 {
				background: url(../images/top/sp_kv3.jpg) center / auto 100% no-repeat;
			}
	#kv .kv_in {
		width: 100%;
		height: 0;
		margin: 0 auto;
		padding: 0 0 96.25%;
	}
		#kv .kv_in h2 {
			position: absolute;
			display: inline-block;
			width: 85%;
			margin: 0;
			padding: 0;
			bottom: 10%;
			left: 5%;
		}
			#kv .kv_in h2 img {
				width: 100%;
				height: auto;
			}


/* 私たちができること */
#can_do {
	width: 100%;
	margin: 10% auto 0;
	padding: 0 4%;
}
	#can_do .can_do_in {
		width: 100%;
		margin: 0 auto;
		padding: 20% 5% 5%;
		background: url(../images/top/sp_cando_bg_top.png) center top / 100% auto no-repeat, url(../images/top/sp_cando_bg_btm.png) center bottom / 100% auto no-repeat, url(../images/top/sp_cando_bg_mid.png) center / 100% auto repeat-y;
	}
		#can_do .can_do_in > ul {
			display: none;
		}
		#can_do .can_do_in .covid_info {
			width: 100%;
			margin: 0 auto;
			padding: 0;
		}
			#can_do .can_do_in .covid_info h3 {
				margin: 0;
				padding: 2% 0;
				font-size: 4.2vw;
				line-height: 180%;
				color: #222043;
				background: #E4ECF3;
			}
			#can_do .can_do_in .covid_info ul {
				width: 100%;
				margin: 3% auto 0;
				padding: 0;
				list-style: none;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				align-items: center;
			}
				#can_do .can_do_in .covid_info ul li {
					width: calc(100% / 3);
					margin: 1% 0 0;
					padding: 0;
				}
					#can_do .can_do_in .covid_info ul li img {
						width: 100%;
						height: auto;
					}
			#can_do .can_do_in .covid_info p {
				margin: 5% 0 0;
				padding: 0;
				font-size: 3.8vw;
				line-height: 200%;
				color: #333;
				text-align: left;
			}
				#can_do .can_do_in .covid_info p.fontM {
					font-size: 3.8vw;
				}
				#can_do .can_do_in .covid_info p.fontL {
					font-size: 3.9vw;
				}
			#can_do .can_do_in .covid_info p strong {
				display: block;
				margin: 0;
				padding: 0;
				font-size: 4.0vw;
				line-height: 200%;
				color: #FE6A00;
			}
				#can_do .can_do_in .covid_info p.fontM strong {
					font-size: 4.0vw;
				}
				#can_do .can_do_in .covid_info p.fontL strong {
					font-size: 4.1vw;
				}


/* トリミング・ペットホテル リンク */
#index_link {
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 0;
}
	#index_link .box {
		width: 100%;
		margin: 10% auto 0;
		padding: 0;
	}
		#index_link .box h3 {
			width: 60%;
			margin: 0 auto;
			padding: 0;
		}
			#index_link .box h3 img {
				width: 100%;
				height: auto;
			}
		#index_link .box h4 {
			margin: 1% auto 0;
			padding: 0;
			font-size: 3.2vw;
			line-height: 120%;
			color: #664C00;
			letter-spacing: 1px;
			font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
		}
		#index_link .box .box_cont {
			width: 100%;
			margin: 3% auto 0;
			padding: 0;
			background: #fff;
			border-top: 3px solid #232143;
			border-bottom: 3px solid #232143;
			box-shadow: 0 0 5px rgba(0,0,0,0.65);
		}
			#index_link .box .box_cont .img {
				width: 100%;
				margin: 0 auto;
				padding: 0;
			}
				#index_link .box .box_cont .img img {
					width: 100%;
					height: auto;
				}
			#index_link .box .box_cont .txt {
				width: 100%;
				margin: 0 auto;
				padding: 3% 4%;
				font-size: 3.7vw;
				line-height: 200%;
				color: #664C00;
				text-align: left;
			}
				#index_link .box .box_cont .txt p {
					margin: 0 auto;
					padding: 0;
				}
				#index_link .box .box_cont .txt p.fontM {
					font-size: 3.7vw;
				}
				#index_link .box .box_cont .txt p.fontL {
					font-size: 3.8vw;
				}


/* アクセス */
#index_access {
	width: 100%;
	margin: 15% auto 0;
	padding: 0;
}
	#index_access .access_l {
		width: 100%;
		margin: 0;
		padding: 0;
	}
		#index_access .access_l img {
			width: 100%;
			height: auto;
		}
	#index_access .access_r {
		width: 100%;
		margin: 5% 0 0;
		padding: 7% 5% 4%;
		background: url(../images/top/sp_access_top.png) center top / 100% auto no-repeat, url(../images/top/sp_access_btm.png) center bottom / 100% auto no-repeat, url(../images/top/sp_access_mid.png) center / 100% auto repeat-y;
	}
		#index_access .access_r .access_in {
			width: 100%;
			margin: 0;
			padding: 5% 5%;
			border: 2px solid #D0D3D7;
		}
			#index_access .access_r .access_in h3 {
				margin: 0 auto;
				padding: 0;
				font-size: 6vw;
				line-height: 130%;
				color: #222042;
				font-style: italic;
				font-weight: normal;
				font-family: 'Fondamento', cursive;
			}
			#index_access .access_r .access_in h4 {
				margin: 1% auto 0;
				padding: 0;
				font-size: 3.2vw;
				line-height: 120%;
				color: #222042;
				font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
			}
			#index_access .access_r .access_in .address {
				margin: 3% auto 0;
				padding: 0;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
				#index_access .access_r .access_in .address .address_l {
					width: 78%;
					margin: 0;
					padding: 0;
					text-align: left;
					color: #333;
				}
					#index_access .access_r .access_in .address .address_l h5 {
						margin: 0;
						padding: 0;
						font-size: 3.2vw;
						line-height: 160%;
					}
					#index_access .access_r .access_in .address .address_l dl {
						margin: 2% 0 0;
						padding: 0;
						font-size: 2.8vw;
						line-height: 140%;
						display: flex;
					}
						#index_access .access_r .access_in .address .address_l dl.fontM {
							font-size: 2.8vw;
						}
						#index_access .access_r .access_in .address .address_l dl.fontL {
							font-size: 2.85vw;
						}
						#index_access .access_r .access_in .address .address_l dl dt {
							width: 34%;
							margin: 0;
							padding: 0;
							white-space: nowrap;
						}
						#index_access .access_r .access_in .address .address_l dl dd {
							width: 66%;
							margin: 0;
							padding: 0;
							white-space: nowrap;
						}
					#index_access .access_r .access_in .address .address_l p {
						margin: 2% 0 0;
						padding: 0;
						font-size: 2.8vw;
						line-height: 140%;
						white-space: nowrap;
					}
					#index_access .access_r .access_in .address .address_l p.fontM {
							font-size: 2.8vw;
						}
						#index_access .access_r .access_in .address .address_l p.fontL {
							font-size: 2.85vw;
						}
				#index_access .access_r .access_in .address .address_r {
					width: 22%;
					margin: 0;
					padding: 0;
				}
					#index_access .access_r .access_in .address .address_r img {
						width: 96%;
						height: auto;
					}
			#index_access .access_r .access_in h6 {
				margin: 3% auto 0;
				padding: 0;
				font-size: 3.2vw;
				line-height: 140%;
				color: #FE6A00;
				text-align: left;
			}
			#index_access .access_r .access_in ul {
				margin: 0 auto;
				padding: 3% 0 0;
				font-size: 2.8vw;
				line-height: 160%;
				color: #333;
				text-align: left;
				list-style: none;
			}
				#index_access .access_r .access_in ul.fontM {
					font-size: 2.8vw;
				}
				#index_access .access_r .access_in ul.fontL {
					font-size: 2.85vw;
				}
				#index_access .access_r .access_in ul li {
					margin: 2% auto 0;
					padding: 0.1em 0 0 2.5em;
					position: relative;
				}
					#index_access .access_r .access_in ul li:before {
						position: absolute;
						content: '';
						display: block;
						width: 7%;
						height: 0;
						margin: auto;
						padding: 0 0 7%;
						top: 0;
						left: 0;
					}
					#index_access .access_r .access_in ul li:nth-of-type(1):before {
						background: url(../images/icon/access_ico01.png) center / contain no-repeat;
					}
					#index_access .access_r .access_in ul li:nth-of-type(2):before {
						background: url(../images/icon/access_ico02.png) center / contain no-repeat;
					}


/* クーポン */
#index_coupon {
	width: 80%;
	margin: 15% auto 0;
	padding: 5% 5% 5%;
	border: 4px solid #232143;
	border-radius: 0.5em;
	background: url(../images/top/coupon_bg.png) center repeat;
	position: relative;
}
	#index_coupon:before {
		position: absolute;
		content: '';
		display: block;
		width: 8%;
		height: 0;
		margin: auto;
		padding: 0 0 8%;
		background: url(../images/top/coupon_deco1.png) center / contain no-repeat;
		top: -1em;
		left: -8%;
	}
	#index_coupon:after {
		position: absolute;
		content: '';
		display: block;
		width: 14%;
		height: 0;
		margin: auto;
		padding: 0 0 15%;
		background: url(../images/top/coupon_deco2.png) center / contain no-repeat;
		bottom: 0;
		right: -8%;
	}
	#index_coupon .txt {
		width: 100%;
		margin: 0;
		padding: 0;
	}
		#index_coupon .txt h3 {
			width: 100%;
			margin: 0 auto;
			padding: 0;
		}
			#index_coupon .txt h3 img {
				width: 100%;
				height: auto;
			}
		#index_coupon .txt h4 {
			margin: 3% auto 0;
			padding: 0;
			font-size: 4.0vw;
			line-height: 160%;
			color: #FE6A00;
		}
			#index_coupon .txt h4.fontM {
				font-size: 4.0vw;
			}
			#index_coupon .txt h4.fontL {
				font-size: 4.1vw;
			}
		#index_coupon .txt p {
			margin: 3% auto 0;
			padding: 0;
			font-size: 3.6vw;
			line-height: 200%;
			color: #664C00;
			text-align: left;
		}
			#index_coupon .txt p.fontM {
				font-size: 3.6vw;
			}
			#index_coupon .txt p.fontL {
				font-size: 3.7vw;
			}
	#index_coupon .btn_area {
		width: 100%;
		margin: 3% auto 0;
		padding: 0;
	}


/* Information */
#index_info {
	width: 100%;
	margin: 10% auto 0;
	padding: 0 4% 5%;
}
	#index_info h3 {
		margin: 0 auto;
		padding: 0;
		font-size: 6vw;
		line-height: 130%;
		color: #222042;
		font-style: italic;
		font-weight: normal;
		font-family: 'Fondamento', cursive;
	}
	#index_info h4 {
		margin: 1% auto 0;
		padding: 0;
		font-size: 3.2vw;
		line-height: 120%;
		color: #664C00;
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}
	#index_info .info_in {
		width: 100%;
		margin: 3% auto 0;
		padding: 7% 0 5%;
		background: url(../images/top/info_bg_top.png) center top no-repeat, url(../images/top/info_bg_btm.png) center bottom no-repeat;
		overflow: hidden;
	}

	#index_info div.info_box {
		width: 100%;
		max-height: 250px;
		margin: 0 auto 0;
		padding: 0 3%;
		font-size: 3.6vw;
		line-height: 160%;
		color: #664C00;
		text-align: left;
		overflow-y: scroll;
	}
		#index_info div.fontM {
			font-size: 3.6vw;
		}
		#index_info div.fontL {
			font-size: 3.8vw;
		}
		#index_info div.info_box div
		,#index_info div.info_box p {
			margin: 0 auto;
			padding: 0;
			font-size: 3.6vw;
			line-height: 160%;
		}
			#index_info div.fontM div
			,#index_info div.fontM p {
				font-size: 3.6vw;
				text-align: left;
			}
			#index_info div.fontL div
			,#index_info div.fontL p {
				font-size: 3.8vw;
				text-align: left;
			}


/* ご予約情報のご確認 */
#google_calendar {
	width: 100%;
	margin: 10% auto 0;
	padding: 0 3% 15%;
}
	#google_calendar h3 {
		margin: 0 auto;
		padding: 0;
		font-size: 4.8vw;
		line-height: 120%;
		color: #211F41;
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}
	#google_calendar .cal {
		width: 100%;
		height: 600px;
		margin: 3% auto 0;
		padding: 0;
		position: relative
	}
		#google_calendar iframe {
			position: absolute;
			width: 100%;
			height: 100%;
			margin: auto;
			padding: 0;
			top: 0;
			left: 0;
		}

}