.csc-wwd-box {
	margin: auto;
	padding: 20px 20px 50px 20px;
	max-width: 1200px;
	width: 100%
}
.csc-wwd-title {
	position: relative;
	text-align: center;
	font-size: 2.5em
}
.csc-wwd-title:before {
	content: "";
	display: block;
	border-top: 2px solid #f9bc55;
	width: 100%;
	height: 2px;
	position: absolute;
	top: 50%;
	z-index: 0
}
.csc-wwd-title span {
	background: #f5f5f5;
	padding: 0 30px;
	position: relative;
	z-index: 1
}
.cfb-box {
	margin: 0 0 20px 0
}
.cfb-box::after {
	content: '';
	display: block;
	clear: both;
}
.cfb-box .img {
	float: right;
	width: 540px;
	min-height: 580px;
	border: 20px solid #28b7cc;
}
.cfb-box .info {
	float: left;
	width: calc(100% - 540px);
	min-height: 580px;
	background: #28b7cc;
}
.prdt-sales {
	background-image: url(/application/images/gallery/product-sales.jpg);
    display: block;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.prdt-reservation {
	background: url(/application/images/gallery/product-reservation.jpg);
	display: block;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.prdt-financial {
	background: url(/application/images/gallery/product-financial.jpg);
	display: block;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.prdt-mobile {
	background: url(/application/images/gallery/product-mobile.jpg);
	display: block;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.desc-prdt {
	padding: 30px
}
.desc-prdt strong {
	font-size: 2em;
	color: #fff;
	font-weight: 700
}
.desc-prdt ul li {
	font-size: 1.15em;
	color: #fff;
	font-weight: 400;
	line-height: 150%;
	color: #fff
}
.grid-container-product-flow {
	display: grid;
	grid-template-columns: auto auto;
	background-color: #f5f5f5;
	grid-gap: 20px
}
.grid-item-product-flow {
	border-radius: 20px;
	border: 1px solid #fff;
	box-shadow: 3px 3px 2px #ccc
}
.img-aside-flow {
	width: 100%;
	height: 300px;
	object-fit: cover;
	overflow: hidden;
	border-radius: 20px
}
.csc-wwd-grid {
	margin-bottom: 20px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr))
}
.csc-wwd-lp {
	padding: 20px;
	transition: all .3s
}
.wwd-ico {
	padding: 20px 0
}
.ico-bd {
	margin: auto;
	border: 8px solid #eee;
	width: 200px;
	height: 200px;
	border-radius: 50%;
	transition: all .3s;
	background-size: 50%;
	background-position: center;
	background-repeat: no-repeat
}
.wwd-detail, .wwd-title {
	text-align: center
}
.wwd-title {
	padding: 10px 0;
	font-weight: 700;
	font-size: 1.2em;
	color: #333
}
.wwd-detail {
	padding: 0 0 20px 0;
	font-size: .9em;
	color: #797979;
	line-height: 140%
}
.csc-wwd-lp:hover {
	background-color: #e7e7e7
}
.csc-wwd-lp:hover .ico-bd {
	border: 8px solid #28b7cc;
	background-color: #fff
}
.csc-wwd-lp+.csc-wwd-lp:hover .ico-bd {
	border: 8px solid #f9bc55
}
.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp:hover .ico-bd {
	border: 8px solid #dc2c43
}
.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp:hover .ico-bd {
	border: 8px solid #71992b
}
.csc-wwd-lp:hover .wwd-title {
	color: #28b7cc
}
.csc-wwd-lp+.csc-wwd-lp:hover .wwd-title {
	color: #dc872b
}
.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp:hover .wwd-title {
	color: #dc2c43
}
.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp+.csc-wwd-lp:hover .wwd-title {
	color: #71992b
}
@media only screen and (max-width:1440px) {
	.cfb-box .img, .cfb-box .info {
		min-height: 410px
	}
}
@media only screen and (max-width:1100px) {
	.csc-wwd-box {
		max-width: 800px
	}
	.csc-wwd-grid {
		grid-template-columns: repeat(auto-fit, minmax(50%, 1fr))
	}
	.cfb-box .img, .cfb-box .info {
		float: none;
		width: 100%
	}
	.prdt-financial, .prdt-mobile, .prdt-reservation, .prdt-sales {
		display: block;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center
	}
	.grid-container-product-flow {
		grid-template-columns: 100%
	}

}
@media only screen and (max-width:768px) {
	.cfb-box .img, .cfb-box .info {
		float: none;
		width: 100%;
		min-height: 250px;
		background-position: center
	}
}
@media only screen and (max-width:620px) {
	.csc-wwd-lp {
		padding: 0 20px
	}
	.csc-wwd-title {
		font-size: 1.5em
	}
	.csc-wwd-title span {
		padding: 0 20px
	}
	.csc-wwd-grid {
		grid-template-columns: repeat(auto-fit, minmax(240px, 1fr))
	}
	.ico-bd {
		width: 150px;
		height: 150px
	}
	.grid-container-product {
		display: grid;
		grid-template-columns: 100%;
		background-color: #fff;
		padding: 10px
	}
	.img-aside {
		height: 260px
	}
	.grid-container-product-flow {
		grid-template-columns: 100%
	}
	.img-aside-flow {
		width: 100%;
		height: 98%;
		object-fit: cover;
		overflow: hidden;
		border-radius: 20px
	}
}
@media only screen and (max-width:425px) {
	.cfb-box .img {
		border: 0
	}
	.cfb-box .img, .cfb-box .info {
		float: none;
		width: 100%;
		min-height: 170px;
		background-position: center
	}
	.desc-prdt {
		padding: 20px
	}
	.desc-prdt strong {
		font-size: 1.6em;
		color: #fff;
		font-weight: 700
	}
	.desc-prdt ul li {
		margin: 0;
		font-size: 1em;
		color: #fff;
		font-weight: 400;
		line-height: 150%;
		color: #fff
	}
}