@charset "utf-8";

/* mainimg
---------------------------------------------------------- */
.box-mainimg {
	position: relative;
	z-index: 55;
	padding-bottom: 29px;
	background: #fff;
}
	.list-slide-01 {
		overflow: hidden;
		width: 100%;
		height: 458px;
	}
		.list-slide-01 > li {
			overflow: hidden;
			float: left;
			width: 100%;
			height: 458px;
			background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_slider_02_pc.jpg) no-repeat center bottom;
			background-size: cover;
		}
			.list-slide-01 > li a {
				display: block;
				position: relative;
				height: 458px;
				padding-top: 60px;
			}
				.list-slide-01 > li a .box-slide-01 {
					overflow: hidden;
					display: table;
					margin: 0 auto;
				}
					.list-slide-01 > li a .box-slide-01 .image-01 {
						overflow: hidden;
						display: table-cell;
						width: 486px;
						vertical-align: middle;
						text-align: center;
					}
						.list-slide-01 > li a .box-slide-01 .image-01 img {
							display: inline-block;
						}
					.list-slide-01 > li a .box-slide-01 .detail-01 {
						overflow: hidden;
						display: table-cell;
						min-width: 514px;
						vertical-align: middle;
						padding-left: 33px;
						text-align: left;
					}
						.list-slide-01 > li a .box-slide-01 .detail-01 .logo { margin: 0 0 25px 4px;}
							.list-slide-01 > li a .box-slide-01 .detail-01 .logo img {
								display: inline-block;
								width: 263px;
								height: 43px;
							}
						.list-slide-01 > li a .box-slide-01 .detail-01 .title {
							margin-bottom: 16px;
							color: #0d8a73;
							font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
							font-size: 40px;
							font-size: 4.0rem;
							line-height: 1.1;
							letter-spacing: 0.05em;
						}
						.list-slide-01 > li a .box-slide-01 .detail-01 .title sup {
							top: 0.5em;
							font-size: 50%;
						}
							.list-slide-01 > li a .box-slide-01 .detail-01 .title span {
								position: relative;
								top: -3px;
								vertical-align: top;
								font-size: 30px;
								font-size: 3.0rem;
							}
						.list-slide-01 > li a .box-slide-01 .detail-01 .tag {
							overflow: hidden;
							margin: 0 0 22px 2px;
						}
							.list-slide-01 > li a .box-slide-01 .detail-01 .tag li {
								overflow: hidden;
								float: left;
								margin-right: 13px;
								border: 1px solid #51c2ad;
								-webkit-border-radius: 2px;
								-moz-border-radius: 2px;
								border-radius: 2px;
								background: #fff;
								color: #1f9d86;
								font-size: 12px;
								font-size: 1.2rem;
								font-weight: bold;
								line-height: 1.3;
							}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li:last-child { margin-right: 0;}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-01 {
									padding: 7px 9px 5px 36px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_pressure_01.png) no-repeat 7px center;
									background-size: 23px 19px;
								}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-02 {
									padding: 7px 11px 5px 36px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_air_01.png) no-repeat 9px center;
									background-size: 20px 17px;
								}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-03 {
									padding: 7px 9px 5px 34px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_clean_01.png) no-repeat 7px center;
									background-size: 20px 18px;
								}
						.list-slide-01 > li a .box-slide-01 .detail-01 .text {
							padding-left: 2px;
							color: #4c4c4c;
							font-size: 16px;
							font-size: 1.6rem;
							line-height: 2;
						}
	.box-thumbnail-01 {
		position: relative;
		width: 1000px;
		margin: -66px auto 0;
	}
		.box-thumbnail-01 .thumbnail-slide {
			overflow: hidden;
			float: left;
			width: 700px;
		}
			.box-thumbnail-01 .thumbnail-slide li {
				overflow: hidden;
				float: left;
				position: relative;
				z-index: 55;
				margin-right: 32px;
				cursor: pointer;
			}
				.box-thumbnail-01 .thumbnail-slide li:nth-child(2) { margin-right: 40px;}
				.box-thumbnail-01 .thumbnail-slide li:nth-child(3) { margin-right: 34px;}
				.box-thumbnail-01 .thumbnail-slide li:last-child { margin-right: 0;}
				.box-thumbnail-01 .thumbnail-slide li:hover,
				.box-thumbnail-01 .thumbnail-slide li.is-active {
					transition: opacity 0.3s ease 0s;
					-moz-transition: opacity 0.3s ease 0s;
					opacity: 0.5;
					-moz-opacity: 0.5;
				}
				.box-thumbnail-01 .thumbnail-slide li figure { text-align: center;}
					.box-thumbnail-01 .thumbnail-slide li figure figcaption {
						margin-top: 12px;
						font-size: 14px;
						font-size: 1.4rem;
						line-height: 1.3;
					}
					.box-thumbnail-01 .thumbnail-slide li:hover figure figcaption,
					.box-thumbnail-01 .thumbnail-slide li.is-active figure figcaption {
						color: #3ba995;
						font-weight: bold;
					}
		
		.box-img-slide-01 {
			overflow: hidden;
			float: left;
			position: relative;
			z-index: 56;
			width: 345px;
			height: 212px;
			margin: -62px -45px 0 0;
			background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_slider_03.png) no-repeat left top;
		}
				.box-img-slide-01 a .button {
					position: absolute;
					top: 2px;
					right: 33px;
				}
				.box-img-slide-01 a .text {
					position: absolute;
					top: 20px;
					left: 96px;
				}
				.box-img-slide-01 a .image {
					display: none;
					position: absolute;
					top: 76px;
					left: 4px;
					margin-bottom: 0;
				}
				.box-img-slide-01 a:hover,
				.box-img-slide-01 a:hover img {
					transition: none;
					-moz-transition: none;
					opacity: 1;
					-moz-opacity: 1;
				}
				.box-img-slide-01 a:hover .button img {
					transition: none;
					-moz-transition: none;
					opacity: 0.5;
					-moz-opacity: 0.5;
				}
	.box-mainimg .bx-wrapper .bx-controls-direction a.bx-prev {
		overflow: hidden;
		position: absolute;
		top: 107px;
		left: 0;
		width: 108px;
		height: 220px;
		margin: 0;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/btn_prev_01_pc.png) no-repeat left center;
		background-size: 54px 110px;
		text-indent: -99999px;
		cursor: pointer;
	}
	.box-mainimg .bx-wrapper .bx-controls-direction a.bx-next {
		overflow: hidden;
		position: absolute;
		top: 107px;
		right: 0;
		width: 110px;
		height: 220px;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/btn_next_01_pc.png) no-repeat right center;
		background-size: 55px 110px;
		text-indent: -99999px;
		cursor: pointer;
	}
		.box-mainimg .bx-wrapper .bx-controls-direction a.bx-prev:hover,
		.box-mainimg .bx-wrapper .bx-controls-direction a.bx-next:hover {
			transition: opacity 0.3s ease 0s;
			-moz-transition: opacity 0.3s ease 0s;
			opacity: 0.5;
			-moz-opacity: 0.5;
		}
	
	.list-slide-01 > li.first {
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_slider_01_pc.jpg) no-repeat center bottom;
		background-size: cover;
	}	
			.list-slide-01 > li .box-slide-wrap {
				display: block;
				position: relative;
				height: 458px;
				margin: 0 auto;
			}
				.list-slide-01 > li .box-slide-02 {
					position: absolute;
					top: 102px;
					left: 50%;
					padding-left: 60px;
				}
				.list-slide-01 > li .box-slide-02 .logo {
					margin-bottom: 16px;
					text-align: left;
				}
					.list-slide-01 > li .box-slide-02 .logo img {
						display: inline-block;
						width: 263px;
						height: 43px;
					}
				.list-slide-01 > li .box-slide-02 .text {
					text-align: left;
					color: #138973;
					font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
					font-size: 32px;
					font-size: 3.2rem;
					line-height: 1.5;
					letter-spacing: 0.05em;
				}
				
