@CHARSET "UTF-8";


.system-wrap{width:100%;}
.swiper-container{width:100%; height:100vh; max-height:470px; overflow:hidden;}
.swiper-slide{position:relative;}
.swiper-slide .txt-wrap{width:100%; position:absolute; bottom:40px; left: 50%; transform: translateX(-50%); text-align:center; }
.swiper-slide .txt-wrap p{color:#fff; font-size:17px; line-height:1.5;}
.swiper-slide .txt-wrap .slide-title{display:inline-block; padding:4px 10px;font-size:22px; margin-bottom:7px; background-color:#fff; color:#222; border-radius:26px;}
.swiper-slide .list-gradient{background: linear-gradient(90deg, rgba(25, 25, 25, 0.8) 10%, rgba(25, 25, 25, 0.02) 56%);background: -webkit-linear-gradient(90deg, rgba(25, 25, 25, 0.8) 10%, rgba(25, 25, 25, 0.02) 56%);}

.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{width:100%;}
.work_system_wrap .system_stepwrap {
    width: 100%;
    /*float: left;*/
    /*padding-bottom: 33px;*/
    position: relative;
   /* background: #fff;*/
}
.work_system_wrap .system_stepwrap .system_stepbox {
    width:100%;
    max-width: 1130px;
    margin: 0 auto;
    padding: 50px 0 30px 0;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle {
   /* float: left;*/
    text-align: center;
    width: 100%;
    line-height:1.4;
}
.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_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 .box-wrap{width:100%; display:flex; }
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox {
   /* float: left;*/
    width: 100%;
    max-width:475px;
    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: 100%;
    height: 100%;
    max-width:475px;
    background: url(/khacademy/resources/images/work/step01_new.jpg) no-repeat;
}
/*이미지 합치며 없앰
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step01_leftimg02 {
    float: left;
    width: 286px;
    height: 281px;
    background: url(/khacademy/resources/images/work/system_step01_leftimg02_new.jpg);
}*/
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox {
   /* float: left;*/
    width: 100%;
}
.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 {
    position: absolute;
    left: 11px;
    top: 1px;
    width: 1px;
    background:#dae0e9;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line01 {
    height: 255px;
}    
table {
    border-spacing: 0;
    border-collapse: initial;
}
.content_wrap table {
    width: 100%;
}
.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 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;
}
.work_system_wrap .system_step02, .work_system_wrap .system_step04 {
    background: #f2f5fa;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step02_leftimg01 {
    width:100%;
    height:100%;
   background: url(/khacademy/resources/images/work/step02.png) no-repeat;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox .step03_leftimg01 {
    width: 100%;
    height: 100%;
     background: url(/khacademy/resources/images/work/step03.png) no-repeat;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line02 {
    height: 1535px;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line03 {
    height: 503px;
}
/*step04*/
.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;
	line-height:1.5;
}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle04 span {
    font-size: 16px;
    color: #222;
    letter-spacing: -1.5px;
    font-weight: 300;
}
/*시스템05 제일마지막*/
.system_list {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}
.system_list ul{display:flex; justify-content:space-between; gap:19px;}
.system_list ul li {
    text-align: center;
    position: relative;
    box-shadow: 6px 0 12px 1px rgba(0, 0, 0, 0.1);
}
.system_list .action {
    overflow: hidden;
    position: relative;
}
.system_list .content_box {
    width: 100%;
    /*height: 399px;*/
    background: #fff;
}
.system_list .action img {
    display: block;
    width:100%;
}
.system_list .action .hover_wrap {
    background: #fff;
   /* position: absolute;
    left: 0px;
    bottom: 0;
    width: 364px;
    height: 189px;*/
}
.system_list .action .hover_wrap>div{
	padding:50px 0; width:100%; height:220px;
}
.system_list .action .hover {
    /*position: absolute;
    left: 0px;
    bottom: 0;*/
    width: 100%;
   /* 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 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 p {
    line-height: 1.3;
}
.work_system_wrap .system_stepwrap .system_bottom {
    width: 100%;
    height: 269px;
    position: absolute;
    background: #f2f5f9;
    bottom: 0;
}
.work_system_wrap .system_step05 .step_texttitle {
    margin-bottom: 30px;
}

/******************반응형 태블릿****************************/
@media screen and (max-width:1024px){
.swiper-slide .txt-wrap .slide-title{font-size:20px;}
.swiper-slide .txt-wrap p{font-size:16px; letter-spacing:-0.07em;}

.work_sub p:first-child{font-size:55px;}

.work_system_wrap .system_stepwrap .system_stepbox .step_imgbox{display:none;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox{padding:0 80px;}
.system_list ul {gap:10px;}
.system_list .action .hover_wrap>div{padding:30px 10px;}	
}

@media screen and (max-width:767px){
.swiper-container{max-height:330px;}	
.swiper-slide .txt-wrap .slide-title{font-size:17px;}
.swiper-slide .txt-wrap p{font-size:14px;}	
.work_system_wrap .system_stepwrap .system_stepbox{padding-top:27px;}
.work_system_wrap .system_step05 .system_stepbox{padding-bottom:0;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle00{font-size:16px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle01{font-size:15px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle02{font-size:20px;}

.work_sub p:first-child{font-size:30px;}
.work_sub p:last-child{font-size:24px; margin-top:-17px;}

.work_system_wrap .system_stepwrap .system_stepbox .step_textbox{padding:0 0 0 15px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con{margin-left:44px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .line01{height:275px;}	
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_line img{width:35px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_list_line{left:8px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td p{font-size:15px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_textbox .step_list .step_table .step_con td span{font-size:14px; line-height:1.4;}

.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle03{font-size:22px;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle04{font-size:16px; letter-spacing:-0.1em;}
.work_system_wrap .system_stepwrap .system_stepbox .step_texttitle .step_subtitle04 span{font-size:15px;}

.system_list ul{display:block;}
.system_list ul li{margin-bottom:5px; box-shadow:none;}
.work_system_wrap .system_stepwrap .system_bottom{display:none;}
.system_list .action .hover_wrap{background:#f2f5f9;}
.system_list .content_box{margin-bottom:20px;}

.system_list .action p:first-child {font-size:20px;}
.system_list .action .hover_wrap>div{height:auto;}


}