@charset "utf-8";

/* 공통, html, body font-size (default) */
/* *** 여백 *** */
/* 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: 1024px) {
    .mg_b20 { margin-bottom: 15px; }
    .mg_b30 { margin-bottom: 25px; }
    .mg_b40 { margin-bottom: 35px; }
    .mg_b50 { margin-bottom: 45px; }
    .mg_b60 { margin-bottom: 55px; }
    .mg_b100 { margin-bottom: 90px; }
    .mg_b120 { margin-bottom: 100px; }
    .mg_b150 { margin-bottom: 130px; }
    .mg_t30 { margin-top: 25px; }
    .mg_t40 { margin-top: 35px; }
    .mg_t50 { margin-top: 45px; }
    .pd30 { padding: 25px; }
    .pd40 { padding: 35px; }
    .pd50 { padding: 40px; }
}
@media all and (max-width: 768px) {
    .mg_b80 { margin-bottom: 75px; }
    .mg_b100 { margin-bottom: 85px; }
    .mg_b150 { margin-bottom: 110px; }
    .pd20 { padding: 15px; }
}
@media all and (max-width: 599px) {
    .mg_b40 { margin-bottom: 30px; }
    .mg_b50 { margin-bottom: 40px; }
    .mg_b60 { margin-bottom: 50px; }
    .mg_b80 { margin-bottom: 70px; }
    .mg_b100 { margin-bottom: 80px; }
    .mg_b120 { margin-bottom: 90px; }
    .mg_b150 { margin-bottom: 100px; }
    .mg_t40 { margin-top: 30px; }
    .mg_t50 { margin-top: 40px; }
    .pd40 { padding: 30px; }
    .pd50 { padding: 35px; }
}

/* ****** Webfont (폰트 정의) ****** */
/*
기본 폰트는 노토산스와 Poppins만 사용하고,
고급형 등에서 폰트를 다양하게 할 것.
*/
/* G마켓 산스(noonnu) - 300 */
@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
/* G마켓 산스(noonnu) - 500 */
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
/* G마켓 산스(noonnu) - 700 */
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

