.sub_visual { position: relative; height: 360px; overflow: hidden; }
.sub_visual .bg { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-origin: center; transform: scale(1.1); animation: sub_bg linear forwards 5s; }
@keyframes sub_bg {
    0% { transform: scale(1.1); }
    100% { transform: scale(1); }
}
.sv1 .bg { background: url(/image/sub/sub1_bg.jpg) no-repeat center/cover; }
.sv2 .bg { background: url(/image/sub/sub2_bg.jpg) no-repeat center/cover; }
.sv3 .bg { background: url(/image/sub/sub3_bg.jpg) no-repeat center/cover; }
.sv4 .bg { background: url(/image/sub/sub4_bg.jpg) no-repeat center/cover; }
.sv5 .bg { background: url(/image/sub/sub5_bg.jpg) no-repeat center/cover; }

.sub_visual p { z-index: 1; position: relative; top: 200px; text-align: center; font-weight: 700; font-size: 50px; color: #fff; }

@media (max-width: 1660px) {
    .sub_visual { height: 320px; }
    .sub_visual p { top: 190px; font-size: 40px; }
}
@media (max-width: 1230px) {
    .sub_visual { height: 280px; }
    .sub_visual p { top: 160px; font-size: 35px; }
}
@media (max-width: 767px) {
    .sub_visual { height: 240px; }
    .sub_visual p { top: 140px; font-size: 30px; }
}

/* 서브공통 */
.sub_sect { position: relative; padding: 90px 0; }

/* 서브1 */
.sub1 { padding-top: 0 !important; }
.sub1 .contents1 { overflow: hidden; padding: 120px 0; background: url(/image/sub/sub1_img1.jpg) no-repeat center/cover; }
.sub1 .contents1 .txtbox { max-width: 680px; }
.sub1 .contents1 .txtbox .txt1 { font-weight: 700; font-size: 30px; color: #1f5399; line-height: 1.4; }
.sub1 .contents1 .txtbox .txt2 { font-weight: 600; font-size: 20px; color: #3d3d3d; line-height: 1.5; }
.sub1 .contents2 { overflow: hidden; margin-top: 70px; display: flex; flex-wrap: wrap; }
.sub1 .contents2 > li { position: relative; width: 50%; }
.sub1 .contents2 > li:nth-child(n + 3) { margin-top: 25px; }
.sub1 .contents2 > li dl { display: flex; flex-wrap: nowrap; align-items: center; }
.sub1 .contents2 > li dl dt { min-width: max-content; width: 200px; padding: 10px; margin-right: 20px; padding-left: 25px; font-weight: 700; font-size: 18px; color: #1f5399; line-height: 1.3; background-color: #ebeff6; }
.sub1 .contents2 > li dl dd { font-weight: 600; font-size: 18px; color: #565656; line-height: 1.3; }
@media (max-width: 1230px) {
    .sub1 .contents2 > li dl dt { width: 150px; font-size: 16px; }
    .sub1 .contents2 > li dl dd { font-size: 16px; }
    .sub1 .contents2 > li:nth-child(n + 3) { margin-top: 20px; }
}
@media (max-width: 1024px) {
    .sub1 .contents2 > li dl dt { padding-left: 20px; margin-right: 15px; width: 120px; min-width: 120px; font-size: 15px; }
    .sub1 .contents2 > li dl dd { font-size: 15px; }
}
@media (max-width: 767px) {
    .sub1 .contents1 { background-position-x: 65%; }
    .sub1 .contents1 .txtbox .txt2 { text-shadow:  0 0 1px #fff; }

    .sub1 .contents2 { display: block; }
    .sub1 .contents2 > li { width: 100%; }
    .sub1 .contents2 > li:nth-child(n + 2) { margin-top: 20px; }
    .sub1 .contents2 > li dl dt { width: 110px; min-width: 110px; }
}

/* 서브2 */
.sub2 .contents { display: flex; flex-wrap: wrap; justify-content: space-between; }
.sub2 .contents > li { position: relative; width: 32%; border: 3px solid transparent; transition: border 0.3s;}
.sub2 .contents > li:nth-child(n + 4) { margin-top: 2%; }
.sub2 .contents > li:hover { border: 3px solid #1f5399; }

.sub2 .contents > li a { position: relative; display: block; border: 1px solid #bdbdbd; }
.sub2 .contents > li:hover a { border: none; }
.sub2 .contents > li p { position: relative; padding: 80px 10px; text-align: center; font-weight: 700; font-size: 34px; color: #2b2b2b; }
.sub2 .contents > li .img_wrap { position: relative; text-align: center; border-top: 1px solid #bdbdbd; }
.sub2 .contents > li:hover .img_wrap { border-top: 1px solid #1f5399; }
.sub2 .contents > li .img_wrap.ver2 { border-top: none; border-bottom: 1px solid #bdbdbd; }
.sub2 .contents > li:hover .img_wrap.ver2 { border-top: none; border-bottom: 1px solid #1f5399; }
.sub2 .contents > li .img_wrap img { width: 100%; }

.sub2 .desc1 { margin-top: 50px; text-align: center; font-weight: 700; font-size: 30px; color: #000; line-height: 1.4; }

@media (max-width: 724px) {
    .sub2 .contents > li { width: 48%; }
    .sub2 .contents > li:nth-child(n + 4) { margin-top: initial; }
    .sub2 .contents > li:nth-child(n + 3) { margin-top: 4% !important; }
}