.list-slide-01 > li a:hover,
.list-slide-01 > li a:focus,
.list-slide-01 > li a:hover img {
	transition: none;
	-moz-transition: none;
	opacity: 1;
	-moz-opacity: 1;
}
				
@media screen and (min-width: 601px) and (max-width: 1280px) {
.list-slide-01 > li .box-slide-02 { padding-left: 0;}
}

@media screen and (min-width: 601px) and (max-width: 1000px) {
.list-slide-01 > li a .box-slide-01 .image-01 { width: 250px;}
.list-slide-01 > li a .box-slide-01 .detail-01 {
	min-width: 200px;
	max-width: 350px;
	padding-left: 20px;
}
}

@media screen and (max-width: 600px) {
.box-mainimg {
	margin-top: 45px;
	padding-bottom: 30px;
}
	.list-slide-01 {
		width: 100%;
		height: 365px;
	}
		.list-slide-01 > li {
			height: 365px;
			background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_slider_02_sp.jpg) no-repeat center bottom;
			background-size: cover;
		}
			.list-slide-01 > li a {
				height: 365px;
				padding-top: 23px;
			}
				.box-mainimg .prev:hover,
				.box-mainimg .next:hover,
				.box-thumbnail-01 .list-link-01 li a:hover,
				.box-thumbnail-01 .list-link-01 li a:hover span img,
				.box-thumbnail-01 .list-link-01 li a:hover p img {
					transition: none;
					-moz-transition: none;
					opacity: 1;
					-moz-opacity: 1;
				}
				.list-slide-01 > li a .box-slide-01 {
					display: table;
					margin: 0 auto;
				}
					.list-slide-01 > li a .box-slide-01 .image-01 {
						display: block;
						width: 100%;
						margin-bottom: 12px;
						text-align: center;
					}
						.list-slide-01 > li a .box-slide-01 .image-01 img {
							width: 283px;
							height: 156px;
						}
					.list-slide-01 > li a .box-slide-01 .detail-01 {
						display: block;
						min-width: 100%;
						vertical-align: top;
						padding-left: 0;
						text-align: center;
					}
						.list-slide-01 > li a .box-slide-01 .detail-01 .logo { margin: 0 0 12px 0;}
							.list-slide-01 > li a .box-slide-01 .detail-01 .logo img {
								width: 155px;
								height: 25px;
							}
						.list-slide-01 > li a .box-slide-01 .detail-01 .title {
							margin-bottom: 8px;
							font-size: 23px;
							font-size: 2.3rem;
							line-height: 1.22;
						}
							.list-slide-01 > li a .box-slide-01 .detail-01 .title span {
								top: 0px;
								font-size: 16px;
								font-size: 1.6rem;
							}
						.list-slide-01 > li a .box-slide-01 .detail-01 .tag {
							margin: 0 0 7px 0;
							text-align: center
						}
							.list-slide-01 > li a .box-slide-01 .detail-01 .tag li {
								display: inline-block;
								float: none;
								vertical-align: top;
								margin: 0 5px;
								text-align: left;
								font-size: 10px;
								font-size: 1.0rem;
							}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li:last-child { margin: 0 5px;}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-01 {
									padding: 3px 7px 3px 21px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_pressure_01.png) no-repeat 5px center;
									background-size: 13px 11px;
								}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-02 {
									padding: 3px 7px 3px 21px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_air_01.png) no-repeat 5px center;
									background-size: 12px 11px;
								}
								.list-slide-01 > li a .box-slide-01 .detail-01 .tag li.type-03 {
									padding: 3px 7px 3px 21px;
									background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_clean_01.png) no-repeat 5px center;
									background-size: 13px 12px;
								}
						.list-slide-01 > li a .box-slide-01 .detail-01 .text {
							padding: 0 10px;
							font-size: 14px;
							font-size: 1.4rem;
							line-height: 1.785;
						}
	.box-thumbnail-01 {
		width: 100%;
		margin: 0 auto 0;
		padding-top: 25px;
	}
		.box-thumbnail-01 .thumbnail-slide { display: none;}
				
		.box-img-slide-01 {
			float: none;
			position: relative;
			width: 302px;
			height: 198px;
			margin: 0 auto;
			background: none;
		}
				.box-img-slide-01 a .button { display: none;}
				.box-img-slide-01 a .text { display: none;}
				.box-img-slide-01 a .image {
					position: absolute;
					top: 0;
					left: 0;
				}
				.box-img-slide-01 a:hover .button img {
					transition: none;
					-moz-transition: none;
					opacity: 1;
					-moz-opacity: 1;
				}
	.box-mainimg .bx-wrapper .bx-controls-direction a.bx-prev {
		top: 50%;
		width: 25px;
		height: 50px;
		margin-top: -25px;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/btn_prev_01_sp.png) no-repeat left top;
		background-size: 25px 50px;
	}
	.box-mainimg .bx-wrapper .bx-controls-direction a.bx-next {
		top: 50%;
		width: 27px;
		height: 50px;
		margin-top: -25px;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/btn_next_01_sp.png) no-repeat left top;
		background-size: 27px 50px;
	}
	
	.list-slide-01 > li.first {
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_slider_01_sp.jpg) no-repeat center bottom;
		background-size: cover;
	}	
			.list-slide-01 > li .box-slide-wrap { padding-top: 26px;}
				.list-slide-01 > li .box-slide-02 {
					display: table;
					position: inherit;
					top: 0;
					left: 0;
					padding-left: 0;
					margin: 0 auto;
					text-align: center;
				}
				.list-slide-01 > li .box-slide-02 .logo {
					margin-bottom: 17px;
					text-align: center;
				}
					.list-slide-01 > li .box-slide-02 .logo img {
						width: 188px;
						height: 73px;
					}
				.list-slide-01 > li .box-slide-02 .text {
					padding-left: 16px;
					text-align: center;
					font-size: 21px;
					font-size: 2.1rem;
					line-height: 1.38;
				}
}

