/* 공통 */
.con_wrap { width:1300px; margin:0 auto; }
.se_con { padding:90px 0; }

.sub_title { line-height: 1; text-align: center; }
.sub_title span { display: inline-block; margin-bottom: 20px; font-size:17px; color:#3d6cb3; font-family: 'Montserrat';
font-weight: 500; text-transform: uppercase; }
.sub_title h1 { font-size:43px; color:#000; font-weight: 300; font-family: 'NanumSquare'; }
.sub_title h1 b { font-weight: 800; }


/*Content CSS*/
#s1_con { margin-top: 58px; }
#s1_con .mob_img { display: none; }
#s1_con .img { width:1300px; height: 485px; padding:90px 100px; background:url('../img/gre_bg.jpg') no-repeat center / cover; }
#s1_con .img h2 { padding-bottom: 25px; font-size:34px; color:#fff; font-weight: 800; font-family: 'NanumSquare'; line-height: 48px;
word-break: keep-all; }
#s1_con .img p { font-size:16px; color: #fff; line-height: 27.5px; word-break: keep-all; }
#s1_con .img p:before { content:""; display:block; margin-bottom: 25px; width:36px; height:2px; background:#fff; }

#s1_con .txt { width:1100px; margin: -120px auto 0; padding:65px; background:#fff; }
#s1_con .txt p { font-size:17px; line-height:32px; color:#666; font-weight: 300; word-break: keep-all; }
#s1_con .txt b { display: block; margin-top: 20px; text-align: right; font-size:17px; font-weight: 400; }
#s1_con .txt b strong { padding-left: 15px; font-size:24px; font-weight: 600; }

/* section2 */
#s2 { position:relative; z-index: 1; }
#s2::after { content:""; position:absolute; left:0; right:0; top:0; height:320px;
 background:url('../img/gre_bg2.jpg') no-repeat center / cover; z-index: -1; }
#s2 .sub_title span,
#s2 .sub_title h1 { color:#fff; }

