.visual-area {
    max-width: 2000px;
    height: auto;
    margin: 0 auto;
}

.visual-area-content {
    position: relative;
    width: 100%;
    height: 800px;
    text-align: center;
    background: #5096F2;
}

.visual-area-content .title h1 {
    color: #fff;
    font-size: 60px;
    font-weight: 900;
}

.visual-area-content .title p {
    color: #fff;
    font-size: 20px;
    font-weight: 100;
}

.visual-area-content a {
    padding: 10px 30px;
    margin: 0 5px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 50px;
    color: #5096F2;
    text-align: center;
    font-size: 15px;
    line-height: 30px;
    transition: .5s all;
}

@media screen and (min-width: 1200px) {
    .visual-area-content {
        
    }
    
    .visual-area-content img {
        position: absolute;
        top: 50%;
        left: 15%;
        width: 250px;
        transform: translateX(-50%) translateY(-50%);
    }
    
    .visual-area-content .title {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 80%;
        text-align: right;
        transform: translateX(-50%) translateY(-50%);
    }
    
    .visual-area-content a {
        display: inline-block;
        position: absolute;
        top: 80%;
        left: 85%;
        transform: translateX(-50%) translateY(-50%);
    }
}

@media screen and (max-width: 1200px) {
    .visual-area-content {
        height: auto;
    }
    
    .visual-area-content img {
        position: sticky;
        display: block;
        margin: 0 auto;
        width: 30%;
    }
    
    .visual-area-content .title {
        position: sticky;
        display: block;
        padding: 50px 0;
    }

    .visual-area-content .title h1 {
        font-size: 5vw;
    }
    
    .visual-area-content .title p {
        font-size: 3vw;
    }
    
    .visual-area-content a {
        position: sticky;
        display: inline-block;
        margin: 0 0 50px 0;
        font-size: 3vw;
        line-height: 5vw;
    }
}

.slide-banner {
    padding: 50px 0px;
    max-width: 500px;
    width: 80%;
    height: auto;
}

.contents {
    max-width: 2000px;
    background-color: #000000;
    margin: 0 auto;
}

.contents-1 {
    max-width: 2000px;
    margin: 0 auto;
    margin-top: 50px;
}

.content-1-benner {
    margin: 0 auto;
    align-items: center;
    padding: 30px;
}

.content-1-text {
    font-family: 'Noto Sans KR', sans-ser   if;
    font-size: 28px;
    width: 100%;
    max-width: 2000px;
    margin: 0px auto;
    color: #ffffff;
    text-align: center;
    align-items: center;
    font-weight: 700;
}

.content-1-subtext {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 10px;
    max-width: 100%;    
    width: 1920px;
    margin: 0px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #ffffff;     
    text-align: center;
    align-items: center;
    font-weight: 500;
}

.content-1-bottom-button {
    text-align: center;
    max-width: 100px;
    margin: 0 auto;
}

.content-1-button {
    cursor: pointer;
    max-width: 100%;
    height: auto;
}

.content-1-picture {
    max-width: 400px;
    margin: 0 auto;
}

.content-1-image {
    max-width: 100%;
    height: auto;
}

.content-1-bottom-Explanation {
    height: 50px;
}

.content-1-Explanation {
    font-family: 'Noto Sans KR', sans-serif;
    text-align: center;
    font-size: 10px;
    max-width: 100%;
    width: 1920px;
    margin: 0px auto;
    color: #ffffff;
}

.inline {
    max-width: 2000px;
    width: 100%;
    text-align: center;
    background-color: #f8f8f8;
}

.inline-content-2 {
    display: inline-block;
    width: 49.5%;
    background-color: #f8f8f8;
    height: auto;
    min-width: 300px;
    margin-top: 20px;
}

.content-2 {
    align-items: center;
    margin: 0 auto;
}

.content-2-benner {
    margin: 0 auto;
    align-items: center;
}

.content-2-text {
    font-family: 'Noto Sans KR', sans-ser   if;
    font-size: 40px;
    margin: 0px auto;
    color: #000000;
    text-align: center;
    align-items: center;
    font-weight: 700;
}

.content-2-subtext {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 13px;  
    margin: 0px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #000000;
    text-align: center;
    align-items: center;
    font-weight: 500;
}