/* sec-top-01
---------------------------------------------------------- */
.sec-top-01 {
	overflow: hidden;
	padding: 117px 0 149px;
	background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_pet_01_pc.jpg) no-repeat center bottom;
	text-align: center;
}
	.sec-top-01 .title { margin-bottom: 26px;}
		.sec-top-01 .title img {
			width: 507px;
			height: 35px;
		}
	.sec-top-01 .icon { margin-bottom: 16px;}
	.sec-top-01 .box-text-01 { overflow: hidden;}
		.sec-top-01 .box-text-01 p {
			color: #666;
			font-weight: bold;
			line-height: 2.86;
		}
		.sec-top-01 .box-text-01 .text-01 {
			display: block;
			margin-top: 40px;
		}
		.sec-top-01 .box-text-01 .button-01 { display: none;}
	
@media screen and (max-width: 600px) {
.sec-top-01 {
	padding: 57px 0 242px;
	background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_pet_01_sp.jpg) no-repeat center bottom;
	background-size: 320px auto;
}
	.sec-top-01 .title { margin-bottom: 13px;}
		.sec-top-01 .title img {
			width: 285px;
			height: 19px;
		}
	.sec-top-01 .icon { margin-bottom: 10px;}
		.sec-top-01 .icon img {
			width: 20px;
			height: 22px;
		}
		.sec-top-01 .box-text-01 p { line-height: 2.07;}
		.sec-top-01 .box-text-01 .text-01 {
			display: none;
			margin-top: 27px;
		}
		.sec-top-01 .box-text-01 .text-01.is-open { display: block;}
		.sec-top-01 .box-text-01 .button-01 {
			overflow: hidden;
			display: block;
			padding: 0 55px;
			margin: 22px 0 7px;
		}
			.sec-top-01 .box-text-01 .button-01 p {
				overflow: hidden;
				display: block;
				border: 1px solid #5fc4b2;
				-webkit-border-radius: 20px; 
				-moz-border-radius: 20px; 
				border-radius: 20px;
				background: #fff;
				text-align: center;
				color: #2d9683;
				font-size: 16px;
				font-size: 1.6rem;
				cursor: pointer;
			}
				.sec-top-01 .box-text-01 .button-01 p span {
					display: inline-block;
					vertical-align: top;
					padding: 3px 22px 2px;
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_arrow_down_01.png) no-repeat right center;
					background-size: 15px 9px;
					text-align: left;
				}
		.sec-top-01 .box-text-01 .button-01.hide { display: none;}
}

