@charset "utf-8";

.m_contents{position:relative;z-index:1}

.mcon1{padding:40px 0;background:url("/images/09_health/main/main_visual01.jpg") no-repeat center 0 ; background-size:cover;}
.visual{}
.visual h2{text-align:center;}
.visual h2 img{width:100%;}
.visual_icon{overflow:hidden;}
.visual_icon li{float:left;width:46%;margin:1% 2%;background:url("/images/09_health/main/vis_ban_bg2.png");border-radius:10px;}
.visual_icon li a{display:block;padding:20px 0;width:100%;text-align:center;color:#000;}
.visual_icon li a:hover, .visual_icon li a:focus, .visual_icon li a:active{ text-decoration:underline;}

.mcon2{padding:30px 15px}

.infozone{position:relative;background:#eef0f5;border-radius:5px;}
.infozone h2{color:#000;font-size:18px;padding:12px;line-height:1.5em;background:#fff;border-radius:5px 5px 0 0;border-left:1px solid #e3e3e3;border-right:1px solid #e3e3e3;border-top:1px solid #e3e3e3;}
.infozone p{position:absolute;top:11px;right:15px}
.infozone p button{background:url("/images/09_health/common/common_btn.png") no-repeat;width:29px;height:0;padding:29px 0 0 0;overflow:hidden}
.infozone p .stop{background-position:0px -108px}
.infozone p .play{background-position:-29px -108px}
.infozone p .prev{background-position:-87px -108px}
.infozone p .next{background-position:-116px -108px}
.infozone p .v_img{background-position:-203px -108px}
.infozone p .v_txt{background-position:-232px -108px}

.infozone li{display:none}
.infozone li.on{display:block}
.infozone li img{width:100%;hegith:100%;border-radius:0 0 5px 5px}
.infozone li span{display:none}

.type_img .btn_txt, .type_txt .btn_img{display:none}
.type_img .btn_img, .type_txt .btn_txt{display:inline-block}
.type_txt{}
.type_txt ul{margin:20px}
.type_txt li{background:url("/images/09_health/main/bbs_list.png") no-repeat 0 5px;padding:0 0 0 10px;margin:10px 0 0 0;display:block;}
.type_txt li span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.type_txt li:first-child{margin:0}
.type_txt li img{display:none}
.type_txt li span{display:block}

.fservice{margin:20px 0 0 0;}
.fservice h2{font-weight:400;color:#000;font-size:24px;text-align:center;margin:0 0 10px 0}
.fservice h2 strong{font-weight:600}
.fservice ul{overflow:hidden}
.fservice li{float:left;width:46%;margin:0 2% 3px 2%}
.fservice li a{display:block;border-radius:5px;border:1px solid #00837a;padding:10px 0;text-align:center;color:#00837a;font-size:14px}
.fservice li a:hover, .fservice li a:focus{ text-decoration:underline;}

.mcon3{padding:30px 15px;background:url("/images/09_health/main/bbs_bg.jpg") no-repeat top center; background-size:cover;position:relative;}

.bbs{position:relative;}
.bbs h2{color:#000;font-size:26px;text-align:center;font-weight:400;}
.bbs ul{margin:20px 0 0 0;}
.bbs ul li{display:none;width:90%;background:#019a8f;padding:5%;}
.bbs ul li a{border:1px solid #01b9ac;display:block;padding:10%;color:#fff;font-size:14px;line-height:1.6em;}
.bbs ul li a strong{text-align:center;display:block;font-size:20px;margin:0 0 20px 0;font-weight:500;line-height:1.2em;}
.bbs ul li a em{font-style:normal;display:block;text-align:center;margin:15px 0 0 0;}
.bbs ul li.list01{display:block;}
.bbs ul li:hover, .bbs ul li:focus{background:#00776f;}
.bbs .more{position:absolute;top:0;left:80%;}
.bbs .more img{width:35px;} 

.mcon4{padding:30px 15px;}

.call{padding:0 0 20px 0;border-bottom:1px solid #dcdcdc;}
.call h2{font-weight:400;color:#000;font-size:24px;text-align:center;}
.call h2 span{color:#019a8f;}
.call .num{background:#82be31;color:#fff;text-align:center;font-size:22px;padding:8px 0;border-radius:50px;margin:10px 0}
.call .time{text-align:center;font-size:13px;color:#444;}
.call .time span{color:#0072bc;}
.call .time em{font-style:normal;display:inline-block;padding:0 5px;color:#d7d7d7;}

.health_site{padding:20px 0;border-bottom:1px solid #dcdcdc;}
.health_site h2{font-weight:400;color:#000;font-size:24px;text-align:center;margin:0 0 20px 0;}
.health_site h2 span{color:#019a8f;}
.health_site button{width:100%;font-size:13px;border:1px solid #cecece;text-align:left;padding:0 0 0 20px;height:35px;background:url("/images/09_health/main/stielink_blit.png") #f8f8f8 no-repeat 90% center}
.health_site .site{display:none;}
.health_site .site ul{background:#fff;border:1px solid #cecece;border-top:none;padding:15px 5%;margin:0 0 10px 0;width:89.555555%;}
.health_site .site li{line-height:1.5em;padding:0 0 0 15px;background:url("/images/09_health/main/list_icon.png") no-repeat left center;}
.health_site .site li a{font-size:13px;}
.health_site .site li a:hover, .health_site .site li a:focus{text-decoration:underline}
.health_site div.on{display:block;}
.health_site button.btn02{margin:5px 0 0 0;}

.center_banner{padding:20px 0;}
.center_banner dl{position:relative;margin:15px 0;}
.center_banner dl.top{padding:0 0 15px 0;border-bottom:1px dashed #d7d7d7;}
.center_banner dl dt{font-weight:400;color:#000;font-size:24px;}
.center_banner dl dt span{color:#019a8f;}
.center_banner dl dd{font-size:13px;color:#8b8b8b;margin:5px 0 0 0;}
.center_banner dl dd.more{position:absolute;top:0;right:0;}

/*200707 관련사이트 추가*/
.health_site a.btn03{display: block; width:100%;font-size:13px;border:1px solid #cecece;text-align:left;padding:0 0 0 20px;height:35px;background:url("/images/09_health/main/sitelink_new.png") #f8f8f8 no-repeat 90% center; color: #000; line-height: 35px; margin: 5px 0 0 0; box-sizing: border-box;}

@media all and (min-width:380px) {
.visual_icon li{width:29.2%;}
}

@media all and (min-width:600px) {
.bbs ul{overflow:hidden;}
.bbs ul li{width:38%;float:left;margin:0 1%;}
.bbs ul li a{height:200px;}
.bbs ul li.list02{display:block;}
}

@media all and (min-width:700px) {
.visual h2 img{width:auto;}
}

/* Tablet */
@media all and (min-width:768px) {

.infozone{float:right;width:50%;height:285px}
.infozone h2{padding:15px 0 0 15px;height:40px}
.infozone li{text-align:center}
.infozone li img{height:230px;width:100%;}
.type_txt li{text-align:left}

.fservice{padding:0;}
.fservice h2{font-size:30px;margin:0 0 30px 0}
.fservice li{width:25%;margin:0 0 25px 0}
.fservice li a{border:none;padding:70px 0 0 0;background:url("/images/09_health/main/fservice_icon.png") no-repeat}
.fservice li.icon1 a{background-position:center 0}
.fservice li.icon2 a{background-position:center -110px}
.fservice li.icon3 a{background-position:center -220px}
.fservice li.icon4 a{background-position:center -330px}
.fservice li.icon5 a{background-position:center -440px}
.fservice li.icon6 a{background-position:center -550px}
.fservice li.icon7 a{background-position:center -660px}
.fservice li.icon8 a{background-position:center -770px}
.fservice li.icon9 a{background-position:center -880px}
.fservice li.icon10 a{background-position:center -990px}
.fservice li.icon11 a{background-position:center -1100px}
.fservice li.icon12 a{background-position:center -1210px}
.fservice li.icon13 a{background-position:center -1320px}
.fservice li.icon14 a{background-position:center -1430px}

.bbs ul li{padding:3%;width:42%;}
.bbs ul li a{height:180px;padding:5%}

}

/* Desktop */
@media all and (min-width:1023px) {

.mcon1{min-width:1200px;height:730px;background-size:auto;padding:0;}
.visual{width:1200px;margin:0 auto;}
.visual h2{text-align:center;padding:60px 0 0 0;}
.visual_icon{margin:150px 0 0 0;padding:0 0 5px 0;}
.visual_icon li{background:url("/images/09_health/main/vis_ban_bg.png") no-repeat;width:180px;height:185px;margin:0 0 0 24px;border-radius:0;}
.visual_icon li:first-child{margin:0;}
.visual_icon li a{font-size:18px;padding:130px 0 35px 0; font-weight:400;}
.visual_icon li.icon01 a{background:url("/images/09_health/main/vis_icon01.png") no-repeat center 30px;}
.visual_icon li.icon02 a{background:url("/images/09_health/main/vis_icon02.png") no-repeat center 40px;}
.visual_icon li.icon03 a{background:url("/images/09_health/main/vis_icon03.png") no-repeat center 40px;}
.visual_icon li.icon04 a{background:url("/images/09_health/main/vis_icon04.png") no-repeat center 30px;}
.visual_icon li.icon05 a{background:url("/images/09_health/main/vis_icon05.png") no-repeat center 35px;}
.visual_icon li.icon06 a{background:url("/images/09_health/main/vis_icon06.png") no-repeat center 30px;}


.mcon2{min-width:1200px;padding:70px 0;}
.health_con{width:1200px;margin:0 auto;overflow:hidden;}
.infozone{float:left;margin:0 35px 0 0;width:395px}
.infozone li img{width:auto;height:100%}

.fservice{float:left;margin:0;width:740px;height:285px;background:url("/images/09_health/main/fservice_bg1.png") no-repeat left 0;padding:0 0 0 30px;}
.fservice h2{padding:30px 0 10px 0;}
.fservice>div{background:url("/images/09_health/main/fservice_bg2.png") no-repeat right 0;height:285px;padding:0 30px 0 0;}
.fservice ul{margin:0 10px 0 25px;}
.fservice li{width:25%;margin:0 0 25px 0}
.fservice li a{border:none;padding:25px 0 25px 70px;background:url("/images/09_health/main/fservice_icon.png") no-repeat;text-align:left;}
.fservice li.icon1 a{background-position:left 0}
.fservice li.icon2 a{background-position:left -110px}
.fservice li.icon3 a{background-position:left -220px}
.fservice li.icon4 a{background-position:left -330px}
.fservice li.icon5 a{background-position:left -440px}
.fservice li.icon6 a{background-position:left -550px}
.fservice li.icon7 a{background-position:left -660px}
.fservice li.icon8 a{background-position:left -770px}
.fservice li.icon9 a{background-position:left -880px}
.fservice li.icon10 a{background-position:left -990px}
.fservice li.icon11 a{background-position:left -1100px}
.fservice li.icon12 a{background-position:left -1210px}
.fservice li.icon13 a{background-position:left -1320px}
.fservice li.icon14 a{background-position:left -1430px}


.mcon3{min-width:1200px;padding:0;height:550px;}
.bbs{width:1200px;margin:0 auto;}
.bbs h2{font-size:50px;padding:80px 0 0 0;}
.bbs ul{margin:60px 0 0 0;}
.bbs ul li{display:block;float:left;width:256px;height:256px;padding:12px;margin:0 0 0 26px;}
.bbs ul li:first-child{margin:0;}
.bbs ul li a{width:196px;height:196px;padding:30px;}
.bbs ul li a strong{font-size:24px;margin:0 0 20px 0;}
.bbs .more{position:absolute;top:85px;left:720px;}
.bbs .more img{width:auto;}


.mcon4{min-width:1200px;padding:60px 0;}

.health_info{width:1200px;margin:0 auto;}
.health_info:after{clear:both;content:"";display:block}

.call{float:left;width:295px;height:160px;padding:0 50px 0 150px;border-right:1px solid #dcdcdc;border-bottom:none;background:url("/images/09_health/main/call_img.gif") no-repeat 0 0;}
.call .num{margin:15px 0;}

.health_site{float:left;width:250px;height:160px;padding:0 55px;border-right:1px solid #dcdcdc;border-bottom:none;}
.health_site h2{text-align:left;margin:0 0 15px 0;}
.health_site .site{position:relative;}
.health_site .site ul{position:absolute;height:auto;top:0;left:0;}

.center_banner{float:left;width:285px;height:160px;padding:0 0 0 55px;}
.center_banner dl.top{margin:0;}
.center_banner dl dt{font-size:22px;}

}

.tf01{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf01;}
.tf02{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf02;}
.tf03{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf03;}
.tf04{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf04;}
.tf05{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf05;}
.tf06{animation-duration:4s;animation-iteration-count:infinite;animation-name:transf06;}

@keyframes transf01 {  
 0%{transform: scale3d(1, 1, 1); }
  15% { transform: scale3d(0.9, 0.9, 0.9); }
  30% { transform: scale3d(1, 1, 1); }
  45% { transform: scale3d(1, 1, 1);}
  60% { transform: scale3d(1, 1, 1); }
  75% { transform: scale3d(1, 1, 1); }
  90% { transform: scale3d(1, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
@keyframes transf02 {  
 0%{transform: scale3d(1, 1, 1); }
  15% { transform: scale3d(1, 1, 1); }
  30% { transform: scale3d(0.9, 0.9, 0.9);  }
  45% { transform: scale3d(1, 1, 1);}
  60% { transform: scale3d(1, 1, 1); }
  75% { transform: scale3d(1, 1, 1); }
  90% { transform: scale3d(1, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
@keyframes transf03 {  
 0%{transform: scale3d(1, 1, 1); }
  15% { transform: scale3d(1, 1, 1);  }
  30% { transform: scale3d(1, 1, 1); }
  45% { transform: scale3d(0.9, 0.9, 0.9); }
  60% { transform: scale3d(1, 1, 1); }
  75% { transform: scale3d(1, 1, 1); }
  90% { transform: scale3d(1, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
@keyframes transf04 {  
 0%{transform: scale3d(1, 1, 1); }
  15% { transform: scale3d(1, 1, 1); }
  30% { transform: scale3d(1, 1, 1); }
  45% { transform: scale3d(1, 1, 1); }
  60% { transform: scale3d(0.9, 0.9, 0.9); }
  75% { transform: scale3d(1, 1, 1); }
  90% { transform: scale3d(1, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
@keyframes transf05 {  
 0%{transform: scale3d(1, 1, 1); }
  15% { transform: scale3d(1, 1, 1); }
  30% { transform: scale3d(1, 1, 1); }
  45% { transform: scale3d(1, 1, 1);}
  60% { transform: scale3d(1, 1, 1); }
  75% { transform: scale3d(0.9, 0.9, 0.9); }
  90% { transform: scale3d(1, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
@keyframes transf06 {  
 0%{transform: scale3d(1, 1, 1); }
  15% {  transform: scale3d(1, 1, 1); }
  30% { transform: scale3d(1, 1, 1); }
  45% { transform: scale3d(1, 1, 1);}
  60% { transform: scale3d(1, 1, 1); }
  75% { transform: scale3d(1, 1, 1); }
  90% { transform: scale3d(0.9, 0.9, 0.9); }
100% { transform: scale3d(1, 1, 1); }
}



@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }

  75% {
    transform: translate3d(0, 10px, 0);
  }

  90% {
    transform: translate3d(0, -5px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  animation-name: bounceInUp;
 animation-duration: 3s;
}