/* 공통 */
.sub_con { max-width: 1300px; width:100%; margin:0 auto; }
.sub_h1 { font-size: 44.5px; font-weight: bold; letter-spacing: -2.23px; line-height: 1.34; color: #000; word-break: keep-all; }
.sub_h1.eng { font-size: 55px; letter-spacing: 0;}
.sub_h1 span { font-weight: 300; }
.sub_h2 { font-size: 18.5px; letter-spacing: 3.7px; color: #219914; margin-bottom:10px; text-transform: uppercase; line-height: 1.7; word-break: keep-all; }
.s_tit_p { font-size: 21.5px; font-weight: 300; letter-spacing: -0.54px; line-height: 1.77; color: #000; margin-top: 20px; word-break: keep-all; }

.g_color { color: #219914; }
.sec_pad { padding:100px 0; }
.sec_pad:last-of-type { padding-bottom: 140px; }
.bg_bot { width:100%; height: 500px; background:url('../img/org_bg.jpg') no-repeat center / cover; /*margin-top: 200px;*/ }
.flex { display: flex; }

.img img { max-width: 100%; }

/* contents */
#job { position: relative; overflow: hidden; padding:70px 0 0; text-align: center; }
#job > div:nth-of-type(even) { background:#f7f7f7; }


/* s1 */
#s1 { padding:0 0 90px; }
#s1 p { margin-top: 30px; width:100%; padding:40px; font-size: 18.5px; font-weight: 300; letter-spacing: -0.46px; color: #000; background:rgba(33,153,20,0.06); word-break: keep-all; }
#s1 p b { font-weight: 500; }


/* s2 */
.s2_list { margin-top: 50px; display: flex; }
.s2_list li { flex:1; }
.s2_list li ~ li { margin-left: -50px; }
.s2_list li img { width:100%; }

/* s3 */
.s3_list {margin-top:65px; width: 100%; display: flex; justify-content: space-between; text-align: center; position: relative; z-index: 1;}
.s3_list::before {content: ''; width: 100%; height: 1px; background:#ddd; position: absolute; left:0; top:3px;}
.s3_list li { flex:1; display: flex; flex-direction: column; align-items: center; line-height: 1; }
.s3_list li .s3_dot {width: 9px; height: 9px; background: #c6c6c6; border-radius: 50%; position: relative; z-index: 1; transition: all .3s ease;}
.s3_list li .s3_dot::before {content: ''; display: block; width: 21px; height: 21px; position: absolute; z-index: -1; background: rgba(198,198,198,0.3); transition: all .3s ease; left:-6px; top:-6px; border-radius: 50%; }
.s3_list .s3_ico { margin-top: 70px; }
.s3_list li h2 { font-size:15px; font-weight: 500; color:#219914; margin:55px 0 15px; text-transform: uppercase; }
.s3_list li h1 { font-size:22px; font-weight: 700; color:#000; }

/* s3-active */
.s3_list li.active .s3_dot {background-color: #219914;}
.s3_list li.active .s3_dot::before {background-color: rgba(33,153,20,0.3);}

#s3 .p_box { margin-top: 70px; display: flex; justify-content: center; padding:25px; background:rgba(33,153,20,0.06); }
#s3 .p_box b { font-size: 17px; font-weight: bold; color: #219914; word-break: keep-all; }
#s3 .p_box b img { display: inline-block; margin-right: 10px; }
#s3 .p_box p { margin-left: 25px; font-size: 16px; color: #333; word-break: keep-all; }


/* s4 */
#s4 .list_wrap { margin-top: 45px; border-top: 2px solid #333; padding:45px 0 0; }
.s4_list { display: flex; border-right: 1px solid #ddd; }
.s4_list li { flex:1; border-left: 1px solid #ddd; padding:0 20px; }
.s4_list h3 { width: 88px; margin:0 auto; height: 37px; line-height: 35px; background-color: #333; color:#fff;  border-radius: 18.5px; font-size:16px; font-weight: 900; transition: all .3s; }
.s4_list p { font-size: 17px; color: #333; word-break: keep-all; margin: 20px 0 10px; }

.s4_list li.active h3 { background:#219914; }


/* s5 */
#s5 { padding:80px 0 0; }
#s5 .dot { position:relative; padding-left: 15px; }
#s5 .dot:before { content:""; position:absolute; left:0; top:12px; width:4px; height: 4px; background:#333; border-radius: 50%; }

.s5_con { margin:30px 0 125px; padding:50px 150px 65px; background:rgba(33,153,20,0.06); text-align: left; }
.s5_con > h3 { position:relative; font-size: 21px; font-weight: bold; color: #219914; word-break: keep-all; }
.s5_con > h3 img { display: inline-block; margin-right: 15px; }
.s5_con > .flex { margin:20px 0 0;  display: flex; }
.s5_con > .flex > div { flex:1; }
.s5_con > .flex p { font-size: 18.5px; font-weight: 300; letter-spacing: -0.46px; word-break: keep-all; }
.s5_con > .flex p ~ p { margin-top: 20px; }

.s5_con .left { padding: 0 20px 0 50px; }
.s5_con .right { display: flex; }
.s5_con .right ul { padding-left: 35px; width:calc(100% - 105px); }
.s5_con .right li { display: flex; align-items: center; margin-bottom: 20px; }
.s5_con .right li:last-child { margin-bottom: 0; }
.s5_con .right li b { width: 85px; margin-right: 25px; font-size: 18.5px; font-weight: 500; letter-spacing: -0.46px;  color: #219914; }
.s5_con .right li b img { position:relative; display: inline-block; margin-right: 7px; top:-3px; }
.s5_con .right li p { width:calc(100% - 110px); }

.bot_txt { width:100%; padding:25px; text-align: center; background-color: #219914; }
.bot_txt p { max-width: 1300px; margin:0 auto; display: inline-block; font-size: 19px; font-weight: 500; letter-spacing: -0.48px; color: #fff; text-align: center; word-break: keep-all; }
#s5 .bot_txt .dot:before { background:#fff; }




@media screen and (max-width: 1420px) {
    /* 공통 */
    .sub_con { max-width: 1420px; padding:0 60px; }

   /* con */
   .s5_con { padding: 50px 30px 65px; }


}
@media screen and (max-width: 1023px) {
    /* 공통 */
    .sub_con { padding:0 40px; }
    .sub_h1 { font-size: 38px; line-height: 1.65; }
    .sub_h1.eng { font-size: 48px; }
    .s_tit_p { font-size: 18px; }

    .bg_bot { height: 350px; }
    .sec_pad { padding: 80px 0; }
    .sec_pad:last-of-type { padding-bottom: 100px; }

    /* contents */
    #job { padding:90px 0 0; }

     /* con */
     /* s5 */
     .s5_con { margin: 30px 0 80px; }
     .s5_con > .flex { flex-wrap: wrap; }
     .s5_con > .flex > div { flex: none; width: 100%; }
     .s5_con .right { padding: 20px 0 0 50px; }
     .s5_con .right ul { padding:5px 0 0 35px; }
     .s5_con .right li { margin-bottom: 13px; }

}
@media screen and (max-width: 767px) {
    /* 공통 */
    .sub_con { padding:0 20px; }
    .sub_h1 { font-size: 30px; }
    .sub_h1.eng { font-size: 35px; }
    .sub_h2 { font-size: 16px; margin-bottom: 10px; line-height: 1.7; }
    .s_tit_p { font-size: 16px; margin-top: 15px; line-height: 2; }

    .bg_bot { height: 250px; }
    .flex { flex-wrap: wrap; }
    .sec_pad { padding: 60px 0; }
    .sec_pad:last-of-type { padding-bottom: 80px; }


    /* contents */
    #job { padding:50px 0 0; }

    /* con */
    /* s1 */
    #s1 { padding: 0 0 70px; }
    #s1 p { margin-top: 20px; padding: 20px; font-size: 15px; line-height: 28px; }

    /* s2 */
    .s2_list { width:calc(100% + 50px); margin-top: 30px; flex-wrap: wrap; }
    .s2_list li { flex: none; width: 33.3%; }
    .s2_list li ~ li { margin-left:0; }
    .s2_list li:nth-child(3n),
    .s2_list li:nth-child(3n-1) { margin-left: -25px; }
    .s2_list li:nth-child(n+4) { margin-top: 15px; }


    /* s3 */
    .s3_list { margin-top: 35px; flex-wrap: wrap; }
    .s3_list:before { display: none; }
    .s3_list li { flex: none; width: 50%; }
    .s3_list li:nth-child(n+3) { margin-top: 50px; }
    .s3_list .s3_ico { margin-top: 30px; }
    .s3_list .s3_ico img { height: 40px; }
    .s3_list li h2 { font-size: 13px; margin: 25px 0 10px; }
    .s3_list li h1 { font-size: 18px; }

    .s3_list li:nth-child(odd) { position:relative; }
    .s3_list li:nth-child(odd):before { content:""; position:absolute; left:0; width:200%; top:3px; height: 1px; background:#ddd; }

    #s3 .p_box { margin-top: 50px; padding: 25px 15px; flex-wrap: wrap; justify-content: flex-start; text-align: left; }
    #s3 .p_box p { width: 100%; margin:10px 0 0; font-size: 15px; line-height: 26px; }

    /* s4 */
    #s4 .list_wrap { margin-top: 25px; padding: 25px 0 0;  }
    .s4_list { flex-wrap: wrap; border-right: 0; }
    .s4_list li { flex: none; width:50%; border-left:0; border-left:0; padding:30px 10px; }
    .s4_list li:nth-child(even) { border-left:1px solid #ddd; }
    .s4_list li:nth-child(n+3) { border-top:1px solid #ddd; }

    .s4_list h3 { width: 80px; height: 35px; line-height: 33px; font-size: 15px; }
    .s4_list p { font-size: 15px; margin: 20px 0 0; line-height: 26px; }

    /* s5 */
    #s5 { padding: 60px 0 0; }
    .s5_con { margin: 30px 0 60px; padding: 35px 15px;  }

    .s5_con > h3 { font-size: 17px; }
    .s5_con > h3 img { width: 20px; margin-right: 10px; }
    .s5_con > .flex p { font-size: 15px; line-height: 28px; }
    .s5_con > .flex p ~ p { margin-top: 10px; }

    .s5_con .left { padding: 0 0 0 20px; }
    .s5_con .right { padding: 10px 0 0 20px; flex-wrap: wrap; }
    .s5_con .right ul { padding:5px 0 0 20px; width:100%; }
    .s5_con .right li { margin-bottom: 3px; }
    .s5_con .right li b { width: 70px; margin-right: 20px; font-size: 16px; white-space: nowrap; }
    .s5_con .right li b img { width:13px; }

    .bot_txt { padding: 20px; }
    #s5 .bot_txt .dot { padding:0; font-size: 15px; line-height: 27px; }
    #s5 .bot_txt .dot:before { left:-10px; top: -5px; display: inline-block; position:relative; }

}