#mcontainer{position:relative; width:100%; height:auto; overflow:hidden;background:#efefef}
#mcontents{position:relative; width:1200px; margin:50px auto; overflow:hidden;}
#mcontents #mtop{width:590px; height:auto; overflow:hidden;}
.mc_bg{background:url('/images/health/mcontents_bg.png') right -40px no-repeat;}

#mtop .weather{float:left; width:142px;}
#mtop .weather .weather_tit{font-size:15px; color:#516ca2;  text-align:center; border:1px solid #c7c7c7; border-width:1px 0 1px 0;padding:5px 0; font-weight:700;}
#mtop .weather .weather_img{float:left; width:70px; text-align:center;}
#mtop .weather .weather_info{margin-top:14px;color:#333; font-weight:700;}
#mtop .weather .md{display:block; text-align:center; font-size:12px;}
#mtop .weather .weather_info .weather_temp{font-size: 20px; margin-top:5px; }
#mtop .weather .weather_tit2{clear:both; margin-top:20px; font-size:15px; color:#516ca2;  text-align:center; border:2px solid #c7c7c7; border-radius:20px; padding:1px 0; font-weight:700;}
#mtop .weather .weather_dust{text-align:center; padding:8px 0 4px 0; color:#333; font-weight:700;}
#mtop .mainTxt{float:left; color:#005aa1; width:75%; text-align:center; margin-top:40px;}
#mtop .mainTxt > span{color:#1f74b7; font-size:15px; display:block; text-align:center; line-height:44px;}
#mtop .mainTxt > p{font-size:35px; font-weight:600; text-align:center;}
/*
#mtop .mmenu{clear:both;}
#mtop .mmenu ul li{float:left;padding-right:7px;}
#mtop .mmenu ul li > a {display:block; width:142px; height:128px; text-align:center; padding-top:80px; color:#fff; font-weight:600; font-size:16px;}
#mtop .mmenu ul li > a.ic01{background: #1695ac url('/images/health/mtop_ic01.png') center 25px no-repeat;}
#mtop .mmenu ul li > a.ic02{background:#e9526f url('/images/health/mtop_ic02.png') center 25px no-repeat;}
#mtop .mmenu ul li > a.ic03{background: #b98618 url('/images/health/mtop_ic03.png') center 25px no-repeat;}
#mtop .mmenu ul li > a.ic04{background:#5078bc url('/images/health/mtop_ic04.png') center 25px no-repeat;}
#mtop .mmenu ul li:last-child{padding-right:0;}*/

#mtop .mmenu { clear: both; width: 100%; }
#mtop .mmenu ul { display: flex; flex-wrap: wrap; padding: 0; margin: 0; list-style: none; gap: 5px; }
#mtop .mmenu ul li { flex: 1; min-width: 0; }
#mtop .mmenu ul li > a { display: block; height: 128px; text-align: center;  padding-top: 80px; color: #fff; font-weight: 600;  font-size: 15px; background-position: center 25px;  background-repeat: no-repeat; box-sizing: border-box; text-decoration: none; }



/* 아이콘별 색상 (동일) */
#mtop .mmenu ul li > a.ic01 { background-color: #1695ac; background-image: url('/images/health/mtop_ic01.png'); }
#mtop .mmenu ul li > a.ic02 { background-color: #e9526f; background-image: url('/images/health/mtop_ic02.png'); }
#mtop .mmenu ul li > a.ic03 { background-color: #b98618; background-image: url('/images/health/mtop_ic03.png'); }
#mtop .mmenu ul li > a.ic04 { background-color: #5078bc; background-image: url('/images/health/mtop_ic04.png'); }
#mtop .mmenu ul li > a.ic05 { background-color: #8e44ad; background-image: url('/images/health/mtop_ic05.png'); }
#mtop .mmenu ul li > a.ic06 { background-color: #27ae60; background-image: url('/images/health/mtop_ic06.png'); }