/* 프리텐다드(noonnu) - 200 */
@font-face {
    font-family: 'Pretendard-ExtraLight';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
/* 프리텐다드(noonnu) - 300 */
@font-face {
    font-family: 'Pretendard-Light';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
/* 프리텐다드(noonnu) - 400 */
@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
/* 프리텐다드(noonnu) - 500 */
@font-face {
    font-family: 'Pretendard-Medium';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
/* 프리텐다드(noonnu) - 700 */
@font-face {
    font-family: 'Pretendard-Bold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
/* 프리텐다드(noonnu) - 900 */
@font-face {
    font-family: 'Pretendard-Black';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

/* Detail */
.col0_1 { font-size: 1rem; font-weight: 300; font-family: 'Poppins', 'Noto Sans KR', sans-serif; }
.col0_2 { font-size: 0.95rem; font-weight: 300; font-family: 'Poppins', 'Noto Sans KR', sans-serif; }
.col0_3 { font-size: 0.9rem; font-weight: 300; font-family: 'Poppins', 'Noto Sans KR', sans-serif; }
.col0_4 { font-size: 0.85rem; font-weight: 300; font-family: 'Poppins', 'Noto Sans KR', sans-serif; }
.col1_1EL { font-size: 1rem; font-family: 'Pretendard-ExtraLight', sans-serif; font-weight: 200; letter-spacing: -0.5px; }
.col1_2EL { font-size: 0.95rem; font-family: 'Pretendard-ExtraLight', sans-serif; font-weight: 200; letter-spacing: -0.5px; }
.col1_3EL { font-size: 0.9rem; font-family: 'Pretendard-ExtraLight', sans-serif; font-weight: 200; letter-spacing: -0.5px; }
.col1_4EL { font-size: 0.85rem; font-family: 'Pretendard-ExtraLight', sans-serif; font-weight: 200; letter-spacing: -0.5px; }
.col1_1L { font-size: 1rem; font-family: 'Pretendard-Light', sans-serif; font-weight: 300; letter-spacing: -0.5px; }
.col1_2L { font-size: 0.95rem; font-family: 'Pretendard-Light', sans-serif; font-weight: 300; letter-spacing: -0.5px; }
.col1_3L { font-size: 0.9rem; font-family: 'Pretendard-Light', sans-serif; font-weight: 300; letter-spacing: -0.5px; }
.col1_4L { font-size: 0.85rem; font-family: 'Pretendard-Light', sans-serif; font-weight: 300; letter-spacing: -0.5px; }
.col1_1R { font-size: 1rem; font-family: 'Pretendard-Regular', sans-serif; font-weight: 400; letter-spacing: -0.5px; }
.col1_2R { font-size: 0.95rem; font-family: 'Pretendard-Regular', sans-serif; font-weight: 400; letter-spacing: -0.5px; }
.col1_3R { font-size: 0.9rem; font-family: 'Pretendard-Regular', sans-serif; font-weight: 400; letter-spacing: -0.5px; }
.col1_4R { font-size: 0.85rem; font-family: 'Pretendard-Regular', sans-serif; font-weight: 400; letter-spacing: -0.5px; }
.col1_1M { font-size: 1rem; font-family: 'Pretendard-Medium', sans-serif; font-weight: 500; letter-spacing: -0.5px; }
.col1_2M { font-size: 0.95rem; font-family: 'Pretendard-Medium', sans-serif; font-weight: 500; letter-spacing: -0.5px; }
.col1_3M { font-size: 0.9rem; font-family: 'Pretendard-Medium', sans-serif; font-weight: 500; letter-spacing: -0.5px; }
.col1_4M { font-size: 0.85rem; font-family: 'Pretendard-Medium', sans-serif; font-weight: 500; letter-spacing: -0.5px; }
.col0_1.regular, .col0_2.regular, .col0_3.regular, .col0_4.regular { font-weight: 400; }
.col0_1.medium, .col0_2.medium, .col0_3.medium, .col0_4.medium { font-weight: 500; }
.col0_1.bold, .col0_2.bold, .col0_3.bold, .col0_4.bold { font-weight: 700; }
/* 페이지 내 타이틀 정의 */
/* 기본(노토산스 & Poppins */
.conTit1_1 { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
.conTit1_2 { position: relative; margin-bottom: 0.95rem; font-size: 1.5rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
.conTit1_3 { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
.conTit1_4 { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
.conTit1_5 { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
.conTit1_6 { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; font-weight: 700; text-align: left; font-family: 'Poppins', 'Noto Sans KR', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1px; }
/* G마켓 산스 300 */
.conTit2_1L { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_2L { position: relative; margin-bottom: 0.95rem; font-size: 1.5rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_3L { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_4L { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_5L { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_6L { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; text-align: left; font-weight: 300; font-family: 'GmarketSansLight', sans-serif; word-break: keep-all; line-height: 1.2; }
/* G마켓 산스 500 */
.conTit2_1M { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_2M { position: relative; margin-bottom: 0.95rem; font-size: 1.5rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_3M { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_4M { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_5M { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_6M { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; text-align: left; font-weight: 500; font-family: 'GmarketSansMedium', sans-serif; word-break: keep-all; line-height: 1.2; }
/* G마켓 산스 700 */
.conTit2_1B { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_2B { position: relative; margin-bottom: 0.95rem; font-size: 1.5rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_3B { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; letter-spacing: -1.5px; }
.conTit2_4B { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_5B { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit2_6B { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; text-align: left; font-weight: 700; font-family: 'GmarketSansBold', sans-serif; word-break: keep-all; line-height: 1.2; }
/* 프리텐다드 Bold (700) */
.conTit3_1B { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_2B { position: relative; margin-bottom: 0.95rem; font-size: 1.5rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_3B { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_4B { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_5B { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_6B { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; text-align: left; font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; word-break: keep-all; line-height: 1.2; }
/* 프리텐다드 Bold (900) */
.conTit3_1BB { position: relative; margin-bottom: 1rem; font-size: 1.7rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_2BB { position: relative; margin-bottom: 0.95rem;; font-size: 1.5rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_3BB { position: relative; margin-bottom: 0.9rem; font-size: 1.3rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_4BB { position: relative; margin-bottom: 0.85rem; font-size: 1.1rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_5BB { position: relative; margin-bottom: 0.8rem; font-size: 0.9rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
.conTit3_6BB { position: relative; margin-bottom: 0.75rem; font-size: 0.8rem; color: #222; text-align: left; font-weight: 900; font-family: 'Pretendard-Black', sans-serif; word-break: keep-all; line-height: 1.2; }
/* ****** visual ****** */
/* sub visual #1 */
#subVisual01 { position: relative; width: 100%; height: 700px; background: #fff; }
#subVisual01 .visualBg { position: absolute; top: 0; left: 0; width: 100%; height: 700px; background: url(../img/sub/visual/bg_sample.jpg) no-repeat center; background-size: cover; }
#subVisual01 .visualBg span { position: absolute; display: inline-block; bottom: 0; right: 0; padding: 5px 10px; font-size: 18px; font-weight: 400; color: #333; text-align: left; line-height: 1.4; max-width: 45%; background: rgba(255,255,255,0.5); border-top-left-radius: 10px; }
#subVisual01 .outLine { position: relative; margin: 0 auto; width: 100%; height: 100%; max-width: 1480px; } /* width value 조정 */
#subVisual01 .postInfo { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 20px; width: 600px; height: 100%; background: rgba(255,255,255,0.5); backdrop-filter: blur(10px); }
#subVisual01 .postInfo h5 { margin-top: 50px; margin-bottom: 10px; font-size: 16px; font-weight: 700; color: #000; font-family: 'Pretendard-Bold', sans-serif; line-height: 1; }
#subVisual01 .postInfo h4 { display: inline-block; padding: 0 20px; margin-bottom: 20px; font-size: 18px; font-weight: 400; color: #fff; font-family: 'Pretendard-Bold', sans-serif; background: var(--secondClr3); border-radius: 20px; line-height: 40px; }
#subVisual01 .postInfo h2 { margin-bottom: 10px; font-size: 24px; font-weight: 400; color: #000; text-align: left; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; width: 100%; }
#subVisual01 .postInfo h1 { margin-bottom: 10px; font-size: 42px; font-weight: 700; color: #000; text-align: left; font-family: 'GmarketSansBold', sans-serif; line-height: 1.2; letter-spacing: -1px; width: 100%; }
#subVisual01 .postInfo h3 { font-size: 28px; font-weight: 700; color: #333; text-align: left; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; letter-spacing: -0.5px; width: 100%; }
#subVisual01 .postInfo .writePic { margin-top: auto; }
.writePic { display: flex; flex-flow: row nowrap; justify-content: flex-start; width: 100%; }
.writePic li { margin-right: 20px; font-size: 20px; font-weight: 300; color: #000; }
.writePic li span { font-weight: 500; font-family: 'Pretendard-Bold', sans-serif; }
.writePic li:last-child { margin-right: 0; }
@media all and (max-width: 1280px){
    #subVisual01 { height: 600px; }
    #subVisual01 .visualBg { height: 600px; }
    #subVisual01 .visualBg span { font-size: 17px; }
    #subVisual01 .outLine { padding: 0 20px; }
    #subVisual01 .postInfo { left: 20px; width: 500px; }
    #subVisual01 .postInfo h5 { margin-top: 30px; }
    #subVisual01 .postInfo h4 { font-size: 17px; line-height: 36px; }
    #subVisual01 .postInfo h2 { font-size: 22px; }
    #subVisual01 .postInfo h1 { font-size: 38px; }
    #subVisual01 .postInfo h3 { font-size: 24px; }
    .writePic li { font-size: 19px; }
}
@media all and (max-width: 1024px){
    #subVisual01 { height: 530px; }
    #subVisual01 .visualBg { height: 530px; }
    #subVisual01 .visualBg span { font-size: 16px; }
    #subVisual01 .outLine { padding: 0 20px; }
    #subVisual01 .postInfo { left: 20px; width: 450px; }
    #subVisual01 .postInfo h5 { margin-top: 20px; }
    #subVisual01 .postInfo h4 { font-size: 16px; line-height: 34px; }
    #subVisual01 .postInfo h2 { font-size: 20px; }
    #subVisual01 .postInfo h1 { font-size: 32px; }
    #subVisual01 .postInfo h3 { font-size: 22px; }
    .writePic li { font-size: 17px; }
}
@media all and (max-width: 768px){
    #subVisual01 { height: 420px; }
    #subVisual01 .visualBg { height: 420px; }
    #subVisual01 .visualBg span { font-size: 15px; }
    #subVisual01 .outLine { padding: 0 20px; }
    #subVisual01 .postInfo { left: 10px; padding: 20px 10px 20px 20px; width: 370px; backdrop-filter: blur(5px); }
    #subVisual01 .postInfo h5 { margin-top: 10px; }
    #subVisual01 .postInfo h4 { margin-bottom: 10px; font-size: 15px; line-height: 30px; }
    #subVisual01 .postInfo h2 { font-size: 19px; }
    #subVisual01 .postInfo h1 { font-size: 26px; }
    #subVisual01 .postInfo h3 { font-size: 20px; }
    .writePic li { font-size: 16px; }
}
@media all and (max-width: 599px){
    #subVisual01 { height: auto; }
    #subVisual01 .visualBg { position: relative; top: auto; left: auto; height: 300px; }
    #subVisual01 .visualBg span { font-size: 14px; max-width: 80%; }
    #subVisual01 .outLine { padding: 0; height: auto; }
    #subVisual01 .postInfo { position: relative; top: auto; left: auto; padding: 20px; width: 100%; height: 100%; background: rgba(255,255,255,0.1); backdrop-filter: blur(0px); }
    #subVisual01 .postInfo .writePic { margin-top: 40px; }
    #subVisual01 .postInfo h5 { margin-top: 0; }
    #subVisual01 .postInfo h2 { font-size: 18px; }
    #subVisual01 .postInfo h1 { font-size: 24px; }
    #subVisual01 .postInfo h3 { font-size: 19px; }
    .writePic { flex-flow: row wrap; }
    .writePic li { font-size: 15px; width: 100%; text-align: left; }
}
@media all and (max-width: 480px){
    #subVisual01 .visualBg { height: 250px; }
    #subVisual01 .postInfo .writePic { margin-top: 40px; }
    #subVisual01 .postInfo h5 { margin-top: 0; }
    #subVisual01 .postInfo h2 { font-size: 17px; }
    #subVisual01 .postInfo h1 { font-size: 22px; }
    #subVisual01 .postInfo h3 { font-size: 18px; }
    .writePic li { font-size: 14px; }
}
/* sub visual #2 */
#subVisual02 { position: relative; background: #fff; }
#subVisual02::after { position: absolute; content: ''; bottom: 0; left: 0; width: 100%; height: 50%; background: #f75e36; }
#subVisual02 .outLine { position: relative; display: flex; flex-flow: row nowrap; margin: 0 auto; width: 100%; height: 100%; max-width: 1480px; min-height: 700px; z-index: 5; }
#subVisual02 .postInfo { display: flex; flex-direction: column; align-items: flex-start; padding: 20px 30px 20px 20px; width: 50%; background: rgba(255,255,255,0.8); backdrop-filter: blur(5px); }
#subVisual02 .postInfo h5 { margin-top: 30px; margin-bottom: 10px; font-size: 16px; font-weight: 700; color: #000; font-family: 'Pretendard-Bold', sans-serif; line-height: 1; }
#subVisual02 .postInfo h4 { display: inline-block; padding: 0 20px; margin-bottom: 20px; font-size: 18px; font-weight: 400; color: #fff; background: var(--secondClr3); font-family: 'Pretendard-Bold', sans-serif; border-radius: 20px; line-height: 40px; }
#subVisual02 .postInfo h2 { margin-bottom: 10px; font-size: 24px; font-weight: 400; color: #000; text-align: left; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; width: 100%; }
#subVisual02 .postInfo h1 { margin-bottom: 10px; text-align: left; line-height: 1.2; width: 100%; }
#subVisual02 .postInfo h1 span { display: inline; color: #000; text-align: left; font-family: 'GmarketSansBold', sans-serif; letter-spacing: -1px; }
#subVisual02 .postInfo h3 { font-size: 28px; font-weight: 500; color: #333; text-align: left; font-family: 'Pretendard-Medium', sans-serif; line-height: 1.4; letter-spacing: -0.5px; width: 100%; }
#subVisual02 .postInfo .writePic { margin-top: 20px; }
#subVisual02 .postInfo .summaryCol { margin-top: auto; color: #333; line-height: 1.5; }
.eng #subVisual02 .outLine { min-height: 660px; }
.eng #subVisual02 .postInfo .summaryCol { color: #333; line-height: 1.4; }
#subVisual02 .visualBx { position: relative; width: 50%; }
#subVisual02 .visualBx img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
#subVisual02 .visualBx span { position: absolute; display: inline-block; bottom: 0; right: 0; padding: 5px 10px; font-size: 18px; font-weight: 400; color: #333; text-align: right; line-height: 1.4; max-width: 80%; word-break: keep-all; background: rgba(255,255,255,0.5); border-top-left-radius: 10px; }
@media all and (max-width: 1280px){
    #subVisual02 { padding: 0 20px; }
    #subVisual02 .postInfo h5 { margin-top: 30px; }
    #subVisual02 .postInfo h4 { font-size: 17px; line-height: 36px; }
    #subVisual02 .postInfo h2 { font-size: 22px; }
    #subVisual02 .postInfo h1 { font-size: 38px; }
    #subVisual02 .postInfo h3 { font-size: 24px; }
    #subVisual02 .visualBx span { font-size: 17px; }
}
@media all and (max-width: 1024px){
    #subVisual02 .postInfo h5 { margin-top: 10px; }
    #subVisual02 .postInfo h4 { margin-bottom: 10px; font-size: 16px; line-height: 34px; }
    #subVisual02 .postInfo h2 { font-size: 20px; }
    #subVisual02 .postInfo h1 { font-size: 32px; }
    #subVisual02 .postInfo h3 { font-size: 22px; }
    #subVisual02 .postInfo .writePic { margin-top: 10px; }
    .eng #subVisual02 .postInfo .writePic { flex-flow: column; }
    .eng #subVisual02 .postInfo .writePic li { width: 100%; }
    #subVisual02 .visualBx span { font-size: 16px; }
}
@media all and (max-width: 768px){
    #subVisual02 { padding: 0 10px; }
    #subVisual02 .postInfo { padding: 20px 10px 20px; }
    #subVisual02 .postInfo h4 { margin-bottom: 10px; font-size: 15px; line-height: 30px; }
    #subVisual02 .postInfo h2 { font-size: 19px; }
    #subVisual02 .postInfo h1 { font-size: 26px; }
    #subVisual02 .postInfo h3 { font-size: 20px; }
    #subVisual02 .visualBx { margin-top: 120px; }
    #subVisual02 .visualBx span { font-size: 15px; }
}
@media all and (max-width: 599px){
    #subVisual02 { padding: 0 20px; }
    #subVisual02::after { height: 40%; }
    #subVisual02 .outLine { flex-flow: column; margin: 0 auto; }
    #subVisual02 .postInfo { padding: 20px 0 20px; width: 100%; background: rgba(255,255,255,1); backdrop-filter: blur(0px); }
    #subVisual02 .postInfo h5 { margin-top: 0; }
    #subVisual02 .postInfo h2 { font-size: 18px; }
    #subVisual02 .postInfo h1 { font-size: 24px; }
    #subVisual02 .postInfo h3 { font-size: 19px; }
    #subVisual02 .postInfo .summaryCol { margin-top: 20px; font-size: 15px; }
    #subVisual02 .visualBx { margin-top: 0; width: 100%; height: 450px; }
    .eng #subVisual02 .outLine { min-height: auto; }
    .eng #subVisual02 .postInfo .summaryCol { font-size: 1rem; }
}
@media all and (max-width: 480px){
    #subVisual02 .postInfo h2 { font-size: 17px; }
    #subVisual02 .postInfo h1 { font-size: 22px; }
    #subVisual02 .postInfo h3 { font-size: 18px; }
    #subVisual02 .postInfo .summaryCol { font-size: 14px; }
    #subVisual02 .visualBx { margin-top: 0; width: 100%; height: 300px; }
}
/* sub visual #3 */
#subVisual03 { position: relative; width: 100%; height: 700px; background: #fff; overflow: hidden; }
#subVisual03::before { position: absolute; content: ''; top: -40%; left: -20%; width: 50%; height: 150%; background: rgba(132,48,31,1); transform: rotate(20deg); z-index: 2; }
#subVisual03::after { position: absolute; content: ''; top: -130%; left: -30%; width: 50%; height: 300%; background: rgba(27,27,190,1); transform: rotate(60deg); z-index: 1; }
#subVisual03 .visualBg { position: absolute; top: 0; left: 0; width: 100%; height: 700px; background: url(../img/sub/visual/bg_sample.jpg) no-repeat center; background-size: cover; }
#subVisual03 .visualBg span { position: absolute; display: inline-block; bottom: 0; right: 0; padding: 5px 10px; font-size: 18px; font-weight: 400; color: #333; text-align: left; line-height: 1.4; max-width: 45%; background: rgba(255,255,255,0.5); border-top-left-radius: 10px; }
#subVisual03 .outLine { position: relative; margin: 0 auto; width: 100%; height: 100%; max-width: 1480px; z-index: 10; } /* width value 조정 */
#subVisual03 .postInfo { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 20px; width: 600px; height: 100%; }
#subVisual03 .postInfo h5 { margin-top: 50px; margin-bottom: 10px; font-size: 16px; font-weight: 700; color: #fff; font-family: 'Pretendard-Bold', sans-serif; line-height: 1; }
#subVisual03 .postInfo h4 { display: inline-block; padding: 0 20px; margin-bottom: 20px; font-size: 18px; font-weight: 400; color: #fff; font-family: 'Pretendard-Bold', sans-serif; background: var(--secondClr3); border-radius: 20px; line-height: 40px; }
#subVisual03 .postInfo h2 { margin-bottom: 10px; font-size: 24px; font-weight: 300; color: #fff; text-align: left; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; width: 100%; }
#subVisual03 .postInfo h1 { margin-bottom: 10px; font-size: 42px; font-weight: 500; color: #fff; text-align: left; font-family: 'GmarketSansBold', sans-serif; line-height: 1.2; letter-spacing: -1px; width: 100%; text-shadow: 5px 5px 15px rgba(0,0,0,0.7); }
#subVisual03 .postInfo h3 { font-size: 28px; font-weight: 500; color: #fff; text-align: left; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; letter-spacing: -0.5px; width: 100%; text-shadow: 5px 5px 15px rgba(0,0,0,0.5); }
#subVisual03 .postInfo .writePic { margin-top: auto; }
#subVisual03 .postInfo .writePic li { color: #fff; }
@media all and (max-width: 1280px){
    #subVisual03 { height: 600px; }
    #subVisual03::before { top: -40%; left: -15%; }
    #subVisual03::after { top: -130%; left: -30%; }
    #subVisual03 .visualBg { height: 600px; }
    #subVisual03 .visualBg span { font-size: 17px; }
    #subVisual03 .outLine { padding: 0 20px; }
    #subVisual03 .postInfo { left: 20px; width: 500px; }
    #subVisual03 .postInfo h5 { margin-top: 30px; }
    #subVisual03 .postInfo h4 { font-size: 17px; line-height: 36px; }
    #subVisual03 .postInfo h2 { font-size: 22px; }
    #subVisual03 .postInfo h1 { font-size: 38px; }
    #subVisual03 .postInfo h3 { font-size: 24px; }
}
@media all and (max-width: 1024px){
    #subVisual03 { height: 530px; }
    #subVisual03 .visualBg { height: 530px; }
    #subVisual03 .visualBg span { font-size: 16px; }
    #subVisual03 .outLine { padding: 0 20px; }
    #subVisual03 .postInfo { left: 20px; width: 450px; }
    #subVisual03 .postInfo h5 { margin-top: 20px; }
    #subVisual03 .postInfo h4 { font-size: 16px; line-height: 34px; }
    #subVisual03 .postInfo h2 { font-size: 20px; }
    #subVisual03 .postInfo h1 { font-size: 32px; }
    #subVisual03 .postInfo h3 { font-size: 22px; }
}
@media all and (max-width: 768px){
    #subVisual03 { height: 420px; }
    #subVisual03::before { top: -40%; left: -5%; }
    #subVisual03::after { top: -130%; left: -20%; }
    #subVisual03 .visualBg { height: 420px; }
    #subVisual03 .visualBg span { font-size: 15px; }
    #subVisual03 .outLine { padding: 0 20px; }
    #subVisual03 .postInfo { left: 10px; padding: 20px 10px 20px 20px; width: 370px; }
    #subVisual03 .postInfo h5 { margin-top: 10px; }
    #subVisual03 .postInfo h4 { margin-bottom: 10px; font-size: 15px; line-height: 30px; }
    #subVisual03 .postInfo h2 { font-size: 19px; }
    #subVisual03 .postInfo h1 { font-size: 26px; }
    #subVisual03 .postInfo h3 { font-size: 20px; }
}
@media all and (max-width: 599px){
    #subVisual03 { height: auto; }
    #subVisual03::before { display: none; }
    #subVisual03::after { display: none; }
    #subVisual03 .visualBg { position: relative; top: auto; left: auto; height: 300px; }
    #subVisual03 .visualBg span { font-size: 14px; max-width: 80%; }
    #subVisual03 .outLine { padding: 0; height: auto; }
    #subVisual03 .postInfo { position: relative; top: auto; left: auto; padding: 20px; width: 100%; height: 100%; background: rgba(255,255,255,0.1); backdrop-filter: blur(0px); }
    #subVisual03 .postInfo .writePic { margin-top: 40px; }
    #subVisual03 .postInfo h5 { margin-top: 0; color: #000; }
    #subVisual03 .postInfo h2 { font-size: 18px; color: #333; font-weight: 400; }
    #subVisual03 .postInfo h1 { font-size: 24px; color: #000; text-shadow: none; }
    #subVisual03 .postInfo h3 { font-size: 19px; color: #000; text-shadow: none; }
    #subVisual03 .postInfo .writePic li { color: #333; }
}
@media all and (max-width: 480px){
    #subVisual03 .visualBg { height: 250px; }
    #subVisual03 .postInfo .writePic { margin-top: 40px; }
    #subVisual03 .postInfo h5 { margin-top: 0; }
    #subVisual03 .postInfo h2 { font-size: 17px; }
    #subVisual03 .postInfo h1 { font-size: 22px; }
    #subVisual03 .postInfo h3 { font-size: 18px; }
}
/* sub visual #4 */
#subVisual04 { position: relative; width: 100%; height: 700px; background: #fff; background-image: linear-gradient(to bottom,#fff 0%, #fff 50%, #a896e733 50%, #a896e733); background-repeat: repeat-x; overflow: hidden; }
#subVisual04::before { position: absolute; content: ''; bottom: -90%; left: -50%; width: 200%; height: 100%; background: rgba(132,48,31,0.3); transform: rotate(-8deg); z-index: 2; }
#subVisual04::after { position: absolute; content: ''; bottom: -95%; left: -50%; width: 200%; height: 100%; background: rgba(27,27,190,0.3); transform: rotate(-35deg); z-index: 1; }
#subVisual04 .outLine { position: relative; margin: 0 auto; width: 100%; height: 100%; max-width: 1480px; z-index: 10; } /* width value 조정 */
#subVisual04 .postInfo { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 20px; width: 100%; height: 100%; }
#subVisual04 .postInfo h5 { margin-top: 50px; margin-bottom: 10px; font-size: 16px; font-weight: 700; color: #000; font-family: 'Pretendard-Bold', sans-serif; line-height: 1; }
#subVisual04 .postInfo h4 { display: inline-block; padding: 0 20px; margin-bottom: 20px; font-size: 18px; font-weight: 400; color: #fff; font-family: 'Pretendard-Regular', sans-serif; background: var(--secondClr3); border-radius: 20px; line-height: 40px; }
#subVisual04 .postInfo h2 { margin-bottom: 10px; font-size: 24px; font-weight: 400; color: #000; text-align: left; font-family: 'Pretendard-Bold', sans-serif; line-height: 1.4; width: 100%; }
#subVisual04 .postInfo h1 { margin-bottom: 10px; font-size: 42px; font-weight: 700; color: #000; text-align: left; font-family: 'GmarketSansBold', sans-serif; line-height: 1.2; letter-spacing: -1px; width: 100%; }
#subVisual04 .postInfo h3 { font-size: 28px; font-weight: 500; color: #333; text-align: left;font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; letter-spacing: -0.5px; width: 100%; }
#subVisual04 .postInfo .writePic { margin-top: auto; }
#subVisual04 .postInfo .writePic li { color: #000; }
@media all and (max-width: 1280px){
    #subVisual04 { height: 600px; }
    #subVisual04::before { bottom: -90%; left: -50%; }
    #subVisual04::after { bottom: -95%; left: -50%; }
    #subVisual04 .visualBg { height: 600px; }
    #subVisual04 .visualBg span { font-size: 17px; }
    #subVisual04 .outLine { padding: 0 20px; }
    #subVisual04 .postInfo { left: 20px; width: calc(100% - 40px); }
    #subVisual04 .postInfo h5 { margin-top: 30px; }
    #subVisual04 .postInfo h4 { font-size: 17px; line-height: 36px; }
    #subVisual04 .postInfo h2 { font-size: 22px; }
    #subVisual04 .postInfo h1 { font-size: 38px; }
    #subVisual04 .postInfo h3 { font-size: 24px; }
}
@media all and (max-width: 1024px){
    #subVisual04 { height: 530px; }
    #subVisual04::before { bottom: -90%; left: -50%; }
    #subVisual04::after { bottom: -95%; left: -50%; }
    #subVisual04 .visualBg { height: 530px; }
    #subVisual04 .visualBg span { font-size: 16px; }
    #subVisual04 .outLine { padding: 0 20px; }
    #subVisual04 .postInfo h5 { margin-top: 20px; }
    #subVisual04 .postInfo h4 { font-size: 16px; line-height: 34px; }
    #subVisual04 .postInfo h2 { font-size: 20px; }
    #subVisual04 .postInfo h1 { font-size: 32px; }
    #subVisual04 .postInfo h3 { font-size: 22px; }
}
@media all and (max-width: 768px){
    #subVisual04 { height: 420px; }
    #subVisual04::before { bottom: -90%; left: -50%; }
    #subVisual04::after { bottom: -95%; left: -50%; }
    #subVisual04 .visualBg { height: 420px; }
    #subVisual04 .visualBg span { font-size: 15px; }
    #subVisual04 .outLine { padding: 0 20px; }
    #subVisual04 .postInfo { left: 10px; padding: 20px 10px 20px 20px; width: calc(100% - 20px); }
    #subVisual04 .postInfo h5 { margin-top: 10px; }
    #subVisual04 .postInfo h4 { margin-bottom: 10px; font-size: 15px; line-height: 30px; }
    #subVisual04 .postInfo h2 { font-size: 19px; }
    #subVisual04 .postInfo h1 { font-size: 26px; }
    #subVisual04 .postInfo h3 { font-size: 20px; }
}
@media all and (max-width: 599px){
    #subVisual04 { height: auto; }
    #subVisual04::before { bottom: -90%; left: -50%; }
    #subVisual04::after { bottom: -95%; left: -50%; }
    #subVisual04 .visualBg { position: relative; top: auto; left: auto; height: 300px; }
    #subVisual04 .visualBg span { font-size: 14px; max-width: 80%; }
    #subVisual04 .outLine { padding: 0; height: auto; }
    #subVisual04 .postInfo { position: relative; top: auto; left: auto; padding: 20px; width: 100%; height: 100%; }
    #subVisual04 .postInfo .writePic { margin-top: 40px; }
    #subVisual04 .postInfo h5 { margin-top: 0; color: #000; }
    #subVisual04 .postInfo h2 { font-size: 18px; color: #333; font-weight: 400; }
    #subVisual04 .postInfo h1 { font-size: 24px; color: #000; text-shadow: none; }
    #subVisual04 .postInfo h3 { font-size: 19px; color: #000; text-shadow: none; }
    #subVisual04 .postInfo .writePic li { color: #333; }
}
@media all and (max-width: 480px){
    #subVisual04 .visualBg { height: 250px; }
    #subVisual04 .postInfo .writePic { margin-top: 40px; }
    #subVisual04 .postInfo h5 { margin-top: 0; }
    #subVisual04 .postInfo h2 { font-size: 17px; }
    #subVisual04 .postInfo h1 { font-size: 22px; }
    #subVisual04 .postInfo h3 { font-size: 18px; }
}
/* sub visual #5 */
#subVisual05 { position: relative; padding: 50px 20px 70px; height: 700px; overflow: hidden; }
#subVisual05::after { position: absolute; content: ""; bottom: 0; left: 50%; transform: translate(-50%, 0) scale(5); transform-origin: bottom; width: 100vh; height: 100vh; border-radius: 50%; background: #4767a8; z-index: 0; }
#subVisual05 .outLine { position: relative; height: 100%; z-index: 10; }
#subVisual05 .postInfo { position: relative; display: flex; flex-flow: column; justify-content: center; align-items: center; width: 100%; height: 100%; }
/* #subVisual05 .postInfo h4 { display: flex; justify-content: center; align-items: center; margin-bottom: 20px; font-size: 18px; font-weight: 500; color: #fff; text-align: center; font-family: 'Pretendard-Bold', sans-serif; width: 100px; height: 100px; line-height: 1.2; background: var(--secondClr3); border-radius: 50%; box-shadow: 10px 10px 25px rgba(0,0,0,0.2); } */
#subVisual05 .postInfo h4 { display: inline-block; padding: 0 20px; margin-bottom: 20px; font-size: 18px; font-weight: 400; color: #fff; font-family: 'Pretendard-Regular', sans-serif; background: var(--secondClr3); border-radius: 20px; line-height: 40px; white-space: nowrap; }
#subVisual05 .postInfo h2 { margin-bottom: 10px; font-size: 28px; font-weight: 300; color: #fff; text-align: center; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; width: 100%; }
#subVisual05 .postInfo h1 { margin-bottom: 30px; text-align: center; width: 100%; line-height: 1.2; }
#subVisual05 .postInfo h1 span { display: inline; font-size: 60px; font-weight: 500; color: #fff; font-family: 'GmarketSansBold', sans-serif; line-height: 1.2; letter-spacing: -1px; }
#subVisual05 .postInfo h3 { font-size: 32px; font-weight: 500; color: #d9d9d9; text-align: center; font-family: 'Pretendard-Regular', sans-serif; line-height: 1.4; letter-spacing: -0.5px; width: 100%; }
#subVisual05 .postInfo .writePic { justify-content: center; margin-top: auto; margin-bottom: 30px; }
#subVisual05 .postInfo .writePic li { color: #fff; }
@media all and (max-width: 1280px) {
    #subVisual05 { padding: 35px 20px 60px; height: 600px; }
    #subVisual05::after { transform: translate(-50%, 0) scale(3.5); }
    #subVisual05 .postInfo h4 { font-size: 17px; }
    #subVisual05 .postInfo h2 { font-size: 24px; }
    #subVisual05 .postInfo h1 span { font-size: 48px; }
    #subVisual05 .postInfo h3 { font-size: 26px; }
    #subVisual05 .postInfo .writePic { margin-bottom: 15px; }
}
@media all and (max-width: 1024px) {
    #subVisual05 { padding: 35px 20px 60px; height: 530px; }
    #subVisual05::after { transform: translate(-50%, 0) scale(3); }
    #subVisual05 .postInfo h4 { margin-bottom: 15px; font-size: 16px; width: 90px; height: 90px; }
    #subVisual05 .postInfo h2 { font-size: 22px; }
    #subVisual05 .postInfo h1 span { font-size: 40px; }
    #subVisual05 .postInfo h3 { font-size: 24px; }
    #subVisual05 .postInfo .writePic { margin-bottom: 10px; }
}
@media all and (max-width: 768px) {
    #subVisual05 { padding: 30px 20px 50px; height: 500px; }
    #subVisual05::after { transform: translate(-50%, 0) scale(2.7); }
    #subVisual05 .postInfo h4 { margin-bottom: 15px; font-size: 15px; width: 80px; height: 80px; }
    #subVisual05 .postInfo h2 { font-size: 20px; }
    #subVisual05 .postInfo h1 { margin-bottom: 20px; }
    #subVisual05 .postInfo h1 span { font-size: 34px; }
    #subVisual05 .postInfo h3 { font-size: 22px; }
}
@media all and (max-width: 599px) {
    #subVisual05 { padding: 30px 20px 40px; height: 470px; }
    #subVisual05::after { transform: translate(-50%, 0) scale(2); }
    #subVisual05 .postInfo h4 { margin-bottom: 15px; font-size: 15px; width: 80px; height: 80px; }
    #subVisual05 .postInfo h2 { font-size: 18px; }
    #subVisual05 .postInfo h1 { margin-bottom: 20px; }
    #subVisual05 .postInfo h1 span { font-size: 30px; }
    #subVisual05 .postInfo h3 { font-size: 20px; }
}
@media all and (max-width: 480px) {
    #subVisual05 { padding: 30px 20px 30px; }
    #subVisual05::after { transform: translate(-50%, 0) scale(1.7); }
    #subVisual05 .postInfo h4 { font-size: 14px; width: 70px; height: 70px; }
    #subVisual05 .postInfo h2 { font-size: 18px; }
    #subVisual05 .postInfo h1 { margin-bottom: 20px; }
    #subVisual05 .postInfo h1 span { font-size: 28px; }
    #subVisual05 .postInfo h3 { font-size: 20px; }
}

/* ****** Summary ****** */
/* Type #1 */
.summaryWrap { position: relative; }
.summaryWrap .topDeco { text-align: center; }
.summaryWrap .topDeco i { font-size: 28px; color: #333; }
.summaryWrap .summaryCol { font-size: 21px; font-weight: 500; color: #444; line-height: 1.5; letter-spacing: -0.8px; text-align: justify; word-break: break-all; }
@media all and (max-width: 1280px) {
    .summaryWrap .summaryCol { font-size: 20px; }
}
@media all and (max-width: 1024px) {
    .summaryWrap .summaryCol { font-size: 19px; }
}
@media all and (max-width: 768px) {
    .summaryWrap .summaryCol { font-size: 18px; }
}
@media all and (max-width: 599px) {
    .summaryWrap .summaryCol { font-size: 17px; }
}

/* Type #2 */
.summaryWrap2 { position: relative; }
.summaryWrap2 .topDeco { text-align: center; }
.summaryWrap2 .topDeco span { position: relative; display: inline-block; }
.summaryWrap2 .topDeco span::before { position: absolute; content: ''; top: 40%; left: -80px; width: 50px; height: 2px; border-radius: 2px; background: #333; }
.summaryWrap2 .topDeco span::after { position: absolute; content: ''; top: 40%; right: -80px; width: 50px; height: 2px; border-radius: 2px; background: #333; }
.summaryWrap2 .topDeco span i { font-size: 28px; color: #333; }
.summaryWrap2 .summaryCol { font-size: 21px; font-weight: 500; color: #444; line-height: 1.5; letter-spacing: -0.8px; text-align: justify; word-break: break-all; }
.eng .summaryWrap2 .summaryCol { letter-spacing: 0; }

@media all and (max-width: 1280px) {
    .summaryWrap2 .summaryCol { font-size: 20px; }
}
@media all and (max-width: 1024px) {
    .summaryWrap2 .summaryCol { font-size: 19px; }
}
@media all and (max-width: 768px) {
    .summaryWrap2 .summaryCol { font-size: 18px; }
}
@media all and (max-width: 599px) {
    .summaryWrap2 .summaryCol { font-size: 17px; }
}

/* ****** 일반 레이아웃 ****** */
/* 본문 Section > outline 레이아웃 */
.section { padding: 50px 20px; }
.section:nth-child(even) { background: #f7f7f7; }
.section:nth-child(odd) { background: #fff; }
.outLine { position: relative; margin: 0 auto; width: 100%; height: 100%; max-width: 1480px; }
.outline { position: relative; margin: 0 auto; padding: 30px; width: 100%; height: 100%; max-width: 1480px; border-radius: 30px; }
.outline.size_01 { max-width: 1280px; }
.outline.size_02 { max-width: 1200px; }
.outline.size_03 { max-width: 1024px; }
.outline.size_04 { max-width: 768px; }
.section:nth-child(even) .outline { background: #fff; }
.section:nth-child(odd) .outline { background: #f7f7f7; }
@media all and (max-width: 1024px) {
    .section { padding: 40px 20px; }
}
@media all and (max-width: 768px) {
    .outline { padding: 20px; }
}
@media all and (max-width: 599px) {
    .section { padding: 30px 10px; }
    .outline { padding: 15px; border-radius: 20px; }
}

/* Box 레이아웃 */
.boxLayout_2n1 { position: relative; }
.boxLayout_2n1 .wrap { position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; gap: 20px; }
.boxLayout_2n1 .bx { position: relative; width: calc(50% - 10px); }
.boxLayout_2n1 .all { position: relative; display: block; margin-top: 10px; width: 100%; line-height: 1.3; }
.boxLayout_3n1 { position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; gap: 20px; }
.boxLayout_3n1 .bx { position: relative; width: calc(33.3333% - 13.3333px); }
.boxLayout_2n2 { position: relative; }
.boxLayout_2n2 .wrap { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 20px; }
.boxLayout_2n2 .bx { position: relative; width: calc(50% - 10px); }
.boxLayout_2n2 .all { position: relative; display: block; margin-top: 10px; width: 100%; line-height: 1.3; }
.boxLayout_2n1Full { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 20px; }
.boxLayout_2n1Full .bx { position: relative; width: calc(50% - 10px); }
.boxLayout_2n1Full .bx:last-child { width: 100%; }
.imgWrap3n1Unbalanced { position: relative; display: flex; flex-flow: row wrap; }
.imgWrap3n1Unbalanced span { position: relative; display: block; margin-top: 10px; width: 100%; line-height: 1.3; word-break: break-all; }
.imgWrap3n1Unbalanced .bx { position: relative; height: 600px; }
.imgWrap3n1Unbalanced .bx.left { width: 40%; }
.imgWrap3n1Unbalanced .bx.right { width: 60%; }
.imgWrap3n1Unbalanced .bx figure { position: relative; display: block; height: 100%; }
.imgWrap3n1Unbalanced .bx figure.inbx { height: 50%; }
.imgWrap3n1Unbalanced .bx figure img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
@media all and (max-width: 1024px) {
    .imgWrap3n1Unbalanced .bx { height: 500px; }
}
@media all and (max-width: 768px) {
    .boxLayout_3n1 { flex-flow: row wrap; }
    .boxLayout_3n1 .bx { width: calc(50% - 10px); }
    .imgWrap3n1Unbalanced .bx { height: 400px; }
    .imgWrap3n1Unbalanced .bx.left { width: 50%; }
    .imgWrap3n1Unbalanced .bx.right { width: 50%; }
}
@media all and (max-width: 599px) {
    .boxLayout_2n1 .wrap { flex-flow: row wrap; gap: 15px; }
    .boxLayout_2n1 .bx { width: 100%; }
    .boxLayout_3n1 { flex-flow: row wrap; gap: 15px; }
    .boxLayout_3n1 .bx { width: 100%; }
    .boxLayout_2n2 .wrap { flex-flow: row wrap; gap: 15px; }
    .boxLayout_2n2 .bx { width: 100%; }
    .boxLayout_2n1Full { gap: 15px; }
    .boxLayout_2n1Full .bx { width: 100%; }
    .imgWrap3n1Unbalanced { flex-flow: column; }
    .imgWrap3n1Unbalanced .bx { height: auto; }
    .imgWrap3n1Unbalanced .bx.left { width: 100%; }
    .imgWrap3n1Unbalanced .bx.right { width: 100%; }
    .imgWrap3n1Unbalanced .bx figure img { position: relative; top: auto; left: auto; }
}
/* img + colBox - horizontal */
.imgColBox1 { position: relative; display: flex; flex-flow: row nowrap; gap: 20px; }
.imgColBox1 > * { width: calc(50% - 10px); }
@media all and (max-width: 480px) {
    .imgColBox1 { flex-flow: column; gap: 15px; text-align: center; }
    .imgColBox1 > * { width: 100%; }
}
/* img 4 */
.imgColBox4 { position: relative; display: flex; flex-flow: row nowrap; gap: 10px; }
.imgColBox4 .bx { width: calc(25% - 7.5px); }
.imgColBox4 .bx div:first-child { margin-bottom: 10px; }
.imgColBox4 .bx div h4 { margin-bottom: 5px; }
.imgColBox4 .bx div h4,
.imgColBox4 .bx div p { text-align: center; }
.imgColBox4 .bx p { line-height: 1.4; }
@media all and (max-width: 599px) {
    .imgColBox4 { flex-flow: row wrap; gap: 20px; }
    .imgColBox4 .bx { width: calc(50% - 10px); }
}
@media all and (max-width: 375px) {
    .imgColBox4 { flex-flow: column; gap: 15px; }
    .imgColBox4 .bx { width: 100%; }
}


/* ****** 이미지 레이아웃 ****** */
.imgWrap { position: relative; }
.imgWrap img { border-radius: 10px; }
.imgWrap span { display: block; margin-top: 10px; text-align: left; line-height: 1.3; word-break: keep-all; }
.chn .imgWrap span { word-break: break-all; }
@media all and (max-width: 599px) {
    .imgWrap img { border-radius: 7px; }
}
/* sticky 레이아웃 */
/* sticky */
.imgTxtBxSticky { position: relative; display: flex; flex-flow: row nowrap; align-items: flex-start; gap: 40px; }
.imgTxtBxSticky .Bx { width: calc(50% - 20px); }
.imgTxtBxSticky .imgWrap { position: relative; }
.imgTxtBxSticky .imgWrap .peopleInfo { position: absolute; padding: 15px; max-width: 85%; background: #134B84; }
.imgTxtBxSticky .imgWrap .peopleInfo.topLeft { top: 30px; left: 0; border-top-right-radius: 15px; border-bottom-right-radius: 15px; }
.imgTxtBxSticky .imgWrap .peopleInfo.bottomRight { bottom: 50px; right: 0; border-top-left-radius: 15px; border-bottom-left-radius: 15px; }
.imgTxtBxSticky .imgWrap .peopleInfo.bottomRight p { text-align: right; }
.imgTxtBxSticky .imgWrap .peopleInfo p { font-weight: 300; color: #fff; line-height: 1.4; }
.imgTxtBxSticky .imgWrap .peopleInfo p em { font-weight: 700; font-family: 'Pretendard-Bold', sans-serif; }
.imgTxtBxSticky .left { position: sticky; top: 10px; } /* header 높이에 따라 top 위치 조정 */
@media all and (max-width: 768px) {
    .imgTxtBxSticky { gap: 30px; }
    .imgTxtBxSticky .Bx { width: calc(50% - 15px); }
    .imgTxtBxSticky .imgWrap .peopleInfo { padding: 10px; }
}
@media all and (max-width: 599px) {
    .imgTxtBxSticky { flex-flow: row wrap; gap: 30px; }
    .imgTxtBxSticky .Bx { width: 100%; }
    .imgTxtBxSticky .imgWrap { max-width: 414px; }
    .imgTxtBxSticky .left { position: relative; top: auto; }
}
/* full width image */
.fullImgWrap { position: relative; background: #fff; }
.fullImgWrap .wrap { position: relative; }
.fullImgWrap .wrap img { width: 100%; height: auto; }
.fullImgWrap span { display: block; padding: 0 15px; margin-top: 10px; margin-bottom: 10px; line-height: 1.4; }
@media all and (max-width: 599px) {
    .fullImgWrap span { padding: 0 10px; }
}

/* img + txt(요약) + txt */
.rdImgBxWrap { position: relative; }
.rdImgBxWrap .imgWrap img { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.rdImgBxWrap .bottomTxtBx { padding: 10px; background: #134B84; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
.rdImgBxWrap .bottomTxtBx h3 { margin-bottom: 15px; font-weight: 500; color: #fff; text-align: center; line-height: 1.3; }
.rdImgBxWrap .bottomTxtBx h5 { margin-bottom: 5px; font-weight: 700; color: #fff; text-align: center; line-height: 1.3; }
.rdImgBxWrap .bottomTxtBx h5 em { font-weight: 400; font-family: 'Pretendard-Regular', sans-serif; }
.rdImgBxWrap .bottomTxtBx h6 { margin-bottom: 5px; font-weight: 300; color: #fff; text-align: center; line-height: 1.3; letter-spacing: 0; }
.rdImgBxWrap p { margin-top: 15px; padding: 0 5px; color: #666; }

/* ****** 표(Table) ****** */
/* *** 표 일반  *** */
table { border-top: 2px solid #333; border-bottom: 2px solid #999; }
table colgroup col { width: auto; }
table thead tr th,
table thead tr td { font-size: 1rem; line-height: 1.5; }
table thead tr th { padding: 5px 10px; font-weight: 500; color: #111; text-align: center; background: #e9e9e9; }
table tbody tr td { padding: 10px; font-weight: 300; color: #333; vertical-align: top; border-top: 1px solid #a9a9a9; }
/* *** 스크롤되는 표  *** */
.tableWrap.scrollTable { overflow: hidden; overflow-x: auto; }
.tableWrap.scrollTable > table { width: 100%; } /* table의 크기에 따라 미디어쿼리 추가 */
/* sample */
@media all and (max-width: 768px) {
    .tableWrap.scrollTable > table { width: 768px; }
}

/* ****** 기타 요소 ****** */
/* *** 텍스트 박스 *** */
/* 특수 텍스트 박스 */
.leed1 { display: flex; flex-flow: row nowrap; align-items: center; gap: 30px; }
.leed1 .Bx { width: calc(50% - 15px); }
.leed1 .Bx .inWrap { position: relative; padding-left: 10px; border-left: 10px solid #00aeef; }
.leed1 .Bx .inWrap h4 { margin-bottom: 10px; line-height: 1.4; }
.leed1 .Bx .inWrap p { font-weight: 300; line-height: 1.4; }
/* 이미지 없는 특수 텍스트 박스 */
.leed1.noImg .Bx { width: 100%; }
/* 라운드 박스 */
.roundBx { position: relative; padding: 1.5rem; border: 1px solid #666; border-radius: 0.75rem; }
/* leedBox */
.middleLeed { position: relative; padding: 100px 20px; background: linear-gradient(150deg, #0089D0, #56AA46); }
.middleLeed p { position: relative; margin: 0 auto; color: #fff; font-family: 'Pretendard-Medium' !important; font-weight: 500; text-align: center; line-height: 1.6; letter-spacing: -0.6px; width: 100%; max-width: 768px; word-break: keep-all; }
@media all and (max-width: 480px){
    .middleLeed p.conTit1_1 { font-size: 1.4rem; }
}
.middleLeed2 { position: relative; padding: 100px 20px; background: linear-gradient(150deg, #0089D0, #56AA46); }
.middleLeed2 h6 { position: relative; text-align: center; }
.middleLeed2 h6 p { position: relative; font-size: clamp(24px, 3.5vw, 40px); color: #fff; text-align: center; line-height: 1.4; }
.middleLeed2 h6 p span { position: relative; display: inline-block; transform: skew(0deg, -5deg); font-family: 'GmarketSansLight'; min-width: 0.75vw; line-height: 1; }
.middleLeed2 h6 .ddom { position: absolute; left: 50%; transform: translateX(-50%); width: 40px; width: clamp( 26px, 3.5vw, 40px); height: auto; }
.middleLeed2 h6 .ddom.ddomTop2 { top: -60px; }
.middleLeed2 h6 .ddom.ddomBottom2 { bottom: -60px; }
@media all and (max-width: 599px){
    .middleLeed2 { padding: 70px 20px; }
}

/* QNA BOX */
.qnaBox1 { position: relative; }
.qnaBox1 > div { position: relative; }
.qnaBox1 .question { padding: 15px; margin-bottom: 25px; padding-left: calc(60px + 10px); background: #e9e9e9; }
.qnaBox1 .question h3 { position: relative; margin-bottom: 0; font-family: 'Pretendard-Bold'; }
.qnaBox1 .question span { position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; color: #fff; font-family: 'Pretendard-Black'; width: 60px; height: 100%; background: #000; }
.qnaBox1 .question span::before { position: absolute; content: ''; bottom: -10px; left: 0; width: 15px; height: 15px; border-bottom: 15px solid transparent; border-left: 15px solid #000; }
.qnaBox1 .answer { padding: 15px; padding-left: calc(60px + 10px); background: #fff; }
.qnaBox1 .answer span { position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; font-family: 'Pretendard-Black'; color: #fff; width: 60px; height: 60px; background: #000; }
.qnaBox1 .answer span::before { position: absolute; content: ''; top: -10px; left: 0; width: 15px; height: 15px; border-top: 15px solid transparent; border-left: 15px solid #000; }

.qnaBox2 { position: relative; }
.qnaBox2 .question h3 { position: relative; padding-left: 1.5rem; }
.qnaBox2 .question h3::before { position: absolute; content: 'Q.'; top: 0; left: 0;  }

@media all and (max-width: 599px) {
    .qnaBox1 .question { padding-left: calc(50px + 10px); }
    .qnaBox1 .question span { width: 50px; height: 100%; }
    .qnaBox1 .answer { padding-left: calc(50px + 10px); }
    .qnaBox1 .answer span { width: 50px; height: 50px; }
}

/* *** 리스트 (List) *** */
/* 리스트 공통 */
.list { position: relative; }
.list > li { position: relative; padding-left: 1rem; margin-bottom: 3px; line-height: 1.5; }
.list > li:last-child { margin-bottom: 0; }
.list > li::before { position: absolute; top: 0; left: 0; font-size: inherit; color: inherit; font-weight: inherit; line-height: inherit; }
/* 점 리스트 */
.list.dot > li::before { content: '•'; }
/* 대시 리스트 */
.list.dash > li::before { content: '-'; }
/* 당구장 리스트 */
.list.bill > li { padding-left: 1.3rem; }
.list.bill > li::before { content: '※'; }
/* 단계가 있는 리스트 (List) - 1 */
.list.num1 { counter-reset: number 0; }
.list.num1 > li { counter-increment: number; margin-bottom: 10px; }
.list.num1 > li:last-child { margin-bottom: 0; }
.list.num1 > li::before { content: counter(number)'.'; }
.list.num2 { counter-reset: number2 0; }
.list.num2 > li { counter-increment: number2; padding-left: 1.2rem; margin-bottom: 5px; }
.list.num2 > li:last-child { margin-bottom: 0; }
.list.num2 > li::before { content: counter(number2)')'; }
/* 이런 것도 */
.list.other { counter-reset: other; }
.list.other > li { margin-bottom: 10px; }
.list.other > li:last-child { margin-bottom: 0; }
.list.other > li::before { counter-increment: other; content: counters(other, '.') '. '; }
.list.other > li .list.other > li { padding-left: 1.9rem; margin-bottom: 5px; }
@media all and (max-width: 768px) {
    .leed1 { gap: 20px; }
    .leed1 .Bx { width: calc(50% - 15px); }
}
@media all and (max-width: 767px) {
    .leed1 { flex-flow: row wrap; gap: 15px; }
    .leed1 .Bx { width: 100%; }
}
/* *** 출처 & 참고자료 *** */
.further_exp { position: relative; border-top: 1px solid #999; }
.further_exp h5 { margin-top: 10px; }
.further_exp .list.num1 li { margin-bottom: 5px; }
.further_exp .list.num1 li:last-child { margin-bottom: 0; }

/* ** 자세히 보기 ** */
.linkDetail { position: relative; }
.linkDetail .linkBtn { position: relative; display: inline-block; padding: 10px 25px; font-size: 0.9rem; color: #444; background: #f5f5f5; font-family: 'Pretendard-Bold'; line-height: 1; border: 3px solid transparent; border-image: linear-gradient(140deg, #0089D0 0%, #56AA46 33.33%, #F7941D 66.66%, #F1522A 100%); border-image-slice: 1; transition: 0.5s; white-space: nowrap; }
.linkDetail .linkBtn:hover { color: #000; background: #e1e1e1; }

.linkDetail2 { position: relative; }
.linkDetail2 .linkBtn { position: relative; display: inline-block; line-height: 1; border: 3px solid transparent; border-radius: 10px; background-image: linear-gradient(#fff, #fff), linear-gradient(140deg, #0089D0 0%, #56AA46 33.33%, #F7941D 66.66%, #F1522A 100%); background-origin: border-box; background-clip: content-box, border-box; }
.linkDetail2 .linkBtn:hover { background-image: linear-gradient(#fff, #fff), linear-gradient(50deg, #0089D0 0%, #56AA46 33.33%, #F7941D 66.66%, #F1522A 100%); }
.linkDetail2 .linkBtn span { position: relative; display: inline-block; padding: 10px 15px; font-size: 0.9rem; color: #444; font-family: 'Pretendard-Bold'; height: 100%; line-height: inherit; background: #f5f5f5; border-radius: 10px; white-space: nowrap; transition: 0.5s; }
.linkDetail2 .linkBtn:hover span { color: #000; background: #f9f9f9; }

/* 교수동정 */
.professorWrap { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 20px; }
.professorWrap .bx { position: relative; width: calc(50% - 10px); }
.professorWrap .bx .wrap { position: relative;  }
.professorWrap .bx .wrap .imgWrap { position: relative; float: left; margin-right: 15px; width: 140px; }
.professorWrap .bx .wrap .imgWrap::before { content: ""; display: block; clear: both; }
.professorWrap .bx .wrap .imgWrap img { border-radius: 5px; }
@media all and (max-width: 599px) {
    .professorWrap { flex-flow: column; }
    .professorWrap .bx { width: 100%; }
    .professorWrap .bx .wrap .imgWrap { width: 130px; }
}