@charset "utf-8";

/* 질환정보, 자가검진 - 검색 */
.s0501 {width:100%; display:inline-block;}
.s0501 .search_box{padding-bottom:0;}
.s0501 .search_box {width:100%; display:inline-block; border-top:2px solid #000;}
.s0501 .search_box .search_area {width:100%; display:inline-block; background:#f8f8f8;text-align:center;border-bottom:1px solid #e2e2e2;}
.s0501 .search_box .search_area ul {display:inline-block; margin-left:-5px;padding:20px 0;}
.s0501 .search_box .search_area ul li {position:relative;float:left; padding-left:5px;}
.s0501 .search_box .search_area ul li select {padding:0 40px 0 14px; margin:0; height:50px; line-height:50px; background-color:#fff;border:1px solid #dadada; color:#000;}
.s0501 .search_box .search_area ul li input {padding:0; margin:0; height:48px; padding:0 15px; width:228px; font-family:'NotoKrM',sans-serif;font-size:14px;line-height:48px;color:#000; background-color:#fff;border:1px solid #dadada;}
.s0501 .search_box .search_area ul li label{position:absolute;left:15px;top:50%;margin-top:-7px;line-height:1;color:#939393;}
.s0501 .search_box .search_area ul li.btn_search {padding-left:0;}
.s0501 .search_box .search_area ul li.btn_search a {display:inline-block; width:80px; text-align:center; height:50px; font-family:'NotoKrM',sans-serif;font-size:14px;line-height:50px; color:#fff; background:#2468c5;}
.s0501 .search_box .search_area ul li.btn_search a:hover {background:#1a58ae;}
.s0501 .search_box .num_area {width:100%; padding-top:30px;display:inline-block;text-align:center;}
.s0501 .search_box .num_area ul {display:inline-block;}
.s0501 .search_box .num_area ul li {float:left; margin:0 3px;}
.s0501 .search_box .num_area ul li a {display:inline-block;margin-bottom:10px;width:34px; height:34px;line-height:34px; font-family:'NotoKrB',sans-serif;font-size:16px;color:#666;background:#f8f8f8;  text-align:center;border-radius:50%;}
.s0501 .search_box .num_area ul li a:hover, .s0501 .search_box .num_area ul li a.on {background:#2979e2;color:#fff;box-shadow:5px 5px 5px rgba(0,0,0,0.2);}
.s0501 .search_box .num_area ul li.all a {width:60px;border-radius:20px;}
.s0501 .search_box .num_area ul li.all a:hover, .s0501 .search_box .num_area ul li.all a.on {background:#02aeb9;color:#fff;}

.s0501 .search_list {width: 100%;border:5px solid #e2e2e2;display:inline-block;margin-top:30px;box-sizing: border-box;}
.s0501 .search_list ul li {float:left; width:25%; text-align:center; height:36px; line-height:36px; border-bottom:1px solid #e2e2e2;}
.s0501 .search_list ul li a {display:block; border-right:1px solid #e2e2e2;}
.s0501 .search_list ul li a:hover {color:#2468c5; font-weight:600; background:#f8fbfe;}


/*건강정보-질환정보사전*/
.visualbox{display: inline-block;width: 100%;border-radius: 0 20px 0 0;background: url(/img/05info/sick_info_bg.gif) no-repeat 96% bottom #e0ebf7;}
.visualbox .bg0501{display: inline-block;min-width:325px;padding: 35px 30px;margin: 46px 0 0 27px;box-shadow:-1px -4px 10px rgba(78,132,192,0.21);background: #FFF;}
.visualbox .tit{font-size: 30px;font-family: 'NotoKrB',sans-serif;color: #000;margin-bottom:30px;}
.visualbox .tit span{display: block;font-family: 'NotoKrR',sans-serif;font-size: 18px;color: #535353;margin-bottom: 15px;}
.visualbox .tit::after{content:"";display:inline-block;width:7px;height:7px;border-radius:7px;margin-left:10px;background:#1dabed;}


/*자가검진*/
.s0506 {width:100%; display:inline-block;}
.s0506 .checkbox {width: 100%;display:inline-block;margin-top:10px;border:1px solid #e2e2e2;border-top:none;/* background:url(/img/05info/s0601line.gif) repeat-y left top; */}
.s0506 .checkbox ul li {float:left;width: 291px;min-height:452px;border-top:2px solid #222;}
.s0506 .checkbox ul li.bodyimg {position:relative; width:266px; font-size:0; line-height:0; border-top:2px solid #2468c5; background:url(/img/05info/s0601bg.gif) no-repeat 68px 40px;}
.s0506 .checkbox ul li.bodyimg div {position:absolute;}
.s0506 .checkbox ul li.bodyimg .head {top:40px; left:114px;}
.s0506 .checkbox ul li.bodyimg .neck {top:87px; left:120px;}
.s0506 .checkbox ul li.bodyimg .leg {top:105px; left:68px;}
.s0506 .checkbox ul li.bodyimg .stomach {top:169px; left:104px;}
.s0506 .checkbox ul li.bodyimg .breast {top:105px; left:103px;}
.s0506 .checkbox ul li.bodyimg .genitalia {top:212px; left:104px;}

.s0506 .checkbox ul li.checklist {display:inline-block;border-left:1px solid #e2e2e2;}
.s0506 .checkbox ul li.checklist dl {display:inline-block; width:100%; padding-bottom:10px;}
.s0506 .checkbox ul li.checklist dl dt {width:100%; height:40px; line-height:40px; color:#222; text-align:center; font-weight:600; background:#f6f6f6; margin-bottom:10px; font-size:14px;}
.s0506 .checkbox ul li.checklist dl dd {margin-left:15px; padding:3px 0 3px 7px; background:url(/img/05info/s0601icon.gif) no-repeat left 50%;}
.s0506 .checkbox ul li.checklist dl dd a {color:#666;}
.s0506 .checkbox ul li.checklist dl dd a:hover, .s0506 .checkbox ul li.checklist dl dd a.on {color:#2468c5; font-weight:600;}

.s0506 .checktxt {width:100%; display:inline-block;}
.s0506 .checktxt .box {width:748px; display:inline-block; border:1px solid #e2e2e2; border-top:2px solid #222; margin-top:20px;}
.s0506 .checktxt .box dl dt {width:100%; height:40px; line-height:40px; color:#222; text-align:center; font-weight:600; background:#f6f6f6; font-size:14px;}
.s0506 .checktxt .box dl dd {padding:15px;}




/****************************** 태블릿 ******************************/
@media all and (max-width:1024px){

/*건강정보-질환정보사전*/
.visualbox .tit{margin-bottom:25px;font-size:24px;}
.visualbox .tit span{margin-bottom:7px;font-size:17px;}


/*자가검진*/
.s0506 .checkbox ul li,
.s0506 .checkbox ul li.bodyimg{width:33.24%;}
.s0506 .checktxt .box{width:100%;}

}



/*****************************모바일 ******************************/
@media all and (max-width:767px){

/*건강정보-질환정보사전*/
.visualbox{padding-top:100px;text-align:center;background-position:top 15px center;background-size:300px auto;}
.visualbox .bg0501{margin-left:0;padding:20px;min-width:auto;text-align:left;}
.visualbox .tit{margin-bottom:20px;font-size:20px;}
.visualbox .tit span{font-size:15px;}
.visualbox .txt{font-size:13px;line-height:135%;word-break:keep-all;}
.visualbox .txt br{display:none;}


/* 질환정보, 자가검진 - 검색 */
.s0501.mt40{margin-top:25px;}
.s0501 .search_box .search_area{padding:15px 0;}
.s0501 .search_box .search_area ul{padding:0;}
.s0501 .search_box .search_area ul li select{padding:0 30px 0 10px;height:40px;line-height:40px;font-size:13px;}
.s0501 .search_box .search_area ul li input{padding:0 10px;width:200px;height:38px;line-height:38px;font-size:13px;}
.s0501 .search_box .search_area ul li label{left:10px;font-size:13px;}
.s0501 .search_box .search_area ul li.btn_search a{width:50px;height:40px;line-height:40px;font-size:13px;}

.s0501 .search_box .num_area{padding-top:20px;}
.s0501 .search_box .num_area ul li a{height:28px;line-height:28px;font-size:15px;}
.s0501 .search_box .num_area ul li.all a{width:55px;}

.s0501 .search_list{margin-top:10px;}
.s0501 .search_list ul li{width:50%;font-size:12px;}


/*자가검진*/
.s0506 .checkbox ul li{width:50%;box-sizing:border-box;}
.s0506 .checkbox ul li.bodyimg{width:100%;background-position:center 40px;}
.s0506 .checkbox ul li.bodyimg .head{left:50%;margin-left:-23.5px;}
.s0506 .checkbox ul li.bodyimg .neck{left:50%;margin-left:-17.5px;}
.s0506 .checkbox ul li.bodyimg .leg{left:50%;margin-left:-68.5px;}
.s0506 .checkbox ul li.bodyimg .stomach{left:50%;margin-left:-33.5px;}
.s0506 .checkbox ul li.bodyimg .breast{left:50%;margin-left:-33px;}
.s0506 .checkbox ul li.bodyimg .genitalia{left:50%;margin-left:-33.5px;}
.s0506 .checkbox ul li.checklist dl dt{font-size:13px;}
}

