
/* main_visual_slide */
.main_visualbox {position: relative; width: 100%; overflow: hidden;}
.main_visualarea {float: left; width: 100%;}
.main_visualarea .swiper-container-1 {width: 100%; height: 100%; margin-left: auto; margin-right: auto;}
.main_visualarea .swiper-container-1 .swiper-slide {text-align: center; /* Center slide text vertically */ -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center;
-ms-flex-align: center; -webkit-align-items: center; align-items: center;}
.main_visualarea .swiper-container-1 .swiper-slide .slideback {float: left; width: 100%; padding-bottom: 590px; background-size: cover;}  /* ¹è³ÊÀÌ¹ÌÁö ºÐ¸® */

.main_visualarea .swiper-container-1 .swiper-pagination-bullet {width: 17px !important; height: 17px !important; display: inline-block; border-radius: 100%; background-color: rgba(255,255,255,0) !important; border: 1px solid rgba(255,255,255,0.5); box-sizing:border-box; opacity: 1 !important;}
.main_visualarea .swiper-container-1 .swiper-pagination-white .swiper-pagination-bullet-active {width: 17px !important; height: 17px !important; background: #fff !important; border: 0;}
.main_visualarea .swiper-container-1 .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {bottom: 4% !important;}
.main_visualarea .swiper-container-1 .mainprev, .mainnext {width: 60px !important; height: 60px !important; background-size: 60px 60px !important;}
.main_visualbox .swiper-container-1 .swiper-button-next, .swiper-container-rtl .swiper-button-prev {background-image: url(../images/main_slide_next.png) !important; right: 3% !important;}
.main_visualbox .swiper-container-1 .swiper-button-prev, .swiper-container-rtl .swiper-button-next {background-image: url(../images/main_slide_prev.png) !important; left: 3% !important;}

/* shortcut ¹Ù·Î°¡±â ¹öÆ° ¿µ¿ª */
.shortcut_box {float: left; width: 100%; background: #f2f3f5;}
.shortcut_area {margin: 0 auto; width: 100%; max-width: 1200px;}

.shortcut_list {float: left; width: 100%; padding: 50px 0;}
.shortcut_list ul {float: left; width: 100%; text-align:center;}
.shortcut_list ul li {position: relative; display: inline-block; width: 16.6667% /*200px*/; text-align: center; margin-right: 3.83334%;}
.shortcut_list ul li:last-child {margin-right: 0;}
.shortcut_list ul li.shortcut_item a {display: block; width: 100%; font-family: "NanumSquare", sans-serif; transform: rotate(-0.04deg); font-size: 18.72px; color: #515151; font-weight: 800; line-height: 24px; letter-spacing: -0.15px; padding-top: 190px;}
.shortcut_list ul li.shortcut_item a:before {position: absolute; content: ''; top: 0; left: 50%; transform: translateX(-50%); width: 166px; height: 166px; text-align: center; overflow: hidden; border-radius: 100%; background: #fff; box-shadow: 3px 3px 10px rgb(0,0,0,0.1);}
.shortcut_list ul li.item1 a:after {position: absolute; display: block; content: ''; top: 36px; left: 0; right: 0; width: 96px; height: 95px; margin: 0 auto; background: url("../images/shortcut_ico1.png") no-repeat center;}
.shortcut_list ul li.item2 a:after {position: absolute; display: block; content: ''; top: 36px; left: -5px; right: 0; width: 88px; height: 95px; margin: 0 auto; background: url("../images/shortcut_ico2.png") no-repeat center;}
.shortcut_list ul li.item3 a:after {position: absolute; display: block; content: ''; top: 38px; left: 0; right: 0; width: 98px; height: 95px; margin: 0 auto; background: url("../images/shortcut_ico3.png") no-repeat center;}
.shortcut_list ul li.item4 a:after {position: absolute; display: block; content: ''; top: 36px; left: 0; right: 0; width: 97px; height: 95px; margin: 0 auto; background: url("../images/shortcut_ico4.png") no-repeat center;}
.shortcut_list ul li.item5 a:after {position: absolute; display: block; content: ''; top: 36px; left: 0; right: 0; width: 80px; height: 95px; margin: 0 auto; background: url("../images/shortcut_ico5.png") no-repeat center;}
.shortcut_list ul li.shortcut_item a span.txt-length {letter-spacing: -1px;}

/* shortcut ¹Ù·Î°¡±â ¹öÆ° rollover eff */
.shortcut_list ul li.shortcut_item a:hover {color: #4f95cf; text-decoration: underline;}
.shortcut_list ul li.shortcut_item a:hover:before {background: #cee6f9; transition: all 0.3s ease;}

/* board °Ô½ÃÆÇ ¿µ¿ª */
.board_box {position: relative; float: left; width: 100%; padding: 50px 0 100px; background: url("../images/board_ico_2.jpg") no-repeat right top;}
.board_box:before {position: absolute; display: block; content: ''; top: 0; left: 0; width: 50%; height: 100%; background: #a1caec url("../images/board_ico_1.png") no-repeat left 86%; z-index: 1;}

.board_area {margin: 0 auto; width: 100%; max-width: 1200px;}
.board_contents {position: relative; float: left; width: 100%; z-index: 2;}
.board_contents .qna {float: left; width: 560px; /*background: #a1caec;*/}
.board_contents .qna .tit {float: left; width: 100%; height: 55px; border-bottom: 1px solid #fff;}
.board_contents .qna .tit h4 {float: left; font-family: "NanumSquare", sans-serif; font-size: 25px; color: #fff; font-weight: 700; line-height: 25px; transform: rotate(-0.04deg); padding-top: 5px;}
.board_contents .qna .tit .btnmore {float: right;}
.board_contents .qna .tit .btnmore a {display: block; width: 16px; height: 16px; margin-top: 10px;}
.board_contents .qna .tit .btnmore a img {vertical-align: top;}
.board_contents .qna .contents {float: left; width: 100%;}
.board_contents .qna .contents li {float: left; width: 100%; height: 55px; font-family: "NanumSquare", sans-serif; transform: rotate(-0.04deg); font-size: 15px; color: #fff; font-weight: 700; line-height: 55px; border-bottom: 1px solid #fff;}
.board_contents .qna .contents li a {display: block; width: 100%; font-family: "NanumSquare", sans-serif; transform: rotate(-0.04deg); font-size: 15px; color: #fff; font-weight: 700; line-height: 55px;}
.board_contents .qna .contents li a span.subject {float: left; width: 80%; letter-spacing: -0.8px; text-overflow: ellipsis; white-space: nowrap; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.board_contents .qna .contents li a span.date {float: right; font-size: 13px; color: #fff; font-weight: 400; letter-spacing: -0.4px;}
.board_contents .qna .contents li a:hover span.subject {color: #ffff00; text-decoration: underline;}

.board_contents .notice {float: right; width: 560px;}
.board_contents .notice .tit {float: left; width: 100%; height: 55px; border-bottom: 1px solid #474a58;}
.board_contents .notice .tit h4 {float: left; font-family: "NanumSquare", sans-serif; font-size: 25px; color: #171717; font-weight: 700; line-height: 25px; transform: rotate(-0.04deg); padding-top: 5px;}
.board_contents .notice .tit .btnmore {float: right;}
.board_contents .notice .tit .btnmore a {display: block; width: 16px; height: 16px; margin-top: 10px;}
.board_contents .notice .tit .btnmore a img {vertical-align: top;}
.board_contents .notice .contents {float: left; width: 100%;}
.board_contents .notice .contents li {float: left; width: 100%; height: 55px; font-family: "NanumSquare", sans-serif; transform: rotate(-0.04deg); font-size: 15px; color: #2b2a2a; font-weight: 700; line-height: 55px; border-bottom: 1px solid #dbdbdb;}
.board_contents .notice .contents li a {display: block; width: 100%; font-family: "NanumSquare", sans-serif; transform: rotate(-0.04deg); font-size: 15px; color: #2b2a2a; font-weight: 700; line-height: 55px;}
.board_contents .notice .contents li a span.subject {float: left; width: 80%; letter-spacing: -0.8px; text-overflow: ellipsis; white-space: nowrap; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.board_contents .notice .contents li a span.date {float: right; font-size: 13px; color: #646464; font-weight: 400; letter-spacing: -0.4px;}
.board_contents .notice .contents li a:hover span.subject {color: #37af2e; text-decoration: underline;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_mobile 359 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:359px) {

.pc {display: none;}

.main_visualarea .swiper-container-1 .swiper-slide .slideback {padding-bottom: 79.861112%;}
.main_visualarea .swiper-container-1 .mainprev, .mainnext {display: none;}

.shortcut_list {padding: 32px 0 18px;}
.shortcut_list ul {font-size: 0;}
.shortcut_list ul li {width: 33.3334%; margin-right: 0;}
.shortcut_list ul li.shortcut_item a {float: left; font-size: 15px; letter-spacing: -1px; padding-top: 115px; word-break: keep-all;}
.shortcut_list ul li.shortcut_item a:before {width: 100px; height: 100px; text-align: center; right: 0; margin: 0 auto;}
.shortcut_list ul li.item1 {height: 180px;}
.shortcut_list ul li.item1 a:after {top: 0; background-size: 60% 60%;}
.shortcut_list ul li.item2 {height: 180px;}
.shortcut_list ul li.item2 a:after {top: 5px; left: 3px; background-size: 60% 60%;}
.shortcut_list ul li.item3 {height: 180px;}
.shortcut_list ul li.item3 a:after {top: 5px; width: 90px; background: url("../images/shortcut_ico3.png") no-repeat 47% center; background-size: 60% 60%;}
.shortcut_list ul li.item4 {height: 150px;}
.shortcut_list ul li.item4 a:after {top: 5px; background-size: 60% 60%;}
.shortcut_list ul li.item5 {height: 150px;}
.shortcut_list ul li.item5 a:after {top: 2px; background-size: 63% 63%;}

.board_box {padding: 0; background: #fff;}
.board_box:before {display: none;}
.board_contents .qna {width: 100%; padding: 30px 2%; box-sizing: border-box; background: #37af2e;}
.board_contents .qna .tit h4 {font-size: 20px;}
.board_contents .qna .contents li {height: 45px;}
.board_contents .qna .contents li a {font-size: 14px; line-height: 45px;}
.board_contents .qna .contents li a span.subject {width: 78%;}
.board_contents .qna .contents li a span.date {font-size: 12.5px; letter-spacing: -0.8px;}
.board_contents .notice {width: 100%; padding: 30px 2%; box-sizing: border-box;}
.board_contents .notice .tit h4 {font-size: 20px;}
.board_contents .notice .contents li {height: 45px;}
.board_contents .notice .contents li a {font-size: 14px; line-height: 45px;}
.board_contents .notice .contents li a span.subject {width: 78%;}
.board_contents .notice .contents li a span.date {font-size: 12.5px; letter-spacing: -0.8px;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_mobile 360,719 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:360px) and (max-width:719px) {

.pc {display: none;}

.main_visualarea .swiper-container-1 .swiper-slide .slideback {padding-bottom: 79.861112%;}
.main_visualarea .swiper-container-1 .mainprev, .mainnext {display: none;}

.shortcut_list {padding: 32px 0 22px;}
.shortcut_list ul {font-size: 0;}
.shortcut_list ul li {width: 33.3334%; margin-right: 0;}
.shortcut_list ul li.shortcut_item a {float: left; font-size: 16px; line-height: 22px; padding-top: 120px; word-break: keep-all;}
.shortcut_list ul li.shortcut_item a:before {width: 100px; height: 100px; text-align: center; right: 0; margin: 0 auto;}
.shortcut_list ul li.item1 {height: 190px;}
.shortcut_list ul li.item1 a:after {top: 0; background-size: 60% 60%;}
.shortcut_list ul li.item2 {height: 190px;}
.shortcut_list ul li.item2 a:after {top: 5px; left: 3px; background-size: 60% 60%;}
.shortcut_list ul li.item3 {height: 190px;}
.shortcut_list ul li.item3 a:after {top: 5px; width: 106px; background: url("../images/shortcut_ico3.png") no-repeat 47% center; background-size: 60% 60%;}
.shortcut_list ul li.item4 {height: 150px;}
.shortcut_list ul li.item4 a:after {top: 5px; background-size: 60% 60%;}
.shortcut_list ul li.item5 {height: 150px;}
.shortcut_list ul li.item5 a:after {top: 2px; background-size: 63% 63%;}

.board_box {padding: 0; background: #fff;}
.board_box:before {display: none;}
.board_contents .qna {width: 100%; padding: 30px 2%; box-sizing: border-box; background: #a1caec;}
.board_contents .qna .tit h4 {font-size: 22px;}
.board_contents .qna .contents li {height: 45px;}
.board_contents .qna .contents li a {line-height: 45px;}
.board_contents .qna .contents li a span.subject {width: 78%;}
.board_contents .qna .contents li a span.date {font-size: 12.5px; letter-spacing: -0.8px;}
.board_contents .notice {width: 100%; padding: 30px 2%; box-sizing: border-box;}
.board_contents .notice .tit h4 {font-size: 22px;}
.board_contents .notice .contents li {height: 45px;}
.board_contents .notice .contents li a {line-height: 45px;}
.board_contents .notice .contents li a span.subject {width: 78%;}
.board_contents .notice .contents li a span.date {font-size: 12.5px; letter-spacing: -0.8px;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_mobile 400,499 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:400px) and (max-width:499px) {

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_mobile 500,640 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:500px) and (max-width:640px) {

.shortcut_list {padding: 32px 0;}
.shortcut_list ul li {width: 20%; margin-right: 0;}
.shortcut_list ul li.shortcut_item a {font-size: 16px; padding-top: 110px;}
.shortcut_list ul li.shortcut_item a:before {width: 90px; height: 90px; text-align: center; right: 0; margin: 0 auto;}
.shortcut_list ul li.item1 {height: 140px;}
.shortcut_list ul li.item1 a:after {top: -2px; background-size: 60% 60%;}
.shortcut_list ul li.item2 {height: 140px;}
.shortcut_list ul li.item2 a:after {top: -2px; background-size: 60% 60%;}
.shortcut_list ul li.item3 {height: 140px;}
.shortcut_list ul li.item3 a:after {top: 0; background-size: 60% 60%;}
.shortcut_list ul li.item4 {height: 140px;}
.shortcut_list ul li.item4 a:after {top: -2px; background-size: 60% 60%;}
.shortcut_list ul li.item5 {height: 140px;}
.shortcut_list ul li.item5 a:after {top: 0; background-size: 60% 60%;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_tablet 720,767 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:720px) and (max-width:767px) {

.pc {display: none;}

.main_visualarea .swiper-container-1 .swiper-slide .slideback {padding-bottom: 79.861112%;}

.shortcut_list {padding: 30px 0 25px;}
.shortcut_list ul {font-size: 0;}
.shortcut_list ul li {width: 20%; margin-right: 0;}
.shortcut_list ul li.shortcut_item a {float: left; font-size: 17px; line-height: 22px; padding-top: 135px; word-break: keep-all;}
.shortcut_list ul li.shortcut_item a:before {width: 120px; height: 120px; text-align: center; right: 0; margin: 0 auto;}
.shortcut_list ul li.item1 {height: 180px;}
.shortcut_list ul li.item1 a:after {top: 13px; background-size: 70% 70%;}
.shortcut_list ul li.item2 {height: 180px;}
.shortcut_list ul li.item2 a:after {top: 13px; background-size: 70% 70%;}
.shortcut_list ul li.item3 {height: 180px;}
.shortcut_list ul li.item3 a:after {top: 15px; background-size: 70% 70%;}
.shortcut_list ul li.item4 {height: 180px;}
.shortcut_list ul li.item4 a:after {top: 15px; background-size: 70% 70%;}
.shortcut_list ul li.item5 {height: 180px;}
.shortcut_list ul li.item5 a:after {top: 13px; background-size: 70% 70%;}

.board_box {padding: 0; background: #fff;}
.board_box:before {display: none;}
.board_contents .qna {width: 100%; padding: 40px 5%; box-sizing: border-box; background: #37af2e;}
.board_contents .notice {width: 100%; padding: 40px 5%; box-sizing: border-box;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_tablet 768,1023 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:768px) and (max-width:1023px) {

.pc {display: none;}

.main_visualarea .swiper-container-1 .swiper-slide .slideback {padding-bottom: 79.861112%;}

.shortcut_list {padding: 30px 0 25px;}
.shortcut_list ul {font-size: 0;}
.shortcut_list ul li {width: 20%; margin-right: 0;}
.shortcut_list ul li.shortcut_item a {float: left; font-size: 17px; line-height: 22px; padding-top: 135px; word-break: keep-all;}
.shortcut_list ul li.shortcut_item a:before {width: 120px; height: 120px; text-align: center; right: 0; margin: 0 auto;}
.shortcut_list ul li.item1 {height: 180px;}
.shortcut_list ul li.item1 a:after {top: 13px; background-size: 70% 70%;}
.shortcut_list ul li.item2 {height: 180px;}
.shortcut_list ul li.item2 a:after {top: 13px; background-size: 70% 70%;}
.shortcut_list ul li.item3 {height: 180px;}
.shortcut_list ul li.item3 a:after {top: 15px; background-size: 70% 70%;}
.shortcut_list ul li.item4 {height: 180px;}
.shortcut_list ul li.item4 a:after {top: 15px; background-size: 70% 70%;}
.shortcut_list ul li.item5 {height: 180px;}
.shortcut_list ul li.item5 a:after {top: 13px; background-size: 70% 70%;}

.board_box {padding: 0; background: #fff;}
.board_box:before {display: none;}
.board_contents .qna {width: 100%; padding: 40px 5%; box-sizing: border-box; background: #37af2e;}
.board_contents .notice {width: 100%; padding: 40px 5%; box-sizing: border-box;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_pc 1024,1279 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1024px) and (max-width:1279px) {

.mobile {display: none;}
.main_visualarea .swiper-container-1 .swiper-slide .slideback {padding-bottom: 400px; background-size: 120% 100% !important;}
.shortcut_list ul li {margin-right: 3%;}
.shortcut_list ul li.shortcut_item a {font-size: 16px;}
.shortcut_list ul li.shortcut_item a span {word-break: keep-all;}

.board_box {background: #fff;}
.board_box:before {background: #37af2e;}
.board_contents .qna {width: 46.66666666666667%; background: #37af2e;}
.board_contents .notice {width: 46.66666666666667%;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_pc 1280,1919 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1280px) and (max-width:1919px) {

.mobile {display: none;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** jny_pc 1920 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1920px) {

.mobile {display: none;}

}