@charset "utf-8";

.con-healbeing .wrap-visual {
  width: 100%;
  height: 574px;
  background: url(../../images/market_healbeing/bg_visual.jpg) no-repeat top center;
}
.con-healbeing .row-visual {
  position: relative;
}
.con-healbeing .txt-visual {
  position: absolute;
}
.con-healbeing .txt-visual.ele1 {
  left: 0px;
  top: 90px;
}
.con-healbeing .txt-visual.ele2 {
  right: 0px;
  top: 30px;
}
.con-healbeing .txt-visual.ele3 {
  right: 0px;
  bottom: 35px;
}
.con-healbeing .txt-visual.ele4 {
  left: 0px;
  bottom: 35px;
}
.con-healbeing .wrap-contents {
  background: url(../../images/market_healbeing/bg_contents.jpg) no-repeat top center;
}


.con-healbeing .summary {
  text-align: center;
  font-size: 0.9rem;
  padding: 70px 0 60px 0;
}
.con-healbeing .desc {
  display: inline-block;
  width: 100%;
}
.con-healbeing .desc .point1,
.con-healbeing .desc .point2 {
  float: left;
  width: 50%;
  box-sizing: border-box;
}
.con-healbeing .desc .point1 h4 {
  padding: 0 0 30px 0;
}
.con-healbeing .desc .point1 p {
  padding: 0 0 30px 0;
}
.con-healbeing .desc .point1 ol {
  list-style-type: none !important;
  padding: 0px !important;
  font-size: 0.9rem;
}
.con-healbeing .desc .point1 .list span {
  font-size: 0.8rem;
  display: inline-block;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  color: #fff;
  background: #c00c0c;
  border-radius: 20px;
  margin: 0 10px 5px 0;
}
.con-healbeing .desc .point2 h4 {
  padding: 0 0 2px 0;
  margin: 0 0 20px 0;
  font-size: 1.4rem;
  background: url(../../images/market_healbeing/point_line.gif) no-repeat left bottom;
}
.con-healbeing .desc .point2 em {
  color: #c00c0c;
  font-size: 1rem;
  font-weight: 600;
  display: block;
}
.con-healbeing .desc .diagram {
  font-size: 0.82rem;
  padding: 20px 0 0 0;
  display: inline-block;
}
.con-healbeing .desc .diagram .line1,
.con-healbeing .desc .diagram .line2,
.con-healbeing .desc .diagram .line3 {
  float: left;
}
.con-healbeing .desc .diagram .line1 li {
  width: 80px;
  height: 80px;
  line-height: 1.5;
  background: #555555;
  border-radius: 100%;
  color: #fff;
  text-align: center;
  margin: 20px 0 0 0;
}
.con-healbeing .desc .diagram .line1 li span {
  padding: 21px 0 0 0;
  display: block;
}
.con-healbeing .desc .diagram .line2 ul {
  padding: 140px  0 0 90px;
  background: url(../../images/market_healbeing/bg_diagram.png) no-repeat 15px 0;
  text-align: left;
}
.con-healbeing .desc .diagram .line3 p {
  width: 117px;
  height: 117px;
  background: url(../../images/market_healbeing/bg_diagram2.png) no-repeat center center;
  text-align: center;
  margin: 0 0 0 20px;
}
.con-healbeing .desc .diagram .line3 span {
  padding: 37px 0 0 0;
  display: inline-block;
}

.con-healbeing .product {
  position: relative;
  padding: 0 0 0 0;
}
.con-healbeing .product h3 {
  text-align: center;
  font-size: 2rem;
  background: url(../../images/market_healbeing/gallery_line.gif) no-repeat center top;
  margin: 50px 0 50px 0;
}
.con-healbeing .product .product-list {
  display: inline-block;
  width: 100%;
  border: 2px solid #e6e6e6;
  box-sizing: border-box;
  background: #fff;
}
.con-healbeing .product .product-list > li {
  float: left;
  width: 33.333%;
  height:540px;
  padding: 20px;
  box-sizing: border-box;
  border-left: 1px solid #d1d1d1;
}
.con-healbeing .product .product-list h4 {
  color: #c00c0c;
  font-size: 1rem;
  line-height: 1.2;
  font-weight: 600;
  padding: 0 0 5px 0;
  margin: 0 0 10px 0;
  border-bottom: 1px solid #c00c0c;
}
.con-healbeing .product .product-list .thumb {
  margin: 0 0 20px 0;
}
.con-healbeing .product .product-list .price {
  color: #c00c0c;
  font-size: 0.85rem;
  padding: 0 0 8px 0;
}
.con-healbeing .product .product-list .point {
  font-size: 0.78rem;
  line-height: 1.4;
  font-weight: 600;
}
.con-healbeing .product .product-list .desc {
  font-size: 0.78rem;
  text-align: left;
  color: #555;
  margin: 12px 0 0 0;
}
.con-healbeing .product .product-list .desc-list li {
  float: none;
  width: 100%;
  padding: 0px;
}

