
/* sub5 */
.sub5 .contents1 { position: relative; padding: 55px 0; text-align: center; }
.sub5 .contents1 .desc1 { display: inline-block; padding: 13px 37px; font-weight: 700; font-size: 22px; color: #063972; line-height: 1.3; border-radius: 100px; border: 2px solid #063972; }
.sub5 .contents1 .desc2 { text-align: center; font-size: 18px; color: #000; line-height: 1.6; }
.sub5 .contents1 .desc2 b { font-weight: 700; color: #063972; }

.sub5 .contents2 { padding: 40px 0; display: flex; flex-wrap: nowrap; margin: 0 auto; max-width: 780px; font-weight: 700; font-size: 22px; color: #fff; }
.sub5 .contents2 * { font-weight: inherit; font-size: inherit; color: inherit; }
.sub5 .contents2 li { width: 26%; text-align: center; }
.sub5 .contents2 li.arrow_li { width: 11%; }

.sub5 .contents2 li .circle { position: relative; display: flex; align-items: center; justify-content: center; padding-bottom: 100%; border-radius: 50%; overflow: hidden; }
.sub5 .contents2 li:nth-of-type(1) .circle { background-color: #5390c9; }
.sub5 .contents2 li:nth-of-type(3) .circle { background-color: #2d659e; }
.sub5 .contents2 li:nth-of-type(5) .circle { background-color: #063972; }
.sub5 .contents2 li .circle p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); white-space: nowrap; }

.sub5 .contents2 li.arrow_li img { position: relative; top: 50%; transform: translateY(-50%); display: inline-block; width: 17px; }

.sub5 .contents3 { background-color: #063972; }
.sub5 .contents3 ul { display: flex; flex-wrap: nowrap; }
.sub5 .contents3 ul li { width: 50%; }
.sub5 .contents3 ul li:first-of-type { background: url(/image/sub/sub5/sub5_img1.jpg) no-repeat center/cover; }
.sub5 .contents3 ul li:first-of-type img { display: none; }
.sub5 .contents3 ul li .descbox { padding: 40px; }
.sub5 .contents3 ul li .descbox .desc1 { font-weight: 700; font-size: 34px; color: #fff; line-height: 1.25; }
.sub5 .contents3 ul li .descbox .desc2 { margin-top: 15px; font-size: 18px; color: #fff; line-height: 1.55; }
.sub5 .contents3 ul li .descbox .desc2 b { font-weight: 700; color: #ffee57; }

.sub5 .contents4 { margin-top: 80px; overflow: hidden; background: url(/image/sub/sub5/sub5_img2.jpg) no-repeat center/cover; }
.sub5 .contents4 ul { display: flex; flex-wrap: nowrap; }
.sub5 .contents4 ul li { position: relative; width: 50%; }
.sub5 .contents4 ul li .descbox { position: relative; top: 50%; transform: translateY(-50%); padding: 90px 0 120px; }
.sub5 .contents4 ul li .descbox .desc1 { font-size: 50px; color: #000; line-height: 1.35; }
.sub5 .contents4 ul li .descbox .desc1 b { font-weight: 700; }
.sub5 .contents4 ul li .descbox .desc2 { font-size: 30px; color: #000; letter-spacing: -0.025em; line-height: 1.35; }
.sub5 .contents4 ul li .descbox .desc2 b { font-weight: 700; }
.sub5 .contents4 ul li .descbox .desc3 { margin-top: 35px; display: flex; flex-wrap: wrap; font-size: 18px; color: #333; line-height: 1.65; }
.sub5 .contents4 ul li .descbox .desc3 * { font-size: inherit; color: inherit; line-height: inherit; }
.sub5 .contents4 ul li .descbox .desc3 p { width: 50%; }
.sub5 .contents4 ul li:first-of-type { display: flex; align-items: end; }
.sub5 .contents4 ul li .img1 { max-width: 90%; max-height: 90%; width: auto; height: auto; }

.sub5 .contents5 { margin-top: 80px; }
.sub5 .contents5 .text1 { text-align: center; font-size: 50px; color: #000; line-height: 1.25; }
.sub5 .contents5 .text1 b { font-weight: 700; font-size: inherit !important; }

.sub5 .contents6 { margin-top: 60px; }
.sub5 .contents6 li { display: flex; flex-wrap: nowrap; }
.sub5 .contents6 li .imgbox { width: 50%; }
.sub5 .contents6 li .imgbox img { width: 100%; }
.sub5 .contents6 li .txtbox { width: 50%; padding: 30px; }
.sub5 .contents6 li .txtbox .txt1 { font-weight: 700; font-size: 30px; color: #000; letter-spacing: -0.025em; line-height: 1.55; }
.sub5 .contents6 li .txtbox .txt2 { margin-top: 5px; font-size: 18px; color: #333; letter-spacing: -0.025em; line-height: 1.55; }
.sub5 .contents6 li:nth-of-type(2n) { flex-direction: row-reverse; }

@media (max-width: 1660px) {
    .sub5 .contents2 { font-weight: 600; }

    .sub5 .contents2 li.arrow_li img { width: 15px; }

    .sub5 .contents3 ul li .descbox .desc1 { font-weight: 600; }
    .sub5 .contents3 ul li .descbox .desc2 b { font-weight: 600; }

    .sub5 .contents4 ul li .descbox { padding: 70px 0 100px; }

    .sub5 .contents6 li .txtbox { padding: 25px; }
} 
@media (max-width: 1440px) {
    .sub5 .contents2 { font-weight: 500; }

    .sub5 .contents2 li.arrow_li img { width: 13px; }

    .sub5 .contents4 ul li .descbox { padding: 50px 0 80px; }

    .sub5 .contents6 li .txtbox { padding: 20px; }
} 
@media (max-width: 1279px) {
    .sub5 .contents2 { max-width: 600px; }
    .sub5 .contents2 li { width: 28%; }
    .sub5 .contents2 li.arrow_li { width: 8%; }

    .sub5 .contents3 ul li .descbox .desc1 { font-weight: 500; }
    .sub5 .contents3 ul li .descbox .desc2 b { font-weight: 500; }

    .sub5 .contents4 ul li .descbox { padding: 40px 0 60px; }
    .sub5 .contents4 ul li .descbox .desc3 { display: block; }
    .sub5 .contents4 ul li .descbox .desc3 p { width: 100%; }

    .sub5 .contents6 li { display: block; }
    .sub5 .contents6 li:nth-of-type(n + 2) { margin-top: 40px; }
    .sub5 .contents6 li .imgbox { width: 100%; text-align: center; }
    .sub5 .contents6 li .imgbox img { width: 100%; max-width: 300px; }
    .sub5 .contents6 li .txtbox { width: 100%; padding: 0; margin-top: 20px; text-align: center; }
    .sub5 .contents6 li .txtbox .txt1 { font-weight: 600; }
}
@media (max-width: 1023px) {
    .sub5 .contents1 .desc2 b { font-weight: 600; }

    .sub5 .contents2 li.arrow_li img { width: 11px; }

    .sub5 .contents4 ul { flex-wrap: wrap; flex-direction: column-reverse; text-align: center; }
    .sub5 .contents4 ul li { width: 100%; }
    .sub5 .contents4 ul li .descbox { top: initial; transform: translateY(0); padding: 30px 0; }
    .sub5 .contents4 ul li:first-of-type { display: block; text-align: center; }
    .sub5 .contents4 ul li .img1 { max-width: 250px; max-height: initial; width: 100%; height: auto; }
}
@media (max-width: 767px) {
    .sub5 .contents3 { background-color: transparent; }
    .sub5 .contents3 ul { display: block; }
    .sub5 .contents3 ul li { width: 100%; }
    .sub5 .contents3 ul li:first-of-type { background: none !important; text-align: center; }
    .sub5 .contents3 ul li:first-of-type img { display: inline-block; width: 100%; max-width: 300px; }
    .sub5 .contents3 ul li:last-of-type { margin-top: 20px; background-color: #063972; }

    .sub5 .contents4 ul li .img1 { max-width: 220px; }

    .sub5 .contents5 .text1 br { display: none; }

    .sub5 .contents6 li .imgbox img { max-width: 250px; }
    .sub5 .contents6 li .txtbox { margin-top: 15px; }
}

/* sub5_1 */
.sub5_1 .sub_intro { background: url(/image/sub/sub5/sub5_1_intro.jpg) no-repeat center/cover; }

/* sub5_2 */
.sub5_2 .sub_intro { background: url(/image/sub/sub5/sub5_2_intro.jpg) no-repeat center/cover; }

/* sub5_3 */
.sub5_3 .sub_intro { background: url(/image/sub/sub5/sub5_3_intro.jpg) no-repeat center/cover; }

/* sub5_4 */
.sub5_4 .sub_intro { background: url(/image/sub/sub5/sub5_4_intro.jpg) no-repeat center/cover; }
