@charset "utf-8";

#container {background:none; letter-spacing:-0.05em; }

.mtop {position:relative; height:545px;}
.mtop:before{z-index:-1;background:#000 url(/health/img/main/mbg.jpg) no-repeat 0 -5px; width:2000px; height:100%; top:0; position:absolute;left:50%; display:block; content:"";margin-left: -1000px; display:block; content:""}
.mtop:after {content:''; background:url(/health/img/main/person.png) no-repeat 0 0; display:block; width:746px; height:425px; position:absolute; bottom:-122px; right:-80px; z-index:-1;}

.main_copy {width:40%; margin:0 auto; text-align:center; padding:70px 0px;}
.main_copy .mtit {margin-bottom:20px; font-size:16px;}
.main_copy p {color:#262d35;}

.mtop_icon ul li {float:left; width:15%;}
.mtop_icon ul li a {display:block; text-align:center; font-size:18px; font-weight:400; color:#000; transition:all .3s;}
.mtop_icon ul li a:before {content:''; display:block; width:100px; height:100px; background-image:url(/health/img/main/icon_01.png); background-repeat:no-repeat; background-color:#7c93b1; border-radius:50%; margin:0 auto; margin-bottom:10px; transition:all .3s;}
.mtop_icon ul li.list01 {position:absolute; top:60px; left:0;}
.mtop_icon ul li.list02 {position:absolute; top:60px; left:15%;}
.mtop_icon ul li.list03 {position:absolute; top:60px; left:70%;}
.mtop_icon ul li.list04 {position:absolute; top:60px; left:85%;}

.mtop_icon ul li.list01 a:before {background-position:0 0; background-color: #ebebeb;}
.mtop_icon ul li.list02 a:before {background-position:-100px 0; background-color:#e1aa46;}
.mtop_icon ul li.list03 a:before {background-position:-200px 0; background-color:#15cae3;}
.mtop_icon ul li.list04 a:before {background-position:-300px 0; background-color:#35c98b;}

.mtop_icon ul li a:hover:before {background-color:#4384db;}

#popup {position:absolute; bottom:0; left:0;  width:50%;}
#popup ul {position:relative;}
#popup ul li img {width:100%;}
#popup ul li a{display:block;}
#popup ul li a:focus{border:5px dotted #920909; padding:1px;}

#popup div.control {position:absolute; top:20px; right:15px;}
#popup div.control button {background:rgba(255,255,255,0.7); width:40px; height:40px; float:left; margin-left:1px; text-indent:-99999px;}
#popup div.control button.prev-slide {background:rgba(255,255,255,0.7) url(/common/img/bul.png) no-repeat -120px 0;}
#popup div.control button.next-slide {background:rgba(255,255,255,0.7) url(/common/img/bul.png) no-repeat -120px -40px;}
#popup div.control button.stop-slide {background:rgba(255,255,255,0.7) url(/common/img/bul.png) no-repeat -120px -120px;}
#popup div.control button.start-slide {background:rgba(255,255,255,0.7) url(/common/img/bul.png) no-repeat -120px -80px;}

.midlink {position:relative;  text-align:center; padding:20px 0px;  box-sizing:border-box; position:relative; clear:both; margin-top:40px;}
.midlink ul {width:100%; box-sizing:border-box; }
.midlink li {display:block; width:100%; text-align:center; position:relative; margin-left:-1px;}
.midlink li a { display:block; height:150px; background:rgba(11,51,96,0.8); box-sizing:border-box; padding-top:20px; color:#fff; font-size:16px; font-weight:100; line-height:1.2em; letter-spacing:0;}
.midlink li a:before {content:''; width:70px; height:70px; display:block; transition:all .2s; margin:0 auto;}

.midlink li.c01 a:before {background:url(/health/img/main/icon_02.png) no-repeat 0px 0;}
.midlink li.c02 a:before {background:url(/health/img/main/icon_02.png) no-repeat -70px 0;}
.midlink li.c03 a:before {background:url(/health/img/main/icon_02.png) no-repeat -140px 0;}
.midlink li.c04 a:before {background:url(/health/img/main/icon_02.png) no-repeat -210px 0;}
.midlink li.c05 a:before {background:url(/health/img/main/icon_02.png) no-repeat -280px 0;}
.midlink li.c06 a:before {background:url(/health/img/main/icon_02.png) no-repeat -350px 0;}
.midlink li.c07 a:before {background:url(/health/img/main/icon_02.png) no-repeat -420px 0;}
.midlink li.c08 a:before {background:url(/health/img/main/icon_02.png) no-repeat -490px 0;}
.midlink li a:hover { background:rgba(0,130,217,1);}

.midlink button {text-indent:-999999px; width:40px; height:40px; z-index:3000;}
.midlink button.slick-prev { position:absolute; background:rgba(0,0,0,0.7) url(/common/img/bul.png) no-repeat -160px -1px; position:absolute; left:-10px; top:54px;}
.midlink button.slick-next { position:absolute; background:rgba(0,0,0,0.7) url(/common/img/bul.png) no-repeat -160px -41px; position:absolute;  right:-10px; top:54px;}


.newsbox {position:relative;  }
#board { margin-bottom:10px; position:relative; min-height:295px; background:#f8f8f8;  box-sizing:border-box; width:48%; float:left; box-sizing:border-box; border:1px solid #dedede;}
#board ul {position:relative;}

#board ul > li > div > a.title {z-index:1; width:28%; line-height:60px; height:60px; text-align:center; font-size:20px; color:#333;  display:block; position:absolute;  box-sizing:border-box;  background:#3c5c80; color:#fff; font-weight:600; }
#board ul > li:nth-child(1) > div > a.title {top:0; left:0;}
#board ul > li:nth-child(2) > div > a.title {top:0; left:30%;}
#board ul > li:nth-child(3) > div > a.title {top:0; left:60%;}
#board ul > li.on > div > a.title {color:#333; background:#f8f8f8; }
#board ul > li:not(.on) div.mnews, #board ul > li:not(.on) a.more{display:none;}
#board ul > li.on div.nolist { padding:100px 0px 10px 0px; text-align:center; width:100%;}

.mnews {position:relative;}
.mnews ul {padding:70px 40px 0px 40px;}
.mnews ul li {width:100%; box-sizing:border-box; clear:both; margin-bottom:10px; position:relative; padding-left:8px;}
.mnews ul li:before {content:''; display:block; width:3px; height:3px; background:#333; position:absolute; top:10px; left:0; border-radius:50%;}
.mnews ul li:after {clear:both; content:''; display:block;}
.mnews ul li a {display:block;}
.mnews ul li a p{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display:inline-block; }
.mnews ul li a p.title {width:70%; float:left;}
.mnews ul li a p.detail {display:none;}
.mnews ul li a p.date {float:right; width:30%; text-align:right; color:#666; font-size:13px;}
.mnews ul li a:hover {color:#047ed6;}
.mnews ul li:first-child { padding-left:0px; border-bottom:1px dashed #dedede; padding-bottom:7px; margin-bottom:15px; }
.mnews ul li:first-child:before {display:none;}
.mnews ul li:first-child a p.title {width:80%; float:right; color:#000; font-size:17px; margin-bottom:5px; margin-top:15px;}
.mnews ul li:first-child a p.detail {display:block; width:80%; float:right;  white-space:nowrap; overflow: hidden; text-overflow: ellipsis; display:block; word-break:break-all; font-size:15px; line-height:21px; color:#666;}
.mnews ul li:first-child a p.date {float:none; width:15%; text-align:center; color:#666; font-size:13px; background:#fff; position:relative; padding:10px 0 40px 0; box-sizing:border-box; border:1px solid #dedede;}
.mnews ul li:first-child a p.date span {font-size:30px; position:absolute; top:35px; left:0; display:block; text-align:center; width:100%;}
.mnews ul li:first-child a:hover p.title {color:#047ed6;}
.mnews ul li:first-child a:hover p.date {background:#333; color:#fff;}

#board a.more { position:absolute; top:0; right:0; width:10%; height:50px; text-indent:-99999px; background:#49698e; }
#board a.more:after {position:absolute; top:0; left:0; content:'+';  display:block; color:rgba(255,255,255,0.5); width:100%; height:50px; padding-top:13px; text-indent:0px; font-size:34px; font-weight:100; text-align:center; box-sizing:border-box; }
#board a.more:hover {background:#3c5c80;}

.sitelinkbox {float:right; width:48%;}
#quicklink { position:relative; min-height:295px; background:#fff;  box-sizing:border-box; width:60%; float:left; box-sizing:border-box; border:1px solid #dedede;}
#quicklink ul {position:relative;}
#quicklink ul > li > div > a.title {z-index:1; width:50%; line-height:68px; height:68px; text-align:center; font-size:18px; color:#333;  display:block; position:absolute;  box-sizing:border-box;  background:#ebedef; border-bottom:1px solid rgba(0,0,0,0.2);  font-weight:600;}
#quicklink ul > li:nth-child(1) > div > a.title {top:0; left:0; border-right:1px solid rgba(0,0,0,0.2);}
#quicklink ul > li:nth-child(2) > div > a.title {top:0; left:50%;}
#quicklink ul > li.on > div > a.title {color:#333; background:#fff; border-bottom:0; }
#quicklink ul > li:not(.on) div.inner, #board ul > li:not(.on) a.more{display:none;}
#quicklink ul > li.on div.nolist { padding:100px 0px 10px 0px; text-align:center; width:100%;}

#quicklink .inner {position:relative;}
#quicklink .inner ul {padding:100px 20px 0px 20px;}
#quicklink .inner ul li {width:50%; box-sizing:border-box; margin-bottom:10px; position:relative; float:left; box-sizing:border-box;}
#quicklink .inner ul li a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display:inline-block; position:relative; font-size:14px; letter-spacing:-0.05em;}
#quicklink .inner ul li a:hover:before {border-bottom:1px solid #0082d9; content:''; display:inline-block; height:1px; width:100%; position:absolute; bottom:0; left:0;}
#quicklink .inner ul li a:hover {color:#0082d9;}


.quicklink02 { margin-bottom:10px; position:relative; min-height:295px; background:#f8f8f8;  box-sizing:border-box; width:40%; float:right; box-sizing:border-box; border:1px solid #dedede; border-left:0; padding-top:30px;}
.quicklink02 h3 {text-align:center; font-size:20px; margin-bottom:35px; color:#000;font-weight:600;}
.quicklink02 ul {width:100%; box-sizing:border-box; }
.quicklink02 li {display:block; width:100%; text-align:center; position:relative; margin-left:-1px;}
.quicklink02 li a { display:block; box-sizing:border-box; color:#333;}
.quicklink02 li a:before {content:''; width:135px; height:135px; display:block; margin:0 auto; border-radius:50%; background:#ebeff2; transition:all .3s; margin-bottom:10px;}
.quicklink02 li a:focus{border:1px solid #000}
.quicklink02 li.c01 a:before {background:#ebeff2 url(/health/img/main/icon_03.png) no-repeat 0px 0;}
.quicklink02 li.c02 a:before {background:#ebeff2 url(/health/img/main/icon_03.png) no-repeat -135px 0;}
.quicklink02 li.c03 a:before {background:#ebeff2 url(/health/img/main/icon_03.png) no-repeat -270px 0;}
.quicklink02 li.c04 a:before {background:#ebeff2 url(/health/img/main/icon_03.png) no-repeat -405px 0;}
.quicklink02 li.c05 a:before {background:#ebeff2 url(/health/img/main/icon_03.png) no-repeat -540px 0;}
.quicklink02 li a:hover:before { background-color:rgba(0,130,217,0.7);}

.quicklink02 button {text-indent:-999999px; width:40px; height:40px; z-index:3000;}
.quicklink02 button.slick-prev { position:absolute; background:url(/common/img/bul.png) no-repeat -121px -1px; position:absolute; top:50px; left:10px; }
.quicklink02 button.slick-next { position:absolute; background:url(/common/img/bul.png) no-repeat -118px -41px; position:absolute;  top:50px; right:10px; }




.finfo {position:relative; padding:30px 0;}
.finfo dl { width:20%; background:#f2f2f2; float:left; box-sizing:border-box; padding:30px 1% 10px 1%; position:relative;}
.finfo dl dt {font-size:17px; padding-top:87px; margin-bottom:15px; color:#424242; font-weight:600;}
.finfo dl dd {line-height:22px; color:#333; font-size:14px;}
.finfo dl dd p.time {font-size:17px;  display:block; margin-bottom:5px; }
.finfo dl dd p.time span {color:#0096ff;}
.finfo dl dd p.time:after {content:''; width:128px; background:#dedede; height:3px; display:block; margin-top:5px;}
.finfo dl dd p.call {font-weight:600; color:#3ea5e4; font-size:19px; margin-top:5px;}
.finfo dl.f01 { background:url(/health/img/main/infobg_01.png) no-repeat 0% 10px;}
.finfo dl.f02 { background:url(/health/img/main/infobg_02.png) no-repeat 0 10px;}
.finfo dl.f03 { background:url(/health/img/main/infobg_03.png) no-repeat 0 10px;}
.finfo dl.f04 {margin-right:0; background:url(/health/img/main/infobg_04.png) no-repeat 0 10px;}
.finfo dl.f05 {margin-right:0; background:url(/health/img/main/infobg_05.png) no-repeat 0 13px;}
.finfo dl.f05 dt {letter-spacing: -1px;}

/*·¹À̾îÆ˾÷*/
#hd_pop {z-index:99999999999999999999999999;position:relative;margin:0 auto; width:1200px;height:0; }
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden;}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff; top:-72px; right: 0;}
.hd_pops_con p{margin: 0; padding: 0;}
.hd_pops_con p img {width: 600px; height: auto;}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right;}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}

#hd_pop .vote {left: 492px;}
#hd_pop .vote_pop .vote_top {font-family: 'yg-jalnan'; font-size:20px;}
#hd_pop .vote_pop .vote_top strong {font-size:28px; color:#3399ff; display:block; margin-top:10px; line-height:36px;}

@media all and (max-width:800px) {
	.hd_pops_con p img, .vote_pop {width: 492px; height: auto;}
	#hd_pop .vote {left: 0;}
}

@media all and (max-width:500px) {
	.hd_pops_con p img, .vote_pop {width: 400px;}
}

@media all and (max-width:400px) {
	.hd_pops_con p img, .vote_pop {width: 350px;}
}

@media all and (max-width:350px) {
	.hd_pops_con p img, .vote_pop {width: 320px;}
	.vote_pop {padding: 20px;}
	.vote_pop .vote_box {padding: 15px 10px;}
	.vote_pop .vote_box fieldset .head {font-size: 15px;}
}
/*·¹À̾îÆ˾÷³¡*/

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

}


@media only screen and (max-width:1024px) {
.main_copy {width:35%; margin:0 auto; text-align:center; padding:70px 0px;}
.midlink { padding:20px 0px 70px;}
.midlink {position:relative;  text-align:center; padding:20px 0px;  box-sizing:border-box; position:relative; clear:both; margin-top:0px;}



.finfo dl { width:50%; height:180px; border-bottom:1px solid #dedede;}
.finfo dl.f02:after, .finfo dl.f04:after {content:''; display:block; width:1px; height:180px; position:absolute; top:0; left:0; background:#dedede;}

.finfo dl.f01 { background:url(/health/img/main/infobg_01.png) no-repeat 0% 10px;}
.finfo dl.f02 { background:url(/health/img/main/infobg_02.png) no-repeat 0 10px; }
.finfo dl.f03 { background:url(/health/img/main/infobg_03.png) no-repeat 0 10px; border-bottom:0;}
.finfo dl.f04 {margin-right:0; background:url(/health/img/main/infobg_04.png) no-repeat 0 10px;  border-bottom:0;}
.finfo dl dt {padding-top: 0; padding-left: 87px;}
.finfo dl dd {padding-left: 87px;}
.finfo dl.f03,.finfo dl.f04 {border-bottom:1px solid #dedede;}
.finfo dl.f05 {border-right:1px solid #dedede; border-bottom: 0;}
}

@media only screen and (max-width:910px) {
.middlebox .mbox { width:100%; margin-bottom:10px;}
.middlebox .mbox ul li {float:left; width:25%;}
.middlebox {margin-bottom:0px;}

#board { width:100%; float:none;}
.sitelinkbox {float:none; width:100%; margin-top:20px;}

}

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

.main_copy {width:60%; padding:50px 0px 30px 0px;}
.mtop_icon {margin-bottom:30px;}
.mtop_icon ul li {float:left; width:25%;}
.mtop_icon ul li a {font-size:16px;}
.mtop_icon ul li.list01 {position:relative; top:0px; left:0;}
.mtop_icon ul li.list02 {position:relative; top:0px; left:0;}
.mtop_icon ul li.list03 {position:relative; top:0px; left:0;}
.mtop_icon ul li.list04 {position:relative; top:0px; left:0;}

.mtop {position:relative; height:auto;}
.mtop:before{z-index:-1;background:url(/health/img/main/mbg.jpg) no-repeat 0 -5px; width:2000px; height:320px; top:0; position:absolute;left:50%; display:block; content:"";margin-left: -1000px; display:block; content:""}
.mtop:after {display:none;}

.main_copy .mtit {margin-bottom:20px; width:280px;}
.main_copy p {display:none;}
#popup {position:relative; width:100%; margin-top:50px;}


#quicklink { width:100%; float:none;}
.quicklink02 { width:100%; float:right;  border-left:1px solid #dedede; margin-top:20px;}



}


@media only screen and (max-width:520px) {
.mtop:before{height:450px;}
.mtop_icon ul li {float:left; width:50%; margin-bottom:10px;}

.finfo {padding:0;}
.finfo dl { width:100%; height:auto; float:none; border-bottom:1px solid #dedede;padding-bottom:20px;}
.finfo dl dt {margin-bottom:5px; padding-left:0;}
.finfo dl dd {padding-left:0;}
.finfo dl.f03 {border-bottom:1px solid #dedede;}
.finfo dl.f05 {border-bottom:0; border-right: 0;}
.finfo dl.f02:after, .finfo dl.f04:after {display:none;}

.finfo dl.f01, .finfo dl.f02, .finfo dl.f03, .finfo dl.f04, .finfo dl.f05{background-position:right 50%;}
}

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

}


/***»ó´Ügnb***/
.topgnb {display: none;}

@media only screen and (max-width:1024px) {
	.sitelink1 {display: none;}
	.topgnb {display: block;}
	.subtop_gnb .slick-list {width: 86%; margin: 0 auto;}
	.subtop_gnb button {position: absolute; display: inline-block; vertical-align: top; width: 7%; height: 39px;  text-indent:-99999px;}
	.subtop_gnb button.slick-prev {left: 0; top: 0; background: #fff url(/common/img/gnb_prev.png) no-repeat center;}
	.subtop_gnb button.slick-next {right: 0; top: 0; background: #fff url(/common/img/gnb_next.png) no-repeat center; border-left: 1px solid #c1c8cc;}
}