/* 메인공통 */
h2.main_tit {position: relative; line-height: 30px; padding: 0 0 0 28px; font-family: 'NanumSquare'; font-size: 22px; font-weight: 400; color: #333;}
h2.main_tit:before {position: absolute; top: 50%; transform: translateY(-50%); left: 0; box-sizing: border-box; width: 14px; height: 14px; border: 3px solid #d80e19; background-color: transparent; border-radius: 50%; content: '';}

/* main visual */
.main_visual {z-index: 1;}
.main_visual .slide {position: relative; background: url(../images/main/visual01.jpg) no-repeat center center / cover; vertical-align: top;}
.main_visual .slide2 {position: relative; background: url(../images/main/visual02.jpg) no-repeat center center / cover; vertical-align: top;}
.main_visual .slide3 {position: relative; background: url(../images/main/visual03.jpg) no-repeat center center / cover; vertical-align: top;}
.main_visual .slide .inner {position: relative; height: 460px;}
.main_visual .slide .inner .txt_box {position: absolute; top: 50%; transform: translateY(-50%); left: 0; box-sizing: border-box;}
.main_visual .slide .inner .txt_box strong {display: block; position: relative; margin: 0 0 25px; padding: 0 0 25px; font-family: 'NanumSquare'; font-size: 50px; font-weight: 400; color: #fff;}
.main_visual .slide .inner .txt_box strong:before {display: block; position: absolute; left: 0; bottom: 0; width: 80px; height: 1px; background-color: #d80e19; content: '';}
.main_visual .slide .inner .txt_box p {line-height: 1.6; font-size: 20px; font-weight: 500; color: #fff;}
.main_visual .slide2 .inner {position: relative; height: 460px;}
.main_visual .slide2 .inner .txt_box {position: absolute; top: 50%; transform: translateY(-50%); left: 0; box-sizing: border-box;}
.main_visual .slide2 .inner .txt_box strong {display: block; position: relative; margin: 0 0 25px; padding: 0 0 25px; font-family: 'NanumSquare'; font-size: 50px; font-weight: 400; color: #fff;}
.main_visual .slide2 .inner .txt_box strong:before {display: block; position: absolute; left: 0; bottom: 0; width: 80px; height: 1px; background-color: #d80e19; content: '';}
.main_visual .slide2 .inner .txt_box p {line-height: 1.6; font-size: 20px; font-weight: 500; color: #fff;}
.main_visual .slide3 .inner {position: relative; height: 460px;}
.main_visual .slide3 .inner .txt_box {position: absolute; top: 50%; transform: translateY(-50%); left: 0; box-sizing: border-box;}
.main_visual .slide3 .inner .txt_box strong {display: block; position: relative; margin: 0 0 25px; padding: 0 0 25px; font-family: 'NanumSquare'; font-size: 50px; font-weight: 400; color: #fff;}
.main_visual .slide3 .inner .txt_box strong:before {display: block; position: absolute; left: 0; bottom: 0; width: 80px; height: 1px; background-color: #d80e19; content: '';}
.main_visual .slide3 .inner .txt_box p {line-height: 1.6; font-size: 20px; font-weight: 500; color: #fff;}
.main_visual .slick-arrow {display: none !important;}
.main_visual .slick-dots {box-sizing: border-box; right: 0; bottom: 60px; left: 0; max-width: 1180px; width: 100%; margin: 0 auto; text-align: left;}
.main_visual .slick-dots li {float: left; display: block; width: 8px; height: 8px; margin: 0 0 0 20px;}
.main_visual .slick-dots li:first-child {margin: 0;}
.main_visual .slick-dots li button {width: 100%; height: 100%; background-color: rgba(255,255,255,0.5); border-radius: 50%; vertical-align: top;}
.main_visual .slick-dots li.slick-active button {background-color: rgba(255,255,255,1);}

/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;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}
.hd_pops img {max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject {background:#000;text-align:left}
.hd_pops_footer .hd_pops_close {background:#393939;position:absolute;top:0;right:0}

/* main issue banner */
.main_issue {position: absolute; top: 50px; width: 100%;}
.main_issue .inner {position: relative; height: 360px;}
.main_issue .img_box {display: block; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 280px; height: 360px; z-index: 2;}
.main_issue .img_box img {width: 100%; height: 100%; vertical-align: top;}

.main_contents {padding: 80px 0 140px;}

.main_menu:after {display: block; clear: both; *zoom: 1; content: '';}
.main_menu li {float: left; width: calc((100% - 40px)/3); height: 200px; margin: 0 0 0 20px;}
.main_menu li:first-child {margin: 0;}
.main_menu li a {display: block; overflow: hidden; position: relative; width: 100%; height: 100%; box-shadow: 0 0 0 rgba(0,0,0,0)}
.main_menu li a:before {visibility: visible; opacity: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); content: ''; transition: all 0.3s ease-in-out;}
.main_menu li a img {width: 100%; height: 100%; transition: all 0.3s ease-in-out;}
.main_menu li a strong {display: block; position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; width: 220px; height: 70px; line-height: 70px; 
	font-family: 'NanumSquare'; font-size: 22px; font-weight: 400; color: #fff; text-align: center; background-color: transparent; transition: all 0.3s ease-in-out; border-radius: 0 35px 0 35px;}
.main_menu li a:hover {box-shadow: 11px 0 27px rgba(0,0,0,0.1);}
.main_menu li a:hover:before {visibility: hidden; opacity: 0;}
.main_menu li a:hover img {transform: scale(1.1);}
.main_menu li a:hover strong {background-color: rgba(216,14,25,0.8);}

.main_mid {background: url(../images/main/main_bg.jpg) no-repeat 0 120px / 100% 80%;}

.main_doctor {position: relative; width: 980px; height: 360px; margin: 80px auto 0;}
.main_doctor .img_box {width: 580px; height: 100%;}
.main_doctor .img_box img {max-width: 100%; vertical-align: top;}
.main_doctor .txt_box {position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 480px; height: 300px; background-color: #fff; border-radius: 0 50px 0 50px; box-shadow: 11px 0 27px rgba(0,0,0,0.1);}
.main_doctor .txt_box p {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; padding: 30px 0; margin: 0 auto; font-family: 'NanumSquare'; font-size: 24px; line-height: 44px; color: #333; text-align: center;} 
.main_doctor .txt_box p:before {display: block; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; width: 15px; height: 13px; background: url(../images/main/mark01.png) no-repeat 0 0; content: '';}
.main_doctor .txt_box p:after {display: block; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; width: 15px; height: 13px; background: url(../images/main/mark02.png) no-repeat 0 0; content: '';}

.video_area {margin: 130px 0 0 0;}
.video_area > strong {display: block; font-family: 'NanumSquare'; font-size: 32px; font-weight: 400; color: #fff;}
.video_area > ul {margin: 50px 0 0 0;}
.video_area > ul:after {display: block; clear: both; *zoom: 1; content: '';}
.video_area > ul > li {float: left;}
.video_area > ul > li:nth-child(1) {width: 200px;}
.video_area > ul > li:nth-child(2) {width: calc(100% - 200px);}
.video_area h2.main_tit {color: #fff;}
.video_area .video_b {float: left; width: 680px; height: 380px;}
.video_area .video_b img {max-width: 100%; vertical-align: top;}
.video_area .video_b iframe {max-width: 100%; vertical-align: top;}
.video_area .video_s {float: left; width: 280px; margin: 0 0 0 20px;}
.video_area .video_s li {width: 210px; height: 120px; margin: 10px 0 0 auto; cursor: pointer; transition: all 0.3s ease-in-out;} 
.video_area .video_s li:first-child {margin: 0 0 0 auto;}
.video_area .video_s li img {vertical-align: top;}
.video_area .video_s li iframe {vertical-align: top;}
.video_area .video_s li:hover {margin: 10px 70px 0 auto;}
.video_area .video_s li:first-child:hover {margin: 0 70px 0 auto;}

.board_area {margin: 55px 0 0 0;}
.board_area:after {display: block; clear: both; *zoom: 1; content: '';}
.board_area > li {float: left; box-sizing: border-box; width: calc((100% - 40px)/3); margin: 0 0 0 20px;}
.board_area > li:first-child {margin: 0;}
.board_area > li > ul {position: relative; margin: 15px 0 0 0; box-sizing: border-box; width: 100%; padding: 10px; background-color: #fff; box-shadow: 11px 0 27px rgba(0,0,0,0); transition: all 0.3s ease-in-out;}
.board_area > li > ul:hover {box-shadow: 11px 0 27px rgba(0,0,0,0.1);}
.board_area > li > ul:hover:before {visibility: hidden; opacity: 0;}
.board_area > li > ul:before {visibility: visible; opacity: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; border: 1px solid #ddd; content: '';}
.board_area ul li {border-top: 1px solid #ddd;}
.board_area ul li a {display: block; position: relative;}
.board_area ul li a:after {display: block; clear: both; *zoom: 1; content: '';}
.board_area ul li a img {max-width: 100%; height:270px; vertical-align: top;}
.board_area ul li a strong {float: left; display: block; overflow: hidden; width: calc(100% - 80px); line-height: 40px; font-weight: 400; color: #333; text-overflow: ellipsis; white-space: nowrap; word-break: break-all;}
.board_area ul li a span {float: right; width: 80px; line-height: 40px; text-align: right;}
.board_area .info {font-size: 14px; color: #999;}
.board_area .first {border: 0;}
.board_area .first strong {float: none; width: 100%;}
.board_area .first p {display: block; overflow: hidden; height: 3.4em; line-height: 1.7; font-size: 14px; color: #666; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}
.board_area .first span {float: none; width: 100%;}


.mo_bnn {display: none; margin: 50px 0 0 0;}
.mo_bnn .inner:after {display: block; clear: both; *zoom: 1; content: '';}
.mo_bnn .inner li {position: relative; float: left; width: 50%;}
.mo_bnn .inner li:nth-child(1) {background-color: #dce0e9;} 
.mo_bnn .inner li:nth-child(2) {background-color: #9ac0cb;} 
.mo_bnn .inner li:nth-child(3) {background-color: #274b6d;} 
.mo_bnn .inner li:nth-child(4) {background-color: #1d2d51;} 
.mo_bnn .inner li:nth-child(5) {width: 100%; background-color: #ab0009;}
.mo_bnn .inner li a {display: block; height: 54px; line-height: 54px; color: #fff; text-align: center;}
.mo_bnn .inner li a p {display: inline-block; vertical-align: top;}
.mo_bnn .inner li:nth-child(1) a {color: #333;}
.mo_bnn .inner li:nth-child(5) p {padding: 0 35px 0 0;background: url(../images/main/ic_play.png) no-repeat right center / 24px;}


@media screen and (min-width:1201px) and (max-width: 1450px) {
	.main_visual .slide .inner .txt_box {box-sizing: border-box; width: 55%; padding: 0 30px;}
	.main_visual .slide2 .inner .txt_box {box-sizing: border-box; width: 55%; padding: 0 30px;}
	.main_visual .slide3 .inner .txt_box {box-sizing: border-box; width: 55%; padding: 0 30px;}
	.main_visual .slick-dots {padding: 0 30px;}

	.main_issue .img_box {right: 15%; width: 220px; height: 280px;}

	.main_doctor {width: 100%; max-width: 980px;}

	.video_area {width: 680px; margin: 100px auto 0;}
	.video_area > ul {margin: 30px 0 0 0;}
	.video_area > ul > li {float: none;}
	.video_area > ul > li:nth-child(1) {width: 100%;}
	.video_area > ul > li:nth-child(2) {width: 100%; margin: 30px 0 0 0;} 
	.video_area .video_b {float: none;}
	.video_area .video_s {float: none; width: 100%; padding: 20px 0 0 0; margin: 0;}
	.video_area .video_s:after {display: block; clear: both; *zoom: 1; content: '';}
	.video_area .video_s li {float: left; margin: 30px 0 0 25px;}
	.video_area .video_s li:first-child {margin: 30px 0 0 0;}
	.video_area .video_s li:hover {margin: 0 0 0 25px;}
	.video_area .video_s li:first-child:hover {margin: 0;}
}

/* tablet */
@media screen and (min-width:768px) and (max-width: 1200px) {
	.main_visual .slide .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide .inner .txt_box strong {font-size: 34px;}
	.main_visual .slide .inner .txt_box p {font-size: 16px;}
	.main_visual .slide2 .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide2 .inner .txt_box strong {font-size: 34px;}
	.main_visual .slide2 .inner .txt_box p {font-size: 16px;}
	.main_visual .slide3 .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide3 .inner .txt_box strong {font-size: 34px;}
	.main_visual .slide3 .inner .txt_box p {font-size: 16px;}
	.main_visual .slick-dots {padding: 0 30px;}

	.main_issue .img_box {right: 30px; width: 220px; height: 280px;}

	.main_menu li {height: 140px;}

	.main_contents {padding: 50px 0 70px;}

	.main_doctor {width: 100%; max-width: 980px;}
	.main_doctor .txt_box {width: 380px; height: 240px;}
	.main_doctor .txt_box p {font-size: 20px; line-height: 40px;}

	.video_area {width: 680px; margin: 80px auto 0;}
	.video_area > ul {margin: 30px 0 0 0;}
	.video_area > ul > li {float: none;}
	.video_area > ul > li:nth-child(1) {width: 100%;}
	.video_area > ul > li:nth-child(2) {width: 100%; margin: 30px 0 0 0;} 
	.video_area .video_b {float: none;}
	.video_area .video_s {float: none; width: 100%; padding: 20px 0 0 0; margin: 0;}
	.video_area .video_s:after {display: block; clear: both; *zoom: 1; content: '';}
	.video_area .video_s li {float: left; margin: 30px 0 0 25px;}
	.video_area .video_s li:first-child {margin: 30px 0 0 0;}
	.video_area .video_s li:hover {margin: 0 0 0 25px;}
	.video_area .video_s li:first-child:hover {margin: 0;}

	
	
 }  
  

@media screen and (min-width:481px) and (max-width:767px) {
	.main_visual .slide .inner {height: 300px;}
	.main_visual .slide .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide .inner .txt_box strong {font-size: 24px;}
	.main_visual .slide .inner .txt_box p {font-size: 14px;}
	.main_visual .slide2 .inner {height: 300px;}
	.main_visual .slide2 .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide2 .inner .txt_box strong {font-size: 24px;}
	.main_visual .slide2 .inner .txt_box p {font-size: 14px;}
	.main_visual .slide3 .inner {height: 300px;}
	.main_visual .slide3 .inner .txt_box {width: 60%; padding: 0 30px;}
	.main_visual .slide3 .inner .txt_box strong {font-size: 24px;}
	.main_visual .slide3 .inner .txt_box p {font-size: 14px;}
	.main_visual .slick-dots {bottom: 30px; padding: 0 30px;}

	.main_issue {top: 0;}
	.main_issue .inner {height: 300px;}
	.main_issue .img_box {right: 30px; width: 150px; height: 190px;}

	.main_menu {width: 100%; max-width: 380px; margin: 0 auto;}
	.main_menu li {float: none; width: 100%; margin: 20px 0 0 0;}
	

	.main_contents {padding: 50px 0 70px;}

	.main_mid {background-image: url(../images/main/m_main_bg.jpg);}

	.main_doctor {width: 100%; max-width: 980px; height: auto; margin: 50px auto 0;}
	.main_doctor .img_box {max-width: 580px; width: 100%;}
	.main_doctor .txt_box {position: relative; transform: none; top: auto; width: 380px; height: 200px; margin: -90px auto 0;}
	.main_doctor .txt_box p {font-size: 18px; line-height: 30px;}

	.video_area {max-width: 680px; width: 100%; margin: 50px auto 0;}
	.video_area > ul {margin: 30px 0 0 0;}
	.video_area > ul > li {float: none;}
	.video_area > ul > li:nth-child(1) {width: 100%;}
	.video_area > ul > li:nth-child(2) {width: 100%; margin: 30px 0 0 0;} 
	.video_area .video_b {float: none; width: 100%; height: auto;}
	.video_area .video_s {float: none; width: 100%; padding: 30px 0 0 0; margin: 0;}
	.video_area .video_s:after {display: block; clear: both; *zoom: 1; content: '';}
	.video_area .video_s li {float: left; margin: 0 0 0 25px; width: calc((100% - 20px)/3); height: auto; margin: 0 0 0 10px;}
	.video_area .video_s li:first-child {margin: 0;}
	.video_area .video_s li:hover {margin: -15px 0 0 10px;}
	.video_area .video_s li:first-child:hover {margin: -15px 0 0 0;}
	.video_area .video_s li img {max-width: 100%;}

	.board_area > li {float: none; width: 100%; margin: 30px 0 0 0;}
	
	.board_area .first {padding: 0 0 10px 0;}
	.board_area .first img {width: 50%;}
	.board_area .first div {position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 50%; box-sizing: border-box; padding: 20px 0 0 20px;}

	.mo_bnn {display: block;}
}


/* mobile */
@media screen and (max-width:480px) {
	.main_visual .slide .inner {height: 260px;}
	.main_visual .slide .inner .txt_box {width: 100%; padding: 0 15px;}
	.main_visual .slide .inner .txt_box strong {margin: 0 0 10px; padding: 0 0 10px; font-size: 18px;}
	.main_visual .slide .inner .txt_box strong:before {width: 30px;}
	.main_visual .slide .inner .txt_box p {line-height: 1.3; font-size: 12px; font-weight: 400;}
	.main_visual .slide2 .inner {height: 260px;}
	.main_visual .slide2 .inner .txt_box {width: 100%; padding: 0 15px;}
	.main_visual .slide2 .inner .txt_box strong {margin: 0 0 10px; padding: 0 0 10px; font-size: 18px;}
	.main_visual .slide2 .inner .txt_box strong:before {width: 30px;}
	.main_visual .slide2 .inner .txt_box p {line-height: 1.3; font-size: 12px; font-weight: 400;}
	.main_visual .slide3 .inner {height: 260px;}
	.main_visual .slide3 .inner .txt_box {width: 100%; padding: 0 15px;}
	.main_visual .slide3 .inner .txt_box strong {margin: 0 0 10px; padding: 0 0 10px; font-size: 18px;}
	.main_visual .slide3 .inner .txt_box strong:before {width: 30px;}
	.main_visual .slide3 .inner .txt_box p {line-height: 1.3; font-size: 12px; font-weight: 400;}
	.main_visual .slick-dots {bottom: 15px; padding: 0 15px;}
	.main_visual .slick-dots li {width: 4px; height: 4px; margin: 0 0 0 5px;}

	.main_issue {position: static; top: auto; margin: 15px 0 0 0;}
	.main_issue .inner {height: 100px;}
	.main_issue .img_box {position: static; transform: none; right: auto; width: 100%; height: 100%;}

	.main_menu {width: 100%; max-width: 380px; margin: 0 auto;}
	.main_menu li {float: none; width: 100%; height: 120px; margin: 20px 0 0 0;}
	.main_menu li a strong {width: 140px; height: 50px; line-height: 50px; font-size: 16px;}
	

	.main_contents {padding: 50px 0 70px;}

	.main_mid {background-image: url(../images/main/m_main_bg.jpg); background-position: 0 90px;}

	.main_doctor {width: 100%; max-width: 980px; height: auto; margin: 50px auto 0;}
	.main_doctor .img_box {max-width: 580px; width: 100%;}
	.main_doctor .txt_box {position: relative; transform: none; top: auto; width: 85%; max-width: 380px; height: 130px; margin: -30px auto 0; border-radius: 0 30px 0 30px;}
	.main_doctor .txt_box p {padding: 20px 0; font-size: 13px; line-height: 18px;}
	.main_doctor .txt_box p:before {width: 10px; height: 9px; background-size: 10px 9px;}
	.main_doctor .txt_box p:after {width: 10px; height: 8px; background-size: 10px 8px;}

	h2.main_tit {padding: 0 0 0 18px; font-size: 18px;}
	h2.main_tit:before {width: 10px; height: 10px; border-width: 2px;}

	.video_area {max-width: 680px; width: 100%; margin: 50px auto 0;}
	.video_area > strong {font-size: 20px;}
	.video_area > ul {margin: 10px 0 0 0;}
	.video_area > ul > li {float: none;}
	.video_area > ul > li:nth-child(1) {width: 100%;}
	.video_area > ul > li:nth-child(2) {width: 100%; margin: 10px 0 0 0;} 
	.video_area .video_b {float: none; width: 100%; height: auto;}
	.video_area .video_s {float: none; width: 100%; padding: 30px 0 0 0; margin: 0;}
	.video_area .video_s:after {display: block; clear: both; *zoom: 1; content: '';}
	.video_area .video_s li {float: left; margin: 0 0 0 25px; width: calc((100% - 20px)/3); height: auto; margin: 0 0 0 10px;}
	.video_area .video_s li:first-child {margin: 0;}
	.video_area .video_s li:hover {margin: -15px 0 0 10px;}
	.video_area .video_s li:first-child:hover {margin: -15px 0 0 0;}
	.video_area .video_s li img {max-width: 100%;}

	.board_area {margin: 50px 0 0 0;}
	.board_area > li {float: none; width: 100%; margin: 30px 0 0 0;}
	.board_area > li > ul {margin: 10px 0 0 0;}
	.board_area > li > ul > li {margin: 10px 0 0 0;}
	.board_area ul li a strong {line-height: 36px; font-size: 13px;}
	.board_area ul li a span {line-height: 36px;}
	.board_area .first p {height: 3em; line-height: 1.5; font-size: 12px;}
	.board_area .info {font-size: 12px;}
	
	.board_area .first {padding: 0; margin: 0;}
	.board_area .first img {width: 40%; height: auto;}
	.board_area .first div {position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 60%; box-sizing: border-box; padding: 0 0 0 10px;}
	.board_area .first .tit {margin: 0 0 5px 0; line-height: 1;}
	.board_area .first .info {line-height: 1;}

	.mo_bnn {display: block;}
	
}
















 