#mcon{clear:both; margin-top:20px; width:100%;}
#mcon .mconBox{width:590px; height:280px;background:#fff; float:left;}
#mcon .mconBox .boxHead{height:48px; background:#516ca2; }
#mcon .mconBox .boxHead h2{padding-left:30px; line-height:48px; font-size:18px; color:#fff;}
#mcon .mconBox .boxCon{padding:23px 20px;}
#mcon .mconBox .boardH {padding-left:30px;}
#mcon .mconBox .boardH ul li{float:left; margin-left:8px; padding-left:8px; background:url('/images/health/head_bar.jpg') 0 center no-repeat;}
#mcon .mconBox .boardH ul li:first-child{padding:0; margin:0; background:none;}
#mcon .mconBox a:focus{outline:2px dotted #000; outline-offset: -2px;}



/* ÃƒÂ«Ã‚Â©Ã¢â‚¬ÂÃƒÂ¬Ã‚ÂÃ‚Â¸ ÃƒÂ­Ã…â€™Ã‚ÂÃƒÂ¬Ã¢â‚¬â€Ã¢â‚¬Â¦ÃƒÂ¬Ã‚Â¡Ã‚Â´ popupZone */
#m_popupZone{position:relative;}
#m_popupZone h3{position:absolute; left:20px; top:10px; color:#333; font-weight:600;}
#m_popupZone .control{width:150px; height:40px; position:absolute; top:0px; right:15px;}
#m_popupZone .control button{width:21px; height:21px; float:left; margin:14px 2px; text-indent:-9999px;}
#m_popupZone .control .bx-pager {color:#fff;}
#m_popupZone .control .none{display:none;}
#m_popupZone .bx-controls{float:left; padding:14px 20px 0 0;}
#m_popupZone .btn_prev{width:30px; height:30px; background:url('/images/health/popup_btn_prev.jpg') no-repeat;}
#m_popupZone .btn_stop{background:url('/images/health/popup_btn_stop.jpg') no-repeat;}
#m_popupZone .btn_play{background:url('/images/health/popup_btn_play.jpg') no-repeat;}
#m_popupZone .btn_next{background:url('/images/health/popup_btn_next.jpg') no-repeat;}
#m_popupZone .btn_prev{background:url('/images/health/popup_btn_prev.jpg') no-repeat;}
#m_popupZone a:focus{outline:2px dotted #000; outline-offset: -2px;}

#mcon .mconBox .board { float:left; position:relative; width:590px; height:100%;  }

#mcon .mconBox .board ul li{display:inline;float: left;padding:0; background:url('/images/health/head_bar.jpg') 0 center no-repeat}
#mcon .mconBox .board ul li.first{background:none; padding-left:10px;}
#mcon .mconBox .board .boardCon ul li{background:none;}
#mcon .mconBox .board ul li a.tab_btn{display: block; padding:2px 18px 0; height:46px; color:#edecec; font-size:18px;line-height:46px;}
#mcon .mconBox .board ul li a.tab_btn:focus { border:1px dotted #ddd;}
#mcon .mconBox .board ul li.active a.tab_btn{ color:#fff; font-weight:600; font-size:18px;}
#mcon .mconBox .board ul.board_head{width:100%; height:48px; background:#516ca2}
#mcon .tabcontent{position: absolute;top:53px;left:0;width:100%; height:120px; padding:23px 27px 10px; background:#ffffff;}

/*
.board  ul ul li{ width:100%;margin:0;padding:0 0 0 10px;background: url(/images/health/board_bu.gif) no-repeat 3px 13px;  text-align:right;}
/*.board  ul ul li a{display:inline-block; float:left; width: 80%; padding:0; font-size:15px;color:#1b1b1b;line-height:22px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow: ellipsis;}*/
/*
.board  ul ul li img { vertical-align:middle;}
.board  ul ul li span.date { display:inline-block; padding-top:5px; font-size:12px; color:#898989;  text-decoration:none; }
.board  .more a{ display:block; position: absolute; top: -53px;right: 5px; width: 46px; height:46px; background:#70a1d3 url(/images/health/board_more.png) no-repeat center; font-size: 0;line-height: 0;}
*/


