@charset "utf-8";
/* 서브 비주얼*/
#subVis {position: relative; width: 100%; height: 240px; background-color: #000; background-repeat: no-repeat; background-size: cover;}
#subVis .subBg {height: 100%;}
#subVis .inner {position: absolute; top: 0; left: 0; right: 0; height: 100%;}
#subVis .subVisCon {display: flex; align-items: center; justify-content: center; height: 100%;}
#subVis .pageInfo {color: #fefeff; text-align: center;}
#subVis .pageTit {font-size: 1.45rem; font-weight: 400; padding-bottom: 13px;}
#subVis .pageTxt {font-size: 2.8rem; font-weight: 700; text-shadow: 2px 3px 7px #2e2e2e; letter-spacing: 2px;}

#subCont {overflow: hidden; height: 100%; min-height: 400px; margin:60px 0 100px;}

/* 왼쪽 메뉴*/
#lnb {float: left; width: 250px;}
#lnb .subMenuTit {position: relative; width: 100%; margin-bottom: 7px; border-radius: 15px; background: #1b224e; padding: 54px 0; color: #fff;}
#lnb .subMenuTit:before {content: ''; display: block; position: absolute; left:0; bottom:0; width: 250px; height: 31px; background: url('../images/edu/menu_title_img.png'); background-size: contain; background-repeat: no-repeat; opacity: .1;}
#lnb .subMenuTit span {display: block; text-align: center; font-size: 26px; font-weight: 500;}
#lnb .lnbDepth2 {font-weight: 500;}
#lnb .lnbDepth2 li {border: 1px solid #e0e0e0; border-radius: 10px; margin-bottom: 7px;}
#lnb .lnbDepth2 li a {position: relative; display: block; width: 100%; padding: 19px 20px 19px 34px; color: #343434; height: 55px;}
#lnb .lnbDepth2 li a:before {content: ''; position: absolute; top: 50%; left: 19px; transform: translateY(-50%); display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: #0076e4;}

#lnb .lnbDepth2 .active {border: 1px solid #202291; background: #202291; border-top-right-radius: 2px; border-bottom-right-radius: 2px;}
#lnb .lnbDepth2 .active a {color:#fff;}
#lnb .lnbDepth2 .active a:before {background: #fff;}
#lnb .lnbDepth2 .active a:after {content: ''; position: absolute; top: 50%; right: -16px; transform: translateY(-50%); display: inline-block; width: 18px; height: 56px; background: url('../images/edu/lnb_on_bg.png'); background-size: contain; background-repeat: no-repeat;}

