@charset "utf-8";
/*
TITLE : 웹진 (ELEMENT Define)
WORKER : HSG
DATE : 2021.12.29
VERSION : Ver 1.0
- Ver 1.0 : 최초 작업.
*/
/* 공통, html, body font-size (default) */
/* Base html style */
.element .link { position: fixed; right: 0; bottom: 0; padding: 10px; background-color: #d9d9d9; z-index: 100; }
.element .link a { display: block; text-align: center; line-height: 20px; font-weight: 700; }
.menu { position: fixed; top: 0; left: 50%; width: 100%; max-width: 1300px; transform: translateX(-50%); display: flex; flex-flow: row nowrap; justify-content: space-between; padding-bottom: 10px; background-color: #fff; z-index: 100; }
.menu:after { position: absolute; content: ""; left: 0; bottom: 4px; width: 100%; height: 2px; background-color: #111; }
.menu h2 { flex: 1; font-size: 18px; color: #999; font-weight: 400; line-height: 40px; text-align: center; border: 1px solid #999; border-right: 0px solid #666; cursor: pointer; letter-spacing: -1px; transition: color .2s ease-in; }
.menu h2.on { color: #111; font-weight: 500; }
.menu h2:last-child { border-right: 1px solid #999; }
.wrap { padding-top: 60px; background-color: #f9f9f9; }
.wrap .box { background-color: #f5f5f5; }
.wrap .box > h3 { font-size: 20px; line-height: 40px; color: #111; font-weight: 500; letter-spacing: -1.2px; background-color: #d9d9d9; }
.wrap .box > h4 { margin-bottom: 10px; font-size: 18px; font-weight: 500; color: #000; border-bottom: 1px solid #c9c9c9; }
.wrap .box .inbox { display: flex; flex-flow: row wrap; }
.wrap .box .inbox > div { margin-bottom: 20px; padding: 0 10px; width: 50%; background-color: #e8e8e8; }
.wrap .box .inbox > div h4 { margin-bottom: 10px; font-size: 18px; font-weight: 500; color: #000; border-bottom: 1px solid #c9c9c9; }
.wrap .box .inbox > div.non_pd { padding: 0; border: 1px solid #fff; }
.wrap .box .inbox > div.non_pd p { text-align: center; background: #c9c9c9; }
.wrap .box_2 > h4 { font-size: 18px; font-weight: 500; color: #333; line-height: 28px; }
.wrap .box_2 > .detail { padding-bottom: 20px; }
.wrap .box_5 .color { display: flex;  }
.wrap .box_5 .color > div { display: flex; justify-content: center; align-items: center; width: 33.3333%; height: 150px; font-weight: 500; text-align: center; }
@media all and (max-width: 768px) {
    .wrap .box .inbox > div { margin-bottom: 15px; width: 100%; }
}
/* *** 여백 *** */
/* margin-bottom */
.mg_b5 { margin-bottom: 5px; }
.mg_b10 { margin-bottom: 10px; }
.mg_b15 { margin-bottom: 15px; }
.mg_b20 { margin-bottom: 20px; }
.mg_b30 { margin-bottom: 30px; }
.mg_b40 { margin-bottom: 40px; }
.mg_b50 { margin-bottom: 50px; }
.mg_b60 { margin-bottom: 60px; }
.mg_b80 { margin-bottom: 80px; }
.mg_b100 { margin-bottom: 100px; }
.mg_b120 { margin-bottom: 120px; }
.mg_b150 { margin-bottom: 150px; }
/* margin-top */
.mg_t10 { margin-top: 10px; }
.mg_t20 { margin-top: 20px; }
.mg_t30 { margin-top: 30px; }
.mg_t40 { margin-top: 40px; }
.mg_t50 { margin-top: 50px; }
/* padding */
.pd5 { padding: 5px; }
.pd10 { padding: 10px; }
.pd20 { padding: 20px; }
.pd30 { padding: 30px; }
.pd40 { padding: 40px; }
.pd50 { padding: 50px; }
@media all and (max-width: 1280px) {
    .mg_b30 { margin-bottom: 25px; }
    .mg_b40 { margin-bottom: 35px; }
    .mg_b50 { margin-bottom: 45px; }
    .mg_b60 { margin-bottom: 55px; }
    .mg_b80 { margin-bottom: 75px; }
    .mg_b100 { margin-bottom: 95px; }
    .mg_b120 { margin-bottom: 110px; }
    .mg_b150 { margin-bottom: 130px; }
    .mg_t30 { margin-top: 25px; }
    .mg_t40 { margin-top: 35px; }
    .mg_t50 { margin-top: 45px; }
    .pd40 { padding: 35px; }
    .pd50 { padding: 45px; }
}
@media all and (max-width: 1024px) {
    .mg_b15 { margin-bottom: 10px; }
    .mg_b20 { margin-bottom: 15px; }
    .mg_b80 { margin-bottom: 70px; }
    .mg_b100 { margin-bottom: 90px; }
    .mg_b120 { margin-bottom: 100px; }
    .mg_b150 { margin-bottom: 120px; }
    .mg_t20 { margin-top: 15px; }
    .pd30 { padding: 25px; }
    .pd40 { padding: 35px; }
    .pd50 { padding: 40px; }
}
@media all and (max-width: 768px) {
    .mg_b10 { margin-bottom: 5px; }
    .mg_b30 { margin-bottom: 20px; }
    .mg_b40 { margin-bottom: 30px; }
    .mg_b50 { margin-bottom: 40px; }
    .mg_b60 { margin-bottom: 50px; }
    .mg_b80 { margin-bottom: 65px; }
    .mg_b100 { margin-bottom: 80px; }
    .mg_b120 { margin-bottom: 90px; }
    .mg_b150 { margin-bottom: 110px; }
    .mg_t30 { margin-top: 20px; }
    .mg_t40 { margin-top: 30px; }
    .mg_t50 { margin-top: 40px; }
    .pd20 { padding: 10px; }
    .pd30 { padding: 20px; }
    .pd40 { padding: 30px; }
    .pd50 { padding: 35px; }
}
@media all and (max-width: 600px) {
    .mg_b15 { margin-bottom: 5px; }
    .mg_b20 { margin-bottom: 10px; }
    .mg_b40 { margin-bottom: 25px; }
    .mg_b50 { margin-bottom: 35px; }
    .mg_b60 { margin-bottom: 45px; }
    .mg_b80 { margin-bottom: 60px; }
    .mg_b100 { margin-bottom: 70px; }
    .mg_b120 { margin-bottom: 80px; }
    .mg_b150 { margin-bottom: 90px; }
    .mg_t20 { margin-top: 10px; }
    .mg_t40 { margin-top: 25px; }
    .mg_t50 { margin-top: 35px; }
    .pd10 { padding: 5px; }
    .pd30 { padding: 15px; }
    .pd40 { padding: 25px; }
    .pd50 { padding: 30px; }
}
/* ****** Layout ****** */
/* 본문을 코딩하면서 추가를 할 것. */
/* Section Area */
.section_Area { position: relative; padding: 50px 20px 50px; }
/* Summary */
.summaryWrap { position: relative; padding: 60px 20px 80px;  z-index: 10; background: #f7f7f7; }
.summaryWrap .outline { background: #fff; border-radius: 30px; }
.summaryWrap .topDeco { text-align: center; }
.summaryWrap .topDeco i { font-size: 28px; color: #333; }
.summaryWrap .summaryCol { font-size: 21px; font-weight: 500; color: #444; letter-spacing: -0.8px; text-align: justify; word-break: break-all; }
.summaryWrap .summaryCol .eng { font-size: 0.92em; color: #555; font-weight: 400; line-height: 1.6; letter-spacing: -0.2px; text-align: justify; word-break: keep-all; }
/* Theme Story 레이아웃 */
.themeStory01 { display: flex; flex-flow: row nowrap; align-items: flex-start; }
.themeStory01 > div { width: 50%; }
.themeStory01 .left { position: sticky; top: 120px; padding-right: 20px; }
.themeStory01 .left .imgWrap { position: relative; }
.themeStory01 .left .imgWrap .people { position: absolute; display: flex; flex-flow: column; align-items: flex-start; justify-content: flex-start; padding: 10px 30px 10px 20px; background: var(--PCclr1); border-top-right-radius: 15px; border-bottom-right-radius: 15px; z-index: 20; }
.themeStory01 .left .imgWrap .people.topLeft { left: 0; top: 30px; }
.themeStory01 .left .imgWrap .people.bottomLeft { left: 0; bottom: 30px; }
.themeStory01 .left .imgWrap .people p { font-size: 20px; color: #fff; font-weight: 300; line-height: 1.5; text-align: left; word-break: keep-all; }
.themeStory01 .left .imgWrap .people p.kor { font-weight: 400; }
.themeStory01 .left .imgWrap .people p.kor span { font-weight: 500; }
.themeStory01 .left .imgWrap .people p.eng { font-size: 18px;  }
.themeStory01 .left .imgWrap .people p.eng span { font-weight: 400; }
.themeStory01 .right { padding-left: 20px; }
/* Content Define */
.colTit { margin-bottom: 10px; font-size: 30px; color: #222; font-weight: 700; text-align: left; line-height: 1.3; letter-spacing: -1px; word-break: break-all; }
.colTit.Eng { font-size: 24px; letter-spacing: -0.4px; word-break: keep-all; }
.colTit1 { margin-bottom: 10px; font-size: 26px; color: #222; font-weight: 700; text-align: left; line-height: 1.3; letter-spacing: -1px; word-break: break-all; }
.colTit1.Eng { font-size: 22px; letter-spacing: -0.4px; word-break: keep-all; }
.smColTit { position: relative; margin-bottom: 6px; font-size: 22px; color: #222; font-weight: 500; text-align: left; line-height: 1.3; letter-spacing: -1px; word-break: break-all; }
.smColTit::before { content: '첫째'; display: inline-block; margin-right: 10px; padding: 2px 10px; font-size: 0.8em; font-weight: inherit; color: #fff; line-height: inherit; transform: translateY(-2px); background: #222; border-radius: 3px; }
.subCol1 { position: relative; display: block; padding-left: 24px; font-size: 17px; font-weight: 400; color: #333; line-height: 1.3; word-break: keep-all; }
.subCol1::before { position: absolute; content: '※'; top: 0; left: 0; display: inline-block; font-size: inherit; font-weight: inherit; color: inherit; line-height: inherit; }
.col, .col p { font-size: 20px; color: #333; font-weight: 400; letter-spacing: -0.5px; text-align: justify; word-break: break-all; }
.col.Eng, .col.Eng p { font-size: 18px; letter-spacing: 0; line-height: 1.6; text-align: left; word-break: keep-all; }
.colImg { box-shadow: 5px 5px 10px 0 rgba(0,0,0,.2); border-radius: 20px; }
.imgcol { font-size: 16px; font-weight: 400; color: #555; text-align: left; letter-spacing: -0.6px; word-break: keep-all; line-height: 1.5; }
.imgcol .eng { font-size: 0.95em; letter-spacing: 0; }
/* .col.qaBox {  } */
.col.qaBox .qa { font-size: 1.05em; font-weight: 700; line-height: 1.6; }
.col.qaBox .qa span,
.col.qaBox .an span { display: inline-block; margin-right: 10px; font-size: 1.1em; font-weight: 700; color: #fff; width: 40px; text-align: center; background: #000; border-radius: 5px; }
.col.qaBox .qa span { font-size: 1em; }
/* 작은 글씨 */
.colTit2 { margin-bottom: 10px; font-size: 22px; color: #222; font-weight: 700; text-align: left; line-height: 1.3; letter-spacing: -1px; word-break: break-all; }
.colTit2.Eng { font-size: 20px; font-weight: 700; letter-spacing: -0.4px; word-break: break-all; }
.col2, .col2 p { font-size: 18px; color: #333; font-weight: 400; letter-spacing: -0.5px; text-align: justify; word-break: break-all; }
.col2.Eng, .col2.Eng p { font-size: 16px; letter-spacing: 0; line-height: 1.6; text-align: left; word-break: keep-all; }
/* 좀더 작은 글씨 */
.colTit3 { margin-bottom: 10px; font-size: 20px; color: #222; font-weight: 700; text-align: left; line-height: 1.3; letter-spacing: -1px; word-break: break-all; }
.colTit2.Eng { font-size: 19px; font-weight: 700; letter-spacing: -0.4px; word-break: break-all; }
@media all and (max-width: 1280px) {
    .summaryWrap { padding: 50px 20px 70px; }
    .summaryWrap .summaryCol { font-size: 20px; }
    .section_Area { padding: 40px 20px 40px; }
    .themeStory01 .left { top: 110px; }
    .themeStory01 .left .imgWrap .people p { font-size: 19px; }
    .themeStory01 .left .imgWrap .people p.eng { font-size: 17px; }
    .themeStory01 .right { padding-left: 20px; }
    .colTit { font-size: 28px; }
    .colTit1 { font-size: 24px; }
    .colTit1.Eng { font-size: 21px; }
    .smColTit { font-size: 21px; }
    .subCol1 { padding-left: 22px; font-size: 16px; }
    .colTit.Eng { font-size: 22px; }
    .col, .col p { font-size: 19px; }
    .col.Eng, .col.Eng p { font-size: 17px; }
    .colTit2 { font-size: 21px; }
    .colTit2.Eng { font-size: 19px; }
    .col2, .col2 p { font-size: 17px; }
    .col2.Eng, .col2.Eng p { font-size: 15px; }
    .colTit3 { font-size: 19px; }
    .colTit2.Eng { font-size: 18px; }
}
@media all and (max-width: 1024px) {
    .summaryWrap { padding: 50px 20px 70px; }
    .summaryWrap .summaryCol { font-size: 20px; }
    .section_Area { padding: 35px 20px 35px; }
    .themeStory01 .left { top: 100px; padding-right: 15px; }
    .themeStory01 .left .imgWrap .people { padding: 10px 15px 10px 15px; }
    .themeStory01 .left .imgWrap .people p { font-size: 18px; }
    .themeStory01 .left .imgWrap .people p.eng { font-size: 16px; }
    .themeStory01 .right { padding-left: 15px; }
    .colTit { font-size: 26px; }
    .colTit1 { font-size: 23px; }
    .colTit1.Eng { font-size: 20px; }
    .smColTit { font-size: 20px; }
    .subCol1 { padding-left: 20px; font-size: 15px; }
    .colTit.Eng { font-size: 20px; }
    .col, .col p { font-size: 18px; }
    .col.Eng, .col.Eng p { font-size: 16px; }
    .imgcol { font-size: 15px; }
    .col.qaBox .qa span,
    .col.qaBox .an span { width: 38px; }
}
@media all and (max-width: 768px) {
    .summaryWrap { padding: 40px 20px 60px; }
    .summaryWrap .topDeco i { font-size: 24px; }
    .summaryWrap .summaryCol { font-size: 18px; }
    .summaryWrap .summaryCol .eng { text-align: left; }
    .section_Area { padding: 30px 20px 30px; }
    .themeStory01 .left { top: 90px; padding-right: 10px; }
    .themeStory01 .left .imgWrap .people { padding: 5px 10px; width: 90%; }
    .themeStory01 .left .imgWrap .people.topLeft { top: 15px; }
    .themeStory01 .left .imgWrap .people.bottomLeft { bottom: 15px; }
    .themeStory01 .left .imgWrap .people p {  font-size: 15px; line-height: 1.3; }
    .themeStory01 .left .imgWrap .people p.eng { font-size: 14px; }
    .themeStory01 .right { padding-left: 10px; }
    .colTit { font-size: 22px; }
    .colTit1 { font-size: 20px; }
    .colTit1.Eng { font-size: 19px; }
    .smColTit { font-size: 18px; }
    .subCol1 { padding-left: 20px; font-size: 15px; }
    .smColTit::before { margin-right: 5px; }
    .colTit.Eng { font-size: 19px; }
    .col, .col p { font-size: 17px; }
    .col.Eng, .col.Eng p { font-size: 15px; }
    .colTit2 { font-size: 20px; }
    .colTit2.Eng { font-size: 18px; }
    .col2, .col2 p { font-size: 16px; }
    .col2.Eng, .col2.Eng p { font-size: 14px; }
    .colTit3 { font-size: 18px; }
    .colTit2.Eng { font-size: 17px; }
}
@media all and (max-width: 600px) {
    .summaryWrap { padding: 40px 10px 50px; }
    .summaryWrap .topDeco i { font-size: 22px; }
    .summaryWrap .summaryCol { font-size: 16px; }
    .summaryWrap .summaryCol .eng { text-align: left; }
    .section_Area { padding: 30px 10px 30px; }
    .themeStory01 { flex-flow: row wrap; }
    .themeStory01 > div { width: 100%; }
    .themeStory01 .left { position: initial; top: 0; margin-bottom: 40px; }
    .themeStory01 .left .imgWrap .people { padding: 5px 10px; width: 90%; }
    .themeStory01 .left .imgWrap .people.topLeft { top: 15px; }
    .themeStory01 .left .imgWrap .people.bottomLeft { bottom: 15px; }
    .themeStory01 .left .imgWrap .people p {  font-size: 14px; }
    .themeStory01 .left .imgWrap .people p.eng { font-size: 13px; }
    .themeStory01 .right { padding-left: 0px; }
    .colTit { font-size: 21px; }
    .colTit1 { font-size: 20px; }
    .colTit1.Eng { font-size: 18px; }
    .smColTit { font-size: 17px; }
    .subCol1 { padding-left: 20px; font-size: 14px; }
    .colTit.Eng { font-size: 19px; }
    .col, .col p { font-size: 16px; }
    .col.Eng, .col.Eng p { font-size: 15px; }
    .colImg {  border-radius: 10px; }
    .imgcol { font-size: 14px; }
    .col.qaBox .qa span,
    .col.qaBox .an span { width: 34px; }
    .colTit2 { font-size: 18px; }
    .colTit2.Eng { font-size: 17px; }
    .col2, .col2 p { font-size: 15px; }
    .colTit3 { font-size: 17px; }
    .colTit2.Eng { font-size: 16px; }
}
/* ****** BOX LAYOUT ****** */
/* 01. 가로 2x1 (600px 전환) */
.flex21 { display: flex; flex-flow: row nowrap; align-items: stretch; }
.flex21 > div { width: 50%; height: 100%; }
.flex21 > .left { padding-right: 10px; }
.flex21 > .right { padding-left: 10px; }
/* 01. 가로 2x1 (600px 전환 + 통합 Col) */
.flex21_col .inwrap { display: flex; flex-flow: row nowrap; gap: 20px; }
.flex21_col .col { padding: 10px; margin-top: 10px; background: #fff; border-radius: 10px; }
.flex21_col .col .imgcol span { display: block; }
/* 02. 가로 2x2 (600px 전환) */
.flex22_wrap .flex22 { display: flex; flex-flow: row wrap; align-items: stretch; }
.flex22_wrap .flex22 > div { margin-bottom: 15px; width: 50%; height: 100%; }
.flex22_wrap .flex22 > div:nth-child(odd) { padding-right: 10px; }
.flex22_wrap .flex22 > div:nth-child(even) { padding-left: 10px; }
.flex22_wrap.Hynews .flex22 > div:nth-child(odd) { padding-right: 20px; }
.flex22_wrap.Hynews .flex22 > div:nth-child(even) { padding-left: 20px; }
.flex22_wrap.Hynews .flex22 > div { margin-bottom: 50px; }
.flex22_wrap.Hynews .flex22 > div:nth-last-child(1),
.flex22_wrap.Hynews .flex22 > div:nth-last-child(2) { margin-bottom: 0; }
/* 03. 가로 3x1 (600px 전환) */
.flex31_wrap .flex31 { display: flex; flex-flow: row wrap; align-items: stretch; justify-content: space-between; }
.flex31_wrap .flex31 > div { padding: 0 10px; margin-bottom: 0; width: 32%; height: 100%; }
.flex31_wrap .flex31 > div > div { margin-bottom: 0x; }
.flex31_wrap .total_imgcol { padding: 10px; margin-top: 10px; font-size: 16px; font-weight: 400; color: #555; text-align: center; letter-spacing: -0.6px; word-break: keep-all; line-height: 1.5; background: #fff; border-radius: 10px; }
.flex31_wrap .total_imgcol span { display: block; }
/* 03. 가로 3x1 (600px 전환) - Process */
.flex31_wrap.process .box_in_tit { padding: 0 10px; margin-bottom: 10px; }
.flex31_wrap.process .box_in_tit h5 { padding: 10px 0; font-size: 22px; font-weight: 700; color: #fff; text-align: center; background: var(--ETCclr2); border-radius: 15px; line-height: 1.2; }
.flex31_wrap.process .box_in_tit h5 .eng { display: block; font-size: 18px; font-weight: 500; }
.flex31_wrap.process .flex31 > div { position: relative; }
.flex31_wrap.process .flex31 > div::before { position: absolute; content: "\e907"; font-family: xeicon!important; top: 30%; right: -28px; color: #fff; background: var(--ETCclr2); width: 30px; height: 30px; border-radius: 50%; text-align: center; line-height: 30px; font-weight: 900; }
.flex31_wrap.process .flex31 > div:last-child::before { display: none; }
/* 04. 가로 1x2x1 (600px 전환) */
.flex121_wrap .flex121 { display: flex; flex-flow: row wrap; margin-bottom: 15px; }
.flex121_wrap .flex121 .top { margin-bottom: 10px; width: 100%; }
.flex121_wrap .flex121 .left { padding-right: 5px; width: 50%; }
.flex121_wrap .flex121 .right { padding-left: 5px; width: 50%; }
/* 05. 가로 2x1 (중간 리드, 발문, 600px 전환) */
.leed { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; }
.leed > div { width: 49%; }
.leed .right .in_wrap { position: relative; padding-left: 20px; }
.leed .right .in_wrap::before { position: absolute; content: ""; top: 0; left: 0; width: 10px; height: 100%; background: var(--post11Clr); }
.leed .right .in_wrap h4 { margin-bottom: 15px; font-size: 26px; font-weight: 400; text-align: left; line-height: 1.4; word-break: keep-all; }
@media all and (max-width: 1280px) {
    .flex31_wrap.process .box_in_tit h5 { font-size: 21px; }
    .flex31_wrap.process .flex31 > div::before { right: -26px; }
    .leed .right .in_wrap h4 { margin-bottom: 10px; font-size: 24px; }
}
@media all and (max-width: 1024px) {
    .flex31_wrap .total_imgcol { font-size: 15px; }
    .flex31_wrap.process .box_in_tit h5 { font-size: 20px; }
    .flex31_wrap.process .flex31 > div::before { right: -24px; font-size: 18px; width: 28px; height: 28px; line-height: 26px; }
    .leed .right .in_wrap h4 {  font-size: 22px; }
}
@media all and (max-width: 768px) {
    .flex31_wrap .flex31 > div { padding: 0 5px; }
    .flex31_wrap.process .box_in_tit { padding: 0 5px; }
    .flex31_wrap.process .box_in_tit h5 { font-size: 20px; }
    .flex31_wrap.process .flex31 > div::before { right: -17px; font-size: 15px; width: 20px; height: 20px; line-height: 20px; }
    .leed .right .in_wrap::before { width: 8px; }
    .leed .right .in_wrap h4 {  font-size: 20px; }
}
@media all and (max-width: 767px) {
    .flex31_wrap.process .box_in_tit { padding: 0 5px; }
    .flex31_wrap.process .box_in_tit h5 { font-size: 20px; }
    .flex31_wrap.process .flex31  { flex-flow: row wrap; }
    .flex31_wrap.process .flex31 > div { margin-bottom: 50px; width: 100%; }
    .flex31_wrap.process .flex31 > div:last-child { margin-bottom: 0; }
    .flex31_wrap.process .flex31 > div::before { top: auto; bottom: -36px; right: auto; left: 50%; transform: translateX(-50%) rotate(90deg); font-size: 16px; width: 32px; height: 32px; line-height: 32px; }
    .leed { flex-flow: row wrap; }
    .leed > div { width: 100%; }
    .leed .left { margin-bottom: 15px; }
    .leed .right .in_wrap h4 {  font-size: 18px; }
    .leed .right .in_wrap h4 br { display: none; }
}
@media all and (max-width: 600px) {
    .flex21 { flex-flow: row wrap; }
    .flex21 > div { width: 100%; }
    .flex21 > .left { padding-right: 0px; margin-bottom: 30px; }
    .flex21 > .right { padding-left: 0px; }
    .flex21_col .inwrap { flex-flow: row wrap; gap: 0; }
    .flex21_col .inwrap > div { width: 100%; }
    .flex21_col .inwrap .left { margin-bottom: 30px; }
    .flex22_wrap .flex22 > div { margin-bottom: 10px; width: 100%; }
    .flex22_wrap .flex22 > div:last-child { margin-bottom: 0px; }
    .flex22_wrap .flex22 > div:nth-child(odd) { padding-right: 0px; }
    .flex22_wrap .flex22 > div:nth-child(even) { padding-left: 0px; }
    .flex22_wrap.Hynews .flex22 > div:nth-child(odd) { padding-right: 0px; }
    .flex22_wrap.Hynews .flex22 > div:nth-child(even) { padding-left: 0px; }
    .flex22_wrap.Hynews .flex22 > div:nth-last-child(2) { margin-bottom: 50px; }
    .flex22_wrap.Hynews .flex22 > div:nth-last-child(1) { margin-bottom: 0; }
    .flex31_wrap .flex31 > div { padding: 0; margin-bottom: 30px; width: 100%; }
    .flex31_wrap .flex31 > div:last-child { margin-bottom: 0; }
    .flex31_wrap .total_imgcol { font-size: 14px; }
    .flex121_wrap .flex121 .top { margin-bottom: 10px; }
    .flex121_wrap .flex121 .left { padding-right: 0px; margin-bottom: 10px; width: 100%; }
    .flex121_wrap .flex121 .right { padding-left: 0px; width: 100%; }
}
/* ****** ELEMENT LAYOUT ****** */
/* 01. 미니인터뷰 / 인물소개 */
.introduce { border: 1px solid var(--PCclr1); border-radius: 15px; }
/* 02. Color Box 레이아웃 */
.clrBox .tit { font-size: 20px; font-weight: 500; color: #111; text-align: left; word-break: keep-all; }
/* 03. List (Dot) */
.dot li { position: relative; padding-left: 20px; font-size: 20px; font-weight: 400; color: #333; text-align: left; line-height: 1.6; word-break: keep-all; }
.dot.eng li { font-size: 18px; }
.dot li::before { position: absolute; content: "•"; left: 0; }
/* 04. List (응용) */
.span li { position: relative; padding-left: 100px; font-size: 20px; font-weight: 400; color: #333; text-align: left; line-height: 1.6; word-break: keep-all; }
.span li span { position: absolute; left: 0; }
/* title - bg */
.bg.colTit { display: inline-block; padding: 0 15px; color: #fff; font-weight: 500; background-color: var(--PCclr1); border-radius: 5px; line-height: 1.5; }
.bg.colTit1 { display: inline-block; padding: 0 15px; color: #fff; font-weight: 500; background-color: var(--PCclr1); border-radius: 5px; line-height: 1.5; }
.bg.colTit2 { display: inline-block; padding: 0 15px; color: #fff; font-weight: 500; background-color: var(--PCclr1); border-radius: 5px; line-height: 1.5; }
.professorTit { position: relative; font-size: 22px; }
.professorTit span { position: relative; display: block; font-size: 0.9em; font-weight: 400; color: #000; line-height: 1; }
.tableWrap { position: relative; }
table { width: 100%; table-layout: fixed; border-spacing: 0; border-collapse: collapse; border-top: 2px solid #000; border-bottom: 1px solid #000; }
table colgroup col { width: auto; }
table thead tr th {  text-align: center; font-weight: 500; background-color: #e9e9e9; }
table tr th,
table tr td { padding: 5px 10px; font-size: 19px; border-bottom: 1px solid #333; border-right: 1px solid #333; }
table tr th:last-child,
table tr td:last-child { border-right: 0px solid #333; }
table tbody tr td { font-weight: 400; }
@media all and (max-width: 1280px) {
    .clrBox .tit { font-size: 19px; }
    .dot li { padding-left: 16px; font-size: 19px; }
    .span li { padding-left: 100px; font-size: 19px; }
    .dot.eng li { font-size: 17px; }
}
@media all and (max-width: 1024px) {
    .clrBox .tit { font-size: 18px; }
    .dot li { font-size: 18px; }
    .span li { padding-left: 90px; font-size: 18px; }
    .dot.eng li { font-size: 16px; }
    .professorTit { font-size: 20px; }
    table tr th,
    table tr td { font-size: 18px; }
}
@media all and (max-width: 768px) {
    .clrBox .tit { font-size: 17px; }
    .dot li { font-size: 17px; }
    .span li { padding-left: 84px; font-size: 17px; }
    .dot.eng li { font-size: 15px; }
}
@media all and (max-width: 600px) {
    .clrBox .tit { font-size: 16px; }
    .dot li { font-size: 16px; }
    .span li { padding-left: 80px; font-size: 16px; }
    .dot.eng li { font-size: 15px; }
    .professorTit { font-size: 18px; }
    table tr th,
    table tr td { font-size: 16px; }
}
/* ****** 이미지 레이아웃 ****** */
/* 01. 일반 이미지 */
.imgWrap { width: 100%; height: 100%; }
.imgWrap div img { width: 100%; height: 100%; }
.imgWrap .imgcol { padding: 10px; margin-top: 10px; background: #fff; text-align: left; border-radius: 10px; }
.imgWrap .imgcol span { display: block; }
/* 02. 컬러 캡션 이미지 */
.clrcapimgWrap div img { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.clrcapimgWrap div.imgcol { position: relative; padding: 20px; color: var(--SCclr2); word-break: break-all; text-align: justify;  background: var(--post21Clr); box-shadow: 5px 5px 10px 0 rgb(0 0 0 / 30%); border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; z-index: 3; }
.clrcapimgWrap div.imgcol span { position: relative; display: block; padding-top: 20px; word-break: keep-all; text-align: left; }
.clrcapimgWrap div.imgcol span:before { position: absolute; content: ""; top: 10px; left: 0; width: 100%; height: 1px; background: #fff; }
.clrcapimgWrap div.imgcol h5 { font-size: 28px; font-weight: 500; color: #fff; text-align: center; line-height: 1.4; letter-spacing: -1px; }
.clrcapimgWrap div.imgcol h6 { font-size: 20px; font-weight: 500; color: #fff; text-align: center; }
.clrcapimgWrap div.imgcol h6 em { display: block; font-weight: 100; }
/* 03. Full width imgBox */
.section_Area.fullImgBox { padding: 0; max-height: 860px; }
.section_Area.fullImgBox img { padding: 0; }
/* 04. image 내 캡션 */
.imgWrap.CapInImg { position: relative; }
.imgWrap.CapInImg .imgcol { position: absolute; bottom: 0; right: 0; padding: 60px 30px 20px; color: #000; width: 100%; background: rgba(252, 232, 235, .6); border-radius: 0; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
.imgWrap.CapInImg .imgcol h3 { margin-bottom: 10px; font-size: 28px; font-weight: 500; color: #000; text-align: right; letter-spacing: -1px; line-height: 1.4; }
.imgWrap.CapInImg .imgcol h3 span { display: inline; background-image: linear-gradient(#000, #000); background-size: 100% 1px; background-repeat: no-repeat; background-position: 0 94%; }
.imgWrap.CapInImg .imgcol h5 { font-size: 18px; font-weight: 300; color: #000; text-align: right; }
.imgWrap.CapInImg .imgcol h5 em { font-weight: 500; }
/* 05. HY NEWS #1 */
.imgWrap.hynews1 > div { margin-bottom: 15px; }
.imgWrap.hynews1 > div.colBox { margin-bottom: 0; }
/* 05. HY NEWS #2 (float) */
.floLeft .left { float: left; margin-right: 15px; margin-bottom: 5px; width: 140px; }
@media all and (max-width: 1280px) {
    .clrcapimgWrap div.imgcol h5 { font-size: 26px; }
    .clrcapimgWrap div.imgcol h6 { font-size: 19px; }
    .imgWrap.CapInImg .imgcol h3 { font-size: 24px; }
    .imgWrap.CapInImg .imgcol h5 { font-size: 18px; }
    .floLeft .left { width: 130px; }
}
@media all and (max-width: 1024px) {
    .clrcapimgWrap div.imgcol h5 { font-size: 22px; }
    .clrcapimgWrap div.imgcol h6 { font-size: 17px; }
    .floLeft .left { width: 120px; }
}
@media all and (max-width: 768px) {
    .clrcapimgWrap div.imgcol h5 { font-size: 20px; }
    .clrcapimgWrap div.imgcol h6 { font-size: 16px; }
    .imgWrap.CapInImg .imgcol { padding: 20px; }
    .imgWrap.CapInImg .imgcol h3 { font-size: 22px; }
    .imgWrap.CapInImg .imgcol h5 { font-size: 17px; }
    .floLeft .left { width: 110px; }
}
@media all and (max-width: 600px) {
    .imgWrap.CapInImg .imgcol { position: initial; padding: 10px; background: #fff; border-radius: 0; }
    .imgWrap.CapInImg .imgcol h3 { font-size: 18px; }
    .imgWrap.CapInImg .imgcol h5 { font-size: 15px; }
    .floLeft .left { width: 100px; }
}