@charset "utf-8";

h1, h2, h3, h4, h5, h6{font-size:100%; font-weight:800; font-family:'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은고딕', 'Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
button{box-shadow:none; border:none; font-size:15px; vertical-align:top; font-family:'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은고딕', 'Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
body{color:#333; font-size:16px; font-weight:200; letter-spacing:-1px; -webkit-text-size-adjust:100%; font-family:'Noto Sans KR','Nanum Gothic', 'Malgun Gothic', '맑은고딕', 'Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}

#container_main{overflow:hidden; width:100%;}
#container_main h4{font-family:"paybooc"; font-weight:700; letter-spacing:-2px; color:#000;}

.more{z-index:1; position:absolute; top:0; right:0; display:block; width:40px; height:40px; border:1px solid #e5e5e5; border-radius:5px; font-size:0; text-indent:-999px; transition:0.25s ease-in-out; background:url(/source/korean/images/main2022/ico_ctrl.png) no-repeat 10px -19px; box-sizing:border-box;}
.more:hover{border-color:#00a3a0;}

.control:after{content:''; display:block; clear:both; width:100%;}
.control button{position:relative; float:left; width:40px; height:40px; font-size:0; text-indent:-9999px; box-sizing:border-box; background:url(/source/korean/images/main2022/ico_ctrl.png) no-repeat -94px -58px;}
.control .btn_next,
.control .slick-next{background-position:-144px -58px;}
.control .btn_stop{background-position:-40px 18px;}
.control .btn_stop.on{background-position:-70px 17px;}
.control button:hover{border-color:#00a3a0;}

/* 메인비주얼 */
#visual {position:relative; overflow:hidden; height:620px; margin:0 0 62px;}
#visual:before{z-index:2; content:''; position:absolute; top:0; left:50%; height:100%; width:100%; margin:0 0 0 115px; background:#333e59;}
#visual .pic{z-index:1; position:absolute; top:0; right:50%; margin:0 -115px 0 0;}
#visual .txt{z-index:2; position:relative; width:1200px; margin:0 auto; padding:87px 0 0 755px; box-sizing:border-box; color:#fff;}
#visual .slogan{position:relative; height:128px; margin:0 0 36px; font-size:28px; word-break:keep-all; letter-spacing:-2px; font-weight:700; font-family:"paybooc"; border-bottom:1px solid rgba(255,255,255,0.15);}
#visual .slogan p{padding:0 0 7px; line-height:110%; color:#fff; font-family:"paybooc"; font-weight:500;}
#visual .slogan strong{display:block; line-height:125%; font-size:44px; color:#fff; font-weight:700;}
#visual .slogan strong span{color:#eceda5; font-weight:800;}
#visual .detail{font-size:24px; color:#fff;}
#visual .detail > ul > li{padding:0 0 27px 14px;}
#visual .detail > ul > li:before{top:9px; background:#028e7d;}
#visual .detail > ul > li strong{display:block; height:35px; line-height:100%; font-weight:800;}
#visual .detail > ul > li p{position:relative; padding:0 0 0 10px; color:#ccc; font-size:16px; font-weight:200;}
#visual .detail > ul > li p:before{content:''; display:block; position: absolute; top:10px; left:0; width:4px; height:1px; background:#ccc;}
#visual .career div{overflow:hidden; width:434px; height:152px; padding:24px 24px 24px 24px; margin:7px 0 0 -2px; font-size:16px; font-weight:200; border-radius:10px; color:#fff; background:#252d41; box-sizing:border-box;}
#visual .career ul{overflow-y:scroll; height:100%; padding:0 5px 0 0;}
#visual .career ul::-webkit-scrollbar{width:5px;}
#visual .career ul::-webkit-scrollbar-thumb{background-color:#fff; border-radius:5px;}
#visual .career ul::-webkit-scrollbar-track{background-color:rgba(255,255,255,0.25); border-radius:5px;}
#visual .career li{padding-bottom:6px; line-height:140%;}
#visual .career li:before{top:10px; background-color:#fff;}

/* 게시판 */
#board{position:relative; float:left; width:100%; height:404px; box-sizing:border-box;}
#board h3{position:absolute; top:0; left:0; line-height:58px; font-size:36px; font-family:"paybooc"; letter-spacing:-2px; color:#000; font-weight:700;}
#board h3 span{color:#028e7d; font-weight:800;}
#board > ul{position:relative; float:left; width:100%; padding:0 58px 0 358px; box-sizing:border-box;}
#board > ul > li{float:left; width:25%; padding:0 8px 0 0; box-sizing:border-box;}
#board li h4{line-height:0; padding:0; letter-spacing:-1px;}
#board li h4 br{display:none;}
#board li h4 a{z-index:1; overflow:hidden; position:relative; display:block; width:100%; height:58px; line-height:58px; font-size:18px; font-weight:800; font-family:"Noto Sans KR"; color:#000; border-radius:5px; text-decoration:none; text-align:center; box-sizing:border-box; background:#eeeff0;}
#board li h4 a:before{z-index:-1; opacity:0; content:''; display:block; position:absolute; top:-5%; left:-130%; width:120%; height:110%; margin:0; background:#111d68; transform:skew(-20deg); transition:0.25s linear;}
#board li h4 a:hover{color:#fff; font-size:19px; transition:color 0.25s linear, font 0s 0.2s ease-in-out;}
#board li h4 a:hover:before{opacity:1; left:-10%;}
#board li.on h4 a{color:#fff; font-size:19px; background-color:#111d68;}
#board .con{visibility:hidden; opacity:0; position:absolute; top:69px; left:0; width:100%; box-sizing:border-box;}
#board .on .con{visibility:visible; opacity:1; top:79px; transition:0.25s ease-in-out;}
#board .list_wrap{z-index:1; width:100%; box-sizing:border-box;}
#board .list{float:left; width:23.91%; margin:0 1.4% 0 0;}
#board .list a{position:relative; display:block; height:249px; padding:36px 30px 0 34px; border-radius:10px; color:#666; text-decoration:none; border:1px solid #dfe3eb; box-sizing:border-box;}
#board .list:last-child{margin:0;}
#board .tit{display:inline-block; display:-webkit-box; vertical-align:top; height:60px; line-height:30px; color:#000; font-size:19px; font-weight:700; font-family:"paybooc"; overflow:hidden; text-overflow:ellipsis; white-space:normal; -webkit-line-clamp:2; -webkit-box-orient:vertical; box-sizing:border-box;}
#board .detail{display:inline-block; display:-webkit-box; vertical-align:top; margin:12px 0 38px; height:46px; line-height:23px; overflow:hidden; text-overflow:ellipsis; white-space:normal; -webkit-line-clamp:2; -webkit-box-orient:vertical; box-sizing:border-box;}
#board .detail img{max-width:100%;}
#board .file{float:right; display:block; width:18px; height:18px; margin:-3px 0 0 0; font-size:0; text-indent:-999px; background:url(/source/korean/images/main2022/ico_file.png) no-repeat;}
#board .date{float:left; display:block; line-height:100%; font-weight:700; color:#111d68; font-family:"paybooc";}
#board .none{width:100%; padding:3em 0 0 0 !important; text-align:center; background:none;}
#board .list a:hover{border-color:#111d68;}
#board a:hover .tit,
#board a:focus .tit,
#board a:active .tit{text-decoration:underline;}
#board .control{z-index:2; display:none; position:absolute; top:0; right:0;}
#board .more{display:none; width:58px; height:58px; border:none; background-color:#eeeff0; background-position:17px -150px; transition:none;}
#board .more:hover{background-color:#111d68; background-position:-28px -150px;}
#board .on .more{display:block;}

/* 갤러리 */
#gallery{clear:both; z-index:1; position:relative; width:100%; padding:93px 0 0 0; box-sizing:border-box; text-align:center; background:url(/source/member/images/main2022/bg_gallery.jpg) no-repeat 50% 100%;}
#gallery h4{height:82px; line-height:110%; font-size:45px; text-align:center; font-weight:800; color:#028e7d;}
#gallery h4 span{display:inline-block; line-height:100%; font-size:40px; font-weight:500; color:#000;}
#gallery .list_wrap{overflow:hidden; width:100%; text-align:left;}
#gallery .slick-center{position:relative; z-index:1;}
#gallery .list_wrap .list:not(:first-of-type){display:none;}
#gallery .list_wrap.slick-initialized .list:not(:first-of-type){display:block;}
#gallery .list{float:left;}
#gallery .list *{display:block;}
#gallery .list a{overflow:hidden; position:relative; width:274px; margin:20px 53px 89px 0; text-decoration:none; border-radius:10px; box-shadow:3px 3px 20px rgba(0,0,0,0.21); background:rgba(255,255,255,0.3); transition:0.25s ease-in-out;}
#gallery .img{position:relative; overflow:hidden;}
#gallery .img img{width:100%; height:246px; transition:0.5s ease;}
#gallery .sbj{position:relative; overflow:hidden; width:100%; height:88px; padding:20px 25px 0 27px; box-sizing:border-box;}
#gallery .tit{position:relative; z-index:1; display:block; max-width:100%; line-height:110%; margin:0 0 18px; color:#000; font-family:"paybooc"; font-size:17px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; box-sizing:border-box;}
#gallery .date{float:left; line-height:110%; color:#999; font-size:14px;}
#gallery .new{float:right; display:block; width:20px; height:20px; line-height:20px; margin:-3px 0 0 0; font-size:10px; text-align:center; color:#fff; border-radius:50%; letter-spacing:0; background:#028e7d; text-transform:uppercase;}
#gallery a:active img,
#gallery a:hover img,
#gallery a:focus img{transform:scale(1.1);}
#gallery .list a:hover{box-shadow:3px 3px 3px rgba(0,0,0,0.21);}
#gallery .control{z-index:1; position:absolute; right:50%; top:325px; margin:0 -600px 0 0; width:1200px;}
#gallery .control button{position:absolute; left:0; top:0; width:81px; height:81px; border-radius:50%; box-shadow:3px 3px 3px rgba(0,0,0,0.44); background-color:#028e7d; background-position:-63px -38px; transition:0.25s ease-in-out;}
#gallery .control .btn_next{left:auto; right:0; background-position:-126px -38px;}
#gallery .control button:hover{border-color:#00a3a0; box-shadow:2px 2px 2px rgba(0,0,0,0.44);}
#gallery .more{right:50%; top:90px; width:54px; height:54px; margin:0 -600px 0 0; background-position:14px -151px; background-color:rgba(255,255,255,0.8);}
#gallery .none{width:100%; padding:5em 0 10em;}