@charset "utf-8";

/* -----------------------------
	equipment
-------------------------------- */

.equipment-area {
	padding: 80px 0 0;
}

.equipment-area .mv-area {
	padding: 0 0 90px;
}

.equipment-area .mv-area .pc-display.image {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.equipment-area .mv-area .image .img-01 ,
.equipment-area .mv-area .image .img-02 {
	position: relative;
}

.equipment-area .mv-area .image .img-02 {
	margin: 140px 0 0;
}

.equipment-area .mv-area .image .img-01::before ,
.equipment-area .mv-area .image .img-02::before {
	display: block;
	content: "";
	position: absolute;
	width: 580px;
	height: 400px;
	background: #F7F6F4;
	z-index: -1;
}

.equipment-area .mv-area .image .img-01::before {
	left: -30px;
	top: 30px;
}

.equipment-area .mv-area .image .img-02::before {
	right: -30px;
	top: -30px;
}

.equipment-area .mv-area .copy {
	font-size: 2.6rem;
	font-weight: 400;
	font-family: var(--basefont-jp);
	line-height: 1.5;
	padding: 30px 0 0;
}

@media screen and (max-width: 768px){
	
	.equipment-area {
		padding: 50px 0 0;
	}
	
	.equipment-area .mv-area  {
		padding: 0 20px 30px;
	}

	.equipment-area .mv-area .pc-display.image {
		display: none;
	}

	.equipment-area .mv-area .sp-display-b.image img {
		width: 100%;
	}

	.equipment-area .mv-area .copy {
		font-size: 2.0rem;
		padding: 20px 0 0;
	}

}

/* -----------------------------
	list-area
-------------------------------- */

.list-area {
	background: #F6F6F4;
	padding: 100px 0;
}

.list-area .link-area {
	display: flex;
	justify-content: space-between;
}

.list-area .link-area li {
	width: calc( (100% - 80px) / 5);
	text-align: center;
}

.list-area .link-area li a {
	display: block;
	background: #fff url("../img/arrow-blk-down.svg") no-repeat center bottom 15px / 8px auto ;
	width: 100%;
	padding: 15px 0 35px;
	box-shadow: 0 0 15px rgba(114,97,69,0.2);
}

.list-area .link-area li a:hover {
	box-shadow: none;
}

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

	.list-area {
		padding: 50px 10px;
	}

	.list-area .link-area {
		flex-wrap: wrap;
		gap: 10px;
		padding: 0 10px;
	}

	.list-area .link-area li {
		width: calc( (100% - 10px) / 2);
		text-align: center;
	}

	.list-area .link-area li a {
		padding: 15px 0 20px;
		background-position: center bottom 10px;
	}

	.list-area .link-area li a:hover {
		box-shadow: 0 0 15px rgba(114,97,69,0.2);
	}

	.list-area .link-area li a .ttl-lower-m .jp {
		line-height: 1.2;
		font-size: 2.0rem;
	}

}

/* -----------------------------
	com
-------------------------------- */

.com-box {
	background: #fff;
	padding: 70px 40px 30px;
	margin: 50px 0 0;
}

.com-box .ttl-lower-m {
	text-align: center;
}

.com-box .top-copy {
	text-align: center;
	font-weight: bold;
	padding: 20px 0 30px;
}

.com-box .flex {
	display: flex;
	justify-content: space-between;
	gap:0 20px;
}

.com-box .image {
	line-height: 0;
	position: relative;
}

.com-box .image img {
	line-height: 0;
}

.com-box .image figcaption {
	position: absolute;
	bottom: 5px;
	font-weight: bold;
	font-size: 1.2rem;
	line-height: 1;
	z-index: 1;
}

.com-box .image.border {
	background: #fff;
	border: #EBE6D7 solid 1px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.com-box .title {
	background: #F6F6F4;
	border: #EBE6D7 solid 1px;
	color: #726145;
	padding: 5px 10px;
	margin: 0 0 20px;
}

.com-box .top-block .title {
	margin: 0 0 10px;
}

.com-box .txt {
	font-size: 1.4rem;
	line-height: 1.5;
}

