@charset "utf-8";

.visual {position:relative; height:525px; background:#eaf2fc;}
.vis-slide {overflow:hidden;}
.visual img {max-width:none;}
.visual .wrap {display:flex; justify-content:flex-end; position:absolute; left:50%; top:65px; transform:translateX(-50%); overflow:hidden;}
.visual .title {width:400px; margin-right:50px; font-weight:500; font-family:'GmarketSans'; transform:rotate(-0.03deg); text-shadow: 0 0 7px rgba(255,255,255,1);}
.visual .title > span {display:inline-block; height:40px; line-height:43px; padding:0 30px; font-size:20px; color:#6d45a0; font-weight:500; text-align:center; background:#fff; border-radius:20px;}
.visual .title dt {margin:30px 0; font-size:45px;}
.visual .title dt span {font-weight:600;}
.visual .title dd {font-size:18px; font-family:'Pretendard';}

.vis-btn {position:absolute; width:105px; height:30px; left:0; bottom:30px; z-index:1;}
.vis-btn a {display:block; float:left; width:30px; height:30px; margin-left:5px; text-align:center; background:#323232 url('/Main/Images/section2023/btn_control.png') no-repeat 0/500% 200%; border-radius:50%; text-indent:-9999px;}
.vis-btn a.prev {background-position:0 -30px;}
.vis-btn a.stop {background-position:-30px -30px;}
.vis-btn a.next {background-position:-60px -30px;}

.visual .link {display:flex; flex-wrap:wrap; width:500px; padding:3px;}
.visual .link a {display:block; position:relative; width:calc((100% - 20px) / 2); margin:25px 0 0 20px; padding:20px; background:#fff; border-radius:10px 25px;}
.visual .link a::before {content:''; position:absolute; right:-15px; bottom:10px; width:50px; height:50px; transform:translateX(-50%); background:url('/Main/Images/section2023/ico_link2.png') no-repeat 0/600% 600%;}
.visual .link a.link01:before {background-position:0 0;}
.visual .link a.link02:before {background-position:20% 0;}
.visual .link a.link03:before {background-position:40% 0;}
.visual .link a.link04:before {background-position:60% 0;}
.visual .link a.link05:before {background-position:80% 0;}
.visual .link a.link06:before {background-position:100% 0;}
.visual .link a.link07:before {background-position:0 20%;}
.visual .link a.link08:before {background-position:20% 20%;}
.visual .link a.link09:before {background-position:40% 20%;}
.visual .link a.link10:before {background-position:60% 20%;}
.visual .link a.link11:before {background-position:80% 20%;}
.visual .link a.link12:before {background-position:100% 20%;}
.visual .link a.link13:before {background-position:0 40%;}
.visual .link a.link14:before {background-position:20% 40%;}
.visual .link a.link15:before {background-position:40% 40%;}
.visual .link a.link16:before {background-position:60% 40%;}
.visual .link a.link17:before {background-position:80% 40%;}
.visual .link a.link18:before {background-position:100% 40%;}
.visual .link a.link19:before {background-position:0 60%;}
.visual .link a.link20:before {background-position:20% 60%;}
.visual .link a.link21:before {background-position:40% 60%;}
.visual .link a.link22:before {background-position:60% 60%;}
.visual .link a.link23:before {background-position:80% 60%;}
.visual .link a.link24:before {background-position:100% 60%;}
.visual .link a.link25:before {background-position:0 80%;}
.visual .link a.link26:before {background-position:20% 80%;}
.visual .link a.link27:before {background-position:40% 80%;}
.visual .link a.link28:before {background-position:60% 80%;}
.visual .link a.link29:before {background-position:80% 80%;}
.visual .link a.link30:before {background-position:100% 80%;}
.visual .link a.link31:before {background-position:0 100%;}
.visual .link a.link32:before {background-position:20% 100%;}
.visual .link a.link33:before {background-position:40% 100%;}
.visual .link a.link34:before {background-position:60% 100%;}
.visual .link a.link35:before {background-position:80% 100%;}
.visual .link a.link36:before {background-position:100% 100%;}
.visual .link a:nth-child(2n+1){margin-left:0;}
.visual .link a:nth-child(-n+2) {margin-top:0;}
.visual .link a span {display:block;}
.visual .link .subject {font-size:18px; font-weight:700;}
.visual .link .txt {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden; height:40px; line-height:20px; margin-top:20px; font-size:16px;}
.visual .link .btn {margin-top:30px;}
.visual .link .btn em {position:relative; padding-right:30px;}
.visual .link .btn em::before {content:'→'; position:absolute; right:0; top:-8px;}
@media all and (max-width:1200px) {
	.visual .wrap {width:92%;}
}
@media all and (max-width:1023px) {
	.visual {overflow:hidden;}
	.visual .wrap {display:block; top:45px;}
	.visual .title {float:right; width:500px; margin:0 0 25px 0; padding-bottom:50px; text-align:right;}
	.visual .title > span {height:35px; line-height:38px; padding:0 25px; font-size:18px;}
	.visual .title dt {margin:20px 0 10px 0; font-size:40px;}
	.visual .title dt span {display:block;}
	.vis-btn {left:auto; right:0; bottom:0;}
	.visual .link {width:100%; margin-top:0;}
	.visual .link a {width:calc((100% - 45px) / 4); margin-left:15px;}
	.visual .link a::before {width:40px; height:40px;}
	.visual .link a:nth-child(2n+1){margin-left:15px;}
	.visual .link a:first-child {margin-left:0;}
	.visual .link a:nth-child(-n+2) {margin-top:25px;}
	.visual .link .txt {display:none;}
	.visual .link .btn {margin-top:15px;}
}
@media all and (max-width:768px) {
	.visual .wrap {width:94%;}
	.visual, .vis-slide img {height:450px;}
	.visual .title {width:100%;}
	.visual .title > span {height:30px; line-height:33px; font-size:15px;}
	.visual .title dt {font-size:30px;}
	.visual .link a {width:calc((100% - 15px) / 2); margin-top:10px; padding:15px; border-radius:5px; font-weight:600;}
	.visual .link a::before {right:10px; bottom:50%; transform:translateY(50%); width:30px; height:30px;}
	.visual .link a:nth-child(2n+1){margin-left:0;}
	.visual .link a:nth-child(-n+2) {margin-top:0;}
	.visual .link .subject {font-size:16px;}
	.visual .link .btn {display:none;}
}
@media all and (max-width:490px) {
	.visual, .vis-slide img {height:320px;}
	.visual .wrap {top:25px;}
	.visual .title {margin-bottom:15px; padding-bottom:35px;}
	.visual .title dt {margin:10px 0 5px 0; font-size:25px;}
	.visual .title dd {display:none;}
	.visual .link a {display:flex; justify-content:center; align-items:center; width:calc((100% - 10px) / 2); height:50px; margin:5px 0 0 10px;  padding:0 15px; font-weight:600;}
	.visual .link a::before {display:none;}
	.visual .link .subject {font-size:14px; text-align:center;}
}

#container > .wrap {margin:0 auto; padding:3px;}
#container > .wrap > div {clear:both; overflow:hidden;}

.news, .job {position:relative; margin-top:40px; padding:50px 0;}
.news > a, .job > a {position:absolute; left:0; top:0; width:115px; padding-left:25px; font-family:'GmarketSans'; transform:rotate(-0.03deg); font-size:23px; font-weight:500;  color:#666; transition:0.3s;}
.job > a {width:230px !important;}
.news > a::after, .job > a::after {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:12px; height:22px; background:url('/Main/Images/section2023/bar.png') no-repeat;}
.news > a.on, .job > a.on {color:#ff0000 !important; font-weight:600; text-decoration:underline;}
.news > a:nth-of-type(1)::after, .job > a:nth-of-type(1)::after {display:none;}
.news > a:hover, .job > a:hover {color:#e40026; font-weight:700;}
.news > div, .job > div {display:none;}
.news > a.on+div, .job > a.on+div {display:block;}
.news > div a:not(.more), .job > div a:not(.more) {display:block; float:left; width:22.75%; padding:20px; margin-left:3%; border:1px solid #7a7e95; border-radius:20px; box-shadow:2px 10px 10px rgba(0,0,0,0.1);}
.news > div a:not(.more):first-of-type, .job > div a:not(.more):first-of-type {margin-left:0;}

.news > a:nth-of-type(1) {padding-left:0;}
.news > a:nth-of-type(2) {left:115px;}
.news > a:nth-of-type(3) {left:230px;}

.job > a:nth-of-type(1) {padding-left:0;}
.job > a:nth-of-type(2) {left:230px;}

.news dt, .job .title {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden; height:52px; line-height:26px; color:#222; font-size:20px; font-weight:600;}
.news dd.txt, .job dd.txt {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden; height:44px; line-height:22px; color:#7f7f7f; margin:20px 0 40px 0; word-wrap:break-word;}
.news dd.date, .job dd.date {display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:600; color:#636363;}
.news dd.date em, .job dd.date em {width:100px;}
.news dd.date .writer, .job dd.date .writer {width:calc((100% - 100px)); color:#2e4690; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:right;}
.news a.more {position:absolute; top:0; right:0; width:28px; height:28px; text-indent:-9999px; background:url('/Main/Images/new/ko2023/btn_more.png') no-repeat center;}

.job dt {margin-bottom:15px; text-align:center;}
.job dt span {display:block;}
.job .company {margin-bottom:10px; color:#222; font-size:20px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.job .work {padding:5px 10px; color:#0c4488; font-size:18px; background:#f6f6f6; border-radius:5px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.job .title {text-align:left;}
.job ul {min-height:90px;}
.job li {margin:5px 0; font-size:15px;}
.job li.salary img {vertical-align:middle; padding-right:10px;}

@media all and (max-width:1280px) {
	.news dt, .job .title {font-size:18px;}
	.news dd.txt, .job dd.txt {margin:15px 0 25px 0; font-size:16px;}
	/*.news dd.date em, .job dd.date em {display:block;}
	.news dd.date .writer, .job dd.date .writer {margin-top:3px;}*/
}
@media all and (max-width:1023px) {
	.news > div a:not(.more), .job > div a:not(.more) {width:48.5%; margin-bottom:25px;}
	.news > div a:not(.more):nth-child(2n+1), .job > div a:not(.more):nth-child(2n+1) {margin-left:0;}
}
@media all and (max-width:768px) {
	.news, .job {padding:40px 0;}
	.news > a, .job > a {font-size:20px;}
	.news > a {width:100px;}
	.news > a:nth-of-type(2) {left:100px;}
	.news > a:nth-of-type(3) {left:200px;}
	.job > a {width:190px !important;}
	.job > a:nth-of-type(2) {left:190px;}
	.news > div a:not(.more), .job > div a:not(.more) {margin-bottom:15px; padding:15px;}
	.news dt, .job .title {font-size:17px; height:48px; line-height:24px;}
	.news dd.txt, .job .txt {margin:10px 0 15px 0;}
}
@media all and (max-width:560px) {
	.news > a, .job > a {font-size:18px;}
	.news > a {width:90px;}
	.news > a:nth-of-type(2) {left:90px;}
	.news > a:nth-of-type(3) {left:180px;}
	.news dd.txt, .job .txt {font-size:15px;}
	.news dd.date, .job dd.date {display:block; font-size:14px;}
	.news dd.date em, .job dd.date em {display:block; width:100%;}
	.news dd.date .writer, .job dd.date .writer {width:100%; margin-top:7px;}
}



.favorite {margin-bottom:40px;}
.favorite h2 {font-family:'GmarketSans'; transform:rotate(-0.03deg); font-size:23px;}
.favorite h2 span {color:#014396;}
.favorite_slide li {float:left; width:12.5%;}
.favorite_slide li a {display:block; position:relative; padding-top:90px; text-align:center; font-weight:500; margin:20px;}
.favorite_slide li a:before {content:''; position:absolute; left:50%; top:0; transform:translateX(-50%); width:80px; height:80px; background:url('/Main/Images/section2023/finace_favorite.png') no-repeat 0/600% 200%;}
.favorite_slide li a:hover:before {animation:motion 0.5s ease-in Infinite Alternate;}
.favorite_slide li a span {display:block; margin:0 20px; font-weight:600;}
.favorite_slide li.favorite01 a:before {background-position:0 0;}
.favorite_slide li.favorite02 a:before {background-position:20% 0;}
.favorite_slide li.favorite03 a:before {background-position:40% 0;}
.favorite_slide li.favorite04 a:before {background-position:60% 0;}
.favorite_slide li.favorite05 a:before {background-position:80% 0;}
.favorite_slide li.favorite06 a:before {background-position:100% 0;}
.favorite_slide li.favorite07 a:before {background-position:0% 100%;}
.favorite_slide li.favorite08 a:before {background-position:20% 100%;}
.favorite_slide li.favorite09 a:before {background-position:40% 100%;}
.favorite_slide li.favorite10 a:before {background-position:60% 100%;}
.favorite_slide li.favorite11 a:before {background-position:80% 100%;}
.favorite_slide li.favorite12 a:before {background-position:100% 100%;}
@media all and (max-width:1200px) {
    .link {padding:30px 0;}
    .favorite_slide {margin:0 40px;}
    .favorite_slide .slick-prev {left:-40px;}
    .favorite_slide .slick-next {right:-40px;}
}
@media all and (max-width:768px) {
	/*.favorite {padding-top:40px;}*/
	.favorite_slide {margin-top:20px;}
	.favorite_slide li a {margin:0; padding-top:65px;}
	.favorite_slide li a:before {width:60px; height:60px;}
	.favorite_slide li a span {margin:0;}
}
@keyframes motion {
	0% {top:0;}
	50% {top:5px;}
}

.slick-prev,
.slick-next {display:block; position:absolute; top:50%; width:40px; height:40px; padding:0; background:transparent; border:0; text-indent:-9999px; transform:translateY(-50%); /*z-index:100;*/}
.slick-prev {left:0;}
.slick-next {right:0;}
.slick-prev:before,
.slick-next:before {content:''; position:absolute; top:50%; left:50%; width:18px; height:18px; border-top:2px solid #333; border-right:2px solid #333;}
.slick-prev:before {margin-left:4px; transform:translate(-50%, -50%) rotate(-135deg);}
.slick-next:before {margin-left:-4px; transform:translate(-50%, -50%) rotate(45deg);}
.swiper-button-prev,
.swiper-button-next {display:block; position:absolute; top:50%; width:40px; height:40px; padding:0; margin:0; background:transparent; border:0; text-indent:-9999px; z-index:100; transform:translateY(-50%);}
.swiper-button-prev {left:0;}
.swiper-button-next {right:0;}
.swiper-button-prev:before,
.swiper-button-next:before {content:''; position:absolute; top:50%; left:50%; width:18px; height:18px; border-top:2px solid #333; border-right:2px solid #333;}
.swiper-button-prev:before {margin-left:4px; transform:translate(-50%, -50%) rotate(-135deg);}
.swiper-button-next:before {margin-left:-4px; transform:translate(-50%, -50%) rotate(45deg);}
@media all and (max-width:768px) {
	.slick-prev:before, .slick-next:before {width:14px; height:14px;}
}