/* 게시판 공통 */
#bo_gall, #bo_w, #bo_v, #bo_list {max-width: 1200px; min-height: 400px; margin: 60px auto 100px auto;}


/**********************************************************************
********************    레이아웃   ********************************
**********************************************************************/
.wrappwe{border:1px solid red; }
.contents_container{width:100%; margin: 0 auto;}

/*   상단 메뉴*/
#gnb { }


/*  콘텐츠 영역  */
main{margin-top: 40px;}
#location_container{text-align:center; }

.location_breadcrumb{}
.location-container{}

.SubContents_container{}

@media (max-width:1439px){
	.location_breadcrumb{
	display:flex;
	flex-direction: column-reverse;
		}
	.lnb{display:none;}
}


@media (min-width: 1440px) {
	.lnb_wrap{padding: 40px 0;}
	.lnb{width: 270px; border: 1px solid var(--gray1); border-radius: 10px;}
}


/**********************************************************************
********************    좌 측 메 뉴   ********************************
**********************************************************************/
#mysubmenu .leftmenu_b::after {
    content: '';
    position: absolute;
    background-image: url(../images/sub_menu_bg.svg);
    background-repeat: no-repeat;
    width: 100%;
    height: 160px;
    opacity: 46%;
    left: -40px;
    top: -10px;
	z-index: 1;
}
#mysubmenu ul{margin-bottom: 0;}
#mysubmenu .leftmenu_b {position: relative; padding: 50px 0; text-align:center; font-size:24px; font-weight:bold; border-radius: 10px; background: var(--main); box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 18px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; overflow: hidden;}
#mysubmenu .leftmenu_b + ul {padding: 20px 16px;}
#mysubmenu .leftmenu_b a{position: relative; padding: 40px 0; margin-bottom:15px; color: #fff; text-align:center; font-size:24px; font-weight:bold; z-index: 2;}
#mysubmenu .leftmenu_s{ border-bottom: 1px dashed var(--gray1);}
/* #mysubmenu .leftmenu_s:last-of-type{border-bottom: none;} */
#mysubmenu .leftmenu_s > a {display: flex; justify-content: space-between; align-items: center; font-size: 17px; color:#333; }
#mysubmenu .leftmenu_s a{display: flex; padding: 14px 0 14px 20px; color: #000;}
#mysubmenu .leftmenu_s a.active{color: var(--main); font-weight:bold;}
#mysubmenu .leftmenu_s:last-child .leftmenu_ul2{border-radius: 0 0 50px 0;}
#mysubmenu .gnb_3da{ padding: 12px 0 12px 20px;}
#mysubmenu .gnb_3dli.active .gnb_3da {color: #007BFF; font-weight: bold;}
#mysubmenu .gnb_3dli{padding: 0;}
.leftmenu_ul2{background: #faf8f9;}
.leftmenu_li{border-top: 1px solid #d2d2d2;}
.leftmenu_a2{margin-left: 10px; font-size: 14px;}
.depth_arrow{position: relative;}
.depth_arrow::before{content: "\f078"; display: inline-block; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; top: 26%; right: 7%; color: #999;}
.leftmenu_ul2{display: none;}
.depth_arrow.on .leftmenu_ul2{display: block;}
.depth_arrow.on::before{transform: rotate(180deg);}


.contents_container_0{max-width: 1320px; margin: 0 auto;}
#mysubmenu .leftmenu_s .gnb_3dul_box {display: none;}
#mysubmenu .leftmenu_s .menu-icon {margin-left: 10px; transition: transform 0.3s; font-size: 14px;}
#mysubmenu .gnb_3dul_box {display: flex; flex-direction: column; padding: 10px; background: #fff;}


/* 2차 메뉴 active */
#mysubmenu .leftmenu_s.active{position: relative;}
#mysubmenu .leftmenu_s.active > a,
#mysubmenu .leftmenu_s:hover > a {text-decoration: none; font-weight: 600; color: var(--main);}
#mysubmenu .leftmenu_s.active > a::after {content: ''; position: absolute; display: block; width: 100%; height: 2px; top: 53px; left: 0; background: var(--main);}
#mysubmenu .leftmenu_s.active > a .toggle-icon::before{background: var(--main);}

/* 3차 메뉴 : hover + active */
#mysubmenu .leftmenu_s .gnb_3dli:hover > a,
#mysubmenu .leftmenu_s .gnb_3dli.active > a {background: var(--blue1); color: var(--main); font-weight: bold; border-radius: 10px;}
#mysubmenu .leftmenu_s .gnb_3dli > a,
#mysubmenu .leftmenu_s .gnb_3dli > a{padding: 10px 0 10px 20px;}

/* 서브메뉴 기존 충돌 방지용 세부 선택자 */
#mysubmenu .leftmenu_s .gnb_3dul_box{display:none;}


/* +,- 아이콘 */
.toggle-icon {position: relative; width: 12px; height: 12px; margin-left: 8px; display: inline-block;}
.toggle-icon::before,
.toggle-icon::after {content: ""; position: absolute; background: var(--gray2); transition: all 0.3s ease;}

/* 가로 선 ( - ) */
.toggle-icon::before {top: 50%; left: 0; width: 12px; height: 2px; transform: translateY(-50%);}

/* 세로 선 ( | ) – plus일 때만 보임 */
.toggle-icon.plus::after {left: 50%; top: 0; width: 2px; height: 12px; transform: translateX(-50%);}

/* minus일 땐 세로선 제거 */
.toggle-icon.minus::after {display: none;}


/* 정보공개 > 경영공시 하위메뉴 감추기 */
/* 삭제해야할 경우 skin/nav/mysubmenu.php 하단 스크립트도 삭제 */
/* 권장: 본 페이지에만 적용 (예: body.page-openinfo-gongsi) */
body.page-openinfo-gongsi .lnb #mysubmenu #mysub5 .leftmenu_s.no-sub > a .toggle-icon {
  display: none !important;
}

/* 아이콘이 사라져도 오른쪽 여백이 남지 않게 */
body.page-openinfo-gongsi .lnb #mysubmenu #mysub5 .leftmenu_s.no-sub > a {
  padding-right: 0 !important;   /* 사이트 기본 스타일에 맞춰 수치 조정 */
}

/* 만약 body 클래스 못 쓰면, 앵커 속성으로 한정해도 OK */
.lnb #mysubmenu #mysub5 .leftmenu_s > a[href*="co_id=info_reports"] .toggle-icon {
  display: none !important;
}
.lnb #mysubmenu #mysub5 .leftmenu_s > a[href*="co_id=info_reports"] {
  padding-right: 0 !important;
}