.content-2-bottom-button {
    text-align: center;
    max-width: 100px;
    margin: 0 auto;
}

.content-2-button {
    cursor: pointer;
    max-width: 100%;
    height: auto;
}

.content-2-picture {
    max-width: 300px;
    margin: 0 auto;
}

.content-2-image {
    max-width: 100%;
    height: auto;
}

.content-2-bottom-Explanation {
    height: 50px;
}

.content-2-Explanation {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 10px;
    margin: 0px auto;
    color: #000000;
}

.inline-content-3 {
    display: inline-block;
    background-color: #f8f8f8;
    width: 49.5%;
    height: auto;
    min-width: 300px;
    margin-top: 20px;
}

.content-3 {
    align-items: center;
    margin: 0 auto;
}   

.content-3-benner {
    margin: 0 auto;
    align-items: center;
}

.content-3-text {
    font-family: 'Noto Sans KR', sans-ser   if;
    font-size: 40px;
    margin: 0px auto;
    color: #000000;
    text-align: center;
    align-items: center;
    font-weight: 700;
}

.content-3-subtext {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 13px;   
    margin: 0px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #000000;
    text-align: center;
    align-items: center;
    font-weight: 500;
}

.content-3-bottom-button {
    text-align: center;
    max-width: 100px;
    margin: 0 auto;
}

.content-3-button {
    cursor: pointer;
    max-width: 100%;
    height: auto;
}

.content-3-picture {
    max-width: 300px;
    margin: 0 auto;
}

.content-3-image {
    max-width: 100%;
    height: auto;
}

.content-3-bottom-Explanation {
    height: 50px;
}

.content-3-Explanation {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 10px;
    margin: 0px auto;
    color: #000000;
}

.inline-2 {
    max-width: 2000px;
    width: 100%;
    text-align: center;
    background-color: #000B24;
    margin-top: 10px;
}

.inline-content-4 {
    display: inline-block;
    width: 49.5%;
    background-color: #000B24;
    height: auto;
    min-width: 300px;
    margin-top: 20px;
}

.content-4 {
    align-items: center;
    margin: 0 auto;
}

.content-4-benner {
    margin: 0 auto;
    align-items: center;
}

.content-4-text {
    font-family: 'Noto Sans KR', sans-ser   if;
    font-size: 40px;
    margin: 0px auto;
    color: #ffffff;
    text-align: center;
    align-items: center;
    font-weight: 700;
}

.content-4-subtext {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 13px;  
    margin: 0px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #ffffff;
    text-align: center;
    align-items: center;
    font-weight: 500;
}

.content-4-bottom-button {
    text-align: center;
    max-width: 100px;
    margin: 0 auto;
}

.content-4-button {
    cursor: pointer;
    max-width: 100%;
    height: auto;
}

.content-4-picture {
    max-width: 300px;
    margin: 0 auto;
}

.content-4-image {
    max-width: 100%;
    height: auto;
}

.content-4-bottom-Explanation {
    height: 50px;
}

.content-4-Explanation {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 10px;
    margin: 0px auto;
    color: #ffffff;
}

.inline-content-5 {
    display: inline-block;
    background-color: #000B24;
    width: 49.5%;
    height: auto;
    min-width: 300px;
    margin-top: 20px;
}

.content-5 {
    align-items: center;
    margin: 0 auto;
}   

.content-5-benner {
    margin: 0 auto;
    align-items: center;
}

.content-5-text {
    font-family: 'Noto Sans KR', sans-ser   if;
    font-size: 40px;
    margin: 0px auto;
    color: #ffffff;
    text-align: center;
    align-items: center;
    font-weight: 700;
}

.content-5-subtext {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 13px;   
    margin: 0px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #ffffff;
    text-align: center;
    align-items: center;
    font-weight: 500;
}

.content-5-bottom-button {
    text-align: center;
    max-width: 100px;
    margin: 0 auto;
}

.content-5-button {
    cursor: pointer;
    max-width: 100%;
    height: auto;
}

.content-5-picture {
    max-width: 300px;
    margin: 0 auto;
}

.content-5-image {
    max-width: 100%;
    height: auto;
}

.content-5-bottom-Explanation {
    height: 50px;
}

.content-5-Explanation {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 10px;
    margin: 0px auto;
    color: #ffffff;
}