/* sec-top-02
---------------------------------------------------------- */
#care-01{
	margin-top: -80px;
	padding-top: 80px;
}

#care-01 .box-cmn-02 {padding-top: 40px;}

.sec-top-02 {
	position: relative;
	padding-top: 77px;
}
	.ico-care-01 {
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 50%;
		width: 120px;
		height: 97px;
		margin-left: -60px;
		padding: 33px 0 0 39px;
		-webkit-border-radius: 60px/60px 60px 38px 38px;
		-moz-border-radius: 60px/60px 60px 38px 38px;
		border-radius: 60px/60px 60px 38px 38px;
		background: #fff;
	}
	.ttl-care-01 {
		margin-bottom: 28px;
		text-align: center;
		color: #0d8a73;
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
		font-size: 38px;
		font-size: 3.8rem;
		line-height: 1.2;
	}
	.txt-care-01 {
		margin-bottom: 53px;
		text-align: center;
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 2;
	}
	
@media screen and (max-width: 600px) {
	#care-01{
	margin-top: -25px;
	padding-top: 25px;
}
	#care-01 .box-cmn-02 {padding-top: 32px;}
.sec-top-02 { padding-top: 46px;}
	.ico-care-01 {
		top: 0;
		left: 50%;
		width: 60px;
		height: 48px;
		margin-left: -30px;
		padding: 16px 0 0 19px;
		-webkit-border-radius: 30px/30px 30px 19px 19px;
		-moz-border-radius: 30px/30px 30px 19px 19px;
		border-radius: 30px/30px 30px 19px 19px;
	}
		.ico-care-01 img {
			width: 23px;
			height: 21px;
		}
	.ttl-care-01 {
		margin-bottom: 17px;
		font-size: 24px;
		font-size: 2.4rem;
	}
	.txt-care-01 {
		margin-bottom: 34px;
		text-align: center;
		line-height: 1.875;
	}
}
	
