@charset "utf-8";
.img{
  background: url('../img/whitening-skin-title.jpg') no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 740px;
 }
@media all and (max-width:991px) {
	.img { height: 70vh;}
}
@media all and (max-width: 767px) {
	.img { height: 50vh;}
}
@media all and (max-width: 560px) {
	.img { height: 30vh;}
}
.img-cover{
   position: absolute;
   bottom:0px;
   height: 70px;
   width: 100%;
   background-color: rgba(255, 255, 255, 0.8);                                                                 
   z-index:1;
}
.img .content{
     position: absolute;
     top:50%;
     left:30%;
     transform: translate(-50%, -50%);                                                                   
     color: white;
     z-index: 2;
     text-align: left;
	 float:left;
}
@media all and (max-width:991px) {
	.img .content { top:42%;left:35%;}
}
@media all and (max-width: 560px) {
	.img .content { top:20%;left:30%;}
}
.img .content2{
     position: absolute;
     top:90%;
     left:0%;
     transform: translate(-50%, -32%);                                                                   
     color: white;
     z-index: 2;
     text-align: left;
	 float:left;
}
.img-row { position:relative; margin: 0; padding: 0;}
.html_bg_box {width: 100%; position:relative;  margin: 0; padding: 0; text-align: left;}
.html_bg_title {font-size: 64px;font-family: "Noto Sans KR", sans-serif;font-weight: 700;color:#FFFFFF;}
.html_bg_title_s {font-size: 64px;font-family: "Noto Sans KR", sans-serif;font-weight: 300;color:#FFFFFF;}
.html_bg_description {font-size:16px;font-family: "Noto Sans KR", sans-serif;color:#5d4f4e;font-weight: 400;line-height:160%;}
@media all and (max-width:991px) {
	.html_bg_title { height:50px;font-size: 42px;}
	.html_bg_title_s { height:50px;font-size: 42px;}
	.html_bg_description {font-size:14px;font-family: "Noto Sans KR", sans-serif;color:#5d4f4e;}
}
@media all and (max-width: 767px) {
	.html_bg_title { height:28px;font-size: 30px;}
	.html_bg_title_s { height:28px;font-size: 30px;}
	.html_bg_description {font-size:12px;font-family: "Noto Sans KR", sans-serif;color:#5d4f4e;}
}
@media all and (max-width: 560px) {
	.html_bg_title { height:28px;font-size: 24px;}
	.html_bg_title_s { height:28px;font-size: 24px;}
	.html_bg_description {font-size:12px;font-family: "Noto Sans KR", sans-serif;color:#5d4f4e;}
}
.img-txt-box { font-size: 14px; position:relative; width: 185px; padding: 6px 20px; background:#de8e87;color:#ffffff;font-family: "Noto Sans KR", sans-serif;}
.img-txt-box2 { font-size: 14px; position:relative; width: 185px; padding: 6px 20px; background:#de8e87;color:#ffffff;font-family: "Noto Sans KR", sans-serif;}
@media all and (max-width: 560px) {
	.img-txt-box { font-size: 12px;width: 100%; padding: 0px 2px ; text-align:center;}
}
@media all and (max-width: 767px) {
	.img-txt-box { font-size: 12px;width: 100%; padding: 0px 2px ; text-align:center;}
}

.hm {font-size:14px;font-family: "Noto Sans KR", sans-serif;color:#ed7e6b;font-weight: 500;}
.hm-2 {font-size:13px;font-family: "Noto Sans KR", sans-serif;color:#302e2f;font-weight: 400;}
@media (max-width: 560px) {
  .hm {font-size:12px;font-family: "Noto Sans KR", sans-serif;color:#ed7e6b;font-weight: 500;}
  .hm-2 {font-size:10px;font-family: "Noto Sans KR", sans-serif;letter-spacing:-0.5px;}
}
@media (max-width: 320px) {
  .hm {font-size:11px;font-family: "Noto Sans KR", sans-serif;color:#ed7e6b;font-weight: 500;}
  .hm-2 {font-size:10px;font-family: "Noto Sans KR", sans-serif;}
  .sm {padding:0px;margin:10px 0px 0px 4px;width:28px;}
}

.col-centered {
    float: none;
    margin: 0 auto;
}

.carousel-control { 
    width: 8%;
    width: 0px;
}
.carousel-control.left,
.carousel-control.right { 
    margin-right: 40px;
    margin-left: 32px; 
    background-image: none;
    opacity: 1;
}
.carousel-control > a > span {
    color: white;
	  font-size: 29px !important;
}

.carousel-col { 
    position: relative; 
    min-height: 1px; 
    padding: 5px; 
    float: left;
 }

 .active > div { display:none; }
 .active > div:first-child { display:block; }

/*xs*/
@media (max-width: 767px) {
  .carousel-inner .active.left { left: -50%; }
  .carousel-inner .active.right { left: 50%; }
	.carousel-inner .next        { left:  50%; }
	.carousel-inner .prev		     { left: -50%; }
  .carousel-col                { width: 50%; }
	.active > div:first-child + div { display:block; }
}

/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
  .carousel-inner .active.left { left: -33%; }
  .carousel-inner .active.right { left: 33%; }
	.carousel-inner .next        { left:  33%; }
	.carousel-inner .prev		     { left: -33%; }
  .carousel-col                { width: 33%; }
	.active > div:first-child + div { display:block; }
	.active > div:first-child + div + div { display:block; }
}

/*md*/
@media (min-width: 992px) and (max-width: 1199px) {
  .carousel-inner .active.left { left: -25%; }
  .carousel-inner .active.right { left: 25%; }
	.carousel-inner .next        { left:  25%; }
	.carousel-inner .prev		     { left: -25%; }
  .carousel-col                { width: 25%; }
	.active > div:first-child + div { display:block; }
  .active > div:first-child + div + div { display:block; }
  .active > div:first-child + div + div + div { display:block; }
}

/*lg*/
@media (min-width: 1200px) {
  .carousel-inner .active.left { left: -20%; }
  .carousel-inner .active.right{ left:  20%; }
	.carousel-inner .next        { left:  20%; }
	.carousel-inner .prev		     { left: -20%; }
  .carousel-col                { width: 20%; }
	.active > div:first-child + div { display:block; }
  .active > div:first-child + div + div { display:block; }
	.active > div:first-child + div + div + div { display:block; }
	.active > div:first-child + div + div + div + div { display:block; }
}

.block {
	width: 250px;
	height: 40px;
}

.carousel_style {position: absolute;margin-top:-60px;margin-left:200px;z-index:1;}
/*xs*/
@media (max-width: 767px) {
  .carousel_style {position: relative;margin-top:0px;margin-left:0px; }
}

/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
  .carousel_style { margin-left:20px; }
}

/*md*/
@media (min-width: 992px) and (max-width: 1199px) {
  .carousel_style { margin-left:100px; }
}

.co_about {color:#bb4f43;}
.co_doc {color:#dddddd;}
.line_about {margin:0px; margin-bottom:6px; max-width: 115px; height:1px; overflow: hidden; position:relative; background:#bb4f43;}
.line_doc {margin:0px; margin-bottom:6px; max-width: 340px; height:1px; overflow: hidden; position:relative; background:#cfcfcf;}
.line_hr1 {margin-left :10px; width: 1px; height:20px; overflow: hidden; position:relative; background:#f5c4b6;}
.line_hr50 {margin-left :10px; width: 1px; height:50px; overflow: hidden; position:relative; background:#f5c4b6;}

.box_about {width: 100%; overflow: hidden; background: url('../img/skin-care-title-box-bg.jpg') repeat top center;}

.box_list1 {width: 100%; overflow: hidden; background: url('../img/whitening-skin-box01.jpg') repeat center center; margin: 0 auto;}
.box_list2 {width: 100%; overflow: hidden; background: url('../img/whitening-skin-box02.jpg') repeat center center; margin: 0 auto;}
.line_hr_blank {margin:0px; width: 1px; height:200px; overflow: hidden; position:relative;}

.box_list3 {width: 100%; overflow: hidden; background: url('../img/whitening-skin-box03.jpg') repeat center center; margin: 0 auto;}

.co_tt1 {color:#e98681;}
.co_tt2 {color:#2d3236;}
.co_num {color:#cecece;}
.line_tt {margin-top:10px; margin-bottom:10px; width: 100%; height:1px; overflow: hidden; position:relative; background:#e5e5e5;}

.co_tt3 {color:#55545c;}
.line_tt3 {margin-top:10px; width: 100%; height:1px; overflow: hidden; position:relative; background:#d4d4d4;}
.co_tt_n {color:#e1807a;}
.co_tt_nt {color:#96959b;}
.co_tt_nd {color:#e28170;}
.line_tt_n {margin:0px; width: 54px; height:3px; overflow: hidden; position:relative; background:#e27f7a;}


.line_tt1 {margin-top:10px; width: 100%; height:1px; overflow: hidden; position:relative; background:#7995a3;}
.line_tt_white {margin-top:10px; width: 100%; height:1px; overflow: hidden; position:relative; background:#FFFFFF;}

.line_ml_white {margin-top:10px; margin-left:15px; width: 100%; height:1px; overflow: hidden; position:relative; background:#FFFFFF;}
.box_ml {margin-left:15px; width: 100%; overflow: hidden; position:relative;}

.line_hr_how {margin-top:10px; width: 160px; height:2px; overflow: hidden; position:relative; background:#ffffff;}
.box_tt1 {width: 100%; overflow: hidden; position:relative; background:#7995a3;}
.box_tummy {margin: 0 auto; max-width: 384px;position:relative; }