#mcon .mconBox .boardH ul li a{ line-height:48px; }
#mcon .boxM{margin-left:19px;}
#mcon .boardTop {border-bottom:1px dotted #f0f0f0; padding-bottom:5px;}
#mcon .boardTop p.title{font-size:19px; font-weight:600; padding-bottom:3px; color:#333;}
#mcon .boardTop p{font-size:13px; line-height:22px;}
#mcon .boardTop span.date{font-size:14px; display:block; text-align:right; }
#mcon .boardCon{margin-top:10px;}
#mcon .boardCon li:before{width:4px; height:2px; background:#0060ac; float:left; content:''; display:block; margin:13px 8px 0 0;}
#mcon .boardCon li{width:100%;}
#mcon .boardCon li a{line-height:28px; font-size:14px;}
#mcon .boardCon li .date{font-size:14px; text-align:right; float:right;}

#mcon .mconBoxS{width:284px; height:280px;background:#fff; float:left; margin-top:17px;}
#mcon .boxS{margin-left:21px;}
#mcon .mconBoxS .boxHead{height:48px; border-bottom:1px solid #e5e5e5; }
#mcon .mconBoxS .boxHead h2{padding-left:30px; line-height:52px; font-size:18px; font-weight:700; color:#333; letter-spacing:-0.5px;}
#mcon .mconBoxS .boxCon{padding:30px 30px;}
#mcon .mconBoxS .boxCon h3{font-size:17px; color:#333; display:inline-block; font-weight:600; letter-spacing:-0.5px;}
#mcon .mconBoxS .boxCon h3.barB::before{display:block;content:''; background:#2ab4bd; width:16px; height:3px; margin-bottom:5px;}
#mcon .mconBoxS .boxCon h3.barP::before{display:block;content:''; background:#e9526f; width:16px; height:3px; margin-bottom:5px;}
#mcon .mconBoxS .boxCon .kfda_info{padding-top:15px;}
#mcon .mconBoxS .boxCon p.status{display:block; float:left;}
#mcon .mconBoxS .boxCon p.status > span{display:table-cell; width:54px; height:54px; font-size:18px; vertical-align:middle; text-align:center; border-radius:50px; color:#fff; font-weight:700;}
#mcon .mconBoxS .boxCon p.status > .lv1{background: #1695ac;}
#mcon .mconBoxS .boxCon p.status > .lv2{background:#63a600;}
#mcon .mconBoxS .boxCon p.status > .lv3{background:#ff9700;}
#mcon .mconBoxS .boxCon p.status > .lv4{background:#ee4617;}
#mcon .mconBoxS .boxCon p.status_info{display:block; float:left; padding-left:8px; }
#mcon .mconBoxS .boxCon .status_info > span.date{display:block; font-size:15px; color:#606774}
#mcon .mconBoxS .boxCon .status_info > span.status_text{display:block; font-size:20px;  font-weight:600;}
#mcon .mconBoxS .boxCon .status_info .status_text #em_risk{font-weight:bold;}
#mcon .mconBoxS .boxCon .status_info .status_text .lv1{color:#2ab4bd;}
#mcon .mconBoxS .boxCon .status_info .status_text .lv2{color:#63a600;}
#mcon .mconBoxS .boxCon .status_info .status_text .lv3{color:#ff9700;}
#mcon .mconBoxS .boxCon .status_info .status_text .lv4{color:#ee4617;}
#mcon .mconBoxS .boxCon .status_stxt{clear:both; display:block; font-size:13px; color:#888; padding-top:10px;}
#mcon .mconBoxS .boxCon .health_info{color:#333; padding-left:62px; margin-top:10px; background:url('/images/health/ic_clock.png') 2px center no-repeat;}
#mcon .mconBoxS .boxCon .health_info .weekday{font-size:14px;}
#mcon .mconBoxS .boxCon .health_info .time{font-size:23px; font-weight:600; }
#mcon .mconBoxS .boxCon .health_info .weekend{font-size:13px;}
#mcon .mconBoxS .boxCon .btnBox{width:100%; margin-top:20px;}
#mcon .mconBoxS .boxCon .btnBox a{display:inline-block;}
#mcon .mconBoxS .boxCon .btnBox a > span{display:block; border-radius:3px; width:105px; height:33px; text-align:center; line-height:33px;}
#mcon .mconBoxS a{display:block;}
#mcon .mconBoxS a:focus{outline:2px dotted #000; outline-offset: -2px;}