/* box-care-01
---------------------------------------------------------- */
.box-care-01 {
	position: relative;
	padding: 39px 39px 79px;
	border: 1px solid #b0c5d1;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_top_01_pc.jpg) repeat-x left top;
}
	.box-care-01:before {
		content: "";
		position: absolute;
		bottom: -1px;
		left: -1px;
		width: 1002px;
		height: 97px;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_bottom_01_pc.jpg) no-repeat left bottom;
	}
	.ttl-care-02 {
		overflow: hidden;
		display: table;
		width: 100%;
		margin-bottom: 29px;
	}
		.ttl-care-02 .title {
			overflow: hidden;
			display: table-cell;
			vertical-align: top;
			width: 198px;
			padding: 11px 10px 11px 43px;
			background: #31779f url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_check_01.png) no-repeat 19px 17px;
			background-size: 16px 16px;
			color: #fff;
			font-size: 18px;
			font-size: 1.8rem;
			font-weight: bold;
			letter-spacing: 0.1em;
		}
		.ttl-care-02 .text {
			overflow: hidden;
			display: table-cell;
			vertical-align: middle;
			padding-left: 20px;
			font-size: 16px;
			font-size: 1.6rem;
			line-height: 1.5;
		}
	.box-care-01 .txt-note-01 {
		position: relative;
		z-index: 1;
		text-align: center;
		line-height: 1.71;
	}
	.box-care-01 .txt-note-02 { display: none;}
	.btn-care-01 {
		overflow: hidden;
		display: table;
		margin: 0 auto 26px;
	}
		.btn-care-01 a {
			overflow: hidden;
			display: table;
			padding: 18px 37px 18px 31px;
			-webkit-border-radius: 30px; 
			-moz-border-radius: 30px; 
			border-radius: 30px;
			background: #3279a0;
			text-align: center;
			color: #fff;
			font-size: 16px;
			font-size: 1.6rem;
			font-weight: bold;
		}
			.btn-care-01 a div {
				display: inline-block;
				vertical-align: top;
			}
				.btn-care-01 a div p {
					display: table-cell;
					width: 67px;
					height: 46px;
					vertical-align: middle;
				}
					.btn-care-01 a div p img {
						width: 65px;
						height: 44px;
						border: 1px solid #aabbc8;
					}
				.btn-care-01 a div span {
					color: #fff;
					display: table-cell;
					vertical-align: middle;
					padding: 1px 39px 0 23px;
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_plus_01.png) no-repeat right center;
					text-align: left;
					line-height: 1.2;
				}
				
@media screen and (max-width: 600px) {
.box-care-01-wrap {
	position: relative;
	padding: 0;
}
	.box-care-01-wrap:before {
		content: "";
		position: absolute;
		bottom: -29px;
		left: 0px;
		width: 100%;
		height: 30px;
		background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_bottom_01_sp.jpg) no-repeat left bottom;
		background-size: 100% 30px;
	}
.box-care-01 {
	padding: 21px 18px 13px;
	-webkit-border-radius: 2px 2px 0 0;
	-moz-border-radius: 2px 2px 0 0;
	border-radius: 2px 2px 0 0;
	background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_top_01_sp.jpg) repeat-x left top;
	background-size: 50px 100px;
	border: solid #b0c5d1;
	border-width: 1px 1px 0 1px;
}
	.box-care-01:before {
		bottom: 0;
		left: 0px;
		width: 0;
		height: 0;
		background: none;
		background-size: 0;
	}
	.ttl-care-02 {
		display: block;
		margin-bottom: 17px;
		padding: 0 2px;
	}
		.ttl-care-02 .title {
			display: inline-block;
			width: auto;
			margin-bottom: 9px;
			padding: 5px 10px 3px 35px;
			background: #31779f url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_check_01.png) no-repeat 12px center;
			background-size: 13px 13px;
			font-size: 17px;
			font-size: 1.7rem;
		}
		.ttl-care-02 .text {
			display: block;
			vertical-align: top;
			padding-left: 0;
			line-height: 1.875;
		}
	.box-care-01 .txt-note-01 { line-height: 2.142;}
	.box-care-01 .txt-note-02 {
		display: block;
		position: relative;
		z-index: 1;
		margin-bottom: 5px;
		text-align: center;
		font-size: 14px;
		font-size: 1.4rem;
	}
	.btn-care-01 {
		display: block;
		margin: 0 auto 16px;
	}
		.btn-care-01 a {
			display: block;
			width: 100%;
			padding: 10px 16px;
			-webkit-border-radius: 26px; 
			-moz-border-radius: 26px; 
			border-radius: 26px;
			font-size: 13px;
			font-size: 1.3rem;
		}
				.btn-care-01 a div p {
					width: 42px;
					height: 30px;
				}
					.btn-care-01 a div p img {
						width: 40px;
						height: 28px;
						border: 1px solid #95afc1;
					}
				.btn-care-01 a div span {
					padding: 1px 21px 0 8px;
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_window_01.png) no-repeat right center;
					background-size: 14px 14px;
				}
}
		
/* box-info-01
---------------------------------------------------------- */
.box-care-01 .box-info-01 {
	overflow: hidden;
	margin-bottom: 61px;
}
	.box-care-01 .box-info-01 .image {
		padding-left: 164px;
		margin-bottom: 0;
		text-align: left;
	}
	.box-care-01 .box-info-01 ul {
		position: relative;
		z-index: 1;
		margin: -171px 0 0 42px;
	}
		.box-care-01 .box-info-01 ul li {
			overflow: hidden;
			float: left;
			width: 289px;
			height: 424px;
			padding: 237px 49px 0 0;
			background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_list_01.png) no-repeat left top;
		}
			.box-care-01 .box-info-01 ul li:nth-child(2) {
				width: 240px;
				margin-left: 10px;
				padding: 237px 0 0 0;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_list_02.png) no-repeat left top;
			}
			.box-care-01 .box-info-01 ul li:nth-child(3) {
				width: 288px;
				padding: 237px 0 0 48px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_list_03.png) no-repeat left top;
			}
			.box-care-01 .box-info-01 ul li .title {
				margin-bottom: 48px;
				text-align: center;
				color: #fff;
				font-size: 18px;
				font-size: 1.8rem;
				font-weight: bold;
			}
			.box-care-01 .box-info-01 ul li .text {
				text-align: center;
				line-height: 1.71;
			}
			
