@charset "utf-8";

/* 취업지원시스템 */
.system_wrap {}
.top_system{position:relative; width:1060px; margin: 0 auto; margin-bottom:48px;}

.system_content{ width:1130px; margin:0 auto; background:#fff;}
.top_step_btnbox {width:100%; margin:0 auto 40px;}
.step_btnbox {width:775px; margin:0 auto;}
.step_btnbox .btn_step {float:left; cursor:pointer;}
.step_btnbox .btn_step:last-of-type li {margin-right:0;}
.step_btnbox .btn_step li {width:190px; height:55px; margin-right:5px; background:#f0f3f8; color:#222; text-align:center;}
.step_btnbox .btn_step p {height:100%; color:#222; font-size:16px; line-height:53px;}
.step_btnbox .btn_step  .btn_step_on {background:#008eff; color:#fff;}
.step_btnbox .btn_step img{ width:100px; }
.step_txtbox{width: 1060px; margin: 0 auto; text-align: center;}
.step_txtbox .step_title{font-size: 27px; color: #222; letter-spacing: -0.5px; font-weight: bold;}
.step_txtbox .step_text{font-size: 15px; color: #222; line-height: 20px; letter-spacing: -1px; opacity: 0.9; margin-top: 6px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"}
.cirbtn{ width: 100%; }
.cirbtn ul{text-align:center; position: relative; top:-47px;}
.cirbtn li{ cursor: pointer; display: inline-block; width: 8px; height: 8px; margin: 0 5px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.5); opacity: 0.8; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" cursor:pointer;}
.cirbtn li.on{ opacity: 1;  background: #fff;  width: 8px; height: 8px; border-radius: 50%;}
.cirbtn li.cirbtn02, .cirbtn li.cirbtn03, .cirbtn li.cirbtn04, .cirbtn li.cirbtn05{display:none;}
.rolling_panel { position: relative; width: 1060px; height: 450px; margin:20px auto 0; overflow: hidden; }
.rolling_panel ul { position: absolute; left:0; list-style: none; }
.rolling_panel ul li { float: left; width: 1060px; height: 450px;}
.rolling_panel ul li img{width:100%;}
.system_menu{position:relative; width:1060px; margin: 0 auto; top:15px; text-align:center;}



#system .sliderContainer { position: relative; width: 1130px; height: 600px; margin: 0 auto; overflow: hidden; padding-top: 45px; margin-top: 21px; background: #fff;}
#system .slider { width: 1060px; margin: -10px 40px 0 35px; height: 430px; position: relative; }
#system .systemSlide{ text-align: center; width: 100%; margin:0 auto; }
#system .systemSlide .step_title{ font-size:25px; font-weight: bold; margin-top:20px; }
#system .systemSlide p:last-child{ font-size:15px; margin-top:10px;}
#system .slick-slide { color: white; font-size: 30px; text-align: center; }
#system .progressBarContainer {  position: relative; margin: 0 auto; top: -719px; width: 520px; }
#system .progressBarContainer div { display: block; width: 92px; padding: 0; text-align: center; cursor: pointer; margin-right: 15px; float: left; color: white; }
#system .progressBarContainer div:last-child { margin-right: 0; }
#system .progressBarContainer div span.progressBar { width: 100%; height: 1px;background-color: rgba(255, 255, 255, 0.4); display: block;}
#system .progressBarContainer div span.progressBar .inProgress {background-color: rgba(255, 255, 255, 1); width: 0%; height: 2px; }
#system .slick-dots { bottom: 15px; }
#system .slick-dots li button{ font-size: 0; line-height: 0; display: block; border-radius: 50px; padding: 4px; cursor: pointer; color: transparent;
  border: 2px solid rgba(255,255,255,0.3);
  outline: none;
  background: none; }
#system .slick-dots li.slick-active button{ background:#fff; }
.system_menu{position:relative; width:1060px; margin: 0 auto; top:15px; text-align:center;}
.management{position:relative; float:left; left:10px;}
.support{float:left; position:relative; left: 7.5%;}
.info{float:left; position:relative; left:152px;}
.advice{float:left; position:relative; left:192px;}
.special{float:left; position:relative; left:215px;}
.realinterview{float:left; position:relative; left:258px;}

.work_subwrap{ width:100%; overflow:hidden; background:#fff; }
.work_sub{ width: 100%; margin-top: 50px; }
.work_sub p:first-child{ text-align: center; font-size:65px; color:#f0f3f8; font-weight: bold; }
.work_sub p:last-child{ text-align: center; font-size: 28px; font-weight: 500; margin-top: -39px; }
.work_system_wrap{float:left; width: 100%; background:skyblue;}
.work_system_wrap .work_system {float:left; width:100%; background:#fff; text-align:left;}
.work_system_wrap .systemtap_wrap{ width: 100%;width: min(1200px, 100%); height: 80px; float: left; top: 0px; z-index: 2; background:#fff;}
.work_system_wrap .systemtap_wrap .systemtap_box{width:775px; margin:13px auto; overflow: hidden; }
.work_system_wrap .systemtap_wrap .systemtap_box #menu li:nth-child(3){ margin-right:5px; }
.work_system_wrap .systemtap_wrap .systemtap_box .systemtap{ float:left; width:190px; height:55px; background: #f0f3f8; text-align: center; margin-right: 5px; cursor:pointer; }
.work_system_wrap .systemtap_wrap .systemtap_box .systemtap_on{ background:#008eff; }
.work_system_wrap .systemtap_wrap .systemtap_box .systemtap_on p{ color:#fff !important; }
.work_system_wrap .systemtap_wrap .systemtap_box .systemtap p{font-size: 15px; color: #222; letter-spacing: -0.5px; line-height: 53px;}
.work_system_wrap .system_stepwrap{width: 100%; float: left; padding-bottom:33px; position: relative; background:#fff;}
.work_system_wrap .system_stepwrap .system_bottom{ width: 100%; height: 269px; position: absolute; background: #f2f5f9; bottom: 0;}
.work_system_wrap .system_step01{}
.work_system_wrap .system_step02,.work_system_wrap .system_step04{background:#f2f5fa;}
.work_system_wrap .system_step04{ padding:50px 0 !important; }
.work_system_wrap .system_step04 .system_stepbox{ padding:0 !important; }
.work_system_wrap .system_step05 .step_texttitle{ margin-bottom:30px; }
.work_system_wrap .system_stepwrap .system_stepbox{ width: 1130px; margin: 0 auto; padding: 50px 0 30px 0; }
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox{float: left; width: 480px; margin-top:30px; margin-right: 40px; margin-left:35px; position:relative;}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step01_leftimg01{float:left; width:189px; height:281px; margin-right:5px; background: url('/resources/images/system/system_step01_leftimg01_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step01_leftimg02{float:left; width:286px; height:281px; background: url('/resources/images/system/system_step01_leftimg02_new.jpg');}

.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg01{float:right; width:347px; height:242px; margin-bottom: 15px; background: url('/resources/images/system/system_step02_leftimg01_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg02{float:left; width:286px; height:260px; margin-right: 5px; background:url('/resources/images/system/system_step02_leftimg02_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg03{float:left; width:189px; height:260px; background:url('/resources/images/system/system_step02_leftimg03_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg04{float:left; width:410px; height:163px; margin-top: 15px; margin-right: 5px; background:url('/resources/images/system/system_step02_leftimg04_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg05{float:left; width:270px; height:215px; margin-top: 15px; background:url('/resources/images/system/system_step02_leftimg05_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg06{float:right; width:270px; height:225px; margin-top:-58px; margin-bottom: 182px; background:url('/resources/images/system/system_step02_leftimg06_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg07{float:left; width:286px; height:281px; position: absolute; top: 1107px; left: 0px; background:url('/resources/images/system/system_step02_leftimg07_new.jpg') no-repeat;}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg07_1{width:189px; height:281px; position: absolute; top: 1107px; right: 0px; background:url('/resources/images/system/system_step02_leftimg08_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg08{float:left; width:343px; height:243px; margin-top:129px; margin-right: 5px; background: url('/resources/images/system/system_step02_leftimg09_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg09{float:right; width:375px; height:195px; margin-top:-18px; background: url('/resources/images/system/system_step02_leftimg10_new.jpg');}/*
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg10{float:left; width:375px; height:163px; margin-top: 15px; background: url('/resources/images/system/system_step02_leftimg10.jpg');}*/

.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg01{float:left; width:245px; height:184px; margin-top:96px; margin-right: 5px; background:url('/resources/images/system/system_step03_leftimg01_new.jpg') no-repeat;}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg02{float:left; width:220px; height:280px; background:url('/resources/images/system/system_step03_leftimg02_new.jpg')no-repeat;}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg03{float:left; width:480px; height:245px; margin-top:15px; background: url('/resources/images/system/system_step03_leftimg03_new.jpg') no-repeat;}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg04{display:none; float:left; width:270px; height:204px; background: url('/resources/images/system/system_step03_leftimg04_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg05{float:left; width:480px; height:245px; background: url('/resources/images/system/system_step03_leftimg05_new.jpg');}

.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step05_leftimg01{float:left; width:255px; height:195px; background:url('/resources/images/system/system_step05_leftimg01_new.jpg');}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step05_leftimg02{float:left; width:255px; height:195px; position: absolute; top:102px; right:0; background: url('/resources/images/system/system_step05_leftimg02_new.jpg');}

.work_system_wrap .system_stepwrap .system_stepbox .step_textbox{float: left; width: 530px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle{float: left; text-align: center; width:100%; }
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle00{ font-size:18px; font-weight: 300;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle00 span{ font-size:18px; font-weight: bold; }
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle01{margin-top: 4px; font-size: 16px; letter-spacing: -1px; color: #222;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle02{font-size: 23px; color: #222; letter-spacing: -1.5px; font-weight: 600; line-height: 24px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .line{ width:31px; height:2px; background:#dee6f1; margin:20px auto; }
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle03{font-size: 30px; color: #ff0200; letter-spacing: -1.5px; font-weight: 500;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle04{font-size: 17px; color: #222; letter-spacing: -1.5px; font-weight: bold;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle04 span{font-size: 16px; color: #222; letter-spacing: -1.5px; font-weight: 300;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list{float:left; position:relative; margin-top:26px;}
/* .work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_list_line {background:url('/resources/images/system/step_list_line.jpg'); background-repeat:repeat-y; width:1px; position:absolute; left:11px; top:1px;} */
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_list_line {position:absolute; left:11px; top:1px; width:1px; background:var(--common-border);}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line01 {height:260px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line02 {height:1788px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line03 {height:525px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table{float:left;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_line{float: left; width: 46px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_line td{width:46px; /*height:9px*/}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_line img{position:absolute; z-index:1;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con {float:left; width:530px; margin-left:70px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con th { text-align: left; float:left; width:449px; font-size: 17px; color: #ff0200; font-weight: normal; letter-spacing: -1px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con th img{margin: 0 0 -3px 7px; cursor: pointer;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td {float:left; width:449px;margin-bottom: 22px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td p{font-weight:500; line-height: 1.4; color:#222; letter-spacing: -0.5px; font-size:16px; }
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td p:first-child{ margin-top:2.5px; }
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td span{color:#5b5b5b; letter-spacing: -0.5px; margin-top:1.5px; display:block; font-size:15px; }


.system_list{ width: 1130px; margin: 0 auto; height: 417px; overflow: hidden; }
.system_list ul li{ float: left; text-align: center; position: relative; margin: 0 19px 0 0; box-shadow: 6px 0 12px 1px rgba(0,0,0,0.1)}
.system_list ul li:last-child{ margin-right:0; }
.system_list .content_box { width:364px; height:399px; background:#fff; }
.system_list .action { overflow:hidden; position:relative;}
.system_list .action img { display:block;}
.system_list .action p{ line-height:1.3; }
.system_list .action p:first-child{ font-size: 22px; margin-bottom: 15px; color: #ff0200; font-weight: 500; }
.system_list .action p:nth-child(2){ font-size: 16px; margin-bottom: 7px; color: #222; font-weight: 600; letter-spacing: -0.09em; }
.system_list .action p:nth-child(3){ font-size: 14px; color: #5b5b5b; }

.system_list .action .sub_tit2{ width:181px; white-space: nowrap; margin:0 auto; text-overflow: ellipsis; overflow: hidden; }
.system_list .action .hover_wrap{ background:#fff; position: absolute; left: 0px; bottom: 0; width: 364px; height: 189px; }
.system_list .action .hover { position: absolute;  left: 0px; bottom: 0; width: 364px; padding: 0 0 44px; text-align: center;  box-sizing: border-box;
-webkit-box-sizing: border-box;  -moz-box-sizing: border-box; transition: .25s; -webkit-transition: .25s; -moz-transition: .25s; cursor: pointer; }
.system_list .action .hover .desc{ position: absolute; width: 364px; opacity: 0; top: 120px; left: 150px; cursor: pointer;  box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
.system_list .action:not(.actionN):hover .hover { padding-bottom:55px;transform: translateY(-7%); -webkit-transform: translateY(-7%);
     -moz-transform: translateY(-7%);}
.system_list .action:not(.actionN):hover .hover .desc{ opacity:1; transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0);}


.application_down_wrap{float: left; width: 100%; background:url('/resources/images/system/system_download_bg.jpg'); height:325px; background-size:cover; background-position:center; }
.application_down_wrap .down_box{width: 660px; margin: 0 auto; text-align: center;}
.application_down_wrap .down_box .down_title{float:left; width:660px;}
.application_down_wrap .down_box .down_title h3{font-size: 27px; color: #fff; letter-spacing: -1.5px; font-weight: 400;}
.application_down_wrap .down_box .down_title p{font-size: 15px; color: #fff; line-height: 18px; letter-spacing: -1px; margin-top: 6px; }
.application_down_wrap .down_box .down_btnbox{ margin-top: 60px; }
.application_down_wrap .down_box .down_btnbox .down_logo{ display: inline-block; }
.application_down_wrap .down_box .down_btnbox .down_logo p{font-size: 14px; color: #fff; letter-spacing: -1px; margin-top:5px; }
.application_down_wrap .down_box .down_btnbox .down_list{ width:450px; margin:25px auto; }
.application_down_wrap .down_box .down_btnbox .down_list a{ display: block; }
.application_down_wrap .down_box .down_btnbox .down_list a img{float: left;}
.application_down_wrap .down_box .down_btnbox .down_list a p{ font-size: 15px; position: relative; right:14px; letter-spacing: -1px; height: 53px; color: #fff; width: 188px; line-height: 53px; }
.application_down_wrap .btn button { border: none; outline: none; background: url(/resources/images/system/download_off.png) no-repeat; margin-right: 2px; line-height: 18px; border: 1px solid #fff; position: relative; }
.application_down_wrap .btn button.active { background:url(/resources/images/system/download_on.png) no-repeat; }
.application_down_wrap .btn button.active p { color:#222!important; }
.application_down_wrap .tabs>.labels>label { color: #fff; cursor: pointer; }
.labels{ display: inline-block; margin-top:6px; }
.application_down_wrap .tab_container { width: 100%; margin-top:20px; }
.application_down_wrap .tabs>.labels>label a { color: inherit; }
.application_down_wrap .tabs>input[type="radio"], .tabs .tab_content { display: none; }
input#tab1:checked ~ .tab_container>#tab1C,
input#tab2:checked ~ .tab_container>#tab2C{ display:block; }

.system_bot{float:left;}
.bot_back{width:100%;background-image: url('/resources/images/system/system_bottom.jpg');background-repeat: no-repeat; height:633px; background-color:#f8f8f8;}
.question01{width:1060px; margin:0 auto; position:relative;}
.question02{width:1060px; margin:0 auto; position:relative;}
.job{position:relative; width:1060px; margin: 0 auto; bottom:36%; color:#fedad3;}
.job_call p{position:relative; color:white; text-align:right; right:57%; top: 13%; margin-top:3px;}
.jinterview{font-size:16px;}
.num{font-size: 27px; font-weight: 900; font-family: Tahoma, 'NanumBarunGothic', Dotum, sans-serif;}
.call_interview{font-size:13px; font-fzmily:'NanumGothic'}
.jobsearch{position:relative; margin-top:5%;}
.jobsearch p{color:white; position:relative;  left:57%; margin-top:3px;}
.jobsearch .job_insert{font-size:13px; font-family:'NanumGothic'}
.pinterview{ font-size:16px;} 