@media (max-width:1280px){
	.contents_container,
	.contents_container_0{border:0; }
	.lnb{max-width: 220px; top: -240px;}
	#mysubmenu .leftmenu_b {padding: 28px 0; border-radius: 40px 0 0 0; }
	#mysubmenu > li > a{padding:8px 0 8px 16px; font-size:12px !important;}	
}


@media (max-width:1023px){
	.navbar{position:relative;}
	.contents_container,
	.contents_container_0{width: 100%; padding:0;}	
	.contentBody{width: 100%;}	
}



@media (max-width:639px) {
	.contents_container_0{padding:0;}
}




/**************************************
***************  브레이드크럼 *************
**************************************/
@media (max-width:960px){
#breadcrumb-container{padding:0; margin: 0 0 20px 0; background-color:#f8f8f8;}
}


nav.breadcrumb {
	font-size: 14px;
}

nav.breadcrumb a {
	position: relative;
	color: #333;
	text-decoration: none;
	margin-right: 5px;
	padding: 0 8px;
}

@media (min-width:1440px) {	nav.breadcrumb a:first-child{padding-left:0; } }

nav.breadcrumb a:hover {
	text-decoration: underline;
}

.menu-panel {
  width: 160px;
  border: 1px solid #ccc;
  padding: 20px;
  position: absolute;
  top: 20px;
  z-index: 10;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.menu-panel li {
	cursor: pointer;
	margin: 5px 0;
	padding: 0 8px;
}

.menu-panel li:hover {
	text-decoration: underline;
}

.breadcrumb{margin-bottom:0; padding: .75rem 0 !important;}

.breadcrumb a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	position: relative;
}

.breadcrumb_arrow_box{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff;
	margin-left: 8px;
	cursor: pointer;
}

.breadcrumb .arrow {
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 6px solid #333;
	transition: transform 0.2s ease;
}
.breadcrumb {
  background-color: transparent !important;
}
/* 열렸을 때 화살표 회전 (▼ -> ▲) */
.breadcrumb a[aria-expanded="true"] .arrow {
	transform: rotate(180deg);
}

.menu-panel {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 180px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 8px 0;
	box-shadow: 0 6px 20px rgba(0,0,0,.08);
	z-index: 20;
}

.menu-panel ul { list-style: none; margin: 0; padding: 0; }
.menu-panel li {
	padding: 8px 22px;
	cursor: pointer;
	white-space: nowrap;
}
.menu-panel li:hover { background: #f3f4f6; }

@media (min-width:1440px){
	#breadcrumb-container{padding:0;margin: 0; background-color:#fff;}
	#breadcrumb-container .breadcrumb_arrow_box{display:none}

}

.breadcrumb .menu-panel[hidden]{ display: none !important; }



/**********************************************************************
********************     서 브 페 이 지 공 통  css  ********************************
**********************************************************************/

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
  outline: 3px solid #1a73e8;   /* 파란색 아웃라인 */
  outline-offset: 2px;          /* 요소와 살짝 띄움 */
  background-color: #f0f7ff;    /* 배경 강조 (선택사항) */
}



a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px dashed #ff6600;  /* 주황색 테두리 */
  outline-offset: 3px;
  border-radius: 6px;
  background-color: #fff8f0;   /* 부드러운 강조 배경 */
  z-index: 50px;
}
img {max-width: 100%; display: block;}


.skip-link {
  position: absolute; left: -9999px;
  top: auto; width: 1px; height: 1px;
  overflow: hidden;
}
.skip-link:focus {
  position: fixed; left: 16px; top: 16px;
  width: auto; height: auto;
  padding: .75rem 1rem;
  background: #000; color: #fff;
  border-radius: .5rem;
  z-index: 1000;
}


h1{font-size: 28px; margin-bottom: 30px;}



@media (min-width:1440px){
	h1{font-size:32px;color:#181818; font-weight:500;margin-bottom:30px; }
}