/* 서브 컨텐츠 */
.subConWrap {float: right; width: calc(100% - 310px);}
.subConWrap .subTop {position: relative; margin-bottom: 50px}
.subConWrap .subConTit {position: relative; color: #222; font-size: 30px; font-weight: 700;}
.subConWrap .subConTit:after {content: ''; position: absolute; bottom: 00; left: 0; display: block; width: 100%; height: 1px; background: #171717; z-index: -1;}
.subConWrap .subConTit span {display: block;  padding:20px 0 33px;}

/* 네비게이션 */
.pageNav ul {display: flex; flex-direction: row; align-items: center;}
.pageNav ul li {position: relative;}
.pageNav ul a {color: #666; font-size: 16px; font-weight: 400;}

.pageNav li:after {content:'';display: inline-block; vertical-align: middle; width: 3px; height: 3px; margin: 0 11px; border-radius: 50%; background-color: #666;}
.pageNav li:last-child::after {display: none;}
.pageNav ul .home a::before {content: ''; display: inline-block; vertical-align: middle; width: 17px; height: 15px; background-image: url('../images/common/home_icon.png'); background-repeat: no-repeat; background-size: contain;}

/* 컨텐츠*/
/*교육센터 소개*/
.intro p {text-align: left; color: #343434; font-size: 1.2rem; line-height: 1.5; padding: 0 0 10px; letter-spacing: -.5px;}
.intro p strong {font-size: 1.4rem; padding-right: 3px; color: #202291;}

/* 교육장 찾아 오는 방법*/
.map > div:not(:first-child) {padding-top: 50px; margin-top: 60px; border-top: 1px dashed #ddd;}
.map h4 {position: relative; margin-bottom: 30px; padding-left: 17px; font-size: 20px; font-weight: 700;}
.map h4:before {content: ''; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; border-radius: 50%; background-color: #202291;}
.map .mapImg {width: 100%; height: 500px; background-color: #f7f7f7;}
.map .mapTxt {margin-top: 80px;}
.map .mapTxt > dl {overflow: hidden; margin-bottom: 45px;}
.map .mapTxt > dl > dt {font-weight: bold; font-size: 18px; color: #222; float: left;}
.map .mapTxt > dl > dd {float: left; margin-left: 64px;}
.map .mapTxt > dl:first-child > dd {font-size: 28px; line-height: 1.4;}
.map .mapTxt > dl:first-child > dd em {font-size: 24px;}
.map .mapTxt > dl:nth-child(2) {margin-bottom: 20px;}
.map .mapTxt > dl:nth-child(2) > dd dl {float: left; margin-right: 60px;}
.map .mapTxt dl dd .parking {font-size: 20px; line-height: 1.4;}
.map .mapTxt dl dd dl {margin-bottom: 20px;}
.map .mapTxt dl dd dl dt {font-weight: bold; font-size: 16px; line-height: 23px; color: #0076e4; margin-bottom: 5px;}
.map .mapTxt dl dd dl dd {font-size: 20px; line-height: 29px;}


/* 교육센터*/
/* 교육센터 게시판*/
.eduBg {width: 100%; height: 100%; background-image: linear-gradient(45deg, #4476ed, #3342ad00);}
.edu .conTitNm:before {content:'OSANGJAIEL'; font-size: 2.5rem; color: #e6ecf1; position: absolute; top: 0; left: 0; transform: translateY(-50%); z-index: -1; letter-spacing: -.05em;}

.edu .boardWrap .boardBasic th,
.edu .boardListBox .boardBasic td {padding: 17px 5px;}
.edu .boardWrap .boardPagerBox {margin-top: 65px;}

.edu .boardList {margin-top: 15px;}

/* 알림 박스*/
.dataInfoBox {margin-bottom: 25px; padding: 10px 10px; background-image: url('../images/sub/info_line.png'); background-color: #f2fffd;} /*f2f9ff*/
.dataInfoBox .dataInfoBoxInner {padding: 30px 3%; background-color: #ffffff;}
.dataInfoBox .dataInfoBoxInner .text:not(:last-child) {margin: 0 0 19px;}
.dataInfoBox .dataInfoBoxInner .text p {font-size: 1.06rem; color: #333; font-weight: 500; line-height: 1.2;}
.dataInfoBox .dataInfoBoxInner .text p em {    color: #c90000;}
.dataInfoBox .dataInfoBoxInner .text span {display: inline-block; font-size: 15px; color: #6e6e6e; font-weight: 400; margin-top: 7px;}
.dataInfoBox .dataInfoBoxInner .text .pageLink {color: #0076e4; border-bottom: 1px solid #0076e4; font-weight: 700;}
.dataInfoBox .dataInfoBoxInner .text .txtLg {text-align: center; font-size: 1.35rem; line-height: 1.4;} /* 추가*/

/* 검색 박스*/
.bodSearchBox {padding: 20px 3%; border: 1px solid #d9dddf; margin-bottom: 60px; border-radius: 10px;}
.bodSearchBox * {margin: 2px 0;}
.bodSearchBox dl {display: flex; align-items: center; width: 100%; padding-top: 5px; padding-bottom: 5px; clear: both; gap: 20px;}
.bodSearchBox dl dt {font-size: 1rem; flex: 0 0 8rem; font-weight: 600; color: #222;}
.bodSearchBox dl dd {position: relative; display: flex; flex-wrap: wrap; align-items: center; color: #6b6a6a; font-size: 15px;}
.bodSearchBox dl.boardSearch {justify-content: flex-start;}
.bodSearchBox dl.boardSearch.etc {justify-content: center;}

.bodSearchBox .type {margin-right: 5px;}
.bodSearchBox .type input {color: rgba(255, 255, 255, 1); border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
.bodSearchBox .type input[type="checkbox"] {display: none; visibility: hidden;}
.bodSearchBox .type input[type=checkbox]:checked ~ label {color: #FFF; font-weight: 500;}
.bodSearchBox .type input[type=checkbox]:checked ~ label:before {top: 0; width: 100%; background: #0076e4;}
.bodSearchBox .type input[type=checkbox] + label {position: relative; display: inline-flex; justify-content: center; min-width: 4rem; padding-left: 15px; padding-right: 15px; line-height: 2.3rem; cursor: pointer; color: #343434; z-index: 1; font-size: .95rem; margin: 2px .5rem 2px 0 !important;}
.bodSearchBox .type label:before {content: " "; position: absolute; left: 0; display: block; width: 100%; height: 2.3rem; top: 0; border-radius: 5px; z-index: -1; background-color: #e9eff2;}
.bodSearchBox .type label,
.bodSearchBox .type label:before {transition: 0.25s all ease;}

.bodSearchBox .type02 label:before {height: 2.8rem; background-color: #fff; border: 1px solid #d3dee3;}
.bodSearchBox .type02 input[type=checkbox] + label {font-size: 0; line-height: 2.8rem; align-items: center;}
.bodSearchBox .type02 input[type=checkbox]:checked ~ label:before {background-color: #fff; border: 1px solid #0076e4;}
.bodSearchBox .type02 input[type=checkbox] + label img {width: 85%;}

.bodSearchBox select {padding: 0 5.5rem 0 1.5rem; appearance: none; background: url('../images/common/select_icon.png') no-repeat 100% 50% #fff; }

.bodSearchBox select,
.bodSearchBox input[type="text"],
.bodSearchBox input[type="number"] {border: 1px solid #d9dddf; border-radius: 5px; height: 2.5rem; margin: 4px 5px 4px 0; min-width: 0; max-width: 100%; font-size: .95rem;}

.boardListBtn {display: inline-block; padding: 8px 10px; font-size: 0.9rem; vertical-align: middle; color: #fff !important; border-radius: 5px;}
.boardListBtn.btnBlue {background-color: #033cbb;}
.boardListBtn.btnGray {background-color: #4f4f4f;}
.boardListBtn.btnGreen {background-color: #0a8d2c;}


/* 교육센터 게시판 상세*/
/* 공통*/
.edu .conTitEdu:before {content:'DETAILS'; font-size: 2.5rem; color: #e6ecf1; position: absolute; top: 0; left: 0; transform: translateY(-50%); z-index: -1; letter-spacing: -.05em;}

/* 서브 이미지 & 타이틀*/
.eduBg .subVisCon {justify-content: start !important; padding: 0 4rem;}
.eduBg .pageInfo {text-align: left !important;}
.eduBg .pageInfo .state {display: inline-block; margin-bottom: 25px; font-size: 1.02rem; font-weight: 500; letter-spacing: 0; padding: 10px 17px; border-radius: 6px; border: 1px dashed rgb(255 255 255 / 40%);}
.eduBg .pageInfo .state.btnBlue {background-color: #033cbb;}
.eduBg .pageInfo .state.btnGray {background-color: #5b5b5b;}
.eduBg .pageInfo .state.btnGreen {background-color: #087d26;}

.info.state {display: inline-block; font-size: 0.98rem; letter-spacing: 0; padding: 9px 15px; border-radius: 6px; color: #fff; text-indent: 0;}
.info.state.btnBlue {background-color: #033cbb;}
.info.state.btnGray {background-color: #5b5b5b; color: rgba(255, 255, 255, 0.8);}
.info.state.btnGreen {background-color: #087d26;}
.info.state.btnYellow {background-color: #978a31;}

.eduBg .pageInfo .date {padding-top: 25px; font-size: 1.15rem;}

/* .edu .boardWrap {margin-top: 100px;} 다른페이지 176px */

/* 교육 일정표*/
.edu .eduCont .boardBasic th,
.edu .eduCont .boardBasic td {border-right: 1px solid #E1E1E1;}
.edu .eduCont .boardBasic th:last-child,
.edu .eduCont .boardBasic td:last-child {border-right: none;}

.edu .eduCont .boardListBox .boardBasic th,
.edu .eduCont .boardListBox .boardBasic td {text-align: left; text-indent: 15px;}

/* tab*/
.edu .eduCont .tabListWrap {margin-top: 85px;}
.edu .eduCont .subTabList {display: flex; justify-content: start; width: auto; margin: 0 0; gap: 40px; padding: 0 0; background-color: transparent;}
.edu .eduCont .subTabList a {color: #d7d7d7; font-size: 24px; letter-spacing: -.8px; padding: 5px 0; font-weight: 600;}
.edu .eduCont .subTabList a:hover,
.edu .eduCont .subTabList a:active,
.edu .eduCont .subTabList .active a {color: #000;}

.edu .eduCont .subTabList li {position: relative;}
.edu .eduCont .subTabList li:first-child:after {content: ""; display: block; position: absolute; top: 50%; right: -25px; width: 5px; height: 5px; background-color: #d7d7d7; border-radius: 50%; transform: translateY(-50%);}

.edu .eduCont .tabCont .tabItem.active {display: block !important;}
/* btn*/
.edu .eduCont .boardBtnBox ul {justify-content: center; margin-top: 65px;}

/* 교육센터 서브비주얼 시안2*/
.eduSub {height: 400px !important;}
.eduSub .pageTit {font-size: 3.45rem !important;}
.eduSub .pageTxt {margin-top: 25px !important; font-size: 1.23rem !important;}


/* list style */
.listSt01 li {position:relative; padding-left:10px; line-height:1.5; word-break:keep-all;}
.listSt01 li:not(:last-child) {margin-bottom:7px;}
.listSt01 li::before {content:'-'; position:absolute; left:0; display:inline-block;}


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

}

@media all and (max-width: 1240px) {

   /* 왼쪽 메뉴*/
   #lnb {width: 230px;}

   /* 서브 컨텐츠 */
   .subConWrap {width: calc(100% - 290px);}

   /* 교육센터 게시판 상세*/
   .edu .eduCont .tabListWrap {padding: 0 0;}

}

@media all and (max-width: 1024px) {

   /* 왼쪽 메뉴*/
   #lnb {display: none;}

   /* 서브 컨텐츠 */
   .subConWrap {width: 100%;}

   /* 교육센터 게시판 상세*/
   .eduBg .subVisCon {padding: 0 0;}
   .edu .eduCont .subTabList li {width: auto;}

}

@media all and (max-width: 768px) {

   #subCont {margin: 50px 0 100px;}

   /* 서브 컨텐츠 */
   .subConWrap .subConTit {font-size: 25px;}
   .subConWrap .subConTit span {padding: 20px 0 25px;}

   /* 교육센터 게시판*/
   .edu .boardListBox .boardBasic td.tbDate span br {display: none;}

   /* 교육센터 게시판 상세*/
   .edu .eduCont .tabListWrap {margin-top: 65px;}
   .edu .eduCont .subTabList a {font-size: 20px; padding: 0 0;}
   .edu .eduCont .subTabList li:first-child:after {right: -15px;}

   /* 컨텐츠*/
   /*교육센터 소개*/
   .intro p {font-size: 17px;}




}

@media all and (max-width:640px){

   /* 교육센터 검색 박스*/
   .bodSearchBox {padding: 10px 3%;}
   .bodSearchBox dl {display: block; margin-bottom: 10px;}
   .bodSearchBox dl dt {margin-bottom: 5px; font-size: .95rem;}
   .bodSearchBox .boardSearch .searchForm {display: block; width: 100%;}
   .boardSearch .btnSearchKo {width: 100%;}

}

@media all and (max-width: 420px) {



}