@charset "utf-8";

/* careers common */
.new_careers .container * { box-sizing: border-box; letter-spacing: -0.5px; }
.new_careers #content{padding:0; position:relative;}
.new_careers .section{width:100%; margin:0 auto;}
.new_careers .inner{width:1140px; margin:0 auto; position:relative;}
.new_careers h3,
.new_careers .section h3{padding-bottom:0; margin-bottom:0; font-size:38px; font-weight:600; line-height:1.5; color:#000; text-align:center;}
.new_careers h3::after{display:none;}

.new_careers .sub_tit{margin-bottom:60px;}
.new_careers .sub_tit h3{font-size:38px; color:#000; font-weight:600; word-break:keep-all;}
.new_careers .sub_tit p{margin-top:40px; font-size:20px; color:#333; font-weight:300; word-break:keep-all; text-align:center;}
.new_careers .sub_tit.white h3{color:#fff;}
.new_careers .sub_tit.white p{color:#fff;}
.new_careers [data-motion] .sub_tit h3{opacity:0; transform:translateY(50px); transition:0.7s;}
.new_careers [data-motion] .sub_tit p{opacity:0; transform:translateY(50px); transition:0.7s 0.1s;}
.new_careers [data-motion].active .sub_tit h3{opacity:1; transform:translateY(0);}
.new_careers [data-motion].active .sub_tit p{opacity:1; transform:translateY(0);}

.new_careers .text_list{display:block !important;}
.new_careers .text_list li{padding-left:10px; position:relative; font-size:18px; color:#333; text-align:left; font-weight:300; line-height:1.5; word-break:keep-all;}
.new_careers .text_list.dot li:before{content:"·"; position:absolute; left:0; top:0;}
.new_careers .text_list.line li:before{content:"-"; position:absolute; left:0; top:0;}

/* sec_card_list */
.new_careers .sec_card_list ul { display: flex; flex-wrap: wrap; gap: 30px; }
.new_careers .sec_card_list ul li { border: 1px solid #ddd; border-radius: 20px; background: #fff; box-shadow: 2px 2px 20px 0 rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px); }
.new_careers .sec_card_list ul li a { width: 100%; height: 100%; }
.new_careers .sec_card_list ul li dl dt { display: flex; align-items: center; gap: 0 16px; margin-bottom: 10px; font-size: 24px; font-weight: 700; line-height: 1.5; color: #000; }
.new_careers .sec_card_list ul li dl dt span { position: relative; padding-left: 16px; font-size: 16px; font-weight: 600; }
.new_careers .sec_card_list ul li dl dt span::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 1px; height: 16px; background: #ccc; }
.new_careers .sec_card_list ul li dl dt span.type_research { color: #2c7cd8 }
.new_careers .sec_card_list ul li dl dt span.type_sw { color: #39c5d2 }
.new_careers .sec_card_list ul li dl dt span.type_sales { color: #9c4ee7 }
.new_careers .sec_card_list ul li dl dt span.type_management { color: #666666 }
.new_careers .sec_card_list ul li dl dd { font-size: 16px; line-height: 1.5; font-weight: 300; color: #333; }
.new_careers .sec_card_list ul li .arrow_btn { display:inline-block; position:relative; width: fit-content; padding:7px 19px 7px 0; vertical-align:top; font-size:14px; color:#666; font-weight:600; }
.new_careers .sec_card_list ul li .arrow_btn i{position:absolute; top:50%; right:0; transform:translateY(-50%); width:16px; height:16px;}
.new_careers .sec_card_list ul li .arrow_btn i::before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; opacity:1; background:url("/resources/images/kr/careers/sec_bg_list_arrow_icon.svg") no-repeat center / 100%;}
.new_careers .sec_card_list ul li .arrow_btn i::after{content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; opacity:0; background:url("/resources/images/kr/careers/sec_bg_list_arrow_icon.svg") no-repeat center / 100%;}
.new_careers .sec_card_list ul li a:hover .arrow_btn i::before{left:100%; opacity:0; transition:0.4s;}
.new_careers .sec_card_list ul li a:hover .arrow_btn i::after{left:0; opacity:1; transition:0.4s 0.1s;}
.new_careers .sec_card_list.type1 ul li a, 
.new_careers .sec_card_list.type2 ul li { display: flex; flex-direction: column; justify-content: space-between; flex: 1; padding: 30px; }
.new_careers .sec_card_list.type1 ul li { width: 360px; height: 300px; }
.new_careers .sec_card_list.type2 ul li { width: 360px; height: 220px; }

/* sec_bg_link */
.new_careers .sec_bg_link{padding:160px 0;}
.new_careers .sec_bg_link .bg_area{border-radius:20px; padding:10px; box-sizing:border-box; overflow:hidden; position:relative;}
.new_careers .sec_bg_link .bg_area .bg{position:absolute; left:0; top:0; width:100%; height:100%; background-color:#eee; background-image: url("/resources/images/kr/careers/sec_bg_link_bg.png"); background-size:cover; background-repeat:no-repeat; background-position:center;}
.new_careers .sec_bg_link .bg_area ul{display:flex;}
.new_careers .sec_bg_link .bg_area ul li{width:50%; height:280px; position:relative; text-align:center;}
.new_careers .sec_bg_link .bg_area ul li + li::before{content:""; width:1px; height:100%; position:absolute; left:0; top:0; background-color:rgba(255,255,255,0.6);}
.new_careers .sec_bg_link .bg_area ul li a{height:100%; padding:10px; display:flex; justify-content:center; align-items:center; box-sizing:border-box;}
.new_careers .sec_bg_link .bg_area ul li strong{display:block; font-size:30px; color:#fff; font-weight:600;}
.new_careers .sec_bg_link .bg_area ul li p{margin-top:4px; font-size:16px; color:#fff; font-weight:300;}
.new_careers .sec_bg_link .bg_area ul li .btn{margin-top:24px;}
.new_careers .sec_bg_link .bg_area ul li a .txt strong{transform:translateY(30px);transition:0.6s;}
.new_careers .sec_bg_link .bg_area ul li a .txt p{transform:translateY(30px); transition:0.6s;}
.new_careers .sec_bg_link .bg_area ul li a .txt .btn{transform:translateY(100%); opacity:0; transition:0.6s;}
.new_careers .sec_bg_link .bg_area ul li a .txt .btn::after{border-color:#fff;}
.new_careers .sec_bg_link .bg_area ul li.on a .txt strong{transform:translateY(0);}
.new_careers .sec_bg_link .bg_area ul li.on a .txt p{transform:translateY(0);}
.new_careers .sec_bg_link .bg_area ul li.on a .txt .btn{transform:translateY(0); opacity:1;}
.new_careers .sec_bg_link .bg_area ul li.off a .txt strong{transform:translateY(40px); opacity:0.5;}
.new_careers .sec_bg_link .bg_area ul li.off a .txt p{transform:translateY(40px); opacity:0.5;}
.new_careers .sec_bg_link .bg_area[data-motion]{opacity:0; transform:translateY(100px); transition:0.7s}
.new_careers .sec_bg_link .bg_area[data-motion] .bg{transform:scale(1.2); transition:1s 0.2s}
.new_careers .sec_bg_link .bg_area[data-motion].active{opacity:1; transform:translateY(0);}
.new_careers .sec_bg_link .bg_area[data-motion].active .bg{transform:scale(1);}

/* recruitment_process_list */
.new_careers .recruitment_process_list { display: grid; justify-content: space-between; gap: 40px 0; margin-bottom: 60px; }
.new_careers .recruitment_process_list li { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; position: relative; width: 170px; aspect-ratio: 1 / 1; border-radius: 50%; background: #fff; box-shadow: 2px 2px 20px 0 rgba(0, 0, 0, 0.15); backdrop-filter: blur(20px); }
.new_careers .recruitment_process_list li.mt14 img { margin-top: 14px; }
.new_careers .recruitment_process_list li:last-child { background: #2c7cd8; }
.new_careers .recruitment_process_list li::before { content: ''; position: absolute; top: 50%; left: calc(100% + 24px); transform: translateY(-50%); width: 16px; height: 16px; background:url("/resources/images/kr/careers/recruitment-process/chevron_down.svg") no-repeat center / 100%; }
.new_careers .recruitment_process_list li:last-child::before { display: none; }
.new_careers .recruitment_process_list li .step_num { text-align: center; font-size: 14px; font-weight: 600; line-height: 1.5; color: #2c7cd8; }
.new_careers .recruitment_process_list li:last-child .step_num { color: #fff; }
.new_careers .recruitment_process_list li .step_tit { text-align: center; font-size: 16px; font-weight: 600; line-height: 1.3; color: #333; }
.new_careers .recruitment_process_list li:last-child .step_tit { color: #fff; }

/* sticky_lnb, sticky_tab */
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon1 button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon1_off.svg");}
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon2 button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon2_off.svg");}
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon3 button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon3_off.svg");}
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon1:hover button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon1_on.svg");}
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon2:hover button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon2_on.svg");}
.new_careers .sec_sticky_wrap .sticky_lnb .state.init ul li.icon3:hover button::before{background-image:url("/resources/images/kr/careers/company-life/sec_sticky_tab_icon3_on.svg");}

/* .detail_popup */
.new_careers .detail_popup{display:none; position:fixed; left:0; top:0; min-width:1300px; width:100%; height:100%; z-index:100000; overflow:hidden;}
.new_careers .detail_popup .close_btn{opacity:0; font-size:0; text-indent:-9999px; width:48px; height:48px; position:absolute; top:50%; right:1140px; transform:translateY(-50%); z-index:2; background:url("/resources/images/kr/careers/detail_popup_close_btn.svg")no-repeat center / 100%;}
.new_careers .detail_popup .close_btn:hover{background-image:url("/resources/images/kr/careers/detail_popup_close_btn_on.svg")}
.new_careers .detail_popup .cont_inner{background:rgba(0, 0, 0, 0.70); backdrop-filter:blur(10px); width:100%; height:100%; overflow:hidden auto; position:relative;}
.new_careers .detail_popup .cont{position:absolute; right:-60%; top:0; z-index:2; width:1140px; min-height:100%; background-color:#fff; opacity:0; transition:opacity 0.5s, right 0.5s; transition-timing-function:cubic-bezier(0, 0, 0.2, 1);}
.new_careers .detail_popup .cont .title_wrap{padding:80px 100px 50px; border-bottom:2px solid #ccc; box-sizing:border-box;}
.new_careers .detail_popup .cont .title_wrap h4{font-size:38px; color:#333; font-weight:600;}
.new_careers .detail_popup .cont .title_wrap span { position: relative; padding-left: 20px; font-size: 20px; font-weight: 600; line-height: 1.5; color: #666; }
.new_careers .detail_popup .cont .title_wrap span::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 2px; height: 24px; background: #ccc; }
.new_careers .detail_popup .cont .desc_wrap{padding:60px 100px 80px;}
.new_careers .detail_popup .cont .desc_wrap .con + .con{margin-top:60px;}
.new_careers .detail_popup .cont .desc_wrap .con > h5{font-size:24px; color:#333; font-weight:600; line-height:1.5;}
.new_careers .detail_popup .cont .desc_wrap .con > h5 + *{margin-top:14px;}
.new_careers .detail_popup .cont .desc_wrap .con > p{font-size:20px; color:#333; font-weight:300; word-break:keep-all;}
.new_careers .detail_popup .cont .desc_wrap .con > * + *{margin-top:40px;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table{border-top:1px solid #000; border-bottom:1px solid #000;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table{width:100%;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table thead tr:last-child{border-bottom:1px solid #ccc}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr + tr{border-top:1px solid #ccc}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr th{border-right:1px solid #ccc;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr th:last-child{border-right:0;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr th:last-child:first-child{border-right:1px solid #ccc;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td{border-right:1px solid #ccc;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td.center:last-child:first-child{border-right:1px solid #ccc;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td:last-child{border-right:0;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr th{padding:16px; background-color:#f3f3f3; font-size:20px; color:#333; text-align:center; font-weight:600; word-break:keep-all;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td{padding:20px 30px; background-color:#fff; font-size:18px; color:#333; text-align:left; font-weight:300; word-break:keep-all;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td.center{text-align:center;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td .box{width:49%; display:inline-block; vertical-align:top;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td p{font-size:18px; word-break:keep-all; color:#333;}
.new_careers .detail_popup .cont .desc_wrap .con .table_area .table table tr td ul + ul { margin-top: 40px; }

.new_careers .detail_popup.on{display:block;}
.new_careers .detail_popup.on.active .close_btn{ right:calc(1140px + 50px); opacity:1; transition: opacity 0.3s 0.3s, right 0.3s 0.3s, background 0.3s;}
.new_careers .detail_popup.on.active .close_btn:focus{border-radius:50%;}
.new_careers .detail_popup.on.active .cont{right:0; opacity:1;}

/* 직무 소개 */
.new_careers.job-description .sec_card_list { padding: 100px 0 0; }
.new_careers.job-description .sec_card_list .sub_tit h3 { font-weight: 300; }
.new_careers.job-description .detail_popup .cont .title_wrap { display: flex; align-items: flex-end; gap: 20px; }

/* 채용 프로세스 */
.new_careers.recruitment-process .sec1 { padding: 100px 0 0; }
.new_careers.recruitment-process .sec1 .sub_tit { margin-bottom: 0; }
.new_careers.recruitment-process .sec1 .sub_tit h3 { font-weight: 300; }
.new_careers.recruitment-process .sec2 { padding: 120px 0 160px; }
.new_careers.recruitment-process .sec2 .recruitment_process_list { grid-template-columns: repeat(6, 160px); }
.new_careers.recruitment-process .sec2 .recruitment_process_list li { width: 160px; }
.new_careers.recruitment-process .sec2 .recruitment_process_list li::before { left: calc(100% + 10px); }
.new_careers.recruitment-process .sec3 { padding: 0 0 160px; }
.new_careers.recruitment-process .sec3 .recruitment_process_list { grid-template-columns: repeat(5, 1fr); }
.new_careers.recruitment-process .sec4 { padding: 0 0 160px; }
.new_careers.recruitment-process .sec4 .recruitment_process_list { grid-template-columns: repeat(6, 160px); }
.new_careers.recruitment-process .sec4 .recruitment_process_list li { width: 160px; }
.new_careers.recruitment-process .sec4 .recruitment_process_list li::before { left: calc(100% + 10px); }
.new_careers.recruitment-process .sec5 .recruitment_process_list { grid-template-columns: repeat(5, 170px); }
.new_careers.recruitment-process .recruitment_process_desc { border-top: 1px solid #333; border-bottom: 1px solid #333; }
.new_careers.recruitment-process .recruitment_process_desc dl { display: flex; align-items: flex-start; justify-content: flex-start; padding: 30px 50px; gap: 0 40px; border-bottom: 1px solid #ccc; }
.new_careers.recruitment-process .recruitment_process_desc dl:last-child { border-bottom: 0; }
.new_careers.recruitment-process .recruitment_process_desc dl dt { width: 126px; font-size: 20px; font-weight: 600; line-height: 1.5; color: #333; }
.new_careers.recruitment-process .recruitment_process_desc dl dd { flex: 1; }
.new_careers.recruitment-process .recruitment_process_desc + .btn_wrap { margin-top: 60px; }
.new_careers.recruitment-process .recruitment_process_desc[data-motion],
.new_careers.recruitment-process .btn_wrap[data-motion] {opacity:0; transform:translateY(50px); transition:0.7s;}
.new_careers.recruitment-process .recruitment_process_desc[data-motion].active,
.new_careers.recruitment-process .btn_wrap[data-motion].active {opacity:1; transform:translateY(0);}

/* 채용 Tips */
.new_careers.careers-tips .sec1 { padding: 100px 0 0; }
.new_careers.careers-tips .tips_list { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 80px 48px; }
.new_careers.careers-tips .tips_list li { width: calc((100% - 48px * 2) / 3) }
.new_careers.careers-tips .tips_list li a { display: flex; flex-direction: column; width: 100%; gap: 16px; }
.new_careers.careers-tips .tips_list li a .img_area { overflow: hidden; position: relative; width: 100%; aspect-ratio: 16/9; border-radius: 10px; }
.new_careers.careers-tips .tips_list li a .img_area img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center; width: 100%; height: 100%; object-fit: cover; transition: transform .75s; }
.new_careers.careers-tips .tips_list li a:hover .img_area img { transform: translate(-50%, -50%) scale(1.1); }
.new_careers.careers-tips .tips_list li a .txt_area { display: flex; flex-direction: column; gap: 24px; }
.new_careers.careers-tips .tips_list li a .txt_area .tit { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 20px; font-weight: 700; line-height: 1.5; color: #000;  }
.new_careers.careers-tips .tips_list li a .txt_area .date { font-size: 14px; font-weight: 300; line-height: 1.5; color: #666; }

/* 회사생활 */
.new_careers.company-life .sec_sticky_wrap .sub_tit h3 { font-weight: 300; }
.new_careers.company-life .sec_card_list ul li { width: calc((100% - 30px * 2) / 3); height: 220px; padding: 30px; }
.new_careers.company-life .sec_card_list ul li dl dd { word-break: keep-all; }
.new_careers.company-life .img_wrap { overflow: hidden; position: relative; width: 100%; height: 340px; margin: 0 0 60px; border-radius: 20px; }
.new_careers.company-life .img_wrap .img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center; width: 100%; height: 100%; }
.new_careers.company-life .img_wrap .img img { width: 100%; height: 100%; object-fit: cover; }
.new_careers.company-life .section[data-motion] .img_wrap .img {transform: translate(-50%, -50%) scale(1.4); transition:3s;}
.new_careers.company-life .section[data-motion].active .img_wrap .img {transform: translate(-50%, -50%) scale(1);}
.new_careers.company-life .sec1 { padding: 120px 0 160px; }
.new_careers.company-life .sec2 { padding: 120px 0 160px; background: #f3f3f3; }
.new_careers.company-life .sec3 { padding: 120px 0 0; }