@charset "utf-8";

/*공통*/
.red-txt {color:#cd0f0e !important;}
.blue-txt {color:#2480e8 !important;}
.dis-flex {display:flex;align-items: center; border:0 !important; border-bottom:1px solid #ddd !important;}
.space-txt {display:inline-block; margin:0 5px;}
#email_list {margin-left:5px;}
.join-form .item {margin-right:5px;}
/*greeting*/
.company {}
.company .group-tit {font-size:38px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:60px; text-align:center;}
.company .group {padding:120px 0;}

.company .group:first-child {padding-top:0;}
.company .group:last-child {padding-bottom:0;}
.company .group .img {text-align:center;}

.company .group.history {padding:120px 0;}


.company .group .advantage ul {display:flex; flex-wrap:wrap; margin:0 -8px;}
.company .group .advantage ul li:nth-child(2) {margin-top:100px;}
.company .group .advantage ul li:nth-child(3) {position:relative; margin-top:-100px;}
.company .group .advantage ul li {width:50%; margin-bottom:40px; padding:0 8px;}

.company .cnt2 {background:url("/resources/images/sub/company_1_bg.png") no-repeat 50% 50%; background-size:cover;}
.company .cnt3 .strategy {position:relative; display:flex; flex-wrap:wrap; margin-bottom:-90px;}
.company .cnt3 .strategy-bg {position:absolute; top:50%; left:50%; margin:-130px 0 0 -130px;}
.company .cnt3 .box {width:50%; margin-bottom:90px;}
.company .cnt3 .box .icon {margin-bottom:23px;}
.company .cnt3 .box li {position:relative; padding-left:15px; font-size:22px; font-weight:600; line-height:1.5em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:10px;}
.company .cnt3 .box li:last-child{margin-bottom:0;}
.company .cnt3 .box li:before {content:""; position:absolute; width:6px; height:6px; border-radius:100%; background:#ccc; left:0; top:12px;}
.company .cnt3 .box:nth-child(even) {padding-left:168px;} 
.company .cnt3 .box:nth-child(odd) {text-align:right; padding-right:168px;}
.company .cnt3 .box:nth-child(odd) li {padding-left:0; padding-right:15px;}
.company .cnt3 .box:nth-child(odd) li:before {left:auto; right:0;}

.company .history {background:url("/resources/images/sub/his_bg.jpg") no-repeat 50% 50%; background-size:cover;}
.company .history .group-tit {color:#fff;}
.company  .his-wrap .part {position:relative;}
.company  .his-wrap .part:nth-child(odd) {padding-left:calc(50% + 50px);}
.company  .his-wrap .part:nth-child(odd) li {padding-left:18px;}
.company  .his-wrap .part:nth-child(odd) li:before {left:0;}
.company  .his-wrap .part:nth-child(even) {padding-right:calc(50% + 50px); text-align:right;}
.company  .his-wrap .part:nth-child(even) li {padding-right:18px;}
.company  .his-wrap .part:nth-child(even) li:before {right:0;}
.company  .his-wrap .part:before {content:""; position:absolute; width:1px; height:100%; background:rgba(255,255,255,0.4); left:50%; top:7px;}
.company  .his-wrap .part:last-child::before {display:none;}
.company  .his-wrap .part .year {font-size:30px; font-weight:700; line-height:1.4em; letter-spacing:-0.02em; color:#fff; margin-bottom:15px;}
.company  .his-wrap .part .year:before {content:""; position:absolute; width:10px; height:10px; background:#fff; border-radius:100%; left:50%; margin-left:-5px; top:7px;}
.company  .his-wrap .part .year:after {content:""; position:absolute; width:24px; height:24px; border:1px solid #fff; border-radius:100%; left:50%; margin-left:-12px; top:0;}
.company  .his-wrap .part li {position:relative; font-size:18px; font-weight:500; letter-spacing:-0.02em; color:#fff;}
.company  .his-wrap .part li:before {content:""; position:absolute; width:6px; height:6px; background:#cccccc; border-radius:100%; top:10px;}
.company .people {margin-top:150px;}
.company .ceo {border:1px solid #bbdafd; position:relative; padding:125px 40px; background:url("/resources/images/sub/ceo_bg.gif") no-repeat 50% 50%; background-size:cover; margin-bottom:60px;}
.company .ceo:after {content:""; position:absolute; width:353px; height:502px; background:url("/resources/images/sub/ceo.png") no-repeat 50% 50%; background-size:contain; right:100px; bottom:0;}
/* .company .ceo:before {content:""; position:absolute; width:50px; height:50px; background:url("/resources/images/sub/try.png") no-repeat 50% 50%; background-size:contain; transform:rotate(180deg); right:-1px; bottom:-1px;}
 */.company .ceo .ceo-name {font-size:64px; font-weight:800; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:50px;}
.company .ceo .ceo-name span {font-size:54px; font-weight:600; color:#878787;}
.company .ceo li {position:relative; padding-left:16px; font-size:22px; font-weight:400; line-height:1.4em; letter-spacing:-0.02em; color:#505050; margin-bottom:12px;}
.company .ceo li:last-child {margin-bottom:0;}
.company .ceo li:before {content:""; position:absolute; width:6px; height:6px; background:#2480e8; left:0; top:10px;}
.company .crew > ul {display:flex; flex-wrap:wrap; margin-left:-60px; margin-bottom:-60px;}
.company .crew > ul > li {position:relative; width:calc(50% - 60px); margin-left:60px; margin-bottom:60px; border:1px solid #bbdafd;}
/* .company .crew > ul > li:before {content:""; position:absolute; width:50px; height:50px; background:url("/resources/images/sub/try.png") no-repeat 50% 50%; background-size:contain; transform:rotate(180deg); right:-1px; bottom:-1px;}
 */.company .crew .crew-info {position:relative;padding:115px 40px; min-height:325px; background:url("/resources/images/sub/crew_bg.gif") no-repeat 50% 50%; background-size:cover;}
.company .crew > ul > li:nth-child(1) .crew-info:before {content:""; position:absolute; width:285px; height:297px; background:url("/resources/images/sub/crew1.png") no-repeat 50% 50%; background-size:contain; bottom:0; right:0;}
.company .crew > ul > li:nth-child(2) .crew-info:before {content:""; position:absolute; width:290px; height:296px; background:url("/resources/images/sub/crew2.png") no-repeat 50% 50%; background-size:contain; bottom:0; right:0;}
.company .crew > ul > li:nth-child(3) .crew-info:before {content:""; position:absolute; width:266px; height:306px; background:url("/resources/images/sub/crew3.png") no-repeat 50% 50%; background-size:contain; bottom:0; right:0;}
.company .crew > ul > li:nth-child(4) .crew-info:before {content:""; position:absolute; width:281px; height:296px; background:url("/resources/images/sub/crew4.png") no-repeat 50% 50%; background-size:contain; bottom:0; right:0;}
.company .crew .crew-name {position:relative; z-index:1; font-size:42px; font-weight:800; line-height:1em; letter-spacing:-0.02em; color:#2c2c2c;}
.company .crew .depart {display:block; font-size:22px; color:#19396c;}
.company .crew-career {padding:40px; min-height:205px;}
.company .crew-career > ul > li {position:relative; padding-left:17px; font-size:18px; font-weight:400; line-height:1.6em; letter-spacing:-0.02em; color:#505050; margin-bottom:5px;}
.company .crew-career > ul > li:last-child {margin-bottom:0;}
.company .crew-career > ul > li:before {content:""; position:absolute; width:6px; height:6px; background:#2480e8; border-radius:100%; left:0; top:11px;}
.company .crew-career li li {font-size:16px; font-weight:400; line-height:1.2em; letter-spacing:-0.02em; color:#878787;}

/*insight*/
.insight-cate {margin-top:140px; background:url("/resources/images/bbs/insight_cate.jpg") no-repeat 50% 50%; background-size:cover;}
.insight-cate ul {display:flex; max-width:1200px; margin:0 auto;}
.insight-cate li {flex:1;position:relative; border-right:1px solid #fff;}
.insight-cate li.active::before {opacity:1;}
.insight-cate li a {position:relative; display:flex;flex-direction: column; align-items: center; justify-content: center;padding:60px 0 45px 0; text-align:center; color:#fff; font-size:26px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em;}
.insight-cate li:before {content:""; position:absolute; width:100%; height:calc(100% + 40px); top:-20px; left:0; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;opacity:0; transition:0.1s all ease;}
.insight-cate li:first-child {border-left:1px solid #fff;}
.insight-cate li:nth-child(1):before {background-image:url("/resources/images/bbs/insight_act1.jpg")}
.insight-cate li:nth-child(2):before {background-image:url("/resources/images/bbs/insight_act2.jpg")}
.insight-cate li span {display:block; font-size:16px; font-weight:500; line-height:1.2em; letter-spacing:-0.02em; opacity:0.7;}
.insight-cate .icon {margin-bottom:25px;}

.insight .bg-wrap {background-color:#eafaff; margin-bottom:80px;}
.insight .bg-wrap .tit {font-size:42px; font-weight:900; line-height:1.6em; letter-spacing:-0.02em; color:#2c2c2c;}
.insight .bg-wrap .tit strong {display:block; font-size:56px; font-weight:900;}
.insight .bg-wrap .tit .blue-txt {color:#2480e8;}
.insight.letter .bg-wrap .contain {padding:130px 30px; background:url("/resources/images/bbs/letter_bg.png") no-repeat right center;}
.insight.letter .bg-wrap .tit {padding-right:50%;}
.insight.book .bg-wrap .contain {padding:130px 30px; background:url("/resources/images/bbs/book_bg.png") no-repeat left center;}
.insight.book .bg-wrap .tit {padding-left:50%;}

/*story*/
.story .group {margin-bottom:120px;}
.story .group-tit {position:relative;padding-left:43px;font-size:32px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:28px;}
.story .group-tit:before {content:""; position:absolute; width:28px; height:29px; background:url("/resources/images/sub/group_tit.gif") no-repeat 50% 50%; background-size:contain; left:0; top:5px;}
.story .bespoke {display:flex; margin-left:-10px;}
.story .bespoke li {position:relative; width:calc(33.333% - 10px); margin-left:10px; border:1px solid #ddd; padding-top:80px; min-height:200px; text-align:center; font-size:18px; font-weight:500; line-height:1.4em; letter-spacing:-0.02em; color:#505050;}
.story .bespoke li:before {content:""; position:absolute; width:28px; height:28px; background:url("/resources/images/sub/check_icon.png") no-repeat 50% 50%; background-size:contain; left:50%; margin-left:-14px; top:37px}
.story .cate-list {display:flex; margin-top:40px;}
.story .cate-list .box {width:33.333%; padding:0 74px; text-align:center;}
.story .cate-list .tit {margin:0 auto; max-width:160px; padding:10px; font-size:22px; font-weight:600; line-height:1; letter-spacing:-0.02em; color:#fff; background:#19396c; border-radius:100vh;}
.story .cate-list ul {padding-top:20px; position:relative;}
.story .cate-list ul:before {content:''; position:absolute; left:50%; top:0; width:1px; height:100%; background:#ddd;}
.story .cate-list ul li {margin-bottom:8px; padding:10px; position:relative; z-index:1; background:#eee; font-size:18px; font-weight:400; line-height:1.4; letter-spacing:-0.02em; color:#505050;}
.story .cnt1 .range {position:relative; margin-top:40px; display:flex; justify-content: space-between; padding:0 30px 0 80px;}
.story .cnt1 .range:before {content:""; position: absolute; width:100%; height:41px; background:url("/resources/images/sub/range.png") no-repeat 50% 50%; background-size:100% auto; left:0; top:170px;}

.story .cnt1 .range .icon {text-align:center; margin-bottom:15px;}
.story .cnt1 .range .tit {position:relative; text-align:Center; font-size:22px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; padding-bottom:40px; margin-bottom:50px;}
.story .cnt1 .range .tit:before {content:""; position:absolute; width:23px; height:30px; background:url("/resources/images/sub/arrow_icon.png") no-repeat 50% 50%; bottom:0; left:50%; margin-left:-11.5px;}
.story .cnt1 .range .tit span {display:block; font-size:16px; font-weight:500; color:#505050;}
.story .cnt1 .range li {position:relative; padding-left:13px; font-size:16px; font-weight:700; letter-spacing:-0.02em; color:#2c2c2c;}
.story .cnt1 .range li:before {content:""; position: absolute; width:6px; height:6px; background:#cccccc; border-radius:100%; left:0; top:10px;}

.story .cnt2 ul {margin-bottom:35px;}
.story .cnt2 li {position:relative; padding-left:13px; font-size:20px; font-weight:500; letter-spacing:-0.02em; color:#2c2c2c;}
.story .cnt2 li:before {content:""; position: absolute; width:6px; height:6px; background:#cccccc; border-radius:100%; left:0; top:10px;}

.story .cnt3 {padding:110px 0; background:url("/resources/images/sub/company_1_bg.png") no-repeat 50% 50%;background-size:cover;}
.story .cnt3 h2 {text-align:center; font-size:38px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:55px;}
.story .cnt3 .care {display:flex; margin:0 -40px;}
.story .cnt3 .care > div {width:50%; padding:0 40px;}
.story .cnt3 .care .img {margin-bottom:36px;}
.story .cnt3 .tit {font-size:28px; font-weight:700; line-height:1.4em; letter-spacing:-0.02em; color:#2c2c2c;}
.story .cnt3 .txt {font-size:20px; font-weight:500; line-height:1.4em; letter-spacing:-0.02em; color:#505050; margin-bottom:22px;}
.story .cnt3 .txt:last-child {margin-top:20px; margin-bottom:0;}
.story .cnt3 .info li {position:relative; padding-left:13px; font-size:16px; font-weight:400; letter-spacing:-0.02em; color:#505050;}
.story .cnt3 .info li span {font-weight:500;}
.story .cnt3 .info li:before {content:""; position: absolute; width:6px; height:6px; background:#cccccc; border-radius:100%; left:0; top:10px;}
.story .cnt3 .arrow-wrap {position:relative; font-size:18px; font-weight:600; line-height:1.4em; letter-spacing:-0.02em; color:#2c2c2c; padding-top:60px;}
.story .cnt3 .arrow-wrap:before {content:""; position:absolute; width:23px; height:30px; background:url("/resources/images/sub/arrow_icon2.png") no-repeat 50% 50%; left:50%; margin-left:-11.5px; top:15px;}

.story .cnt4 .graph {display:flex; margin:40px -38px 0 -38px;}
.story .cnt4 .graph > div {padding:0 38px; position:relative; text-align:center;}
.story .cnt4 .graph .tit {text-align:center; display:inline-block; margin-bottom:15px; font-size:22px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#fff; border-radius:50px; padding:8px 30px; background:#2c2c2c;}

.story .cnt5 {margin-bottom:0 !important;}

/*join_step*/
.join-step .group {display:flex;align-items: center;}
.join-step .group:nth-child(even) {flex-direction: row-reverse;}
.join-step .group .cnt {padding-left:50px; flex: 1 1 auto; min-width: 0; width: 1%;}
.join-step .group .cnt .tit {font-size:40px; font-weight:800; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:20px;}
.join-step .group .cnt .tit .num {display:block; font-size:30px; font-weight:700; line-height:1em; letter-spacing:-0.02em; color:#2480e8; margin-bottom:25px;}
.join-step .group .cnt .cnt-info {margin-bottom:55px;}
.join-step .group .bank-info {margin-bottom:43px;}
.join-step .group .bank-info:last-child {margin-bottom:0;}
.join-step .group .cnt .cnt-info li {font-size:18px; font-weight:500; line-height:1.5em; letter-spacing:-0.02em; color:#505050; padding-left:16px; position:relative; margin-bottom:20px;}
.join-step .group .cnt .cnt-info li:last-child {margin-bottom:0;}
.join-step .group .cnt .cnt-info li:before {content:""; position:absolute; width:6px; height:6px; background:#ccc; border-radius:100%; top:10px; left:0;}
.join-step .group .cnt .bank-logo {display:flex; flex-wrap:wrap; margin-left:-9px; margin-bottom:-9px;}
.join-step .group .cnt .bank-info h3 {font-size:18px; font-weight:500; line-height:1.2em; letter-spacing:0; color:#fff; display:inline-block; padding:7px 50px; background:#242424; border-radius:50px; margin-bottom:20px;}
.join-step .group .cnt .bank-info p {padding-left:17px; font-size:18px; font-weight:400; letter-spacing:-0.05em; color:#505050; margin-bottom:30px;}
.join-step .group .cnt .bank-logo li {width:calc(33.333% - 9px); margin-left:9px; margin-bottom:9px;}
.join-step .group .cnt .bank-logo li a {display:block; position:relative; box-shadow:0px 0px 3px rgba(0,0,0,0.43);}
.join-step .group .cnt .bank-logo li a:before {content:""; position:absolute; width:100%; height:100%; border:2px solid #ddd; left:0; top:0; transition:0.2s all ease;}
.join-step .group .cnt .bank-logo li a:hover:before {border-color:#42b0e8;}
.join-step .group:nth-child(even) .cnt {padding-right:50px; padding-left:0; text-align:right;}
.join-step .group:nth-child(even) .cnt-info li {padding-left:0; padding-right:15px;}
.join-step .group:nth-child(even) .cnt-info li:before {left:auto; right:0;}
.join-step .group:nth-child(even) .icon-btns { justify-content: flex-end;}
.join-step .img {position:relative; width:50%;}

/* 20251103 유지보수 */
.join-step .icon-btns { display: flex; gap: 10px; margin-bottom: 30px; }
.join-step .icon-btns div { width: auto; display: inline-flex; gap: 10px; font-weight: 500; line-height: 1em; color: #2c2c2c; border-radius: 10px; border: 1px solid #b1b1b1; padding: 8px 16px; align-items: center;}
.bank-tbl-wrap { overflow: auto; }
.bank-tbl { width: 100%; border-collapse: collapse; border: 1px solid #ddd; border-bottom: none; }
.bank-tbl tr { border-bottom: 1px solid #ddd;}
.bank-tbl tr th { border-right: 1px solid #ddd; line-height: 1.2em; font-weight: 700; font-size: 16px; color: #2c2c2c; letter-spacing: -.02em; background: #fafafa; padding: 18px 10px 16px; text-align: center; }
.bank-tbl tr th:last-child { border: none; }
.bank-tbl tr th.fw { color: #fff; background: #b1b1b1; }
.bank-tbl tr td { border-right: 1px solid #ddd; padding: 15px 10px; text-align: center; vertical-align: middle;}
.bank-tbl tr td:last-child { border: none; }
.bank-tbl tr td .link-btn { display: flex; justify-content: center; gap: 20px; align-items: center;}
.bank-tbl tr td .link-btn a { display: inline-block; }
.bank-tbl tr td img { vertical-align: middle; }

/*career-path*/
.career-path > ul {display:flex; flex-wrap:wrap; margin:0 -28px -48px -28px;}
.career-path > ul > li {width:50%; padding:0 28px; margin-bottom:48px;}
.career-path > ul > li .img {margin-bottom:35px;}
.career-path .tit {font-size:28px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; padding-bottom:20px; border-bottom:1px solid #ddd; margin-bottom:28px;}
.career-path .tit span {position:relative; display:inline-block;}
.career-path .tit span:before {content:""; position:absolute; width:100%; height:3px; left:0; bottom:-21px; background:#2480e8;}
.career-path .cnt-info li {font-size:18px; font-weight:500; line-height:1.5em; letter-spacing:-0.02em; color:#505050; padding-left:16px; position:relative; margin-bottom:20px;}
.career-path .cnt-info li:last-child {margin-bottom:0;}
.career-path .cnt-info li:before {content:""; position:absolute; width:6px; height:6px; background:#ccc; border-radius:100%; top:10px; left:0;}

/*cs*/
.cs .sns-link {display:flex; justify-content: center; margin:0 -15px;}
.cs .sns-link li {width:50%; padding:0 15px;}
.cs .sns-link li a {display:block; display:flex;  align-items: center; padding:35px 0;}
.cs .sns-link li a .img {padding:0 50px;}
.cs .sns-link li a .cnt {flex: 1 1 auto; min-width: 0; width: 1%;}
.cs .sns-link li:first-child a {background:#ffda29;}
/* .cs .sns-link li:last-child a {background:#25adf2;} */
.cs .sns-link .tit {font-size:30px; font-weight:800; line-height:1.2em; letter-spacing:-0.02em; margin-bottom:22px;}
.cs .sns-link .tit span {opacity:0.5; font-size:16px; font-weight:400; line-height:1em; letter-spacing:0.3em; display:block; margin-bottom:5px;}
.cs .sns-link .direct {position:relative; display:inline-block; padding:15px 110px 15px 40px; font-size:22px; font-weight:800; line-height:1.2em; letter-spacing:-0.02em; border-radius:23px;}
.cs .sns-link .direct:before {content:""; position:absolute; width:12px; height:12px; border-right:2px solid #fff; border-bottom:2px solid #fff; right:40px; top:22px; transform:rotate(-45deg);}
.cs .sns-link li:first-child .tit {color:#462827;} 
/* .cs .sns-link li:last-child .tit {color:#fff;}  */
.cs .sns-link li:first-child .direct {color:#fff; background:#462827;}
/* .cs .sns-link li:last-child .direct {color:#25adf2; background:#fff;}
.cs .sns-link li:last-child .direct:before {border-color:#25adf2;} */

.cs .contact-info {display:flex; margin-top:35px; margin-bottom:95px; justify-content: center;}
.cs .contact-info li {position:relative;padding-left:50px; margin-right:40px; font-size:20px; font-weight:400; line-height:1.2em; letter-spacing:-0.03em; color:#2c2c2c;}
.cs .contact-info li:before {content:""; position:absolute; width:36px; height:36px; border-radius:100%; left:0; top:-7px; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
.cs .contact-info li:nth-child(1):before {background-image:url("/resources/images/sub/cs_icon1.png")}
.cs .contact-info li:nth-child(2):before {background-image:url("/resources/images/sub/cs_icon2.png")}
.cs .contact-info li:nth-child(3):before {background-image:url("/resources/images/sub/cs_icon3.png")}
.cs .contact-info li:last-child {margin-right:0;}