/* 공통 */
.sub_con {width: 100%; margin:0 auto; position: relative; padding:0 15px; }
.sub_title {text-align: center;}
.sub_title h2 {    font-size: 12px; font-weight: 400; color: #0867ae; letter-spacing: 3px; font-family: 'Montserrat'; margin-bottom: 8px; text-transform: uppercase;}
.sub_title h1 {    font-size:22px; font-weight: 400; color: #333; font-family: 'NanumSquare',sans-serif; line-height: 35px; word-break: keep-all;}
.sub_title h1 b {font-weight: 800;}
.apos_head {display: inline-block; position: relative; text-align: center; padding:0 30px;}
.apos_head h1 {font-size:18px; font-weight: 400; color:#333; font-family: 'NanumSquare',sans-serif; word-break: keep-all; line-height: 30px; }
.apos_head h1 span {font-weight: 800; color:#0867ae;}
.apos_head > img {position: absolute; top:-10px; width: 20px; }
.apos_head > img.apos1 {left:0;}
.apos_head > img.apos2 {right:0;}
.sub_p {font-size:14px; font-weight: 300; color:#666; letter-spacing: -.7px; line-height: 25px; word-break: keep-all; word-break: keep-all;}
.sub_list {text-align: left;}
.sub_list li {font-size:12px; font-weight: 300; color:#666; letter-spacing: -.7px; margin-bottom: 6px; display: flex; align-items: flex-start;}
.sub_list li:last-child {margin-bottom: 0;}
.sub_list li::before {content: ''; display: block; width: 3px; height: 3px; min-width: 3px; min-height: 3px; background: #0867ae; margin-right:8px; position: relative; top:7px;}

/*Content CSS*/
#ci {text-align: center; padding:0 0 50px; }
.ci_img {width: 100%; display: flex; flex-direction: column; align-items: center; }
.ci_img > div {width: 100%; border:1px solid #eee; overflow: hidden; margin-top:15px; }
.ci_img > div img {max-width: 100%; }
.ci_img > div:first-child {margin-top:0; }
#ci a {    display: flex; margin: 30px auto; width: 240px; height:50px; text-align: center; align-items: center; justify-content: center; font-size: 17px; font-weight: 600; color: #666; background: #fff; font-family: 'NanumSquare',sans-serif; border:1px solid #ddd; transition: all .3s ease;}
#ci a i {margin-left:15px; font-size:20px; }
#ci a:hover {background: #0867ae; color:#fff; border-color: #0867ae; }

/* ci_txt */
.ci_txt {display: flex; flex-direction: column; text-align: center; align-items: center; }
.ci_txt .sub_title {}
.ci_txt .sub_title h1 {font-weight: 800; }
.ci_txt .sub_title h1::before {content: ''; display: block; width: 40px; height: 2px; background: #000; margin:0 auto 20px;  }
.ci_p {width: 100%; }
.ci_p p {font-size:14px; font-weight: 300; color:#666; line-height: 25px;  word-break: keep-all; letter-spacing: -.7px;  margin:15px 0 0;}

.ci_color {display: flex; justify-content: center;  align-items: center; margin-bottom: 30px; }
.ci_color li {display: flex; align-items: center; font-size:14px; font-weight: 400; color:#000;}
.ci_color li span {width: 25px; height: 25px; min-width: 25px; min-height: 25px; background: #0a68af; margin-right: 10px; position: relative; top:2px; }
.ci_color li:nth-child(2) {margin-left:20px; }
.ci_color li:nth-child(2) span {background-color: #63bc51; }


@media screen and (max-width: 404px) {
    .ci_color { flex-direction: column; }
    .ci_color li:nth-child(2) {margin-left:0; margin-top:20px; }
}

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

}

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

}

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

}

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

}