.his_con { width:1300px; margin:60px auto 0; padding-top:50px; background:#fff; }
.his_list_wr.pc { position: relative; width:100%; padding:60px 0; text-align: left; z-index: 1; }
.his_list_wr.pc::before { content: ''; position: absolute; top:0; left:50%; transform:translateX(-50%); width: 1px;
height:calc(100% - 90px); background: #ddd; z-index: -1; }
.his_list_wr.pc > li { display: flex; flex-direction: row-reverse; align-items: flex-start; width: 50%; text-align: right;
  margin-bottom: 109px; }
.his_list_wr.pc > li:nth-child(odd) { margin-left:7px; }
.his_list_wr.pc > li:nth-child(even) { justify-content: flex-start; text-align: left; margin-left:calc(50% - 7px); flex-direction: row; }

.his_list_wr.pc .his_dot { display: flex; align-items: center; }
.his_list_wr.pc > li:nth-child(even) .his_dot { flex-direction: row-reverse; }
.his_list_wr.pc .his_dot::after { content: ''; display:block; width: 15px; height: 15px; background: #fff; border:3px solid #006cb7; border-radius: 50%; }
.his_list_wr.pc .his_dot::before { content: ''; display: block; width: 70px; height: 1px; background: #006cb7; }

.his_list_wr.pc .his_txt { position: relative; height: 0; top:-15px; }
.his_list_wr.pc > li:nth-child(odd) .his_txt {margin-right: 30px; }
.his_list_wr.pc > li:nth-child(even) .his_txt {margin-left: 30px; }
.his_list_wr.pc .his_txt h2 { font-size:30px; color:#3d6cb3; margin-bottom:15px; }
.his_list_wr.pc .his_txt .his_list > li { display: flex; align-items: flex-start; line-height: 37px; font-size:16px; color:#666; font-weight: 300; }
.his_list_wr.pc .his_txt .his_list > li::before { content:""; display: inline-block; margin:16px 10px 0; width: 4px; height: 4px;
background:#006cb7; border-radius: 50%; }
.his_list_wr.pc .his_txt .his_list > li b { font-weight: 400; color:#000; }
.his_list_wr.pc  > li:nth-child(odd) .his_txt .his_list li { flex-direction: row-reverse; }
.his_list_wr.pc > li:nth-child(odd) .his_txt .his_list span { margin-left:30px;}
.his_list_wr.pc > li:nth-child(even) .his_txt .his_list span { margin-right:30px;}

.his_list_wr.pc .his_list br { display: none; }

/* 연혁 모바일 */
.his_list_wr.mob { display: none; width: 100%; position: relative; margin-top: 30px; text-align: left; z-index: 1; padding:40px 0 0;}
.his_list_wr.mob::before {content: ''; display: block; width: 1px; height: 100%; background: #ddd; position: absolute; top:0; left: 7px;
z-index: -1; }
.his_list_wr.mob > li {width: 100%; border:0px solid red; display: flex; flex-direction: row; align-items: flex-start; margin-bottom: 50px; justify-content: flex-start; text-align: left;  }

.his_list_wr.mob .his_dot {display: flex; align-items: center; flex-direction: row-reverse; position: relative; top:-5px; }
.his_list_wr.mob .his_dot::after { content: ''; display:block; width: 15px; height: 15px; background: #fff; border:3px solid #006cb7;
border-radius: 50%; }
.his_list_wr.mob .his_dot::before { content: ''; display: block; width: 30px; height: 1px; background: #006cb7; }

.his_list_wr.mob .his_txt {position: relative; top:-15px;}
.his_list_wr.mob > li .his_txt {margin-left: 20px;}
.his_list_wr.mob .his_txt h2 {font-size:30px; font-weight: 700; color:#3d6cb3; font-family: 'Montserrat'; margin-bottom:15px; }

.his_list_wr.mob .his_txt .his_list > li {display: flex; align-items: flex-start; margin-bottom: 15px; width: 100%;
line-height: 20px; font-size:15px; color:#666; font-weight: 300; }
.his_list_wr.mob .his_txt .his_list > li::before { content:""; display: inline-block; margin:8px 10px 0 0; width: 4px; height: 4px;
background:#006cb7; border-radius: 50%; }
.his_list_wr.mob .his_txt .his_list > li:last-child {margin-bottom: 0; }
.his_list_wr.mob .his_txt .his_list > li b { font-weight: 400; color:#000; }


/* section3 */
#s3 { display: flex; }
#s3 .img { display: none; }
#s3 .left { width:50%; background:url('../img/gre_bg3.jpg') no-repeat center / cover; }

#s3 .right { width:50%; background:#f4f4f4; padding:100px; text-align: left; }
#s3 .sub_title { text-align: left; }
#s3 .right ul { position:relative; margin-top: 48px; }
#s3 .right ul::before { content:""; display: block; width:550px; height:1px; background:#c3c3c3; margin-bottom:48px; }
#s3 .right li { position:relative; line-height: 1; margin-bottom: 20px; }
#s3 .right li:before { content:""; position: absolute; left:0; top:50%; transform: translateY(-50%); width:4px; height: 4px;
background:#006cb7; border-radius: 50%; }
#s3 .right li:last-child { margin-bottom: 0; }
#s3 .right li b { display: inline-block; padding:0 20px; font-size:30px; color:#006cb7; font-family: 'NanumSquare'; }
#s3 .right li span { font-size:17px; color:#000; font-family: 'NanumSquare'; }


@media screen and (max-width: 1350px) {
    .con_wrap { width:100%; padding-left:50px; padding-right: 50px; }

    #s1_con .img { width:100%; }
    #s1_con .txt { width:calc(100% - 130px); padding:40px; }
    #s1_con p br.jump { display: none; }

    .his_con { width:100%; }
    .his_list br { display: block; }

    #s3 .left { background-position:80% 50%; }
    #s3 .right { padding:100px 45px; }
    #s3 .right ul::before { width:100%; }
}

@media screen and (max-width: 1024px) {
    .con_wrap { padding-left:30px; padding-right: 30px; }

    #s1_con .img { height:auto; padding:70px; }
    #s1_con .txt { margin-top:0; padding:0; width:100%; text-align: center; padding:30px; }

    #s2::after { height:200px; }
    #s2.se_con { padding:55px 0; }

    .his_con { width:100%; margin-top:70px; padding-top: 10px; }
    .his_list_wr.mob { display: block; }
    .his_list_wr.pc { display: none; }

    #s3 { flex-wrap: wrap;  }
    #s3 .left { display: none; }
    #s3 .img { display: block; width:100%; }
    #s3 .img img { width:100%; }
    #s3 .right { width:100%; padding:50px 30px; }

}

@media screen and (max-width: 640px) {
    .con_wrap { padding-left:20px; padding-right: 20px; }
    .se_con { padding:80px 0; }

    .sub_title span { font-size:15px;}
    .sub_title h1 { font-size:36px; }

    #s1_con br { display: none; }
    #s1_con .mob_img { display: block; width:100%; }
    #s1_con .mob_img img { width:100%; }
    #s1_con .img { padding:40px 20px; background: 0; text-align: center; }
    #s1_con .img h2 { padding-bottom:0; font-size:28px; line-height: 40px; color:#000; }
    #s1_con .img p { font-size:15px; color:#000; }

    #s1_con .txt:before { content:""; display: block; margin:0 auto 30px; width:100px; height: 1px; background:#ddd; }
    #s1_con .txt { position:relative; padding:0 20px; }
    #s1_con .txt p { font-size:15px; }
    #s1_con .txt p br { display: none; }
    #s1_con .txt b { text-align: center; }

    .his_con { margin-top:80px; padding-top: 0; }
    .his_list_wr.mob .his_txt h2 { font-size:28px; }
    .his_list_wr.mob .his_txt .his_list > li { font-size: 14px; letter-spacing: -0.25px; }

    #s3 .sub_title { text-align: center; }
    #s3 .right ul { margin-top: 30px; }
    #s3 .right { padding:50px 20px; }
    #s3 .right li b { padding: 0 10px; font-size:24px; }
    #s3 .right ul::before { margin-bottom:30px; }
    #s3 .right li span { font-size: 14px; }

}