@charset "utf-8";



.wrapper { width: 100%; max-width: 1400px; margin: 0 auto; position: relative; }

/* skip navi */
#skip { width:100%; margin:0 auto; position:relative;}
#skip ul {position:absolute; z-index:999;}
#skip ul a {float:left; height:1px; width:1px; margin-bottom:-1px; overflow:hidden; text-align:center; white-space:nowrap; font-size:0.688em; display: block;}
#skip ul a:focus, #accessibility a:active {top:10px; height:auto; width:1080px; padding:10px 0; margin:0 auto; font-weight:bold; background:#000; color:#fff;}


#header { width: 100%; display: flex; justify-content: space-between; box-sizing: border-box;  height: 112px; position: absolute; left: 0; top: 0; z-index: 9999;  }
#header.headerWhite { background: #fff; }
#header h1#logo { width: 250px; padding: 10px 0; }
#header h1#logo a { display: block; margin: 0 auto; overflow: hidden; width: 100%; }
#header h1#logo a img { display: block; width: 100%; margin: 0 auto; }


#header > .wrapper { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}

/* nav#gnb { width: calc(100% - 400px); } */
nav#gnb { width: calc(100% - 270px); } 
nav#gnb ul.wrapper { display: grid; grid-template-columns: repeat(8, 1fr); justify-items: center; align-items: center; height: 112px; } 
nav#gnb ul.wrapper > li { width: 100%; position: relative; box-sizing: border-box; height: 112px; display: flex; align-items: center; justify-content: center; } 
/* nav#gnb ul.wrapper > li:hover::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; display: block; height: 5px; background: #7f3c8c; } */
nav#gnb ul.wrapper > li > a { font-family: 'yg-jalnan'; word-break: keep-all; display: block; text-align: center; padding: 49px 10px; box-sizing: border-box; width: 100%; font-size: 1.2em;
line-height: 1.4; color: #fff; } 
#header.headerWhite nav#gnb ul.wrapper > li > a { color: #333; } 
#header.headerWhite nav#gnb ul.wrapper > li:hover > a { color:#7f3c8c; }

nav#gnb .subGnb { display: none; padding: 20px 0; box-sizing: border-box; position: absolute; top: 110px; left: 0; width: 100%; z-index: 9998;  background: rgba(255,255,255,0.9);  }
nav#gnb .subGnb li { text-align: center; line-height: 2.2;  }
nav#gnb .subGnb li a { display: block; font-family: 'yg-jalnan'; font-size: 1.1em; }
#header.headerWhite nav#gnb ul.wrapper > li .subGnb li a:hover { color: #4d3c7c; font-weight: 500; }




#header .gnb_m_open { position:absolute; width:1px; height:1px; margin:0; padding:0; background:none; font-size:0px; color:transparent; line-height:0; right:9999px; top:-9999px; overflow:hidden; }

#all_menu { display:none; }

.container { padding: 00px 0 40px; }
.container .wrapper { width: 100%; max-width: 1400px; margin: 0 auto; position: relative; }


#footer #btmGnb { padding: 12px 0; background: #939598; text-align: center; }
#footer #btmGnb .wrapper > ul li { display: inline-block; }
#footer #btmGnb .wrapper > ul li a { font-size: 0.875em; color: #fff; }
#footer #btmGnb .wrapper > ul li:last-child::after { display: none; }
#footer #btmGnb .wrapper > ul li::after { content: '|'; font-size: 0.875em; margin: 0 19px; color: #999; vertical-align: baseline; }

#footer .addBox .wrapper { padding: 15px 0; font-size: 0.875em; line-height: 1.9; text-align: center;  }
#footer address span { padding-left: 15px;}










/* 메인 */
.mainCon { background: #7F3C8D; background: linear-gradient(149deg,rgba(127, 60, 141, 1) 0%, rgba(77, 60, 124, 1) 100%); padding: 190px 0 40px; }


.mainTop { display: flex; justify-content: space-between; flex-wrap: wrap; }
.mainTop .mainTxt { max-width: 580px; width: 50%; text-align: center; }
.mainTop .mainTxt img { width: 100%; }

.mainTop .mainInfo { width: 50%; box-sizing: border-box; padding: 0 10px; }
.mainTop .mainInfo dl { display: block; width: 100%; margin: 0 auto 25px; }
.mainTop .mainInfo dt { display: inline-block; padding: 5px 12px; background: #fff; text-align: center;   font-family: 'yg-jalnan'; border-radius: 100px; font-size: 1.125em; margin: 0 auto 15px; }
.mainTop .mainInfo dd { color: #fff; font-size: 1.25em; margin: 0 0 5px; }
.mainTop .mainInfo dd::before { content: '•'; color: #fff684; font-weight: 700; padding-right: 10px;  }

.mainTop .banners { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 15px; width: 100%; margin: 40px auto 0; }
.mainTop .banners a { display: block; background-color: rgba(255,255,255,0.8); border: 1px solid #ccc; border-radius: 8px; padding: 20px; box-sizing: border-box; }
.mainTop .banners h3 { font-size: 1.35em; margin-bottom: 10px;  font-family: 'yg-jalnan'; }
.mainTop .banners span { font-weight: 300;}

.mainTop .banners a:first-child h3 { color: #f39200;}
.mainTop .banners a:nth-child(2) h3 { color: #87bd15;}
.mainTop .banners a:nth-child(3) h3 { color: #009fe3;}
.mainTop .banners a:last-child h3 { color: #953f95;}






/* 팝업 */
.lpDim { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; z-index: 10000; }
.lpWrap { background: #fff; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,.25); display: flex; flex-direction: column; overflow: hidden; }
.lpBody { padding: 15px; box-sizing: border-box; overflow: auto; flex: 1 1 auto; }
.lpFigure { margin: 0; }
.lpFigure img { width: 100%; height: auto; display: block; border-radius: 8px; }
.lpFooter { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 10px; border-top: 1px solid #eee; background: #faf7fb; }
.lpToday { display: inline-flex; align-items: center; gap: 8px; font-size: .95rem; color: #4d3c7c; }
.lpBtnClose { padding: 10px 16px; border-radius: 999px; background: #7f3c8d; color: #fff; border: 0; font-weight: 700; cursor: pointer; }
.lpBtnClose:hover { filter: brightness(1.05); }