@media screen and (max-width: 600px) {
.box-care-01 .box-info-01 {
	overflow: inherit;
	margin-bottom: 10px;
}
	.box-care-01 .box-info-01 .image {
		margin-bottom: 44px;
		padding: 0;
		text-align: center;
	}
		.box-care-01 .box-info-01 .image img {
			width: 100%;
			height: auto;
		}
	.box-care-01 .box-info-01 ul { margin: 0;}
		.box-care-01 .box-info-01 ul li {
			overflow: inherit;
			position: relative;
			float: none;
			width: 100%;
			height: auto;
			margin-bottom: 20px;
			padding: 0 2px 0 49px;
			background: none;
		}
			.box-care-01 .box-info-01 ul li:nth-child(2) {
				width: 100%;
				margin-left: 0;
				padding: 0 2px 0 49px;
				background: none;
			}
			.box-care-01 .box-info-01 ul li:nth-child(3) {
				width: 100%;
				margin-left: 0;
				padding: 0 2px 0 49px;
				background: none;
			}
			.box-care-01 .box-info-01 ul li .title {
				overflow: hidden;
				position: absolute;
				top: -15px;
				left: -3px;
				width: 80px;
				height: 80px;
				margin-bottom: 0;
				padding-top: 30px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_title_01.png) no-repeat left top;
				background-size: 80px 80px;
				font-size: 17px;
				font-size: 1.7rem;
				line-height: 1.1;
			}
			.box-care-01 .box-info-01 ul li:nth-child(1) .title {
				padding-top: 21px;
				font-size: 16px;
				font-size: 1.6rem;
				line-height: 0.8125;
			}
			.box-care-01 .box-info-01 ul li .text {
				overflow: hidden;
				min-height: 83px;
				padding: 14px 12px 11px 40px;
				-webkit-border-radius: 2px;
				-moz-border-radius: 2px;
				border-radius: 2px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_content_01.jpg) repeat left top;
				background-size: cover;
				text-align: left;
				font-size: 16px;
				font-size: 1.6rem;
				line-height: 1.874;
			}
}
			
