/*subanner _1*/
#subanner{color: #fff;  font-size: 3em;background-size:cover;height:400px;width:100%;display:flex;align-items: center; justify-content: center;    flex-direction: column;}
#subanner.sub01{background:url('../images/sub/sub_bn_01_r.jpg') no-repeat;background-size:cover}
#subanner.sub02{background:url('../images/sub/sub_bn_05_r.jpg') no-repeat;background-size: cover;}
#subanner.sub03{background:url('../images/sub/sub_bn_15_r.jpg') no-repeat;background-size: cover;}
#subanner.sub04{background:url('../images/sub/sub_bn_08_r.jpg') no-repeat;background-size: cover;}
#subanner.sub05{background:url('../images/sub/sub_bn_07_r.jpg') no-repeat;background-size: cover;}
#subanner.sub06{background:url('../images/sub/sub_bn_09_r.jpg') no-repeat;background-size: cover;}
#subanner.sub07{background:url('../images/sub/sub_bn_06_r.jpg') no-repeat;background-size: cover;}
#subanner.sub08{background:url('../images/sub/sub_bn_10_r.jpg') no-repeat;background-size: cover;}
#subanner.sub09{background:url('../images/sub/sub_bn_11.png') no-repeat;background-size: cover;}
#subanner.sub10{background:url('../images/sub/sub_bn_12.png') no-repeat;background-size: cover;}
#subanner.sub11{background:url('../images/sub/sub_bn_13.png') no-repeat;background-size: cover;}
#subanner.sub12{background:url('../images/sub/sub_bn_14.png') no-repeat;background-size: cover;}
#subanner.sub13{background:url('../images/sub/sub_bn_15_r.jpg') no-repeat;background-size: cover;}
#subanner.sub14{background:url('../images/sub/sub_bn_02.png') no-repeat;background-size: cover;}

