/*  공통 */
.con_wrap { max-width: 1420px; padding:0 60px; margin:0 auto; width:100%; }

.sub_title { line-height: 1; text-align: center; }
.sub_title h1 { position:relative; display: block; font-size: 38px; font-weight: 900; }
.sub_title h1:before { content:""; display: block; width:50px; height:1px; background:#000; margin:0 auto 20px; }

.sub_title p { position:relative; font-size: 24px; font-weight:900; word-break: keep-all; line-height: 42px; }
.sub_title p:before { content:""; display: block; width:50px; height:1px; background:#000; margin:0 auto 45px; }
.sub_title p span { color:#007ad6; font-weight: 600; }
.sub_title p i { font-style: normal; font-weight: 400; }

/* .bg_bot { width:100%; height: 500px; background:url('../img/s2_bg.jpg') no-repeat center / cover; } */

#net_idx { padding: 35px 0 130px; position:relative; z-index: 1; overflow: hidden; }

/* contents */
#net_idx .sub_title span { margin:30px 0 0; display: block; text-align: center; font-size:16px; line-height: 30px; font-weight: 300; }

.idx_con { margin-top: 80px; }
.idx_con ul { position:relative; }
.idx_con ul:after { content:""; position:absolute; left:50%; transform: translateX(-50%); top:0; width:1px; height: 100%; border-left: 1px solid #ddd; z-index: -1; }
.idx_con li { position:relative; display: flex; justify-content:space-between; align-items: center; margin-bottom: 80px; }
.idx_con li:nth-child(even) { flex-direction: row-reverse; }
.idx_con li:last-child { margin-bottom: 0; }

.idx_con li .img img { max-width: 100%; }
.idx_con li .dot { position:absolute; left:50%; transform: translate(-50%,-50%); width:10px; height: 10px; top:28%; background:#007bd7; border-radius: 50%; z-index: 1; }
.idx_con li .dot:before { content:""; position:absolute; left:-5px; top:-5px; width:20px; height: 20px; border-radius: 50%; border:2px solid #007ad6; }
.idx_con li .dot:after { content:""; position:absolute; left:calc(100% + 5px); top:50%; transform: translateY(-50%); width:60px; height: 2px; background:#007bd7; }
.idx_con li:nth-child(even) .dot:after { left:initial; right:calc(100% + 5px); }

.idx_con li .txt { width:545px; line-height: 1; }
.idx_con li .txt h2 { font-size:14px; color: #007ad6; font-weight: 500; font-family: 'Montserrat'; word-break: keep-all; }
.idx_con li .txt h1 { margin:18px 0 36px; font-size:31px; font-weight: 700; word-break: keep-all; }
.idx_con li .txt p { font-size:16px; font-weight: 300; color: #333; font-weight: 300; line-height: 30px; word-break: keep-all; }
.idx_con li .txt .idx_btn { position:relative; margin-top: 50px; display: inline-block; width:200px; line-height: 40px; font-size:13px; font-weight: 300; color:#fff; background-image: linear-gradient(to left, #049, #007bd7); padding:0 0 0 16px;
z-index: 1; word-break: keep-all; }
.idx_con li .txt .idx_btn img { display: inline-block; margin-left: 20px; transition: all .4s; position:relative; top:-1px; }
.idx_con li .txt .idx_btn:hover img { margin-left: 5px; }



@media screen and (max-width:1420px) {

    .idx_con li .img { width:calc(50% - 70px); }

    .idx_con li .dot { top:20%; }
    .idx_con li .dot:after { width: 40px; }

    .idx_con li .txt { width:calc(50% - 70px); }
    .idx_con li .txt br { display: none; }
    .idx_con li .txt h1 { margin: 12px 0 22px; font-size: 28px; }

    .idx_con li .txt .idx_btn { margin-top: 30px; }
}

@media screen and (max-width:1024px) {
    .net_title { margin-bottom: 22px; }

    /* con */
    #net_idx { padding: 35px 0 80px; }
    .idx_con { margin-top: 60px; }

    .idx_con li { margin-bottom:60px; }
    .idx_con li .img { width:calc(50% - 30px); }
    .idx_con li .txt { width:calc(50% - 30px); }

    .idx_con li .dot:after { display: none;  }
    .idx_con li .txt h1 { font-size: 24px; }
    .idx_con li .txt p { font-size: 15px; line-height: 27px; }
    .idx_con li .txt .idx_btn { margin-top: 15px; width: 180px; padding:0 0 0 12px; line-height: 35px; }
    .idx_con li .txt .idx_btn img { margin-left: 10px; }
}

@media screen and (max-width: 768px) {
    /* 공통 */
    #net1 { padding-top: 20px; }
    .con_wrap { padding: 0 40px; }
    .sub_title { padding:0 15px; }
    .sub_title h1 { font-size: 28px; line-height: 35px; }

    .net_title { margin-bottom: 17px; }
    .net_title h2 { margin-left: 20px; font-size: 22px; }

    /* con */
    #net_idx .sub_title span { margin:20px 0 0; font-size: 15px; line-height: 28px; }
    #net_idx .sub_title span br { display: none; }

    .idx_con { margin-top: 40px; }
    .idx_con ul:after { display: none; }
    .idx_con li { flex-wrap: wrap; text-align: center; }

    .idx_con li .dot { display: none; }
    .idx_con li .img { width:100%; order: 1; }
    .idx_con li .txt { padding:20px 0 30px; border-bottom: 1px solid #ddd; width:100%; order: 2; }
    .idx_con li .txt h1 { font-size: 22px; margin:10px 0 20px; }
    .idx_con li .txt h2 { font-size: 13px; }

    .idx_con li .txt .idx_btn { padding:0; }
}

@media screen and (max-width: 640px) {
    /* 공통 */
    .con_wrap { padding: 0 20px; }

    /* con */
}