/* box-care-02
---------------------------------------------------------- */
.box-care-02-wrap {
	overflow: hidden;
	margin-top: -97px;
	padding: 171px 0 129px;
	background: #f0f7f6 url(/content/dam/sites/jp_unicharmpet_com/pro/common/bg_top_02_pc.jpg) repeat-x left top;
}
	.txt-care-02 {
		margin-bottom: 17px;
		text-align: center;
		font-size: 24px;
		font-size: 2.4rem;
		line-height: 1.3;
	}
	.ttl-care-03 {
		margin-bottom: 30px;
		color: #0f9179;
		text-align: center;
		font-size: 38px;
		font-size: 3.8rem;
		line-height: 1.3;
	}
		.ttl-care-03 span { color: #4c4c4c;	}
	
	.list-care-01 {
		overflow: hidden;
		margin-left: -41px;
		padding-bottom: 60px;
	}
		.list-care-01 li {
			position: relative;
			float: left;
			width: 306px;
			margin-left: 41px;
		}
			.list-care-01 li:before {
				content: "";
				position: absolute;
				bottom: -60px;
				left: 50%;
				width: 12px;
				height: 60px;
				margin-left: -6px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_dot_01.png) no-repeat left top;
			}
			.list-care-01 li .detail-01 {
				overflow: hidden;
				position: relative;
				padding: 21px 0 15px;
				border: solid #97d9cd;
				border-width: 1px 1px 0 1px;
				-webkit-border-radius: 6px 6px 0 0;
				-moz-border-radius: 6px 6px 0 0;
				border-radius: 6px 6px 0 0;
				background: #1f9d86;
				text-align: center;
				color: #fff;
				font-size: 16px;
				font-size: 1.6rem;
				font-weight: bold;
			}
					.list-care-01 li .detail-01 figcaption {
						margin-top: 9px;
						letter-spacing: 0.15em;
					}
			.list-care-01 li .detail-02 {
				overflow: hidden;
				position: relative;
				padding: 15px 20px 14px 72px;
				border: solid #97d9cd;
				border-width: 0 1px 1px 1px;
				-webkit-border-radius: 0 0 6px 6px;
				-moz-border-radius: 0 0 6px 6px;
				border-radius: 0 0 6px 6px;
				background: #fff;
				line-height: 1.72;
			}
			.list-care-01 li .detail-02:before {
				content: "";
				position: absolute;
				top: 16px;
				left: 26px;
				width: 24px;
				height: 46px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_01_pc.png) no-repeat left top;
			}
				.list-care-01 li:nth-child(2) .detail-02:before { background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_02_pc.png) no-repeat left top;}
				.list-care-01 li:nth-child(3) .detail-02:before { background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_03_pc.png) no-repeat left top;}

	.box-care-02 {
		overflow: hidden;
	}
		.ttl-care-04 {
			position: relative;
			padding: 26px 0 25px;
			border: solid #97d9cd;
			border-width: 1px 1px 0 1px;
			-webkit-border-radius: 4px 4px 0 0;
			-moz-border-radius: 4px 4px 0 0;
			border-radius: 4px 4px 0 0;
			background: #1f9d86;
			text-align: center;
			color: #fff;
			font-size: 20px;
			font-size: 2.0rem;
			font-weight: bold;
			line-height: 1.3;
		}
			.ttl-care-04:before {
				content: "";
				position: absolute;
				bottom: -22px;
				left: 50%;
				width: 76px;
				height: 24px;
				margin-left: -38px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_arrow_down_02.png) no-repeat left top;
			}
		.box-care-02 .box-info-01 {
			overflow: hidden;
			padding: 53px 0 49px;
			border: solid #97d9cd;
			border-width: 0 1px 1px 1px;
			-webkit-border-radius: 0 0 4px 4px;
			-moz-border-radius: 0 0 4px 4px;
			border-radius: 0 0 4px 4px;
			background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_room_01_pc.jpg) no-repeat left bottom;
		}
			.box-care-02 .box-info-01 .title-01 {
				color: #4c4c4c;
				margin-bottom: 35px;
				text-align: center;
				font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
				font-size: 32px;
				font-size: 3.2rem;
				line-height: 1.3;
			}
				.box-care-02 .box-info-01 .title-01 span { color: #0f9179;}
			.box-care-02 .box-info-01 .text-01 {
				margin-bottom: 37px;
				text-align: center;
				color: #1f9d86;
				font-size: 24px;
				font-size: 2.4rem;
				font-weight: bold;
				line-height: 1.3;
			}
			.box-care-02 .box-info-01 .image {
				margin-bottom: 43px;
				text-align: center;
			}
			.box-care-02 .box-info-01 .button-01 {
				overflow: hidden;
				display: table;
				margin: 0 auto;
			}
				.box-care-02 .box-info-01 .button-01 a {
					display: block;
					padding: 19px 30px 19px 9px;
					-webkit-border-radius: 30px;
					-moz-border-radius: 30px;
					border-radius: 30px;
					background: #1f9d86;
					text-align: center;
					color: #fff;
					font-size: 16px;
					font-size: 1.6rem;
					font-weight: bold;
					line-height: 1.3;
				}
					.box-care-02 .box-info-01 .button-01 a span {
						display: inline-block;
						vertical-align: top;
						padding: 1px 35px;
						background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_plus_01.png) no-repeat right top;
						background-size: 21px 21px;
						text-align: left;
					}