.mid-menu{width:100%;}
.mid-menu .mid-menu-box{float:left;height:40px;width:25%;border:1px solid #ddd;text-align: center;  padding-top: 10px;cursor:pointer}
.mid-menu .box-on{background: #000;  color: #fff;}
.mid-menu::after{clear:both;content:"";display:block}



h1, h2, h3, h4, h5, h6 {font-size:1em;}
#common {margin-top:100px;}
#common .wrap {text-align:center; }
#common img { width:auto; max-width:100%; }

/* 공용 레이아웃 지정 */
#common > .common_title h3 { font-size:20px; letter-spacing:6px; color:#293160; font-weight:500; }
#common > .common_title h1 { word-break:keep-all; margin-top:30px; font-size:35px; font-weight:600; letter-spacing:-2px; color:#293160;}
#common > .common_title h1 strong {color:#222;}
#common > .common_title p.content { font-size:16px; line-height:30px; font-weight:350; color:#888; letter-spacing:-1px; margin:30px 0; }
#common #sub_board h1 strong {color:#222;}

/* 폰트색상 */
.fc-white { color:#fff; }
.fc-black { color:#222; }
.fc-gray { color:#888; }
.fc-pd { color:#293160; }

/* 폰트크기 */
.ft-40 { font-size:40px; font-weight:600; letter-spacing:-2px; line-height:40px;}
.ft-36 { font-size:36px; font-weight:600; letter-spacing:-1px; line-height:36px;}
.ft-30 { font-size:30px; font-weight:500; letter-spacing:-1px; line-height:30px;}
.ft-24 { font-size:24px; letter-spacing:-1px; font-weight:400; line-height:24px;}
.ft-20 { font-size:20px;  letter-spacing:-1px; font-weight:400; line-height:30px;}
.ft-18 { font-size:18px; letter-spacing:-1px; font-weight:300; line-height:18px;}
.ft-16 { font-size:16px; letter-spacing:-1px; font-weight:300; line-height:24px;}
.ft-13 { font-size:13px; letter-spacing:-0.5px; font-weight:350; line-height:13px;}

/* 폰트굵기 */
.fw-300 { font-weight:300; }
.fw-350 { font-weight:350; }
.fw-400 { font-weight:400; }
.fw-500 { font-weight:500; }
.fw-600 { font-weight:600; }

/* 패딩 상하 */
.pd-100 { padding:100px 0; }
.pd-30 { padding:30px 0; }
.pd-20 { padding:20px 0; }
.pd-15 { padding:15px 0; }

/* 패딩 상 */
.pt-30 { padding-top:30px; }
.pt-20 { padding-top:20px; }

/* 패딩 하 */
.pb-30 { padding-bottom:30px; }
.pb-20 { padding-bottom:20px; }

/* 마진 상단 */
.mt-10 { margin-top:10px; }
.mt-20 { margin-top:20px; }
.mt-30 { margin-top:30px; }
.mt-40 { margin-top:40px; }
.mt-50 { margin-top:50px; }
.mt-80 { margin-top:80px; }
.mt-100 { margin-top:100px; }
.mt-150 { margin-top:150px; }

/* 마진 하단 */
.mb-10 { margin-bottom:10px; }
.mb-20 { margin-bottom:20px; }
.mb-30 { margin-bottom:30px; }
.mb-50 { margin-bottom:50px; }
.mb-100 { margin-bottom:100px; }

/* 마진 우측 */
.mr-50 { margin-right:50px; }

/* line-height */
.lh-20 { line-height:20px; }
.lh-30 { line-height:30px; }
.lh-36 { line-height:36px; }
.lh-48 { line-height:48px; }

.text-center{text-align:center}

.co-6{color:#607d8b}

/* PC/모바일 CSS 구분자 */
.mobile_only { display:none; } 

/* 1200px 이하 반응형 */
@media (max-width:1200px) {
/* 팬텀디자인 공용 레이아웃 지정 */
#common > .common_title h3 { font-size:min(18px, 4vw); letter-spacing:6px; color:#293160; font-weight:500; }
#common > .common_title h1 { word-break:keep-all; margin-top:30px; font-size:min(40px, 8vw); font-weight:600; letter-spacing:-2px; color:#293160;}
#common > .common_title h1 strong {color:#222;}
#common > .common_title p.content { font-size:min(14px, 3.5vw); line-height:30px; font-weight:350; color:#888; letter-spacing:-1px; margin:30px 0; }

/* PC/모바일 CSS 구분자 */
.mobile_only { display:inline-block; }
.pc_only { display:none; }

/* 폰트크기 */
.ft-40 { font-size:min(36px, 6vw); letter-spacing:-1px; line-height:40px;}
.ft-36 { font-size:min(30px, 5.5vw); letter-spacing:-1px; line-height:36px;}
.ft-30 { font-size:min(24px, 5vw); letter-spacing:-1px; line-height:30px;}
.ft-24 { font-size:min(20px, 4.2vw); letter-spacing:-1px; line-height:24px;}
.ft-20 { font-size:min(16px, 3.6vw); letter-spacing:-1px; line-height:30px;}
.ft-18 { font-size:min(16px, 3.5vw); letter-spacing:-1px; line-height:18px;}
.ft-16 { font-size:min(14px, 3.1vw); letter-spacing:-1px; line-height:24px;}
.ft-13 { font-size:12px; letter-spacing:-0.5px; line-height:13px;}
}


#common{margin-bottom:100px}
#common > #sub_map { margin-top:150px; background:#fff;}
#common > #sub_map .sub_box { display:flex; margin-top:100px }
#common > #sub_map .sub_box > h1 { position:relative; line-height:40px; padding-left:30px; font-weight:600; letter-spacing:-2px; text-align:center; color:#293160; white-space:nowrap;}
#common > #sub_map .sub_box > h1::before { content:''; position:absolute; width:10px; height:36px; background:#293160; left:0; top:0px; }
#common > #sub_map .sub_box .content_wrap { width:100%; max-width:1000px; margin-left:60px; background:#fff; border-radius:5px;}
#common > #sub_map .sub_box .content_wrap .ps_title { margin-left:50px; }
#common > #sub_map .sub_box .content_wrap ul { width:100%; display:flex; flex-direction: row; flex-wrap: wrap;}
#common > #sub_map .sub_box .content_wrap ul li { display:flex; width:100%; padding:50px 0; align-items: center; border-bottom:1px solid #dcdcdc;}
#common > #sub_map .sub_box .content_wrap ul li:nth-child(1) { padding-top:0; }
#common > #sub_map .sub_box .content_wrap ul li:nth-child(2n) { margin-right:0; }
#common > #sub_map .sub_box .content_wrap ul li h1 { width:80px; height:80px; background:#293160; display:flex; align-items: center; justify-content: center; border-radius:10px;}
#common > #sub_map .sub_box .content_wrap ul li h1 img { max-width:36px; width:100%; }
#common > #sub_map .sub_box .content_wrap ul li h2 { text-align:left; color:#222; margin-bottom:20px; letter-spacing:-1px; font-weight:500; }
#common > #sub_map .sub_box .content_wrap ul li p {text-align:left; color:#888; letter-spacing:-0.8px; font-weight:300; }

/* 1섹션 시작 */
#common > #sub_intro  { position:relative; width:100%; height:100vh; max-height:400px; background:url('../img/1200x400.png') no-repeat center center;  background-size:cover; margin-bottom:150px; }
#common > #sub_intro h1.ceo_title {color:#000; font-weight:350;}
#common > #sub_intro h1.ceo_title b { color:#293160; }
#common > #sub_intro h2.ceo_title { color:#333; letter-spacing:-1px; font-weight:500; margin:30px 0;}
#common > #sub_intro p.ceo_content {  letter-spacing:-0.8px; color:#333;  font-weight:350;}
#common > #sub_intro p.ceo_content strong { margin-right:20px;vertical-align:middle; font-weight:700; }


#sub_class{}
#common  #sub_class .sub_box { display:flex; margin-top:100px }
#common  #sub_class .sub_box > h1 {position:relative; line-height:40px; padding-left:30px; font-weight:600; letter-spacing:-2px; text-align:left; color:#293160; white-space:nowrap;width:200px}
#common  #sub_class .sub_box > h1::before { content:''; position:absolute; width:10px; height:36px; background:#293160; left:0; top:0px; }
#common  #sub_class .sub_box .content_wrap{margin-left:20px;text-align:left}
#common  #sub_class .sub_box .ps_title h2{text-align:left}

#common > #sub_board { margin-top:50px;margin-bottom:50px; }
#common > #sub_board h1 { text-align:center; color:#293160;}
#common > #sub_board h2 { color:#444; margin-top:40px; text-align:center; }

/* 반응형 시작 */
@media (max-width:1200px) {
  #common > #sub_board { padding:0 15px; }
  #common > #sub_intro .ceo_wrap { display:inline-block; padding:0 15px; }
}
@media (max-width:768px) {
#common{margin-top:0}
#common > .common_title h1 {font-size:min(37px, 7vw); }
.sub_intro{padding:5px 10px}
#common > #sub_map .sub_box {padding:0 15px; flex-direction:row; flex-wrap:wrap;}
#common > #sub_map .sub_box .content_wrap { margin-left:0; margin-top:30px; }
#common > #sub_map .sub_box .content_wrap ul li {flex-direction: column; flex-wrap: wrap; justify-content: center; }
#common > #sub_map .sub_box .content_wrap .ps_title { margin-left:0; margin-top:30px; }
#common > #sub_map .sub_box .content_wrap ul li h2 { text-align:center; }
#common > #sub_map .sub_box .content_wrap ul li p { text-align:center; }
.ft-30 { font-size:min(20px, 4vw); letter-spacing:-1px; line-height:25px;}
#common #sub_class .sub_box > h1{line-height:30px;padding-left: 15px;}
#common #sub_class .sub_box > h1::before{    width: 7px;    height: 26px;}

#common #sub_class .sub_box{flex-direction: column;}
}