.con-healbeing .gallery {
  position: relative;
  padding: 0 0 80px 0;
}
.con-healbeing .gallery h3 {
  text-align: center;
  font-size: 2rem;
  background: url(../../images/market_healbeing/gallery_line.gif) no-repeat center top;
  margin: 50px 0 45px 0;
}
.con-healbeing #market-slide {
  width: 95%;
  margin: 0 auto;
}
.con-healbeing .slick-slide {
  text-align: center;
}
.con-healbeing .slick-slide img {
  display: inline-block;
}
.con-healbeing .arrow-market {
  text-align: center;
  width: 28px;
  height: 51px;
  position: absolute;
  top: 50%;
}
.con-healbeing .arrow-market.prev {
  left: -20px;
  background: url(../../images/market_healbeing/arrow_left.png) no-repeat center center;
}
.con-healbeing .arrow-market.next {
  right: -20px;
  background: url(../../images/market_healbeing/arrow_right.png) no-repeat center center;
}
.con-healbeing .menuOpen {
  width: 37px;
  height: 37px;
  background: url(../../images/allabout_act/menuOpen.png) no-repeat center center;
  text-indent: -9999px;
  border: 0px;
  transition: all 0.4s ease-in-out;
  cursor: pointer;
  margin: 0 auto;
  margin-top: 65px;
  display: block;
}
.con-healbeing .contact {
  text-align: center;
  padding: 80px 0;
  font-size: 1.2rem;
  font-weight: 600;
}
.con-healbeing .contact .tel {
  background: url(../../images/market_healbeing/icon_phone.gif) no-repeat left center;
  padding: 0 0 0 27px;
  margin: 0 0 0 10px;
}
.con-healbeing .contact .fax {
  background: url(../../images/market_healbeing/icon_fax.gif) no-repeat left center;
  padding: 0 0 0 27px;
  margin: 0 0 0 10px;
}



/* ==========================================================================
   반응형 미디어 쿼리
   ========================================================================== */

/* ==========================================================================
   1050px 이하
   ========================================================================== */
   
@media all and (max-width: 1050px) {
	.con-healbeing .wrap-contents {
		padding: 0 30px;
		background-size: cover;
	}
	.con-healbeing .summary {
		padding: 50px 0;
	}
	.con-healbeing .desc .point1,
	.con-healbeing .desc .point2 {
		width: 100%;
		float: none;
	}
	.con-healbeing .desc .point1 {
		padding: 0 0 30px 0;
	}
	.con-healbeing .desc .point1 p img {
		width: 100%;
	}
	.con-healbeing .desc .point1 h4 {
		padding: 0 0 20px 0;
	}
	.con-healbeing .contact {
		font-size: 1rem;
	}
	.con-healbeing .desc .diagram {
		display: inline-block;
	}
	.con-healbeing .desc .diagram .line2 {
		text-align: left;
	}
	.con-healbeing .desc .point2 {
		text-align: center;
	}
	.con-healbeing .desc .point2 h4,
	.con-healbeing .desc .point2 em {
		text-align: left;
		display: block;
	}
	.con-healbeing .gallery h3 {
		text-align: left;
		background-position: left top;
		margin: 20px 0px;
	}
	.con-healbeing .wrap-visual {
		height: 325px;
		background-size: cover;
	}
	.con-healbeing .txt-visual.ele1 {
		left: 20px;
		top: 30px;
	}
	.con-healbeing .txt-visual.ele2 {
		right: 20px;
		top: 30px;
	}
	.con-healbeing .txt-visual.ele3 {
		right: 20px;
		bottom: 30px;
	}
	.con-healbeing .txt-visual.ele4 {
		left: 20px;
		bottom: 30px;
	}
	.con-healbeing .txt-visual.ele1 img,
	.con-healbeing .txt-visual.ele2 img,
	.con-healbeing .txt-visual.ele3 img,
	.con-healbeing .txt-visual.ele4 img {
		width: 65% !important;
	}
	.con-healbeing .txt-visual.ele2 h3,
	.con-healbeing .txt-visual.ele3 h3 {
		text-align: right;
	}
	.con-healbeing .product .product-list .thumb img {
		width: 100%;
	}
}

/* ==========================================================================
   768px 이하
   ========================================================================== */
   
@media all and (max-width: 768px) {
	.con-healbeing .desc .point1 h4 img {
		width: auto !important;
		max-width: none !important;
	}
	.con-healbeing .desc .diagram .line1,
	.con-healbeing .desc .diagram .line2,
	.con-healbeing .desc .diagram .line3 {
		float: none;
	}
	.con-healbeing .desc .diagram p {
		margin: 0 auto !important;
	}
	.con-healbeing .desc .diagram .line1 li {
		margin: 0 auto !important;
		margin-bottom: 10px !important;
	}
	.con-healbeing .desc .diagram .line2 ul {
		text-align: center;
		padding: 220px 0 70px 0;
		background: url(../../images/market_healbeing/bg_diagram_m.png) no-repeat top center;
	}
}

/* ==========================================================================
   600px 이하
   ========================================================================== */
   
@media all and (max-width: 600px) {
	.con-healbeing .product .product-list > li {
		width: 100%;
		height: auto;
		float: none;
	}
}

/* ==========================================================================
   500px 이하
   ========================================================================== */
   
@media all and (max-width: 500px) {
	.con-healbeing .txt-visual.ele2 img,
	.con-healbeing .txt-visual.ele3 img,
	.con-healbeing .txt-visual.ele4 img {
		display: none !important;
	}
	.con-healbeing .txt-visual.ele1 {
		left: 30px;
		top: 110px;
	}
	.con-healbeing .desc .point1 ol li br {
		display: none;
	}
	.con-healbeing .desc .point1 .line-break {
		display: inline;
		margin: 0px;
	}
	.con-healbeing .desc .point1 .list span,
	.con-healbeing .desc .point1 .list strong {
		display: block;
		margin: 0 0 10px 0;
	}
	.con-healbeing #market-slide {
		width: 85%;
	}
	.con-healbeing .arrow-market {
		margin: -20px 0 0 0;
	}
	.con-healbeing .contact {
		padding: 80px 30px;
	}
	.con-healbeing .contact .tel,
	.con-healbeing .contact .fax {
		display: inline-block;
	}
}