.btPink{background:#e9526f; color:#fff;}
#mcon .mconBoxS .boxCon .quickMenu li{font-size:16px;}
#mcon .mconBoxS .boxCon .quickMenu li:last-child > a{margin-bottom:0;}
#mcon .mconBoxS .boxCon .quickMenu li > a{display:block; height:38px; line-height:38px; margin-bottom:10px; padding:0 0 0 45px;}
#mcon .mconBoxS .boxCon .fa_ic01{background:url('/images/health/fa_ic01.png') 0 center no-repeat;}
#mcon .mconBoxS .boxCon .fa_ic02{background:url('/images/health/fa_ic02.png') 0 center no-repeat;}
#mcon .mconBoxS .boxCon .fa_ic03{background:url('/images/health/fa_ic03.png') 0 center no-repeat;}
#mcon .mconBoxS .boxCon .fa_ic04{background:url('/images/health/fa_ic04.png') 0 center no-repeat;}
.mediMenu li{float:left; width:50%; margin-bottom:15px;}
.mediMenu li::before{float:left; display:block; width:2px; height:2px; background:#5078bc; content:''; margin:10px 5px 0 0;}
.mediMenu li:nth-child(2n-1){clear:both;}
.mediMenu li a{margin-bottom:10px;letter-spacing:-0.5px; font-size:14.5px;}
.mediMenu li a:hover{font-weight:bold; color:#5078bc; }

#mcon .boxL{margin-top:20px;}
#mcon .mconBoxL{float:left; width:1200px; height:120px; clear:both; background:#fff;}
.footMenu li{padding-left:50px; float:left;}
.footMenu li a h3{display:block; color:#4c527c; font-weight:600;}
.footMenu li a span{color:#888888; display:block; font-size:13px; line-height:20px;}
.footMenu li > a{display:inline-block; padding:29px 0 29px 80px;}
.footMenu li .fm_ic01{background:url('/images/health/ft_ic01.png') 0 center no-repeat;}
.footMenu li .fm_ic02{background:url('/images/health/ft_ic02.png') 0 center no-repeat;}
.footMenu li .fm_ic03{background:url('/images/health/ft_ic03.png') 0 center no-repeat;}
.footMenu li .fm_ic04{background:url('/images/health/ft_ic04.png') 0 center no-repeat;}
.footMenu li .fm_ic05{background:url('/images/health/ft_ic05.png') 0 center no-repeat;}


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

    #mcontents{width: 90%;margin: 0 auto;background: none;}
    #mcontents #mtop{width:100%}
   /* #mtop .mmenu{width:100% ; margin:0 auto;overflow:hidden;text-align:center}
    #mtop .mmenu ul li > a{width:100%}
    #mtop .mmenu ul li{width:calc(25% - 7px)}*/
    #mtop .mmenu ul li { flex: none; width: calc(33.33% - 5px);}
    
    #mtop .mmenu ul li > a { height: 110px;  padding-top: 70px; font-size: 14px; background-size: 35px;  background-position: center 20px; }
    #mcon .mconBox{margin : 20px auto;float:none;}
    #mcon .mconBoxS{float:none;margin: 25px auto}
    
    #mcon .mconBoxL{width:100%;height: auto;}
    .footMenu li{width:50%;}
  
}
@media only screen and (max-width:650px) {
  .footMenu li{float:none;margin:0 auto;width:500px}

    #mtop .weather{width:100%;float:none}
    #mtop .mainTxt{float:none;width:90%;margin:0 auto;line-height:1em;display:block;word-break:keep-all}
    #mtop .weather .weather_info{width:100%;}
    #mtop .mainTxt > p{line-height:1.5em;font-size:20px;margin-bottom:20px}

    /*#mtop .mmenu ul li{width:calc(50% - 7px);margin-bottom:7px}
    #mtop .mmenu ul li:nth-child(even){padding-right:0}*/

    #mcon .mconBox{width:100%;overflow: hidden;}
    #mcon .mconBox .board{width:100%;}

    #mcon .tabcontent{height: auto;overflow:hidden;}

    #mcon .boardTop span.date{display:none}

}            

   