/* 버튼 */
.btn_more { position: absolute; top: -0.23rem; right: 0; display: flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; background: #ededed; border-radius: 50%; color: #000000; font-size: 1.1rem; }
/* 버튼 : active */
.btn_more i { transition: 0.2s; }
.btn_more:hover i,
.btn_more:focus i { transform: rotate(180deg); }

/* 메인비주얼 */
.Mvisual { position: relative; border-radius: 0.5rem; overflow: hidden; isolation: isolate; background: #e1e1e1; }
.Mvisual .item a,
.Mvisual .item p { display: flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; }
.Mvisual .item a > img,
.Mvisual .item p > img { max-width: 100%; }
.Mvisual .control { position: absolute; right: 0; bottom: 0; display: flex; align-items: center; background: rgba(0,0,0,0.5); border-radius: 1rem 0 0.5rem 0; height: 2.5rem; color: #fff; padding: 0 1.5rem; }
.Mvisual .control .page { display: flex; align-items: center; margin-right: 0.7rem; line-height: 1.15rem; }
.Mvisual .control .page > strong { font-weight: bold; } 
.Mvisual .control .page > span { position: relative; padding-left: 0.95rem; margin-left: 0.7rem; }
.Mvisual .control .page > span::before { position: absolute; content: ""; left: 0; top: 50%; transform: translateY(-50%); border-radius: 50%; background: #fff; width: 0.3rem; height: 0.3rem; }
.Mvisual .control > a { display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.Mvisual .control > a.stop,
.Mvisual .control > a.play { margin: 0 0.5rem; }
.Mvisual .control > a.play { display: none; }

/* 바로가기 */

	/* 공통 */
	.link { position: relative; }
	.link > ul { display: flex; flex-wrap: wrap; }

	/* 바로가기01 */
	.link.lnk01 { height: 100%; }
	.link.lnk01 > ul { gap: 2rem; height: 100%; flex-direction:column; }
	.link.lnk01 > ul > li { width: 100%; height: calc((100% - 2rem) / 2); }
	.link.lnk01 > ul > li > a { position: relative; border-radius: 0.5rem; box-shadow: 0px 0px 30px rgba(0,0,0,0.1); background: #fff; padding: 1rem 2rem; display: flex; width: 100%; height: 100%; flex-direction: column; justify-content: center; overflow: hidden; }
	.link.lnk01 > ul > li > a::before { position: absolute; content: ""; background: url('/images/bohun/template/H5/main/linkBg.png')no-repeat; right: 0; bottom: 0; opacity: 0.4; width: 9rem; height: 5.25rem; }
	.link.lnk01 > ul > li > a > span { color: #000000; display: block; line-height: 1.6rem; font-size: 1.2rem; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.link.lnk01 > ul > li > a > p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; color: #444444; font-size: 0.9rem; line-height: 1.4rem; min-height: 1rem; max-height: 2.8rem; margin:0.5rem 0; word-break: keep-all; }
	.link.lnk01 > ul > li > a > em { border-radius: 1.5rem; background: #ededed; height: 2rem; display: inline-flex; align-items: center; justify-content: center; gap: 0 0.5rem; padding: 0 0.75rem; color: #000000; width: 6.5rem; }
	/* 바로가기01 : active */
	.link.lnk01 > ul > li > a > span,
	.link.lnk01 > ul > li > a > p,
	.link.lnk01 > ul > li > a > em,
	.link.lnk01 > ul > li > a::before,
	.link.lnk01 > ul > li > a { transition: 0.2s; }
	.link.lnk01 > ul > li > a:hover,
	.link.lnk01 > ul > li > a:focus { background: #215c00; }
	.link.lnk01 > ul > li > a:hover::before,
	.link.lnk01 > ul > li > a:focus::before { background: url('/images/bohun/template/H5/main/linkBgOn.png')no-repeat; opacity: 0.2; }
	.link.lnk01 > ul > li > a:hover > span,
	.link.lnk01 > ul > li > a:focus > span,
	.link.lnk01 > ul > li > a:hover > p,
	.link.lnk01 > ul > li > a:focus > p { color: #fff; }
	.link.lnk01 > ul > li > a:hover > em,
	.link.lnk01 > ul > li > a:focus > em { color: #fff; background: #1a4a00; }

	/* 바로가기02 */
	.link.lnk02 { padding: 0 1.5rem; }
	.link.lnk02 > ul { justify-content: space-between; }
	.link.lnk02 > ul > li > a { display: flex; flex-direction: column; min-width: 6rem; word-break: keep-all;}
	.link.lnk02 > ul > li > a .img { border-radius: 50%; width:5rem; height: 5rem; display: inline-flex; margin:0 auto; align-items: center; justify-content: center; background: #fff; }
	.link.lnk02 > ul > li > a > p { display: block; color: #000000; font-size: 0.9rem; overflow: hidden; line-height: 1rem; max-height: 2rem; text-align: center; margin-top: 1.1rem; word-break: break-all;}
	/* 바로가기02 :  active */
	.link.lnk02 > ul > li > a .img > img { transition: 0.2s; }
	.link.lnk02 > ul > li > a:hover .img > img,
	.link.lnk02 > ul > li > a:focus .img > img { transform: rotateY(180deg); }

/* 게시판 */
.notice { position: relative; }
.notice .tabLst { display: flex; align-items: center; gap: 0.5rem 2.7rem; margin-right: 3.5rem; } 
.notice .tabLst li { max-width: calc((100% - 5.4rem) / 3); }
.notice .tabLst li > a { display: block; white-space: nowrap; overflow: hidden; font-size: 1.2rem; color: #444444; }
.notice .tabBox { margin-top: 1.2rem; }
.notice .tabBox .box { display: none; }
.notice .tabBox .box.on { display: block; }
.notice .tabBox .box > ul { display: flex; justify-content: space-between; gap: 2rem; }
.notice .tabBox .box > ul > li { width: calc((100% - 4rem) / 3); }
.notice .tabBox .box > ul > li.no_data { display: flex; align-items: center; justify-content: center; width: 100%; font-size: 0.9rem; background: #e1e1e1; border-radius: 0.5rem; font-weight: 500; height: 11rem; }
.notice .tabBox .box > ul > li:nth-child(n + 4) { display: none; }
.notice .tabBox .box > ul > li > a { display: block; border-radius: 0.5rem; box-shadow: 0px 0px 30px rgba(0,0,0,0.1); background: #fff; padding: 1.7rem 2rem; }
.notice .tabBox .box > ul > li > a > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; color: #000000; font-size: 1rem; font-weight: bold; line-height: 1.4rem; height: 2.8rem; } 
.notice .tabBox .box > ul > li > a > p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; color: #444444; line-height: 1.2rem; height: 2.4rem; margin: 0.55rem 0 0.75rem; }
.notice .tabBox .box > ul > li > a > em { display: block; color: #555555; font-size: 0.75rem; } 
/* 게시판 : active */
.notice .tabBox .box > ul > li > a,
.notice .tabLst li > a { transition: color 0.2s; }  
.notice .tabLst li > a:hover,
.notice .tabLst li > a:focus,
.notice .tabLst li > a.current { font-weight: bold; color: #000000; }
.notice .tabBox .box > ul > li > a:hover,
.notice .tabBox .box > ul > li > a:focus { background: #368509; }
.notice .tabBox .box > ul > li > a:hover > span,
.notice .tabBox .box > ul > li > a:focus > span,
.notice .tabBox .box > ul > li > a:hover > p,
.notice .tabBox .box > ul > li > a:focus > p,
.notice .tabBox .box > ul > li > a:hover > em,
.notice .tabBox .box > ul > li > a:focus > em { color: #fff; }

/* 팝업존 */
.popupzone { position: relative; }
.popupzone #popupSlider { border-radius: 0.5rem; isolation: isolate; background: #e1e1e1; overflow: hidden; }
.popupzone .item a { position: relative; display: flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; }
.popupzone .item a::before { position: absolute; content: ""; width: 100%; height: 100%; background: transparent; border: 2px solid #000000; left: 0; top: 0; opacity: 0; border-radius: 0.5rem; }
.popupzone .item a > img { max-width: 100%; }
.popupzone .control { position: absolute; left: 50%; transform: translateX(-50%); border-radius: 1.5rem; background: #fff; height: 2rem; display: flex; align-items: center; padding: 0 1.25rem; bottom: -1rem; box-shadow: 0px 0px 20px rgba(0,0,0,0.2); }
.popupzone .control > a { display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; color: #000000; }
.popupzone .control > a.stop,
.popupzone .control > a.play { margin: 0 0.1rem; }
.popupzone .control > a.play { display: none; }
.popupzone .control .page { display: flex; align-items: center; margin-right: 0.5rem; line-height: 1.15rem; }
.popupzone .control .page > strong { font-weight: bold; color: #215c00; } 
.popupzone .control .page > span { position: relative; padding-left: 0.65rem; margin-left: 0.4rem; color: #444444; }
.popupzone .control .page > span::before { position: absolute; content: ""; left: 0; top: 50%; transform: translateY(-50%); border-radius: 50%; background: #aeb4bc; width: 0.2rem; height: 0.2rem; }
/* 팝업존 : active */
.popupzone .item a::before { transition: 0.2s; }
.popupzone .item a:focus::before { opacity: 1; }

/*** 반응형 ***/
@media screen and (max-width: 1440px) {

	/* 게시판 */
	.notice .tabBox .box > ul > li { width: calc((100% - 2rem) / 2); }
	.notice .tabBox .box > ul > li:nth-child(n + 3) { display: none; }
}

@media screen and (max-width: 1280px) {
	/* 바로가기 */
	.link.lnk01 > ul{ flex-direction: row;}
	.link.lnk01 > ul > li{width: calc(50% - 1rem); height: 100%;}
}

@media screen and (max-width: 1240px) {
	/* 바로가기 */
	.link.lnk01 > ul > li > a { padding: 1.5rem 2rem 1.25rem; }
	.link.lnk01 > ul > li > a > span { font-size: 1.1rem; }
	.link.lnk01 > ul > li > a > p { font-size: 0.85rem; line-height: 1.2rem; height: 2.4rem; }

	.link.lnk02 { padding: 0; }
	.link.lnk02 > ul > li > a { min-width: 0px; }
	.link.lnk02 > ul > li > a .img { height: 4.5rem; width: 4.5rem; border-radius: 0.5rem; }
	.link.lnk02 > ul > li > a .img > img { max-width: 2.75rem; }
	.link.lnk02 > ul > li > a > p { font-size: 0.8rem; }

	/* 게시판 */
	.notice .tabBox .box > ul { gap: 1rem; }
	.notice .tabBox .box > ul > li { width: calc((100% - 1rem) / 2); }
}

@media screen and (max-width: 1024px) {
	.btn_more { top: -0.35rem; }
	.tbl_utile {position:absolute; top:0; right:0;}
	

	/* 바로가기 */
	.link.lnk01 > ul > li > a { padding: 1.25rem 1.5rem; }
	.link.lnk01 > ul > li > a::before,
	.link.lnk01 > ul > li > a:hover::before,
	.link.lnk01 > ul > li > a:focus::before { right: -2rem; bottom: -1rem; }
	.link.lnk01 > ul > li > a > span { padding-right: 3.5rem; }
	.link.lnk01 > ul > li > a > p { -webkit-line-clamp: 1; line-height: 1.4rem; height: 1.4rem; margin: 0.5rem 0 0 0; }
	.link.lnk01 > ul > li > a > em { position: absolute; border-radius: 50%; text-indent: -9999px; width: 2rem; padding: 0; gap: 0; top: 1rem; right: 1.5rem; }
	.link.lnk01 > ul > li > a > em > i { text-indent: 0; }

	.link.lnk02 > ul > li > a .img { height: 4rem; width: 4rem; }
	.link.lnk02 > ul > li > a .img > img { max-width: 2.5rem; }
	.link.lnk02 > ul > li > a > p { font-size: 0.75rem; margin-top: 0.5rem; line-height: 0.9rem; max-height: 1.8rem; }

	/* 게시판 */
	.notice .tabLst { gap: 2.25rem; }
	.notice .tabLst li > a { font-size: 1rem; }
	.notice .tabBox .box > ul > li > a { padding: 1.7rem 1.55rem; }
}

@media screen and (max-width: 900px) {
	/* 바로가기 */
	.link.lnk01 > ul { gap: 1.5rem; flex-direction:unset;}
	.link.lnk01 > ul > li { width: calc((100% - 1.5rem) / 2); min-height:6.25rem;}
	.link.lnk01 > ul > li > a::before,
	.link.lnk01 > ul > li > a:hover::before,
	.link.lnk01 > ul > li > a:focus::before { background-size: 7rem; right: -3rem; bottom: -1.75rem; }
	/* .link.lnk01 > ul > li > a > span {min-height:3rem;} */

	.link.lnk02 > ul { flex-wrap: wrap; justify-content: start; gap: 1.5rem 0; }
	.link.lnk02 > ul > li { width: calc(100% / 4); flex: none; }
	.link.lnk02 > ul > li > a { margin: 0 auto; }
}

@media screen and (max-width: 680px) {
	/* 바로가기 */
	.link.lnk01 > ul { gap: 0.75rem; }
	.link.lnk01 > ul > li { width: 100%; height: auto; min-height: auto;}
	.link.lnk01 > ul > li > a > p{ min-height: 0px; height: auto;}
	
}

@media screen and (max-width: 480px) {
	.btn_more { width: 2rem; height: 2rem; top: -0.25rem; }

	/* 메인비주얼 */
	.Mvisual .control { padding: 0 1rem; height: 2rem; }
	.Mvisual .control > a { font-size: 1rem; }

	/* 바로가기 */
	.link.lnk01 > ul > li > a { padding: 1rem; }
	.link.lnk01 > ul > li > a > em { right: 1rem; }
	.link.lnk01 > ul > li > a::before, 
	.link.lnk01 > ul > li > a:hover::before, 
	.link.lnk01 > ul > li > a:focus::before { bottom: -3.5rem; right: -2.5rem; }

	.link.lnk02 > ul > li > a { width: 100%; padding: 0 0.75rem; }
	.link.lnk02 > ul > li > a .img { height: 3.5rem; width: 3.5rem; margin: 0 auto; }
	.link.lnk02 > ul > li > a .img > img { max-width: 2.25rem; }

	/* 게시판 */
	.notice .tabLst { flex-wrap: wrap; gap: 0.5rem 2rem; }
	.notice .tabLst li { max-width: 100%; }
	.notice .tabBox .box > ul { gap: 0.75rem; flex-wrap: wrap; } 
	.notice .tabBox .box > ul > li { width: 100%; }
	.notice .tabBox .box > ul > li > a { padding: 1rem; }
	.notice .tabBox .box > ul > li > a > span { -webkit-line-clamp: 1; height: 1.2rem; line-height: 1.2rem; font-size: 0.9rem; }
	.notice .tabBox .box > ul > li > a > p { -webkit-line-clamp: 1; font-size: 0.75rem; line-height: 1rem; height: 1rem; margin: 0.55rem 0 0.35rem; }
}

@media screen and (max-width: 380px) {
	.btn_more { width: 1.5rem; height: 1.5rem; font-size: 0.9rem; top: -0.07rem; }

	/* 메인비주얼 */
	.Mvisual .control { padding: 0 0.75rem; height: 1.75rem; }
	.Mvisual .control .page { font-size: 0.65rem; }
	.Mvisual .control > a { font-size: 0.9rem; }
	.Mvisual .control .page > span::before { width: 0.2rem; height: 0.2rem; }
	.Mvisual .control .page > span { padding-left: 0.75rem; margin-left: 0.6rem; }
	.Mvisual .control > a.stop, 
	.Mvisual .control > a.play { margin: 0 0.25rem; }

	/* 바로가기 */
	.link.lnk01 > ul { gap: 0.5rem; }
	.link.lnk01 > ul > li > a > span { font-size: 0.9rem; padding-right: 2rem; }
	.link.lnk01 > ul > li > a > p { font-size: 0.7rem; margin-top: 0.15rem; }
	.link.lnk01 > ul > li > a > em { width: 1.5rem; height: 1.5rem; }

	.link.lnk02 > ul { gap: 0.75rem 0; }
	.link.lnk02 > ul > li { width: calc(100% / 3); }
	.link.lnk02 > ul > li > a .img { height: 3rem; width: 3rem; }
	.link.lnk02 > ul > li > a .img > img { max-width: 2rem; }

	/* 게시판 */
	.notice .tabLst { margin-right: 2rem; gap: 0.5rem 1.75rem; }
	.notice .tabLst li > a { font-size: 0.9rem; }
	.notice .tabBox { margin-top: 0.85rem; }
	.notice .tabBox .box > ul > li.no_data { font-size: 0.75rem; height: 5rem; }
	.notice .tabBox .box > ul > li > a { padding: 0.8rem 0.75rem; } 
	.notice .tabBox .box > ul > li > a > span { font-size: 0.8rem; }
	.notice .tabBox .box > ul > li > a > p { font-size: 0.7rem; margin: 0.5rem 0 0.25rem; }
	.notice .tabBox .box > ul > li > a > em { font-size: 0.65rem; }

	/* 팝업존 */
	.popupzone .control { height: 1.75rem; bottom: -0.875rem; }
	.popupzone .control .page { font-size: 0.65rem; }
	.popupzone .control > a { font-size: 0.9rem; }
}