@charset "utf-8";

/* 
 * content CSS Document
 * KOWEB
 */

/* common */
.sub h1{}
.sub h2{}
.sub h3{}
.sub h4{}
.sub h5{}
.sub h6{}

#content.sub{padding:60px 0}
.sub_tit,
.sub_tit2 {font-size: 27px;color: #111; margin-bottom: 30px; font-family: 'NEXON Lv1 Gothic OTF Bold';}

div[class^="area_"] p
section[class^="area_"] p,
article[class^="area_"] p,
div[class^="area_"] li,
article[class^="area_"] li{line-height:1.7; font-weight:300;}

#content .mob_info{padding:5px 0; background:#f1f1f1; font-weight:600; font-size:13px; color:#444;}

.title01{margin-bottom:20px;font-size: 22px; color:#005ba5;font-family: 'NEXON Lv1 Gothic OTF Bold'; display: flex;align-items: center;justify-content: space-between;}
.title01 p{/* float:right; */ font-size:14px; color:#555}
.title02{display: flex;align-items: center;margin-bottom: 12px;font-size: 19px;line-height: 1;color: #111;}
.title02:before{content:''; display:block;width: 4px;height:18px; background:#005ba5; margin-right:10px;}
.title02.v1{margin-top:33px;}
.title03{padding-top:7px; margin-bottom:10px; font-size: 16px; text-decoration: underline;}

.title04{display: flex; margin-bottom: 12px;font-size: 19px;line-height: 1;color: #111;}
.title04:before{content:''; display:block; width:17px; height:17px; background:url(../../images/content/icon_cont02.svg) no-repeat; margin-right:10px;}
.title04.v1{margin-top:33px;}

.box{margin-top:60px;}

.point_color01{color:#2a81e7}
.point_color02{color:#ff5400}

/* table */
#content table.table tbody tr td.left{text-align:left;}
#content table.table thead th{background: #f0f3f7;}
#content table.table th{padding:20px;}
#content table.table td{line-height:1.9; padding:15px; font-size:15px;}
#content table.table th span{color:#2a81e7}
#content table.table{border-top:2px solid #1a3759}
#content table.table tbody tr th:first-child{background:#f6f6f6; font-size:15px; color: #111;}
#content table.table tbody th{border-right:0} 

/* board */
ul.bbsList{border-top-color:#152f53;}
ul.bbsList li .more.active,
ul.bbsList li .more:hover,
ul.bbsList li .more:focus{border-color:#152f53;}
ul.bbsList li .more em,
ul.bbsList li .subject:hover,
ul.bbsList li .subject:focus{color:#152f53;}
ul.bbsList li .notice{background:#152f53;}

.pagination span{color:#152f53; border-color:#152f53;}
.pagination a:not([class^="btn_"]):hover,
.pagination a:not([class^="btn_"]):focus{background:#f9f1f2; border-color:#f9f1f2;}

.faqList dt.on:before{background:#152f53;}

.bbsTitle_cont > i{color:#c6a582; border-bottom-color:#c6a582;}

.inr_pagination > a:hover > em{color: #c6a582;}
.list02 > li{position:relative; line-height:1.7; padding-left:13px; margin-bottom:7px;}
.list02 > li:before{content:""; position:absolute; left:0; top:12px; width:5px; height:1px; margin-right:5px; background:#555;}
.list01 > li{overflow: hidden; position:relative; line-height:1.7; padding-left:13px; margin-bottom:7px; text-align: left; font-size: 15px;}
.list01 > li:before{content:""; position:absolute; left:0; top:10px; width:4px; height:4px; margin-right:5px; background:#777; border-radius:50%;}
.list01 > li:last-child{margin-bottom:0}
.list03{margin-bottom:10px;}
.list03 > li{margin-top:7px; color:#666}

/* page navigation */
.area_navigation{margin-bottom:50px; padding-top:30px; text-align:left;}
.area_navigation ul{display:inline-block; overflow:hidden;}
.area_navigation ul li{position:relative; float:left; line-height:1; padding:0 12px; font-size:15px; color:#fff;}
.area_navigation ul li img{display:inline-block; position:relative; top:1px; height:12px; vertical-align:top;}
.area_navigation ul li i{display:none;}
.area_navigation ul li:after{content:""; position:absolute; top:3px; right:-3px; width:6px; height:8px; background:url(../images/content/icon_navigation02.svg) no-repeat 50% 50%;}
.area_navigation ul li:last-child:after{display:none;}

/* lnb */
.lnb{border-bottom: 1px solid #e5e5e5;}
.lnb .wrap{  text-align:center; }
.lnb ul{display:flex; overflow:hidden;width: 1200px;margin: 0 auto;}
.lnb ul li{position:relative; margin-right:50px;padding:20px 0;}
.lnb ul li a{display:block; font-size:18px;}
.lnb ul li.active:before{content: ""; position:absolute; bottom:0; left:0; width:100%; height:5px; background-color: #cb0500;}
.lnb ul li.active a{color:#cb0500;}

/* snb */
.snb{display:flex; margin-bottom:40px; border-bottom: 2px solid #1a3759;}
.snb li {position:relative; flex: 1; height:50px;text-align:center;box-sizing: border-box;}
.snb li + li {border-left:none; margin-left:2px;}
.snb li a {display:inline-block; height:50px;background:#f9f9f9; font-size:17px; line-height:50px;color:#999;font-weight:500;margin-right:2px;}
.snb li a {margin-right:2px;width:100%;}
.snb li:last-child a {margin-right:0;}
.snb li.active {background-color:#fff;border:2px solid #1a3759;}
.snb li.active:before {content:'';position:absolute;bottom:-4px;left:0;width:100%;height:2px;background:#fff;z-index:1}
.snb li.active a {background:#fff;color:#1a3759; font-weight:bold;}

/* sub visual */
.area_subVisual{position:relative; height:300px; background-size:cover; background-repeat:no-repeat; background-position:50% 50%; text-align:center;}
.area_subVisual > .wrap{position:relative; top:50%; transform:translateY(-50%);}
.area_subVisual > .wrap h2{text-align:left; color:#fff; font-size:35px;font-family: 'NEXON Lv1 Gothic OTF Bold';}
.area_subVisual > .wrap p{margin-top:10px; text-align:left; color:#fff; font-size:16px;}

/* map default */
.area_map .map_style{padding:0; border:none; border-bottom:1px solid #ccc;}
.area_map .map_style .wrap_controllers{display:none;}

/* 이용약관 */
.area_policy{padding-top:0;}
.area_policy h2{padding:30px 0;font-size:40px;color:#222;text-align:center;font-weight: 700;}
.area_policy h3{margin-bottom:20px;font-weight: 700;font-size:17px;color:#222;}
.area_policy ul li,
.area_policy p{line-height:1.6; font-weight:300; font-size:15px; color:#666;}
.area_policy p{line-height:1.6; font-size:14px;}
.area_policy ul li{margin-bottom:8px;}
.area_policy ul li:last-child{margin:0;}
.area_policy ul li ul{margin-top:5px; margin-bottom:20px;}
.area_policy ul li ul li{margin-bottom:2px; font-size:15px;}
.area_policy .inr_policy{padding:40px 0; border-bottom:1px solid #ddd;}
.area_policy .inr_policy:last-child{border:none;}

/* 검체채취방법 */
.icon_text{display:flex; background:#f0f3f7; padding:40px;}
.icon_text .img{width:120px; text-align:center;}
.icon_text .img img{height:60px;}
.icon_text .text{width:calc(100% - 120px)}
.icon_text .text p{margin-bottom:10px; font-size:18px; color:#111; font-weight:bold;}

/* 인사말 */
.area_company{position:relative; padding:100px 0}
.area_company:before{z-index:-1; content:''; position:absolute; left:0; top:0; display:block; width:0px; height:100%; background:#f6f6f6;  transition:1s}
.area_company .img{position:absolute; right:0; top:100px; width:43%; height:610px;}

.area_company .text h3{font-size:30px; color:#111; font-family: 'NEXON Lv1 Gothic OTF Bold';}
.area_company .text p{line-height:1.8; margin-top:40px;}
.area_company .text span{display:flex; align-items: center; margin-top:40px;}
.area_company .text span b{padding-right:20px; color:#111;}
.on_img .area_company:before{width:80%;}

/* 인증서 */
.area_certificate .list{display:flex;flex-wrap: wrap;justify-content: flex-start;gap: 5%;} 
.area_certificate .list li{width: 30%; margin-top:40px;}
.area_certificate .list li .img{margin-right:30px;}
.area_certificate .list li img{width: 100%;}
.area_certificate .list li .text{width:calc(100% - 215px)}
.area_certificate .list li .text p{font-size: 16px; margin-top:15px; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; transition:0.5s}
.area_certificate .list li .text span{display:inline-block; line-height: 1; margin-top:15px; padding:15px 50px 15px 15px; border:1px solid #ddd; font-size:14px; background:url(../../images/content/icon_down.svg) no-repeat center right 15px; background-size:15px; transition:0.5s}
.area_certificate .list li a{display:flex;}
.area_certificate .list li a .img{position:relative; width: 215px; box-shadow: 12px 14px 20px rgb(0 0 0 / 0.05); }
.area_certificate .list li a:hover .text p{color:#005ba5;}
.area_certificate .list li a:hover .text span{border:1px solid #005ba5; color:#fff; background:#005ba5 url(../../images/content/icon_down_w.svg) no-repeat center right 15px; background-size:15px; transition:0.5s}

/* 정도관리 */
.area_quality .top{display:flex; align-items: center; border: 1px solid #ddd;}
.area_quality .top > div{width:50%;}
.area_quality .top .img img{width:100%;}
.area_quality .top .text{box-sizing:border-box; padding:0 40px;}
.area_quality .top .text span{color:#005ba5; font-size:14px; font-weight:bold;}
.area_quality .top .text h3{margin:0 0 10px 0; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; font-size:25px;}
.area_quality .top .text p{font-size:16px;}

/* 검사업무절차 */
.area_process .top_text{margin-bottom:40px;}
.area_process .top_text ul li{display:flex; align-items: center; margin-bottom:7px;}
.area_process .top_text ul li:before{content:''; display:block; width:15px; height:15px; background:url(../../images/content/icon_cont02.svg) no-repeat; margin-right:10px;}

.area_process .list li .img i{display:block;width: 40px;height: 75px;line-height: 75px;}
.area_process .list li .img i img{vertical-align:middle;}
.area_process .list{display:flex; flex-wrap: wrap; gap: 4%;}
.area_process .list > li{box-sizing:border-box; width:48%; padding:40px; margin-bottom:4%; background:#f5f5f5; border-radius:15px;}
.area_process .list > li .pro_cont{display:flex; }
.area_process .list > li .pro_cont .img{width:18%;}
.area_process .list > li .pro_cont .text{width:82%;}
.area_process .list > li .pro_cont .text span{color:#005ba5; font-size:14px; font-weight:bold;}
.area_process .list > li .pro_cont .text h3{margin:7px 0 10px 0; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; font-size:18px;}

/* 검사의뢰서 */
.request_list{display:flex; flex-wrap: wrap; justify-content: space-between;}
.request_list li{width:23%; margin-bottom:40px;}
.request_list li img{width:100%; border:1px solid #ddd;box-sizing: border-box;}
.request_list li a{display:block;line-height: 1; padding:15px 50px 15px 15px; background: #444 url(../../images/content/icon_down_w.svg) no-repeat center right 15px; color:#fff; background-size:15px; transition:0.5s}

/* 검체용기안내 */
.list_partner_wrap{overflow:hidden; display:flex; flex-wrap: wrap; gap:2%}
.list_partner_wrap > li{box-sizing: border-box; float:left; margin-bottom:20px; width:32%; border:1px solid #ddd; background:#f1f1f1; transition:0.5s}
.list_partner_wrap > li:hover{border:1px solid #005ba5; transition:0.5s}
.list_partner_wrap > li a{width:100%;height:100%;text-align:center;}
.list_partner_wrap > li a img{width: 100%;}
.list_partner_wrap > li a p{background:#f1f1f1; padding:10px; transition:0.5s}
.list_partner_wrap > li a:hover p{background:#005ba5; color:#fff; transition:0.5s}
.list_partner_wrap > li:hover{background:#005ba5}
.img_list li{float:left; width:48%; margin-right:1%;}
.img_list li img{width:100%;}

.active .info_box{display:block;}
.info_box{display: none;}
.info_box .inr{display:flex;}
.info_box .inr .img{margin-right:30px;}
.info_box .inr .img img{max-width:300px;/* border:1px solid #ddd; */}
.info_box .inr .text{width:calc(100% - 330px)}
.info_box .inr .text p{font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; font-size:18px;}
 #content .info_box .inr .text table.table th{padding:15px;}
.popLayer{position:fixed; opacity:0; top:0px; left:0px; z-index:-99; width:100%; height:100%; background:rgba(0,0,0,0.5); transition:all 0.3s ease-out 0s;}
.popLayer > div{position:absolute;top:50%;left:50%;min-height:420px; max-width:960px; width:960px; margin:0 auto;background:#fff;box-shadow:26px 18px 49px rgba(0,0,0,0.2);transform:translate(-50%, -50%);/* border-radius:25px; */min-width:410px;height: auto;}
.popLayer.active{opacity:1; z-index:9999;}
.popLayer .close{display:block; line-height:50px; position:absolute;top:0;right:0;width:50px;height:50px; background:#333;color:#fff;text-align:center; font-size: 24px;}

#layerPopup{overflow: hidden;padding: 40px 40px 40px;}
#layerPopup .content > ul > li{position:relative; margin-bottom:7px;}
#layerPopup .content > ul > li:before{content:""; display:inline-block; width:3px; height:3px; margin-right:9px; background:#000; vertical-align:middle;}
#layerPopup .content li:hover a:after{opacity:0.8;}
#layerPopup .content li a:hover{opacity:0.6;}

/* vision */
.area_vision .vision01{text-align:center;background: #f6f6f6;padding: 70px 0;}
.area_vision .vision01 h3{font-size:40px;line-height:1.4;margin-bottom: 13px; font-weight:700;letter-spacing:-1px;color:#005ba5;}
.area_vision .vision01 .desc1{font-size:28px;margin-bottom: 14px;font-weight:500;color:#000;font-family: 'NEXON Lv1 Gothic OTF Bold';}
.area_vision .vision01 .desc2{font-size:16px; font-weight:500;}
.area_vision .vision02{margin-top:60px;}
.area_vision .vision02 ul{display:flex; justify-content: space-between;}
.area_vision .vision02 ul li{position:relative; box-sizing:border-box;width:23%; text-align: center;}
.area_vision .vision02 ul li:before{content:''; position:absolute; left:0; top:0; display:block; width:1px; height:100%; background:#ddd;}
.area_vision .vision02 ul li:first-child:before{display:none;}
.area_vision .vision02 ul li .img{display:flex; align-items: center; justify-content: center; width: 150px; height:150px; background:#1a3759; text-align:center;border-radius: 50%;margin: 0 auto;line-height: 150px;}
.area_vision .vision02 ul li:nth-child(2n) .img{background:#005ba5;}
.area_vision .vision02 ul li .img img{height:60px;}
.area_vision .vision02 ul li p{margin-top:20px; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111;}

.area_vision .vision03{margin-top:100px; padding:120px 0; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; background-position: 55% 50%; text-align:center;}
.area_vision .vision03 h3{font-size:28px;font-weight:500;color:#fff;font-family: 'NEXON Lv1 Gothic OTF Bold';}

.area_vision .vision04 > ul{margin-top:100px;}
.area_vision .vision04 > ul > li{display:flex; align-items: center; margin-bottom:40px;}
.area_vision .vision04 ul li .img{width:430px; height:265px; margin-right:50px;}
.area_vision .vision04 ul li .text h4{margin-bottom:20px; font-size:21px;font-weight:500;color:#111;font-family: 'NEXON Lv1 Gothic OTF Bold';}

/* 진단검사의학과 */
.area_examine ul{display:flex; flex-wrap: wrap; gap:3.3%;}
.area_examine ul li{width:31%; margin-bottom:30px;}
.area_examine ul li .img{overflow:hidden;position:relative;width:100%;padding-top: 66%; border-radius:15px; text-align:center;transition:opacity 0.5s ease-out 0s;}
.area_examine ul li .img img{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); transition:all 0.5s ease-out 0s;}
.area_examine ul li .img:before{opacity:0; z-index: 1; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:#005ba5; transition:0.5s}
.area_examine ul li:hover .img:before{opacity:0.5;}

.area_examine ul li a p{position:relative; margin-top:15px; font-size:18px; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111;}
.area_examine ul li a p i {position:absolute; right:0; top:5px}
.area_examine ul li a p i img{height:10px;}


.area_examine_inr .top_img{display:flex; }
.area_examine_inr .top_img .img{width:40%; height:330px; background-size:cover; background-position:50%;}
.area_examine_inr .top_img .img img{width:100%;}
.area_examine_inr .top_img .text{display:flex; box-sizing:border-box; width:60%; height:330px; padding:0 60px; background:#f6f6f6;align-items: flex-start;flex-direction: column;justify-content: center;}
.area_examine_inr .top_img .text span{color:#005ba5; font-size:14px; font-weight:bold;}
.area_examine_inr .top_img .text h3{margin:0 0 10px 0; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; font-size:25px;}
.area_examine_inr .top_img .text p{font-size:16px;}
.area_examine_inr .txt1{margin-bottom:15px; font-family: 'NEXON Lv1 Gothic OTF Bold'; color:#111; font-size:17px;}


@media screen and (max-width:1919px){
 
}

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

}

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

}

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

}

@media screen and (max-width:1279px){
	.area_navigation{position:relative; float:right; top:0; right:0; margin-top:30px; margin-right:14px;}
	.lnb ul{width:94%}

	.request_list li{width:24%;}
}

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

}

@media screen and (max-width:959px){
	.area_process .list > li .pro_cont .img{width:55px;}
	.area_process .list li .img i img{vertical-align: top;}
	.area_process .list > li .pro_cont .text{width:calc(100% - 55px);}

	.popLayer > div{top:0; left:0; width:100%; height:100%; min-width: auto; transform:translate(0, 0)}

	.snb li a{font-size:14px;}
}


@media all and (max-width:767px){
	#content.sub{padding:40px 0}

	.area_subVisual{height:250px;}
	.area_subVisual > .wrap h2{font-size:22px;}

	.sub_tit, .sub_tit2{margin-bottom:15px; font-size:20px;}

	.snb li a{font-size:15px;}

	.title01{margin-bottom:10px; font-size:20px;}
	.title02{font-size:18px;}

	.lnb > div{margin:0; padding:0; overflow-x:scroll; overflow-y:hidden;}
	.lnb ul li{white-space:nowrap; float:none; margin-right:30px;}
	.lnb ul li a{font-size:15px;}

	.snb{overflow-x:auto;}
	.snb li.active{background:#1a3759; }
	.snb li.active a{color:#fff; background:none;}
	.snb li a{line-height:inherit;}
	.snb li a{ display: flex; justify-content: center; align-items: center;}	
	.snb li{background: #f9f9f9; margin-right:5px; padding:0 5px;}

	.area_examine ul{gap:2%}
	.area_examine ul li{width:49%}
	.area_examine ul li a p{font-size:14px;}
	
	.area_examine_inr .top_img{flex-direction: column;}
	.area_examine_inr .top_img .img{width:100%;}
	.area_examine_inr .top_img .text{width:100%; height:auto; padding:30px;}
	.area_examine_inr .top_img .text h3{font-size:18px;}

	.area_examine_inr .txt1{font-size:15px}
	.area_examine_inr .txt1 br{display:none;}

	.area_process .list{gap:2%}
	.area_process .list > li{width:49%; padding:25px; margin-bottom:2%;}
	.area_process .list > li .pro_cont .text h3{font-size:16px;}

	.list01 > li{font-size:14px}
	
	.list_partner_wrap{}
	.list_partner_wrap > li{width:49%;}

	.area_policy{margin-top:20px !important;}
	.area_policy h2{padding:0px 0; font-weight:600; font-size:20px;}
	.area_policy h3{margin-bottom:10px; font-weight:600; font-size:14px;}
	.area_policy ul li{margin-bottom:5px;}
	.area_policy ul li ul{padding-left:10px;}
	.area_policy ul li ul li{font-size:13px;}
	.area_policy ul li,
	.area_policy p{line-height:1.7; font-size:13px;}
	.area_policy .inr_policy{padding:25px 0;}

	.request_list li{width:49%; margin-bottom:2%;}
	
	.info_box .inr{flex-direction: column;}
	.info_box .inr .img{margin-right:0; text-align:center;}
	.info_box .inr .text{width:100%; margin-top:20px;}
	.info_box .inr .text p{font-size:16px}
	
	#content .info_box .inr .text table.table th,
	#content table.table td{padding:10px; font-size:13px;}

	#content table.table th{padding:10px;}


}

@media screen and (max-width:630px){
	.area_process .list > li .pro_cont .img{width:100%; text-align:center;}
	.area_process .list li .img i{margin:0 auto;}
	.area_process .list > li .pro_cont{flex-direction: column;}
	.area_process .list > li .pro_cont .text{width:100%;}
	
	.info_box .inr .img img{width:100%}
	
	#layerPopup{padding:40px 20px 40px}

	.icon_text{flex-direction: column; padding:20px;}
	.icon_text .text{width:100%;}
	.icon_text .text p{font-size:17px;}
	.icon_text .img{width:100%; margin-bottom:15px;}
	.icon_text .img img{height:45px;}
}


@media screen and (max-width:400px){
	.area_process .list > li{width:100%;}
	.list_partner_wrap > li{width:100%;}

}

@media all and (max-width:360px){
	body,
	p,
	li,
	a{font-size:13px;}
}

@media all and (max-width:359px){

}