@charset "utf-8";
/**************************************************/
/*                   MAINVISUAL                   */
/**************************************************/
#mainVisual .wrapper{position: absolute; z-index: 10; top: 0; left: 50%; height: 100%; margin: 0 0 0 -500px; text-align: center}
#mainVisual .wrapper .img{position: relative; z-index: 9}
#mainVisual .wrapper .text{position: absolute; width: 100%; right: 0; top:50%; margin: -40px 0 0 0; text-align: center}

#mainCategory{background: #e6e7e8}
#mainCategoryList{overflow: hidden}
#mainCategoryList li{float: left; width: 200px}
#mainCategoryList li a{display: block; text-align: center; color: #47535a; font-size: 15px; border-right: 1px solid #d3d3d4}
#mainCategoryList li:first-child a{border-left: 1px solid #d3d3d4}
#mainCategoryList li a:hover,
#mainCategoryList li a:focus{background: #0053a5; color:#fff}
#mainCategoryList li a span{position: relative;display: inline-block; *display: inline;zoom: 1;padding-left: 55px;line-height: 70px; font-weight: 700;}
#mainCategoryList .icon:after{content: "";display: block;position: absolute;left: 0;top: 0;width: 50px;height: 70px; background-image: url(../../images/main/img_category_new.png);background-repeat: no-repeat;}
#mainCategoryList .icon1:after{background-position: 0 center}
#mainCategoryList li a:hover .icon1:after,
#mainCategoryList li a:focus .icon1:after{background-image: url(../../images/main/img_category.png); background-position: 0 center}
#mainCategoryList .icon2:after{background-position: -50px center}
#mainCategoryList li a:hover .icon2:after,
#mainCategoryList li a:focus .icon2:after{background-image: url(../../images/main/img_category.png); background-position: -50px center}
#mainCategoryList .icon3:after{background-position: -100px center}
#mainCategoryList li a:hover .icon3:after,
#mainCategoryList li a:focus .icon3:after{background-image: url(../../images/main/img_category.png); background-position: -100px center}
#mainCategoryList .icon4:after{background-position: -150px center}
#mainCategoryList li a:hover .icon4:after,
#mainCategoryList li a:focus .icon4:after{background-image: url(../../images/main/img_category.png); background-position: -150px center}
#mainCategoryList .icon5:after{background-position: -200px center}
#mainCategoryList li a:hover .icon5:after,
#mainCategoryList li a:focus .icon5:after{background-image: url(../../images/main/img_category.png); background-position: -200px center}

.main_title{padding: 58px 0 90px 0; text-align: center; color: #3c3c3c}
.main_title h2{position: relative; height: 70px; line-height: 76px; font-size: 40px; font-weight: bold; font-family: "hyundaimedium", "현대체 Medium", "nanumgothic", "나눔고딕", "dotum", "돋움";}
.main_title h2:after{content: ""; display: block; position: absolute; left: 50%; top: 0; width: 50px; height: 1px; margin: 0 0 0 -25px; background: #3c3c3c}

#mainService{height: 682px; background: #efefef}
#mainServiceList{overflow: hidden; text-align: center}
#mainServiceList li{position: relative; display: block; float: left; width: 242px; height: 375px; margin: 0 0 0 10px; overflow: hidden; color: #6e6e6e; text-align: center; background: #fff}
#mainServiceList li:first-child{margin-left: 0}
#mainServiceList li *{display: block}
#mainServiceList li .img{position: relative; z-index: 0; vertical-align: top}
#mainServiceList li .text{position: absolute; left: 0; top: 306px; width: 100%; height: 187px; z-index: 1; -webkit-transition: background-color .3s; transition: background-color .3s}
#mainServiceList li .text p{line-height: 18px; visibility: hidden}
#mainServiceList li .subject{height: 60px; line-height: 69px; font-size: 20px; overflow: hidden}
#mainServiceList li.on a{color: #fff}
#mainServiceList li.on .text{z-index: 1; background: #094ba1 url(../../images/main/arr_category.png) center 137px no-repeat}
#mainServiceList li.on .text p{visibility: visible}

#mainRecruit{height: 555px; background: #fff}
#mainRecruitList{overflow: hidden}
#mainRecruitList li{position: relative; float: left; width: 242px; margin: 0 0 0 10px; overflow: hidden; color: #6e6e6e; text-align: center; background: #fff}
#mainRecruitList li:first-child{margin-left: 0}
#mainRecruitList li .text{display: block}
#mainRecruitList li .icon{display: block; width: 132px; height: 132px; margin: 0 auto 30px; background-image: url(../../images/main/img_recruit_new.png); text-indent: -9999px}
#mainRecruitList li .icon01{background-position: 0 top}
#mainRecruitList li a:hover .icon01,
#mainRecruitList li a:focus .icon01{background-position: 0 bottom}
#mainRecruitList li .icon02{background-position: -133px top}
#mainRecruitList li a:hover .icon02,
#mainRecruitList li a:focus .icon02{background-position: -133px bottom}
#mainRecruitList li .icon03{background-position: -266px top}
#mainRecruitList li a:hover .icon03,
#mainRecruitList li a:focus .icon03{background-position: -266px bottom}
#mainRecruitList li .icon04{background-position: -399px top}
#mainRecruitList li a:hover .icon04,
#mainRecruitList li a:focus .icon04{background-position: -399px bottom}
#mainRecruitList li .subject{position: relative; display: block; height: 61px; margin: 0 0 0 0; line-height: 80px; font-size: 20px; color: #3c3c3c}
#mainRecruitList li .subject:after{content: ""; display: block; position: absolute; left: 50%; top: 0; width: 20px; height: 1px; margin: 0 0 0 -10px; background: #3c3c3c}


#mainBoard{height: 686px; background: url(../../images/main/bg_board.jpg) center top no-repeat}
#mainBoard .main_title{color: #fff}
#mainBoard .main_title h2:after{background: #fff}
#mainBoardList{overflow: hidden}
#mainBoardList li{float: left; width: 239px; margin: 0 0 0 13px; background: #fff; border-width: 0 1px 1px 0; border-style: solid; border-color: #6e6e6e}
#mainBoardList li:first-child{margin-left: 0}
#mainBoardList li .img{border-bottom: 1px solid #c8c8c8; width: 239px; height: 180px;overflow: hidden; position: relative;}
#mainBoardList li .img img{vertical-align: top; width: 100%; min-height: 100%;}
#mainBoardList li a.text{display: block; position: relative; padding: 20px}
#mainBoardList li a.text *{display: block}
#mainBoardList li a.text:hover,
#mainBoardList li a.text:focus{text-decoration: underline}
#mainBoardList li .subject{color: #3c3c3c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
#mainBoardList li .con{height: 59px; margin: 15px 0 25px; font-size: 12px}
#mainBoardList li .date{font-size: 12px}