.com-box .att {
	font-size: 1.4rem;
	line-height: 1.5;
}

.com-box .box-com {
	margin: 0 0 40px;
}

/*top-block*/
.com-box .top-block .left {
	width: 550px;
	padding: 0 0 50px;
}

.com-box .top-block .left .att ,
.com-box .top-block .right .att {
	padding: 10px 0 0;
}

.com-box .top-block .right {
	width: 550px;
}

.com-box .top-block h4 ,
.com-box .under-block h4 {
	color: #A5915A;
	font-size: 2.0rem;
	font-weight: bold;
	border-top: #CBBF92 solid 1px;
	padding: 10px 0;
}

/*iot-area*/
.iot-area .remote-area .top-block ,
.iot-area .famiLock-area .top-block {
	border-top: #CBBF92 solid 1px;
	padding: 50px 0 0;
}

.iot-area .remote-area .top-block .txt ,
.iot-area .famiLock-area .top-block .txt {
	text-align: center;
	padding: 20px 0;
}

.iot-area .remote-area .top-block .image {
	margin: 0 0 40px;
}

.iot-area .remote-area .under-block .box01 .flex {
	gap:0 20px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 ,
.iot-area .remote-area .under-block .box01 .flex .remote-02 ,
.iot-area .remote-area .under-block .box01 .flex .remote-03 {
	border: #EBE6D7 solid 1px;
	width: calc((100% - 40px) / 3);
	padding: 20px 15px;
	text-align: center;
}

.iot-area .remote-area .under-block .box-com > div {
	border: #EBE6D7 solid 1px;
	padding: 20px 15px;
}

.iot-area .remote-area .under-block .box-com.box01 div {
	border: none;
	padding: 0;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 .flex {
	gap:0 10px;
}

.iot-area .remote-area .under-block .box-com .copy {
	font-weight: bold;
    color: #A5915A;
    display: inline-block;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 .copy ,
.iot-area .remote-area .under-block .box01 .flex .remote-02 .copy {
	margin: 20px 0 30px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-03 .copy {
	margin: 0 0 22px;
}

.iot-area .remote-area .under-block .box-com .copy span {
    background: linear-gradient(transparent 50%, #F1EFEB 50%);
    padding: 0 5px;
}

.iot-area .remote-area .under-block .box-com .txt {
	font-size: 1.4rem;
	line-height: 1.5;
	padding: 10px 0 0;
}

.iot-area .remote-area .under-block .box-com .image {
	width: 100%;
	height: 160px;
	background: #F6F6F4;
    display: flex;
    align-items: center;
    justify-content: center;
}

.iot-area .remote-area .under-block .box-com.box02 .image ,
.iot-area .remote-area .under-block .box-com.box03 .image {
	width: 100%;
	height: auto;
	background: none;
    display: block;
	padding: 10px 0;
}

.iot-area .remote-area .under-block .box-com.box03 .image {
	padding: 0 0 0;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 .image {
	width: 160px;
	height: 160px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 .image01 img {
	width: 110px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-01 .image02 img {
	width: 67px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-02 .image img {
	width: 260px;
}

.iot-area .remote-area .under-block .box01 .flex .remote-03 .image {
	justify-content: flex-start;
}

.iot-area .remote-area .under-block .box01 .flex .remote-03 .image img {
	width: 317px;
}

.iot-area .remote-area .under-block .box04 ,
.iot-area .remote-area .under-block .box05 ,
.iot-area .remote-area .under-block .box06 {
	width: 360px;
}

.iot-area .remote-area .under-block .box04 .image img {
	width: 101px;
}

.iot-area .remote-area .under-block .box05 .image img {
	width: 280px;
}

.iot-area .remote-area .under-block .box06 .image {
	align-items:flex-end;
}

.iot-area .remote-area .under-block .box06 .image img {
	width: 330px;
}

.iot-area .remote-area .under-block .box04 > div ,
.iot-area .remote-area .under-block .box05 > div {
	padding: 20px 15px 105px;
}

.iot-area .famiLock-area .top-block .image {
    background: #F6F6F4 url(../img/features-bg.png) repeat left center / auto;
    height: 400px;
    margin: 0 0 30px;
}

.iot-area .famiLock-area .top-block .image.flex {
	align-items: center;
	justify-content: flex-start;
}

.iot-area .famiLock-area .top-block .image.flex .flex {
	justify-content: flex-start;
	gap: 0 10px;
	padding: 30px 0 0;
}

.iot-area .famiLock-area .top-block .image.flex .flex li {
	background: #fff;
	text-align: center;
	font-weight: bold;
	border: #EBE6D7 solid 1px;
	padding: 20px 0;
	width: 200px;
	height: 260px;
}

.iot-area .famiLock-area .top-block .image.flex .flex li .icon {
	padding: 0 0 10px;
}

.iot-area .famiLock-area .top-block .image.flex .flex li:nth-child(2) .icon {
	padding: 45px 0 40px;
}

.iot-area .famiLock-area .under-block {
	padding: 40px 0 0;
	gap: 50px 20px;
	flex-wrap: wrap;
}

.iot-area .famiLock-area .under-block div {
	width: 550px;
}

.iot-area .famiLock-area .under-block div h4 {
	display: inline-block;
	background: #CBBF92;
	color: #fff;
	font-size: 1.8rem;
	font-weight: bold;
	padding: 10px;
	width: 300px;
	text-align: center;
}

.iot-area .famiLock-area .under-block div dl {
	border-top: #CBBF92 solid 1px;
}

.iot-area .famiLock-area .under-block div dl dt {
    font-weight: bold;
    font-size: 2.0rem;
    padding: 0 0 0 18px;
    margin: 20px 0 10px;
    background: url(../img/icon-check.svg) no-repeat left center / 13px;
}

.iot-area .famiLock-area .under-block div dl dd {
	padding: 0 0 20px 18px;
	line-height: 1.7;
	border-bottom: #EBE6D7 solid 1px;
}

.iot-area .txt02 {
	padding: 0 0 40px;
}

.iot-area .txt02 span {
	font-weight: bold;
	color: #fff;
	display: inline-block;
	background: #A5915A;
	padding: 3px 15px;
	margin: 0 0 5px;
}

/*kitchen-area*/
.kitchen-area .box01 figcaption {
	left: 10px;
}

.kitchen-area .box02 {
	width: 265px;
}

.kitchen-area .box02 .flex {
	gap:0 10px;
	padding: 0 0 10px;
}

.kitchen-area .box02 .image figcaption {
	left: 0;
	right: 0;
	margin: 0 auto;
	text-align: center;
}

.kitchen-area .box03 .txt {
	padding: 0 0 10px;
}

.kitchen-area .box04 {
	width: 550px;
}

.kitchen-area .box04 .flex {
	padding: 0 0 10px;
}

.kitchen-area .box04 .image figcaption {
	left: 10px;
	-webkit-text-stroke: 3px #fff;
	text-stroke: 3px #fff;
	paint-order: stroke;
}

.kitchen-area .box06 {
	width: 265px;
}

.kitchen-area .box06 .image {
	padding: 27px 0 26px;
}

.kitchen-area .box08 .txt ,
.kitchen-area .box10 .txt ,
.kitchen-area .box11 .txt {
	padding: 10px 0 0;
}

/*washroom-area*/
.washroom-area .logo {
	height: 40px;
}

.washroom-area .logo img {
	height: 100%;
}

.washroom-area .box01 .image.border {
	width: 450px;
	height: 200px;
}

.washroom-area .box01 .txt-box {
	justify-content: flex-start;
	padding: 20px 0 0;
}

.washroom-area .box02 .image.border {
	width: 265px;
	height: 200px;
	align-items: flex-start;
}

.washroom-area .box04 .flex {
	align-items: center;
	flex-direction: row-reverse;
}

.washroom-area .box04 .flex .txt {
	padding: 10px 0 0;
}

.washroom-area .box04 .flex .txt span {
	display: inline-block;
	width: 110px;
}

.washroom-area .box05 .image.border {
	width: 415px;
	height: 365px;
	box-sizing: content-box;
}

.washroom-area .box05 .txt {
	padding: 10px 0 0;
}

.washroom-area .box06 .flex {
	align-items: center;
	flex-direction: row-reverse;
}

.washroom-area .box06 .txt-box {
	flex: 1;
}

.washroom-area .box06 .txt {
	padding: 10px 0 0;
}

.washroom-area .box06 .image.border {
	width: 200px;
	height: 200px;
}

/*bathroom-area*/
.bathroom-area .logo {
	height: 50px;
}

.bathroom-area .logo img {
	height: 100%;
}

.bathroom-area .box01 dl dt {
	font-size: 1.4rem;
	padding: 10px 0 0;
}

.bathroom-area .box01 dl dd {
	padding: 5px 0 0;
}

.bathroom-area .box02 > .image {
	padding: 10px 0 0;
}

.bathroom-area .box02 .flex {
	gap:0 10px;
	padding: 10px 0 0;
}

.bathroom-area .box02 .image figcaption {
	left: 0;
	right: 0;
	text-align: center;
	margin: 0 auto;
}

.bathroom-area .box03 .image {
	margin: 0 0 10px;
}

.bathroom-area .box03 .image:last-child {
	margin: 0;
}

.bathroom-area .box03 .image figcaption {
	left: auto;
	right: 10px;
	color: #fff;
}

.bathroom-area .box04 ,
.bathroom-area .box05 ,
.bathroom-area .box06 ,
.bathroom-area .box07 {
	width: 550px;
}

.bathroom-area .box04 .image.border {
	padding: 33px 0;
}

.bathroom-area .box04 .txt-box .logo ,
.bathroom-area .box05 .txt-box .logo {
	margin: 20px auto 10px;
	text-align: center;
}

.bathroom-area .box04 .txt-box .txt ,
.bathroom-area .box05 .txt-box .txt {
	text-align: center;
}

.bathroom-area .box05 .image-under {
	margin: 0 0 20px;
}

.bathroom-area .box05 .image.flex {
	display: block;
}

.bathroom-area .box06 .image.border ,
.bathroom-area .box07 .image.border {
	padding: 20px 0;
	margin: 0 0 20px;
}

.bathroom-area .box06 .flex ,
.bathroom-area .box07 .flex {
	gap:0 20px;
	justify-content: flex-start;
	align-items: center;
}

.bathroom-area .box06 .txt-box .txt ,
.bathroom-area .box07 .txt-box .txt {
	padding: 10px 0 0;
}

.bathroom-area .box08 .image.border {
	width: 265px;
	height: 365px;
}

.bathroom-area .box08 .txt {
	padding: 10px 0 0;
}

/*toilet-area*/
.toilet-area .logo.border {
	width: 225px;
	height: 120px;
}

.toilet-area .logo.border.logo01 img {
	width: 185px;
	height: auto;
}

.toilet-area .logo.border.logo02 img {
	width: auto;
	height: 80px;
}

.toilet-area.com-box .top-block .title {
	margin: 0 0 20px;
}

.toilet-area .box01 .flex {
	gap:0 10px;
}

.toilet-area .box01 .image figcaption {
	left: 0;
	right: 0;
	margin: 0 auto;
	text-align: center;
}

.toilet-area .box02 .flex {
	flex-direction: row-reverse;
	align-items: center;
}

.toilet-area .box02 .flex .txt-box {
	flex: 1;
	padding: 0 25px 0 0;
}

.toilet-area .box02 .flex .txt-box .txt {
	padding: 0 0 10px;
}

.toilet-area .box03 .flex {
	padding: 0 0 20px;
}

.toilet-area .box03 .flex.txt-box03 {
	padding: 0 0 0;
}

.toilet-area .box03 .flex.txt-box02 .flex {
	flex-direction: row-reverse;
	align-items: center;
}

.toilet-area .box03 ul li {
	border: #EBE6D7 solid 1px;
	width: calc((100% - 20px) / 2);
}

.toilet-area .box03 ul.txt-box01 li {
	border: #EBE6D7 solid 1px;
	width: calc((100% - 60px) / 4);
}

.toilet-area .box07 ul li {
	border: #EBE6D7 solid 1px;
	margin: 0 0 10px;
}

.toilet-area .box03 ul li h6 ,
.toilet-area .box07 ul li h6 {
	color: #A5915A;
	border-bottom: #EBE6D7 solid 1px;
	text-align: center;
	padding: 15px 0;
}

.toilet-area .box03 .flex li > div ,
.toilet-area .box07 ul li > div {
	padding: 20px;
}

.toilet-area .box03 .flex.txt-box01 .txt {
	padding: 10px 0 0;
}

.toilet-area .box03 .flex.txt-box01 .image.border {
	padding: 0 0 10px;
}

.toilet-area .box03 .flex.txt-box02 .txt {
	flex: 1;
}

.toilet-area .box04.box-com ,
.toilet-area .box05.box-com ,
.toilet-area .box06.box-com ,
.toilet-area .box07.box-com {
	width: 265px;
}

.toilet-area .box05 .image {
	padding: 60px 0;
}

.toilet-area .box05 .txt ,
.toilet-area .box06 .txt {
	padding: 10px 0 0;
}

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

	.com-box {
		padding: 30px 10px 10px;
		margin: 30px 0 0;
	}

	.com-box .top-copy {
		text-align: left;
		font-weight: bold;
		padding: 10px 10px 20px;
	}

	.com-box .flex {
		display: block;
	}

	.com-box .image {
		width: 100%;
	}

	.com-box .image img {
		width: 100%;
	}

	.com-box .title {
		margin: 0 0 10px;
		line-height: 1.5;
	}

	.com-box .top-block .title {
		margin: 0 0 10px;
	}

	.com-box .box-com {
		margin: 0 0 20px;
	}

	/*top-block*/
	.com-box .top-block .left {
		width: 100%;
		padding: 0 0 20px;
	}

	.com-box .top-block .right {
		width: 100%;
	}

	.com-box .top-block h4 ,
	.com-box .under-block h4 {
		font-size: 1.8rem;
	}
	
	/*iot-area*/
	.iot-area .remote-area .top-block ,
	.iot-area .famiLock-area .top-block {
		padding: 30px 0 0;
	}

	.iot-area .remote-area .top-block .txt ,
	.iot-area .famiLock-area .top-block .txt {
		padding: 15px 0;
	}

	.iot-area .remote-area .top-block .image {
		margin: 0 0 20px;
	}
	.iot-area .remote-area .under-block .box01 .flex .remote-01 ,
	.iot-area .remote-area .under-block .box01 .flex .remote-02 ,
	.iot-area .remote-area .under-block .box01 .flex .remote-03 {
		width: 100%;
		padding: 20px;
		margin: 0 0 5px;
	}

	.iot-area .remote-area .under-block .box-com > div {
		padding: 20px;
	}

	.iot-area .remote-area .under-block .box-com.box01 div {
		border: none;
		padding: 0;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-01 .flex {
		display: flex;
		gap:0 10px;
	}
	
	.iot-area .remote-area .under-block .box-com .copy {
		font-size: 1.4rem;
		text-align: center;
		display: block;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-01 .copy ,
	.iot-area .remote-area .under-block .box01 .flex .remote-02 .copy {
		margin: 0 0 15px;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-03 .copy {
		margin: 0 0 15px;
	}

	.iot-area .remote-area .under-block .box-com .image {
		width: 100%;
		height: auto;
	}

	.iot-area .remote-area .under-block .box-com.box02 .image ,
	.iot-area .remote-area .under-block .box-com.box03 .image {
		width: 100%;
	}

	.iot-area .remote-area .under-block .box-com.box03 .image {
		padding: 0 0 0;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-01 .image {
		width: 100%;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-01 .flex > div {
		width: calc((100% - 10px) / 2);
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-03 .image {
		height: auto;
	}

	.iot-area .remote-area .under-block .box01 .flex .remote-03 .image img {
		width: 100%;
	}

	.iot-area .remote-area .under-block .box04 ,
	.iot-area .remote-area .under-block .box05 ,
	.iot-area .remote-area .under-block .box06 {
		width: 100%;
	}

	.iot-area .remote-area .under-block .box04 > div ,
	.iot-area .remote-area .under-block .box05 > div {
		padding: 20px;
	}

	.iot-area .famiLock-area .top-block .image {
		height: auto;
		margin: 0 0 20px;
		padding: 20px;
	}

	.iot-area .famiLock-area .top-block .image .illustration {
		text-align: center;
	}

	.iot-area .famiLock-area .top-block .image .illustration img {
		width: auto;
		height: 200px;
	}

	.iot-area .famiLock-area .top-block .image.flex {
		display: block;
	}

	.iot-area .famiLock-area .top-block .image.flex .flex {
		display: block;
		padding: 20px 0 0;
	}

	.iot-area .famiLock-area .top-block .image.flex .flex li {
        width: 100%;
        height: auto;
        padding: 10px;
        margin: 5px 0 0;
        display: flex;
        align-items: center;
    }

	.iot-area .famiLock-area .top-block .image.flex .flex li .icon {
		padding: 0 0 0 0;
        width: 80px;
        text-align: center;
        margin: 0 10px 0 0;
	}

	.iot-area .famiLock-area .top-block .image.flex .flex li .icon img {
		height: 100px;
		width: auto;
	}

	.iot-area .famiLock-area .top-block .image.flex .flex li:nth-child(2) .icon {
		padding: 0 0 0 0;
	}
	
	.iot-area .famiLock-area .top-block .image.flex .flex li:nth-child(2) .icon img {
		height: 50px;
		width: auto;
	}

	.iot-area .famiLock-area .under-block {
		display: block;
		padding: 20px 10px 0;
	}

	.iot-area .famiLock-area .under-block div {
		margin: 0 0 30px;
		width: 100%;
	}

	.iot-area .famiLock-area .under-block div h4 {
		font-size: 1.6rem;
		width: auto;
	}

	.iot-area .famiLock-area .under-block div dl {
		border-top: #CBBF92 solid 1px;
	}

	.iot-area .famiLock-area .under-block div dl dt {
		font-size: 1.7rem;
		padding: 0 0 0 15px;
		margin: 15px 0 5px;
		line-height: 1.5;
		background: url(../img/icon-check.svg) no-repeat left top 5px / 13px;
	}

	.iot-area .famiLock-area .under-block div dl dd {
		padding: 0 0 15px 15px;
		line-height: 1.5;
	}
	
	.iot-area .txt02 {
		padding: 0 0 20px;
	}

	.iot-area .txt02 span {
		padding: 5px 10px;
		line-height: 1.5;
	}

	/*kitchen-area*/
	.kitchen-area .box02 {
		width: 100%;
	}

	.kitchen-area .box02 .flex {
		display: flex;
	}

	.kitchen-area .box04 {
		width: 100%;
	}

	.kitchen-area .box04 .flex {
		display: flex;
	}

	.kitchen-area .box06 {
		width: 100%;
	}

	.kitchen-area .box06 .image {
		padding: 20px;
		text-align: center;
	}

	.kitchen-area .box06 .image img {
		width: auto;
		height: 200px;
	}

	.kitchen-area .box10 .flex ,
	.kitchen-area .box11 .flex {
		display: flex;
		gap: 0 10px;
	}

	.kitchen-area .box10 .image ,
	.kitchen-area .box11 .image {
		width: auto;
	}
	
	/*washroom-area*/
	.washroom-area .logo {
		margin: 0 auto 10px;
		text-align: center;
	}

	.washroom-area .box01 .image.border {
		width: 100%;
		height: auto;
		padding: 20px;
		margin: 0 0 10px;
	}

	.washroom-area .box01 .txt-box {
		padding: 20px 0 0;
	}

	.washroom-area .box01 .txt-box .txt {
		text-align: center;
	}

	.washroom-area .box02 .image.border {
		width: 100%;
		height: auto;
		padding: 0 0 10px;
	}

	.washroom-area .box02 .image.border img {
		width: 265px;
	}

	.washroom-area .box03 .flex {
		display: flex;
		flex-wrap: wrap;
		gap:10px;
	}

	.washroom-area .box03 .flex .image {
		width: calc( ( 100% - 10px ) / 2 );
	}

	.washroom-area .box04 .flex .logo {
		margin: 20px 0 auto;
	}

	.washroom-area .box04 .flex .txt span {
		display: inline-block;
		width: auto;
	}

	.washroom-area .box04 .flex .txt span {
		display: inline-block;
		width: auto;
	}

	.washroom-area .box05 .image {
		margin: 0 0 10px;
	}

	.washroom-area .box05 .image.border {
		width: 100%;
		height: auto;
		margin: 0;
	}

	.washroom-area .box06 .logo {
		margin: 20px auto 0;
	}

	.washroom-area .box06 .image {
		margin: 0 0 10px;
	}

	.washroom-area .box06 .image.border {
		width: 100%;
		height: auto;
		padding: 20px;
	}

	.washroom-area .box06 .image.border img {
		height: 110px;
		width: auto;
	}
	
	/*bathroom-area*/
	.bathroom-area .logo {
		margin: 0 auto;
	}

	.bathroom-area .box02 .flex {
		display: flex;
	}

	.bathroom-area .box04 ,
	.bathroom-area .box05 ,
	.bathroom-area .box06 ,
	.bathroom-area .box07 {
		width: 100%;
	}

	.bathroom-area .box04 .image.border {
		padding: 20px;
	}

	.bathroom-area .box05 .image-under {
		margin: 0;
	}

	.bathroom-area .box05 .image.flex {
		display: flex;
		gap:0 10px;
		margin: 10px 0;
	}

	.bathroom-area .box05 .image.flex img {
		width: calc((100% - 10px)/2);
	}

	.bathroom-area .box06 .image.border ,
	.bathroom-area .box07 .image.border {
		padding: 20px;
		margin: 0 0 10px;
	}

	.bathroom-area .box06 .flex ,
	.bathroom-area .box07 .flex {
		display: flex;
		gap:0 10px;
		align-items: flex-start;
	}

	.bathroom-area .box06 .txt-box .txt ,
	.bathroom-area .box07 .txt-box .txt {
		font-size: 1.2rem;
	}

	.bathroom-area .box08 .image.border {
		width: 100%;
		height: auto;
		margin: 20px 0 0;
	}

	.bathroom-area .box08 .image.border img {
		width: auto;
		height: 260px;
	}
	
	/*toilet-area*/
	.toilet-area .logo.border {
		width: 100%;
		height: 120px;
	}

	.toilet-area.com-box .top-block .title {
		margin: 0 0 10px;
	}

	.toilet-area .box01 .flex {
		display: flex;
		gap:5px;
	}

	.toilet-area .box01 .image figcaption {
		font-size: 1.0rem;
	}

	.toilet-area .box02 .flex .image {
		padding: 20px 0;
	}

	.toilet-area .box02 .flex .image img {
		height: 200px;
		width: auto;
	}

	.toilet-area .box02 .flex .txt-box {
		padding: 20px 0 0;
	}

	.toilet-area .box02 .flex .txt-box .txt {
		padding: 0 0 5px;
	}

	.toilet-area .box03 .flex {
		padding: 0;
	}

	.toilet-area .box03 .flex.txt-box03 {
		padding: 0 0 0;
	}

	.toilet-area .box03 ul li {
		width: 100%;
		margin: 0 0 10px;
	}

	.toilet-area .box03 ul.txt-box01 li {
		width: 100%;
	}

	.toilet-area .box03 ul.txt-box01 li:nth-child(1) .image {
		padding: 0 0 20px;
	}

	.toilet-area .box03 ul.txt-box01 li:nth-child(1) img {
		height: 130px;
		width: auto;
	}

	.toilet-area .box03 ul li h6 ,
	.toilet-area .box07 ul li h6 {
		padding: 10px 0;
	}

	.toilet-area .box03 .flex li > div ,
	.toilet-area .box07 ul li > div {
		padding: 15px;
	}

	.toilet-area .box04.box-com ,
	.toilet-area .box05.box-com ,
	.toilet-area .box06.box-com ,
	.toilet-area .box07.box-com {
		width: 100%;
	}

	.toilet-area .box05 .image {
		padding: 30px 0;
	}

	.toilet-area .box05 .image img {
		height: 143px;
		width: auto;
	}


}