@media screen and (max-width: 600px) {
.box-care-02-wrap {
	margin-top: 0;
	padding: 71px 0 65px;
	background: #f0f7f6 url(/content/dam/sites/jp_unicharmpet_com/pro/common/bg_top_02_sp.jpg) repeat-x left top;
	background-size: 150px 60px;
}
	.txt-care-02 {
		margin-bottom: 7px;
		font-size: 18px;
		font-size: 1.8rem;
	}
	.ttl-care-03 {
		margin-bottom: 23px;
		font-size: 26px;
		font-size: 2.6rem;
	}
	.list-care-01 {
		width: 100%;
		margin: 0 -3px;
		padding-bottom: 30px;
	}
		.list-care-01 li {
			width: 33.33%;
			padding: 0 3px;
			margin-left: 0;
		}
			.list-care-01 li:before {
				bottom: -30px;
				left: 50%;
				width: 6px;
				height: 30px;
				margin-left: -3px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_dot_01.png) no-repeat left top;
				background-size: 6px 30px;
			}
			.list-care-01 li .detail-01 {
				padding: 15px 0 8px;
				-webkit-border-radius: 2px 2px 0 0;
				-moz-border-radius: 2px 2px 0 0;
				border-radius: 2px 2px 0 0;
				font-size: 14px;
				font-size: 1.4rem;
			}
				.list-care-01 li .detail-01:before {
					content: "";
					position: absolute;
					top: 6px;
					left: 9px;
					z-index: 1;
					width: 9px;
					height: 21px;
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_01_sp.png) no-repeat left top;
					background-size: 9px 21px;
				}
				.list-care-01 li:nth-child(2) .detail-01:before {
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_02_sp.png) no-repeat left top;
					background-size: 9px 21px;
				}
				.list-care-01 li:nth-child(3) .detail-01:before {
					background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_number_03_sp.png) no-repeat left top;
					background-size: 9px 21px;
				}
				.list-care-01 li .detail-01 img { padding: 0 22px;}
					.list-care-01 li .detail-01 figcaption { margin-top: 6px;}
			.list-care-01 li .detail-02 {
				padding: 10px 10px 9px;
				-webkit-border-radius: 0 0 2px 2px;
				-moz-border-radius: 0 0 2px 2px;
				border-radius: 0 0 2px 2px;
				font-size: 14px;
				font-size: 1.4rem;
				line-height: 1.785;
			}
			.list-care-01 li .detail-02:before {
				top: 0;
				left: 0;
				width: 0;
				height: 0;
				background: none;
			}
				.list-care-01 li:nth-child(2) .detail-02:before { background: none;}
				.list-care-01 li:nth-child(3) .detail-02:before { background: none;}

		.ttl-care-04 {
			padding: 14px 10px;
			-webkit-border-radius: 2px 2px 0 0;
			-moz-border-radius: 2px 4px 0 0;
			border-radius: 2px 2px 0 0;
			font-size: 15px;
			font-size: 1.5rem;
			line-height: 1.44;
		}
			.ttl-care-04:before {
				bottom: -11px;
				left: 50%;
				width: 38px;
				height: 12px;
				margin-left: -19px;
				background: url(/content/dam/sites/jp_unicharmpet_com/pro/top/ico_arrow_down_02.png) no-repeat left top;
				background-size: 37px 12px;
			}
		.box-care-02 .box-info-01 {
			padding: 29px 0 30px;
			-webkit-border-radius: 0 0 2px 2px;
			-moz-border-radius: 0 0 2px 2px;
			border-radius: 0 0 2px 2px;
			background: #fff url(/content/dam/sites/jp_unicharmpet_com/pro/top/bg_room_01_sp.jpg) no-repeat center bottom;
			background-size: cover;
		}
			.box-care-02 .box-info-01 .title-01 {
				margin-bottom: 22px;
				padding: 0 7px;
				font-size: 17px;
				font-size: 1.7rem;
				line-height: 1.43;
			}
			.box-care-02 .box-info-01 .text-01 {
				margin-bottom: 48px;
				padding: 0 8px;
				font-size: 12px;
				font-size: 1.2rem;
			}
			.box-care-02 .box-info-01 .image {
				margin-bottom: 18px;
				padding: 0 5px;
			}
				.box-care-02 .box-info-01 .image img { width: 100%;}
			.box-care-02 .box-info-01 .button-01 {
				display: block;
				padding: 0 20px;
			}
				.box-care-02 .box-info-01 .button-01 a {
					display: block;
					width: 100%;
					padding: 15px 10px;
					-webkit-border-radius: 26px;
					-moz-border-radius: 26px;
					border-radius: 26px;
					font-size: 12px;
					font-size: 1.2rem;
				}
					.box-care-02 .box-info-01 .button-01 a span {
						padding: 2px 20px 2px 10px;
						background: url(/content/dam/sites/jp_unicharmpet_com/pro/common/ico_plus_01.png) no-repeat right center;
						background-size: 14px 14px;
					}
}

/* youtube
---------------------------------------------------------- */
.txt-youtube-01,
.txt-youtube-02 {
	position: absolute;
	top: -36px;
	left: 0;
	color: #fff;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.3;
}

/* 使い方紹介
---------------------------------------------------------- */
.box-product-video{
	padding: 62px 39px 44px !important;
	border-top: 1px solid #97d9cd;
}
.list-video{
	overflow: hidden;
}
	.list-video li:first-child{
		float: left;
		text-align: left;
	}
	.list-video li:last-child{
		float: right;
		text-align: right;
	}


.popup-video{
	display: block;
	position: relative;
}
.popup-video img{
	width: 441px;
	height: 248px;
}
.popup-video::before{
	/* content: "";
	width: 80px;
	height: 80px;
	display: block;
	transform: translate(-50%, -50%);
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 10;
	background-image: url(/content/dam/sites/jp_unicharmpet_com/pro/common/img_play_01.png);
	background-size: 100%; */
}

@media screen and (max-width: 600px) {
	.box-product-video{
		padding: 45px 20px 30px !important;
	}
		.list-video li{
			margin: 30px 0 0;
		}
		.list-video li:first-child,
		.list-video li:last-child{
			float: none;
		}
		.list-video li:first-child{
			margin-top: 8px;
		}

		.popup-video img{
			width: 100%;
			height: auto;
		}
		.popup-video::before{
			width: 40px;
			height: 40px;
		}
}
/* ==========================================================
 sec-product-01
========================================================== */
#product-01{
  padding-top: 80px;
  margin-top: -60px;
}
#product-01 .ico-product-01{
  top: 0;
}
@media screen and (max-width: 600px) {
	#product-01{
		margin-top: -75px;
		padding-top: 115px;
	}
	#product-01 .box-cmn-01{
		padding-top: 0;
	}
	#product-01 .ico-product-01{
		top: 45px;
	}
}