/* slider
--------------------------------------------------	*/
.product-color-01 {
	background: linear-gradient(90deg, #5f5f65 0%, #5f5f65 50%, #34363c 50%, #34363c 100%);
}
.product-color-02 {
	background: linear-gradient(90deg, #d1d1d1 0%, #d1d1d1 50%, #f1f1f1 50%, #f1f1f1 100%);
}
.product-color-03 {
	background: linear-gradient(90deg, #d1d1d1 0%, #d1d1d1 50%, #c5b8e6 50%, #c5b8e6 100%);
}
.product-color-04 {
	background: linear-gradient(90deg, #5f5f65 0%, #5f5f65 50%, #34363c 50%, #34363c 100%);
}
.product-color-05 {
	background: linear-gradient(90deg, #dbc8c0 0%, #dbc8c0 50%, #f0d7cd 50%, #f0d7cd 100%);
}

img {
  max-width: 100%;
}

@media (max-width: 979px){
	#section01 .cmp-au-com-card__width__3layout__responsive {
	  width: 33.3% !important;
	}
	#section01 .cmp-au-com-card__width__3layout2__responsive {
	width: 66.6% !important;
	}
}
@media (max-width: 640px){
	#section01 .cmp-au-com-card__width__3layout__responsive {
	  width: 100% !important;
	}
	#section01 .cmp-au-com-card__width__3layout2__responsive {
	width: 100% !important;
	}
}

/* section-box01
--------------------------------------------------	*/
.section-box01 .btn  {
  margin-bottom: 20px;
}
.section-box01 .btn a {
	font-size: 100%;
	display: inline-block;
	line-height: 2.45em;
	border: solid 1px;
	border-radius: 0.7em;
	padding: 0 1.7em;
	color: #0d0d0d!important;
	text-decoration: none;
}
/* section-box02
--------------------------------------------------	*/
.section-box02 {
	position: relative;
	color:#fff;
}
.section-box02 .content-text {
	position: absolute;
	top: 20%;
	z-index: 2;
	left: 57%;
}
.section-box02 h2 {
  margin: 0 0 4%;
}
.section-box02 p.cont {
	width: 48%;
}
.section-box02 .content-img img {
	position: absolute;
	top: 2em;
	left: 55%;
	width: 33%;
	z-index: 1;
}


@media screen and (max-width: 979px) {
/* section-box02
--------------------------------------------------	*/
	.section-box02 .content-text {
		top: 18%;
	}
}


/* SMP */
@media screen and (max-width: 767px) {
/* section-box02
--------------------------------------------------	*/
	.section-box02 .content-text {
  text-shadow: 1px 1px 1px #333;
	}
	.section-box02 .content-text {
		top: 16%;
	}
	.section-box02 .content-img img {
		width: 40%;
	}
}
@media screen and (max-width: 630px) {
/* section-box02
--------------------------------------------------	*/

	.section-box02 p {
	font-size: 90%;
	}

	.section-box02 p.cont {
		width: 53%;
	}
}

@media screen and (max-width: 510px) {
/* section-box02
--------------------------------------------------	*/
	.section-box02 .content-text {
		top: 22%;
	}
	.section-box02 h2 {
	font-size: 80%;
	}
	.section-box02 p {
	font-size: 65%;
	}
	.section-box02 p.cont {
		width: 70%;
	}
}