@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 

body.bg {background:#eee;}
#wrapper {background:#fff;}

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px;outline-color:#f37736;}

.contain {*zoom:1; width:1120px; margin:0 auto;}
.contain:after {content:" "; display:block; clear:both;}

/* header */
#main #header {height:161px;}
#header {height:141px; background:url('../images/common/bg_top.gif') 0 0 repeat-x;}
#header .contain {position:relative; z-index:120;}
#header .logo {position:absolute; top:52px; left:0; z-index:2; }
#header .bar {padding:0 5px;}
#header .global {height:75px;}
#header .global .util {position:absolute; top:0; right:0;}
#header .global .util li {float:left; font-size:13px; line-height:36px; padding:0 15px; color:#000; border-right:1px solid #cfcfcf;}
#header .global .util li a {display:inline-block; color:#000;}
#header .global .util img {vertical-align:middle;}
#header .global .top-sns {position:absolute; top:0; left:0; border-left:1px solid #cfcfcf;}
#header .global .top-sns li {float:left; font-size:0; line-height:0;border-right:1px solid #cfcfcf;}
#header .global .top-sns li a {display:block;}

#gnb {*zoom:1;}
#gnb:after {content:" "; display:block; clear:both;}
#gnb ul {margin-left:295px;}
#gnb ul > li {float:left; position:relative; font-size:18px; font-weight:700; line-height:50px;}
#gnb ul > li > a {display:block; color:#000; padding:0 60px 16px;}
#gnb ul > li > a:hover,
#gnb ul > li > a:focus,
#gnb ul > li.active > a,
#gnb ul > li.on > a {color:#447cc4}
#gnb ul > li.active .submenu {background:#f8f8f8}
#gnb .submenu {display:none; position:absolute; top:66px; left:0; width:100%; height:410px; background:#fff; border-bottom:1px solid #ddd; border-right:1px solid #ddd; box-sizing:border-box; z-index:200}
#gnb .submenu > ul {margin-left:0; padding:10px 0 0;}
#gnb .submenu > ul > li {float:none; font-size:13px; line-height:20px; font-weight:400;} 
#gnb .submenu > ul > li > a {display:block; padding:5px 10px 5px 36px; color:#555; background:url('../images/common/submenu_dot.gif') 29px 14px no-repeat;}
#gnb .submenu > ul > li > a:hover,
#gnb .submenu > ul > li > a:focus {color:#fff; background-image:url('../images/common/submenu_dot_on.gif'); background-color:#5293dd; outline:1px dotted #000; outline-offset:2px;}
#gnb .m1 .submenu {border-left:1px solid #ddd;}
.gnb-close {position:absolute; bottom:10px; right:10px; padding:0 10px; font-size:12px; line-height:20px; background:#336ebe; color:#fff;}
.gnb-close:hover,
.gnb-close:focus {outline:1px dotted #000; outline-offset:2px; color:#fff;}
/* .bg-submenu {display:none; position:absolute; top:141px; left:50%; width:1120px; margin-left:-560px; height:355px; background:#f8f8f8; border-bottom:1px solid #cfcfcf; z-index:104}*/


/* main */
#container {*zoom:1; width:1120px; margin:0 auto;}
#container:after {content:" "; display:block; clear:both;}

.main-visual {float:left; position:relative; width:800px; height:320px; _overflow:hidden;}
.main-visual .bx-clone {pointer-events:none;}
/*.main-visual .bx-wrapper .bx-pager {position:absolute; bottom:20px; left:75px; text-align:center; z-index:100}
.main-visual .bx-wrapper .bx-pager .bx-pager-item,
.main-visual .bx-wrapper .bx-controls-auto .bx-controls-auto-item {display:inline-block;*zoom: 1; *display: inline; vertical-align:middle}
.main-visual .bx-wrapper .bx-pager.bx-default-pager a {background:url('../images/main/slide_off.png') 0 0 no-repeat; width:17px; height:17px; text-indent: -9999px; display: block; margin:0 3px; overflow:hidden;}
.main-visual .bx-wrapper .bx-pager.bx-default-pager a:hover,
.main-visual .bx-wrapper .bx-pager.bx-default-pager a.active {background:url('../images/main/slide_on.png') 0 0 no-repeat;}
 .main-visual .bx-wrapper .bx-controls-auto {position:absolute; bottom:20px; left:20px; z-index:100; text-align:center;}
.main-visual .bx-wrapper .bx-controls-auto .bx-start {display:block;text-indent: -9999px;width:15px;height:19px; background:url('../images/main/slide_play.png') 0 0 no-repeat;margin:0 4px;}
.main-visual .bx-wrapper .bx-controls-auto .bx-start:hover,
.main-visual .bx-wrapper .bx-controls-auto .bx-start.active {background:url('../images/main/slide_play.png') 0 0 no-repeat;}
.main-visual .bx-wrapper .bx-controls-auto .bx-stop {display:block;text-indent:-9999px;width:15px;height:17px;background:url('../images/main/slide_stop.png') 0 0 no-repeat;margin:0 4px;}
.main-visual .bx-wrapper .bx-controls-auto .bx-stop:hover,
.main-visual .bx-wrapper .bx-controls-auto .bx-stop.active {background:url('../images/main/slide_stop.png') 0 0 no-repeat;} */
.main-visual .auto-btn {position:absolute; bottom:16px; left:20px; z-index:100; text-align:center;  display:flex; gap:8px;}
.main-visual .auto-btn .play {display:block; position:relative; vertical-align:top; text-indent: -9999px;width:15px;height:19px; font-size:0;background:url('../images/main/slide_play.png') 0 0 no-repeat;} 
.main-visual .auto-btn .pause {display:block; position:relative; vertical-align:top; text-indent: -9999px;width:15px;height:19px; font-size:0;background:url('../images/main/slide_stop.png') 0 0 no-repeat;}
.main-visual #bx-pager{position:absolute; bottom:18px; left:75px; z-index:100; text-align:center; display:flex; gap:8px;}
.main-visual #bx-pager a {background:url('../images/main/slide_off.png') 0 0 no-repeat; width:17px; height:17px; font-size:0; line-height:0; color:transparent; display:inline-block; vertical-align:top; border-radius:100%;}
.main-visual #bx-pager a.active {background-image:url('../images/main/slide_on.png'); outline:2px solid #000;}

#visual-slide li a {position:relative; display:block;}
#visual-slide li a:focus {outline-offset:-3px;}

/* swiper slide로 변경 2025-06-19 */
.main-visual .swiper-slide a {display:block;}
.main-visual .swiper-slide a:focus {outline-offset: -3px;}
.main-visual .swiper-slide img {display:block;}
.main-visual .swiper-ctrl {position:absolute; bottom:16px; left:16px; z-index:100; text-align:center;  display:flex; gap:8px;}
.main-visual .swiper-play {display:inline-block; position:relative; vertical-align:top; text-indent: -9999px;width:15px;height:19px; font-size:0;background:url('../images/main/slide_play.png') 0 0 no-repeat;} 
.main-visual .swiper-stop {display:inline-block; position:relative; vertical-align:top; text-indent: -9999px;width:15px;height:19px; font-size:0;background:url('../images/main/slide_stop.png') 0 0 no-repeat;}
.main-visual .swiper-pagination {position:absolute; bottom:18px; left:75px; z-index:100; text-align:center; display:flex; gap:8px;}
.main-visual .swiper-pagination-bullet {background:url('../images/main/slide_off.png') 0 0 no-repeat; width:17px; height:17px; font-size:0; line-height:0; color:transparent; display:inline-block; vertical-align:top; margin:0 !important; border-radius:100%; opacity:1;}
.main-visual .swiper-pagination-bullet-active {background-image:url('../images/main/slide_on.png'); outline:2px solid #000;}

.main-right {float:right; width:300px;}
.main-right .myongdo-bnr {width:298px; height:198px; border:1px solid #cfcfcf; margin-bottom:20px;}
.main-right .myongdo-bnr p {text-align:center; font-size:0; line-height:0; padding:24px 0 14px;}
.main-right .myongdo-bnr ul {*zoom:1;}
.main-right .myongdo-bnr ul:after {content:" "; display:block; clear:both;}
.main-right .myongdo-bnr ul li {float:left; width:84px; height:116px; margin-left:11px; text-align:center;}
.main-right .myongdo-bnr ul li.icon1 {background:#f2f2f2 url('../images/main/kids_icon1.png') 0 0 no-repeat;}
.main-right .myongdo-bnr ul li.icon2 {background:#f2f2f2 url('../images/main/kids_icon2.png') 0 0 no-repeat;}
.main-right .myongdo-bnr ul li.icon3 {background:#f2f2f2 url('../images/main/kids_icon3.png') 0 0 no-repeat;}
.main-right .myongdo-bnr ul li a {display:block; height:116px; color:#000;}
.main-right .myongdo-bnr ul li a span {display:block;padding-top:75px; font-size:12px; line-height:16px;}
.main-right .sponsor-bnr {width:298px; height:98px; border:1px solid #cfcfcf;}
.main-right .sponsor-bnr ul {*zoom:1; height:68px; margin-top:17px;}
.main-right .sponsor-bnr ul:after {content:" "; display:block; clear:both;}
.main-right .sponsor-bnr ul li {float:left; text-align:center; font-size:14px; line-height:22px; font-weight:700; border-left:1px solid #ccc}
.main-right .sponsor-bnr ul li:first-child {border-left:0}
.main-right .sponsor-bnr ul li.icon1 {width:91px; background:url('../images/main/sponsor_icon1.gif') 50% 5px no-repeat;}
.main-right .sponsor-bnr ul li.icon2 {width:110px; background:url('../images/main/sponsor_icon2.gif') 50% 5px no-repeat;}
.main-right .sponsor-bnr ul li.icon3 {width:95px; background:url('../images/main/sponsor_icon3.gif') 50% 5px no-repeat;}
.main-right .sponsor-bnr ul li a {display:block; color:#000;}
.main-right .sponsor-bnr ul li span {display:block;padding-top:42px;}

.main-bnr {margin:0 0 20px; background:#f1f1f1; padding:11px 10px 1px 10px;}
.main-bnr ul {*zoom:1; margin-left:-11px;}
.main-bnr ul:after {content:" "; display:block; clear:both;}
.main-bnr ul li {float:left; width:145px; height:98px; font-size:14px; line-height:22px; font-weight:700; border:1px solid #cfcfcf; text-align:center; margin:0 0 10px 11px;}
.main-bnr ul li.icon1 {background:#fff url('../images/main/cus_icon1.gif') 50% 18px no-repeat;}
.main-bnr ul li.icon2 {background:#fff url('../images/main/cus_icon2.gif') 50% 17px no-repeat;}
.main-bnr ul li.icon3 {background:#fff url('../images/main/cus_icon3.gif') 50% 12px no-repeat;}
.main-bnr ul li.icon4 {background:#fff url('../images/main/cus_icon4.gif') 50% 20px no-repeat;}
.main-bnr ul li.icon5 {background:#fff url('../images/main/cus_icon5.gif') 50% 20px no-repeat;}
.main-bnr ul li.icon6 {background:#fff url('../images/main/cus_icon6.gif') 50% 18px no-repeat;}
.main-bnr ul li.icon7 {background:#fff url('../images/main/cus_icon7.gif') 50% 19px no-repeat;}
.main-bnr ul li.icon8 {background:#fff url('../images/main/cus_icon8.gif') 50% 20px no-repeat;}
.main-bnr ul li.icon9 {background:#fff url('../images/main/cus_icon9.gif') 50% 19px no-repeat;}
.main-bnr ul li.icon10 {background:#fff url('../images/main/cus_icon10.gif') 50% 13px no-repeat;}
.main-bnr ul li.icon11 {background:#fff url('../images/main/cus_icon11.gif') 50% 16px no-repeat;}
.main-bnr ul li.icon12 {background:#fff url('../images/main/cus_icon12.gif') 50% 17px no-repeat;}
.main-bnr ul li.icon13 {background:#fff url('../images/main/cus_icon13.gif') 50% 10px no-repeat;}
.main-bnr ul li.icon14 {background:#fff url('../images/main/cus_icon14.gif') 50% 18px no-repeat;}
.main-bnr ul li a {display:block; height:98px; color:#000;}
.main-bnr ul li span {display:block;padding-top:65px;}

.board-zone {float:left; position:relative; width:547px; height:300px; _overflow:hidden;}
.board-zone .more {position:absolute; top:-40px; right:0;}
.board-zone .more a {display:inline; font-size:13px; color:#757575; font-weight:400; background:none;}
.board-zone ul li.active .more a {font-size:13px; color:#757575; font-weight:400; background:none;}
.board-zone ul li {float:left; width:122px; text-align:center; font-size:14px; line-height:39px; font-weight:700; border:1px solid #cfcfcf; border-left:0; border-bottom:0; }
.board-zone ul li:first-child {border-left:1px solid #cfcfcf}
.board-zone ul li a {display:block; color:#000; background:#eaeaea;}
.board-zone ul li a:focus {position:relative; outline:1px dotted #000; outline-offset:2px;}
.board-zone ul li.active a {color:#fff; background:#447cc4;}
.board-zone .content {display:none; position:absolute; top:40px; left:0; width:545px; height:258px; border:1px solid #cfcfcf;}
.board-zone .content ul {padding:10px 10px;}
.board-zone .content ul li {float:none; width:auto; text-align:left; font-size:13px; line-height:24px; font-weight:400; border:0; color:#555; background:url('../images/main/dot.gif') 0 10px no-repeat; padding-left:10px; overflow:hidden;white-space: nowrap; text-overflow: ellipsis;   }
.board-zone .content ul li a {display:inline; color:#555; background:none;}
.board-zone .content ul li a:hover {color:#000}
.board-zone .content ul li span {color:#757575; font-size:13px; padding-right:10px;}
.board-zone .content ul li img {vertical-align:middle;}

.main-welfare {float:right; width:545px; height:298px; border:1px solid #cfcfcf;}
.main-welfare .box {padding:10px 15px; position:relative;}
.main-welfare .title {font-size:16px; line-height:24px; color:#000; margin:0 0 5px;}
.main-welfare ul {*zoom:1; margin-left:-17px;}
.main-welfare ul:after {content:" "; display:block; clear:both;}
.main-welfare ul li {float:left; width:245px; margin-left:19px;}
.main-welfare ul li .thumb {font-size:0; line-height:0; margin:0 0 7px;} 
.main-welfare ul li a {font-size:16px; line-height:24px; font-weight:700; color:#000}
.main-welfare ul li .info {font-size:13px; line-height:20px; color:#555; height:40px; margin-bottom:5px; word-break:break-all;  overflow:hidden;}
.main-welfare ul li .date {font-size:11px; line-height:20px; color:#757575}
.main-welfare .more {position:absolute; top:12px; right:18px; color:#757575; font-size:13px;}

.main-comm {*zoom:1; margin:0 0 20px}
.main-comm:after {content:" "; display:block; clear:both;}
.main-comm .bnr {float:left; width:400px;}
.main-comm .bnr ul {*zoom:1; border-top:1px solid #cfcfcf; border-right:1px solid #cfcfcf;}
.main-comm .bnr ul:after {content:" "; display:block; clear:both;}
.main-comm .bnr ul li {float:left; width:199px; height:88px; border:1px solid #cfcfcf; border-top:0; border-right:0;}
.main-comm .bnr ul li.first {width:198px;}
.main-comm .bnr ul li a {display:block; position:relative; width:199px; height:88px;}
.main-comm .bnr ul li a.icon1 {background:url('../images/main/bnr_icon1.gif') 21px 27px no-repeat;} 
.main-comm .bnr ul li a.icon2 {background:url('../images/main/bnr_icon2.gif') 34px 22px no-repeat;} 
.main-comm .bnr ul li a.icon3 {background:url('../images/main/bnr_icon3.gif') 25px 36px no-repeat;} 
.main-comm .bnr ul li a.icon4 {background:url('../images/main/bnr_icon4.gif') 32px 26px no-repeat;}
.main-comm .bnr ul li a span {position:absolute; bottom:20px; right:15px; text-align:right; font-size:14px; line-height:20px; color:#000;}
.main-comm .call {float:left; width:279px; height:178px; border:1px solid #cfcfcf; margin-left:20px; background:url('../images/main/call_icon.gif') 15px 69px no-repeat;}
.main-comm .call .title {background:#c3d5ec; font-size:16px; line-height:36px; padding-left:10px; color:#000; border-bottom:1px solid #cfcfcf;}
.main-comm .call .box {padding:35px 0 0 98px}
.main-comm .call .box .number {color:#a92400; font-size:24px; line-height:30px; font-weight:700; margin:0 0 10px;}
.main-comm .call .box li {color:#555; font-size:13px; line-height:20px; font-weight:700;}
.main-comm .schedule {*zoom:1; float:right; width:398px; height:178px; border:1px solid #cfcfcf; overflow:hidden;}
.main-comm .schedule:after {content:" "; display:block; clear:both;}
.main-comm .schedule .title {background:#cde8ef; font-size:16px; line-height:36px; padding-left:10px; color:#000; border-bottom:1px solid #cfcfcf;}
.main-comm .schedule ul {float:left; width:340px; margin-left:20px; padding-top:10px}
.main-comm .schedule ul li {font-size:13px; line-height:24px; background:url('../images/main/dot.gif') 0 10px no-repeat; padding-left:10px; overflow:hidden; white-space:nowrap;text-overflow: ellipsis;}
.main-comm .schedule ul li span {color:#757575; font-size:13px; padding-right:10px;}

.familySlide {position:relative; width:1073px; height:60px; margin:0 auto 20px;}
.familySlide .bx-wrapper .bx-controls-auto .bx-controls-auto-item {display:inline-block;*zoom: 1; *display: inline; vertical-align:middle}
.familySlide .bx-wrapper .bx-controls-auto {position:absolute; top:2px; left:3px; z-index:100; text-align:center;}
.familySlide .bx-wrapper .bx-controls-auto .bx-start {display:block;text-indent: -9999px;width:17px;height:17px; background:url('../images/main/bt_play.png') 0 0 no-repeat;margin:0 1px;}
.familySlide .bx-wrapper .bx-controls-auto .bx-start:hover,
.familySlide .bx-wrapper .bx-controls-auto .bx-start.active {background:url('../images/main/bt_play.png') 0 0 no-repeat;}
.familySlide .bx-wrapper .bx-controls-auto .bx-stop {display:block;text-indent:-9999px;width:17px;height:17px;background:url('../images/main/bt_stop.png') 0 0 no-repeat;margin:0 1px;}
.familySlide .bx-wrapper .bx-controls-auto .bx-stop:hover,
.familySlide .bx-wrapper .bx-controls-auto .bx-stop.active {background:url('../images/main/bt_stop.png') 0 0 no-repeat;}
.familySlide #bt-prev a {position:absolute; top:0; left:-23px; width:17px; height:60px;font-size:0;background:url('../images/main/bt_prev.png') 0 50% no-repeat;}
.familySlide #bt-next a {position:absolute; top:0; right:-23px; width:17px; height:60px;font-size:0;background:url('../images/main/bt_next.png') 0 50% no-repeat;}

#family-slide li a:focus {outline-offset:-2px;}

/* sub page */
#sub #container {display:flex; justify-content:space-between;}
#sub #container:after {display:none;}
#contentArea {width:870px;}

.sub-visual {width:100%; height:150px; background:#e4effe; overflow:hidden;}
.sub-visual .inner {width:1120px; margin:0 auto; text-align:right; font-size:0; line-height:0}

#lnb {width:220px; margin-top:-150px; padding:0 0 50px;}
.lnb h2 {height:144px; width:220px; border-bottom:6px solid #3f79ba; color:#fff; background:#1b497d;font-size:30px; line-height:40px;font-weight:400;display:table-cell;vertical-align:middle; text-align:center; font-family:'Jeju Gothic', sans-serif;}
.lnb ul {border-left:1px solid #d3d6d9;border-right:1px solid #d3d6d9; padding-top:25px;}
.lnb ul li {font-size:14px; line-height:38px; font-weight:700; border-bottom:1px solid #d3d6d9;}
.lnb ul li a {display:block; color:#333; padding-left:23px; background:url('../images/common/menu_off.png') 9px 50% no-repeat;}
.lnb ul li a:hover,
.lnb ul li.active a {display:block; color:#1b497d; padding-left:23px; background:#f6f4f3 url('../images/common/menu_off.png') 9px 50% no-repeat;}
.lnb-customer {width:196px; height:120px; padding:8px 11px;border:1px solid #d3d6d9;border-top:0; background:url('../images/common/call_icon.gif') 14px 78px no-repeat;}
.lnb-customer .title {font-size:16px; line-height:20px; margin:0 0 10px;}
.lnb-customer .number {color:#a92400; font-size:26px; line-height:30px; font-weight:700; margin:0 0 15px; padding-left:5px;}
.lnb-customer ul {padding-left:60px;}
.lnb-customer ul li {color:#555; font-size:13px; line-height:20px; font-weight:700;}

.sub-title {position:relative; height:50px; margin-bottom:50px;}
.sub-title h2 {color:#000; font-size:24px; line-height:30px; padding-top:20px;}
.sub-title .path {position:absolute; top:30px; right:0; color:#555; font-size:11px; line-height:18px;}
.sub-title .path .home {position:relative; display:inline-block;zoom:1;*display:inline; vertical-align:top; margin:-0.2em 0 0 0;padding:0 5px; height:18px; border-radius:2px; font-size:10px; line-height:18px; background:#1b497d; color:#fff;}
.sub-title .path .arrow {margin:0 3px;}

.real-cont {min-height:450px; _height:450px; padding:0 0 100px;}

.sub-menu {margin:0 0 40px}
.sub-menu ul {*zoom:1; border-left:1px solid #cfcfcf; border-bottom:1px solid #cfcfcf;}
.sub-menu ul:after {content:" "; display:block; clear:both;}
.sub-menu ul li {float:left; width:122px; font-size:14px; line-height:39px; font-weight:700; text-align:center; border:1px solid #cfcfcf;  border-bottom:0;margin-left:-1px;}
.sub-menu ul li a {display:block; color:#000; background:#eaeaea}
.sub-menu ul li a:focus {position:relative; outline:2px dotted #000; outline-offset:1px;}
.sub-menu ul li a:hover,
.sub-menu ul li.on a {display:block; color:#fff; background:#447cc4}

/* footer */
#footer {clear:both; padding:29px 0; background:#eee;}
#footer address {font-style:normal;}
#footer .bar {padding:0 5px;}
#footer .contain {position:relative;}
.foot-logo {position:absolute; top:30px; left:17px;}
.foot-menu {*zoom:1; padding-left:185px; margin:0 0 10px;}
.foot-menu:after {content:" "; display:block; clear:both;}
.foot-menu li {float:left; padding:0 10px; font-size:14px; line-height:20px; font-weight:700; background:url('../images/common/foot_bar.gif') 0 7px no-repeat;}
.foot-menu li:first-child {background:none; padding:0 10px 0 0}
.foot-menu li a {display:block; color:#000}
.foot-info {margin-left:185px; color:#000; font-size:14px; line-height:22px;}
.foot-link {position:absolute; top:35px; right:10px;}