@import url(default.css);
@import url(common.css);
@import url(layout.css);

/*
    파일명 : main.css
    작성자 : 김남주
    작성일 : 2024.04.15
    설  명 : 메인페이지에만 들어가는 스타일을 저장 (header, footer 빼고 전부 다)
*/

.container {
    width: 100%;
    margin-top: 200px;
}
.container .headlin {
    margin-bottom: 6vh;
    position: relative;
}
.container .headlin::before {
    position: absolute;
    left: 0;
    top: -48px;
    height: 179px;
    width: 349px;
    z-index: -1;
    background-image: url(../images/headlin_bg01.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    content: "";
}
.container .headlin::after {
    position: absolute;
    right: 0;
    top: 59px;
    height: 104px;
    width: 458px;
    z-index: -1;
    background-image: url(../images/headlin_bg02.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    content: "";
}
@media screen and (min-width:1921px) {
    .container .headlin::before {
        width: 50%;
    }
    .container .headlin::after {
        width: 40%;
    }
}
.container .headlin .headlin_inner {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-end;
}
.container .headlin .search_box {
    width: 38%;
}
.container .headlin .search_box .searchbar .search {
    max-width: 520px;
    min-width: 250px;
    width: 100%;
    height: 75px;
    border: 2px solid #B4CFDE;
    background-color: #FFF;
    border-radius: 45px;
    margin: 0 auto;
    padding: 0 10px 0 41px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition-duration: 300ms;
    transition-timing-function: ease-in-out;
}
.container .headlin .search_box .searchbar .search:hover {
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.1);
}
.container .headlin .search_box .searchbar .search label {
    display: none;
}
.container .headlin .search_box .searchbar .search input[type="text"] {
    font-size: 23px;
    font-weight: 700;
    color: #333;
    width: calc(100% - 100px);
    border: 0;
    outline: 0;
}
.container .headlin .search_box .searchbar .search input[type="text"]::placeholder {
    font-weight: 400;
    color: #999;
}
.container .headlin .search_box .searchbar .search input[type="submit"] {
    border: 0;
    background-color: transparent;
    font-size: 0;
    line-height: 0;
    width: 56px;
    height: 56px;
    background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' viewBox='0 0 56 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28Z' fill='url(%23paint0_linear_301_933)' fill-opacity='0.5'/%3E%3Cpath d='M25.6511 36.8246C22.3948 36.8246 19.6388 35.72 17.3833 33.5107C15.1278 31.3014 14 28.6019 14 25.4123C14 22.2227 15.1278 19.5233 17.3833 17.314C19.6388 15.1047 22.3948 14 25.6511 14C28.9074 14 31.6634 15.1047 33.9189 17.314C36.1744 19.5233 37.3022 22.2227 37.3022 25.4123C37.3022 26.6999 37.0931 27.9142 36.6748 29.0555C36.2566 30.1967 35.689 31.2063 34.972 32.0841L41.5071 39.0591C41.8357 39.381 42 39.7907 42 40.2882C42 40.7856 41.8357 41.1953 41.5071 41.5172C41.1784 41.8391 40.7602 42 40.2523 42C39.7445 42 39.3262 41.8391 38.9976 41.5172L32.4625 34.5422C31.5663 35.2445 30.5356 35.8004 29.3705 36.2101C28.2054 36.6198 26.9656 36.8246 25.6511 36.8246ZM25.6511 33.3131C27.8917 33.3131 29.7962 32.545 31.3646 31.0087C32.933 29.4725 33.7173 27.607 33.7173 25.4123C33.7173 23.2176 32.933 21.3522 31.3646 19.8159C29.7962 18.2796 27.8917 17.5115 25.6511 17.5115C23.4105 17.5115 21.506 18.2796 19.9376 19.8159C18.3692 21.3522 17.585 23.2176 17.585 25.4123C17.585 27.607 18.3692 29.4725 19.9376 31.0087C21.506 32.545 23.4105 33.3131 25.6511 33.3131Z' fill='white'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_301_933' x1='26.6451' y1='1.80645' x2='26.6451' y2='57.8065' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23A5E0E8'/%3E%3Cstop offset='1' stop-color='%235A7ACE'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}
.container .headlin .searchtag {
    display: flex;
    margin: 19px 0 0 67px;
}
.container .headlin .searchtag .s_tit {
    margin-right: 37px;
}
.container .headlin .searchtag .s_tit span {
    position: relative;
    font-weight: 700;
    color: #A3B0D1;
}
.container .headlin .searchtag .s_tit span::after {
    position: absolute;
    top: 8px;
    right: -27px;
    width: 13px;
    height: 2px;
    background-color: #A3B0D1;
    content: "";
}
.container .headlin .searchtag .s_tag ul {
    display: flex;
}
.container .headlin .searchtag .s_tag ul li a {
    display: block;
    font-size: 15PX;
    color: #999;
    padding: 0 8px ;
}
.container .headlin .txt {
    width: 62%;
    overflow: hidden;
}
.container .headlin .txt {
    display: block;
    transform: translate(0, 1.2em);
}
.container .headlin .txt {
    animation-name: txt;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@keyframes txt {
	0% { transform: translate(0, 1.2em)}
	100% { transform: translate(0, 0) }
}
.container .headlin .txt h2 {
    font-size: 45px;
    font-weight: 700;
    margin-bottom: 20px;
}
.container .headlin .txt p {
    font-size: 23px;
    color: #666;
}
.container .headlin .txt p span {
    color: #579BD9;
    font-weight: 500;
}

@media screen and (max-width:1280px) {
    .container {
        margin-top: 177px;
    }
    .container .headlin::before {
        left: 124px;
        top: -30px;
        height: 140px;
        width: 340px;
    }
    .container .headlin::after {
        top: 136px;
    }
    .container .headlin .searchtag {
        margin: 15px 0 0 95px;
    }
    .container .headlin .headlin_inner {
        display: block;
    }
    .container .headlin .search_box {
        margin-top: auto;
        width: 100%;
    }
    .container .headlin .searchtag {
        display: flex;
        justify-content: center;
        margin: 15px 0;
    }
    .container .headlin .txt {
        width: 100%;
        margin-top: 50px;
        text-align: center;
    }
    .container .headlin .txt h2 {
        font-size: 35px;
        color: #20405d;
        margin-bottom: 10px;
    }
    .container .headlin .txt h2 br {
        display: none;
    }
}
@media screen and (max-width:1024px) {
    .container {
        margin-top: 130px;
    }
    .container .headlin .txt {
        margin-top: 40px;
    }
    .container .headlin .txt h2 {
        font-size: 33px;
        margin-bottom: 5px;
    }
    .container .headlin .txt p {
        font-size: 21px;
    }
}
@media screen and (max-width:768px) {
    .container {
        margin-top: 110px;
    }
    .container .headlin::before {
        left: 10px;
        top: -30px;
        height: 115px;
        width: 315px;
    }
    .container .headlin::after {
        top: 150px;
        height: 62px;
        width: 400px;
    }
    .container .headlin .search_box .searchbar .search {
        width: 60%;
        height: 50px;
        padding: 0 10px 0 20px;
    }
    .container .headlin .search_box .searchbar .search input[type="submit"] {
        width: 33px;
        height: 33px;
    }
    .container .headlin .search_box .searchbar .search input[type="text"] {
        font-size: 16px;
        width: 100%;
    }
    .container .headlin .searchtag .s_tag ul li a {
        font-size: 13PX;
        padding: 0 7px;
    }
    .container .headlin .txt h2 {
        font-size: 30px;
    }
    .container .headlin .txt p {
        font-size: 18px;
    }
}
@media screen and (max-width:450px) {
    .container {
        margin-top: 100px;
    }
    .container .headlin::before {
        left: -59px;
        top: 100px;
        height: 52px;
        width: 268px;
    }
    .container .headlin::after {
        top: 12px;
        height: 49px;
        width: 200px;
    }
    .container .headlin .search_box .searchbar .search input[type="text"] {
        font-size: 15px;
    }
    .container .headlin .searchtag {
        display: none;
    }
    .container .headlin .txt {
        margin-top: 30px;
    }
    .container .headlin .txt h2 {
        font-size: 20px;
    }
    .container .headlin .txt p {
        font-size: 15px;
    }
}

.visual {
    margin: 2vh 0 10vh 0;
}
.visual .visual_inner {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    position: relative;
}
.visual .visual_inner .swiper_wrap {
    width: 49%;
    position: relative;
}
.visual .visual_inner .swiper_wrap .swiper {
    max-width: 984px;
    min-width: 280px;
    height: 100%;
    width: 100%;
    border-radius: 30px;
    margin: 0;
    overflow: hidden;
}
.visual .visual_inner .swiper_wrap .swiper ul li a {
    display: block;
    width: 100%;
    overflow: hidden;
}
.visual .visual_inner .swiper_wrap .swiper ul li a img {
    display: block;
    width: 100%;
}
.visual .visual_inner .swiper_wrap .visual_btn {
    position: absolute;
    right: 4%;
    bottom: -21px;
    width: 200px;
    height: 43px;
    background-color: #fcfcfc;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    content: "";
    border-radius: 13px;
    z-index: 10;
    display: flex;
    justify-content: space-evenly;
}
.visual .visual_inner .swiper_wrap .visual_btn .paging {
    width: 30%;
    margin: 11px 0 11px 7px;
}
.visual .visual_inner .swiper_wrap .visual_btn span {
    font-size: 17px;
    font-weight: 500;
}
.visual .visual_inner .swiper_wrap .visual_btn span.swiper-pagination-current {
    font-weight: 700;
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn {
    margin-left: 16px;
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn button {
    width: 11px;
    height: 14px;
    border-color: #fff;
    font-size: 0;
    line-height: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 14px;
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .prev {
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.6671 5.99735L7.24199 10.5723C7.39752 10.7278 7.47708 10.9233 7.48067 11.1587C7.48428 11.3941 7.40472 11.5932 7.24199 11.7559C7.07928 11.9186 6.882 12 6.65018 12C6.41835 12 6.22107 11.9186 6.05836 11.7559L1.01043 6.70797C0.9053 6.60286 0.83114 6.49198 0.787953 6.37533C0.744747 6.25871 0.723145 6.13271 0.723145 5.99735C0.723145 5.86198 0.744747 5.73599 0.787953 5.61936C0.83114 5.50272 0.9053 5.39184 1.01043 5.28673L6.05836 0.238798C6.21387 0.0832722 6.40934 0.00371196 6.64478 0.000117708C6.88021 -0.00349526 7.07928 0.076065 7.24199 0.238798C7.40472 0.401513 7.48609 0.598785 7.48609 0.830614C7.48609 1.06244 7.40472 1.25971 7.24199 1.42243L2.6671 5.99735Z' fill='%23666666'/%3E%3C/svg%3E%0A");
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .stop {
    margin-left: 10px;
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='13' viewBox='0 0 8 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L1 12' stroke='%23666666' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M7.11108 1L7.11108 12' stroke='%23666666' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .play {
    margin-left: 10px;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='12' viewBox='0 0 10 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 10.986V1.01404C0 0.717741 0.101411 0.474661 0.304233 0.284796C0.507037 0.094932 0.743639 0 1.01404 0C1.10033 0 1.1895 0.0122301 1.28156 0.0366877C1.37361 0.0611453 1.46279 0.0978217 1.5491 0.146718L9.39807 5.14348C9.55196 5.24847 9.66738 5.37432 9.74434 5.52103C9.82129 5.66774 9.85976 5.82739 9.85976 6C9.85976 6.17261 9.82129 6.33226 9.74434 6.47897C9.66738 6.62568 9.55196 6.75153 9.39807 6.85652L1.5491 11.8533C1.46279 11.9022 1.37361 11.9389 1.28156 11.9633C1.1895 11.9878 1.10033 12 1.01404 12C0.743639 12 0.507037 11.9051 0.304233 11.7152C0.101411 11.5253 0 11.2823 0 10.986ZM1.68284 9.7584L7.59443 6L1.68284 2.2416V9.7584Z' fill='%23666666'/%3E%3C/svg%3E%0A");
    display: none;
}
.visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .next {
    margin-left: 10px;
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.81899 6.00265L0.244101 1.42773C0.0885746 1.27222 0.00901437 1.07675 0.00542012 0.841307C0.00180715 0.605884 0.0813674 0.406815 0.244101 0.2441C0.406816 0.0813665 0.604087 0 0.835916 0C1.06775 0 1.26502 0.0813665 1.42773 0.2441L6.47566 5.29203C6.58079 5.39714 6.65495 5.50802 6.69814 5.62466C6.74135 5.74129 6.76295 5.86729 6.76295 6.00265C6.76295 6.13802 6.74135 6.26401 6.69814 6.38064C6.65495 6.49728 6.58079 6.60816 6.47566 6.71327L1.42773 11.7612C1.27222 11.9167 1.07675 11.9963 0.841307 11.9999C0.605884 12.0035 0.406816 11.9239 0.244101 11.7612C0.0813674 11.5985 0 11.4012 0 11.1694C0 10.9376 0.0813674 10.7403 0.244101 10.5776L4.81899 6.00265Z' fill='%23666666'/%3E%3C/svg%3E%0A");

}
.visual .visual_inner .popup_wrap {
    display: flex;
    justify-content: space-between;
    width: 50%;
}
.visual .visual_inner .popup_wrap .popup1,
.visual .visual_inner .popup_wrap .popup2 {
    width: 49%;
    position: relative;
}
.visual .visual_inner .popup_wrap a {
    display: block;
    height: 100%;
    border-radius: 20px;
    padding: 33px;
    position: relative;
    transition: 300ms ease-in-out;
}
.visual .visual_inner .popup_wrap .popup1 a {
    background-color: #D9E8FF;
}
.visual .visual_inner .popup_wrap .popup2 a {
    background-color: #E1F6EF;
}
.visual .visual_inner .popup_wrap a:hover {
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.1);
    transform: translate(-3px, -3px);
}
.visual .visual_inner .popup_wrap a::before {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 150px;
    height: 150px;
    content: "";
}
.visual .visual_inner .popup_wrap .popup1 a::before {
    background: url(../images/popup01.png) no-repeat center center / contain;
}
.visual .visual_inner .popup_wrap .popup2 a::before {
    background: url(../images/popup02.png) no-repeat center center / contain;

}
.visual .visual_inner .popup_wrap a::after {
    position: absolute;
    left: 30px;
    bottom: 30px;
    width: 47px;
    height: 47px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='25' fill='white'/%3E%3Cpath d='M32.1269 25.9483H16.75C16.5372 25.9483 16.359 25.8765 16.2154 25.7329C16.0718 25.5893 16 25.4111 16 25.1983C16 24.9855 16.0718 24.8073 16.2154 24.6637C16.359 24.5201 16.5372 24.4483 16.75 24.4483H32.1269L26.9577 19.2791C26.809 19.1304 26.7356 18.9563 26.7375 18.757C26.7394 18.5576 26.8179 18.3804 26.9731 18.2252C27.1282 18.0804 27.3038 18.0054 27.5 18.0002C27.6961 17.9951 27.8718 18.0701 28.0269 18.2252L34.3672 24.5656C34.4608 24.6592 34.5269 24.7579 34.5653 24.8618C34.6038 24.9656 34.623 25.0778 34.623 25.1983C34.623 25.3188 34.6038 25.431 34.5653 25.5348C34.5269 25.6387 34.4608 25.7374 34.3672 25.831L28.0269 32.1713C27.8884 32.3098 27.717 32.3806 27.5125 32.3838C27.308 32.387 27.1282 32.3162 26.9731 32.1713C26.8179 32.0162 26.7404 31.838 26.7404 31.6367C26.7404 31.4355 26.8179 31.2573 26.9731 31.1021L32.1269 25.9483Z' fill='%23666666' stroke='%23666666'/%3E%3C/svg%3E%0A");    background-size: contain;
    content: "";
    transition-duration: 100ms;
    transition-timing-function: ease-in-out;
}
.visual .visual_inner .popup_wrap .popup1 a:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='25' fill='%235B87F5'/%3E%3Cpath d='M32.1269 25.9483H16.75C16.5372 25.9483 16.359 25.8765 16.2154 25.7329C16.0718 25.5893 16 25.4111 16 25.1983C16 24.9855 16.0718 24.8073 16.2154 24.6637C16.359 24.5201 16.5372 24.4483 16.75 24.4483H32.1269L26.9577 19.2791C26.809 19.1304 26.7356 18.9563 26.7375 18.757C26.7394 18.5576 26.8179 18.3804 26.9731 18.2252C27.1282 18.0804 27.3038 18.0054 27.5 18.0002C27.6961 17.9951 27.8718 18.0701 28.0269 18.2252L34.3672 24.5656C34.4608 24.6592 34.5269 24.7579 34.5653 24.8618C34.6038 24.9656 34.623 25.0778 34.623 25.1983C34.623 25.3188 34.6038 25.431 34.5653 25.5348C34.5269 25.6387 34.4608 25.7374 34.3672 25.831L28.0269 32.1713C27.8884 32.3098 27.717 32.3806 27.5125 32.3838C27.308 32.387 27.1282 32.3162 26.9731 32.1713C26.8179 32.0162 26.7404 31.838 26.7404 31.6367C26.7404 31.4355 26.8179 31.2573 26.9731 31.1021L32.1269 25.9483Z' fill='white' stroke='white'/%3E%3C/svg%3E%0A");
}
.visual .visual_inner .popup_wrap .popup2 a:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='25' fill='%23009B64'/%3E%3Cpath d='M32.1269 25.9483H16.75C16.5372 25.9483 16.359 25.8765 16.2154 25.7329C16.0718 25.5893 16 25.4111 16 25.1983C16 24.9855 16.0718 24.8073 16.2154 24.6637C16.359 24.5201 16.5372 24.4483 16.75 24.4483H32.1269L26.9577 19.2791C26.809 19.1304 26.7356 18.9563 26.7375 18.757C26.7394 18.5576 26.8179 18.3804 26.9731 18.2252C27.1282 18.0804 27.3038 18.0054 27.5 18.0002C27.6961 17.9951 27.8718 18.0701 28.0269 18.2252L34.3672 24.5656C34.4608 24.6592 34.5269 24.7579 34.5653 24.8618C34.6038 24.9656 34.623 25.0778 34.623 25.1983C34.623 25.3188 34.6038 25.431 34.5653 25.5348C34.5269 25.6387 34.4608 25.7374 34.3672 25.831L28.0269 32.1713C27.8884 32.3098 27.717 32.3806 27.5125 32.3838C27.308 32.387 27.1282 32.3162 26.9731 32.1713C26.8179 32.0162 26.7404 31.838 26.7404 31.6367C26.7404 31.4355 26.8179 31.2573 26.9731 31.1021L32.1269 25.9483Z' fill='white' stroke='white'/%3E%3C/svg%3E%0A"); 
}
.visual .visual_inner .popup_wrap .popup1 a span {
    color: #075EA4;
}
.visual .visual_inner .popup_wrap .popup2 a span {
    color: #247156;
}
.visual .visual_inner .popup_wrap a span {
    display: block;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 23px;
}
.visual .visual_inner .popup_wrap a h3 {
    font-size: 1.3rem;
    margin-bottom: 50px;
    font-weight: 500;
}
@media screen and (max-width:1280px) {
    .visual {
        margin: 10vh 0 14vh 0;
    }
    .visual .visual_inner .popup_wrap a {
        padding: 27px;
    }
    .visual .visual_inner .popup_wrap a span {
        margin-bottom: 15px;
    }
    .visual .visual_inner .popup_wrap a h3 {
        font-size: 20px;
    }
    .visual .visual_inner .popup_wrap a::before {
        width: 100px;
        height: 100px;
    }
    .visual .visual_inner .popup_wrap a::after {
        left: 27px;
        bottom: 27px;
        width: 40px;
        height: 40px;
    }
}
@media screen and (max-width:1024px) {
    .visual {
        margin: 8vh 0 12vh 0;
    }
    .visual .visual_inner {
        flex-direction: column;
    }
    .visual .visual_inner {
    display: flex;
    justify-content: space-between;
    position: relative;
    align-items: stretch;
    flex-direction: column;
    margin: 0 10vw;
    }
    .visual .visual_inner .swiper_wrap {
        width: 100%;
    }
    .visual .visual_inner .swiper_wrap .visual_btn {
        bottom: -10px;
        width: 160px;
        height: 41px;
    }
    .visual .visual_inner .popup_wrap {
        width: 100%;
        margin: 20px 0;
    }
}
@media screen and (max-width:768px) {
    .visual {
        margin: 4vh 0 10vh 0;
    }
    .visual .visual_inner {
        margin: 0;
    }
    .visual .visual_inner .swiper_wrap .visual_btn {
        right: 4%;
        bottom: -10px;
        width: 140px;
        height: 40px;
        justify-content: center;
    }
    .visual .visual_inner .swiper_wrap .visual_btn .paging {
        width: 25%;
        margin: 10px 0 10px 6px;
    }
    .visual .visual_inner .popup_wrap {
        flex-direction: column;
    }
    .visual .visual_inner .popup_wrap .popup1, 
    .visual .visual_inner .popup_wrap .popup2 {
        width: 100%;
    }
    .visual .visual_inner .popup_wrap .popup1 {
        margin-bottom: 20px;
    }
    .visual .visual_inner .popup_wrap a {
        padding: 20px;
    }
    .visual .visual_inner .popup_wrap a::after {
        left: 20px;
        bottom: 20px;
        width: 28px;
        height: 28px;
    }
    .visual .visual_inner .popup_wrap a span {
        font-size: 15px;
        margin-bottom: 10px;
    }
    .visual .visual_inner .popup_wrap a h3 {
        font-size: 15px;
        margin-right: 70px;
        margin-bottom: 40px;
    }
    .visual .visual_inner .popup_wrap a h3 br {
        display: none;
    }
    .visual .visual_inner .popup_wrap a::before {
        bottom: 15px;
        width: 100px;
        height: 100px;
    }
} 
@media screen and (max-width:450px) {
    .visual .visual_inner .swiper_wrap .visual_btn {
        right: 4%;
        bottom: -10px;
        width: 120px;
        height: 35px;
    }
    .visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .stop {
        margin-left: 5px;
    }
    .visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn .next {
        margin-left: 5px;
    }
    .visual .visual_inner .swiper_wrap .visual_btn span {
        font-size: 13px;
    }
    .visual .visual_inner .swiper_wrap .visual_btn span {
    font-size: 13px;
    font-weight: 500;
    }
    .visual .visual_inner .swiper_wrap .visual_btn .ctrl_btn button {
        width: 9px;
        height: 12px;
        margin-top: 11px;
    }
    .visual .visual_inner .popup_wrap a::before {
        bottom: 5px;
        width: 90px;
        height: 90px;
    }
}

.icon {
    width: 100%;
    height: 540px;
    position: relative;
}
.icon::before {
    position: absolute;
    right: calc(50% - 800px);/*697*/
    top: 0;
    z-index: -1;
    width: 100%;
    height: 456px;
    content: "";
    background: linear-gradient(#e3f3e9, #d2e9e4);
    border-radius: 0 230px 230px 0; 
}
.icon:has(.active > .bl)::before {
    background: linear-gradient(#daebf3, #b8dde1bd);
}
@media screen and (max-width:1600px) {
    .icon::before {
        right: 20px;
    }
}
.icon h2 {
    font-size: 33px;
    font-weight: 700;
    padding-top: 80px;
    position: absolute;
}
.icon .icon_inner {
    position: relative;
    height: 456px; 
}
.icon .icon_inner ul {
    display: flex;
    padding-top: 70px;
}
.icon .icon_inner > ul > li:first-child {
    padding-left: 250px;
}
.icon .icon_inner > ul > li > button {
    padding: 10px 10px;
    margin: 0 15px;
    font-size: 23px;
    display: block;
    position: relative;
}
.icon .icon_inner > ul > li:first-child button::before {
    position: absolute;
    right: -15.5px;
    top: 24px;
    width: 3px;
    height: 3px;
    background-color: #777;
    content: "";
}
.icon .icon_inner > ul > li.active > button.gr {
    color: #2A8677;
    font-weight: 700;
    position: relative;
}
.icon .icon_inner > ul > li > button::after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 3px;
    content: "";
    transform: translate(0%, 0);
    transition: 0.7s;
}
.icon .icon_inner > ul > li.active > button.gr::after {
    background-color: #2A8677;
}
.icon .icon_inner > ul > li.active > button.bl::after {
    background-color: #387ED2;
}
.icon .icon_inner > ul > li.active > button::after {
    width: 100%;
}
.icon .icon_inner > ul > li.active > button.bl{
    color: #387ED2;
    font-weight: 700;
    position: relative;
}
.icon .icon_inner > ul > li .swiper {
    position: absolute;
    left: -33px;
    top: 120px;
    width: 100%;
    display: none;
}
.icon .icon_inner > ul > li.active .swiper {
    display: block;
}
.icon .icon_inner > ul > li .swiper ul {
    display: flex;
    justify-content: space-between;
}
.icon .icon_inner > ul > li .swiper ul li {
    width: 20%;
    text-align: center;
}
.icon .icon_inner > ul > li .swiper ul li a {
    display: block;
    position: relative;
    transition: transform 300ms ease-in-out;
}
.icon .icon_inner > ul > li .swiper ul li a span {
    display: inline-block;
    width: 120px;
    height: 120px;
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    border-radius: 37%;
}
.icon .icon_inner > ul > li .swiper ul li a img {
    width: 73%;
    margin-top: 16px;
    object-fit: contain;
    transform: rotateY(0.003deg);
    transition: transform 0s ease-in-out;
}
.icon .icon_inner > ul > li .swiper ul li a:hover img {
    transform:rotateY(360deg);
    transition-duration:0.3s;
}
.icon .icon_inner > ul > li .swiper ul li a h3 {
    margin-top: 20px;
    padding: 0 10px;
}
.icon .icon_inner > ul > li .swiper ul li a:hover h3 {
    font-weight: 500;
}
.icon .icon_inner > ul li .pagination {
    display: none;
}
@media screen and (max-width:1280px) {
    .icon {
        height: 500px;
    }
    .icon h2 {
        font-size: 30px;
        padding: 80px 0 0 20px;
    }
    .icon .icon_inner > ul > li .swiper ul li a span {
        width: 100px;
        height: 100px;
    }
    .icon .icon_inner > ul > li .swiper ul li a img {
        width: 60%;
        margin-top: 20px;
    }
    .icon .icon_inner > ul > li .swiper {
        left: 4%;
        width: 90%;
    }
}
@media screen and (max-width:1024px) {
    .icon {
        height: 470px;
    }
    .icon::before {
        border-radius: 0 173px 173px 0;
        height: 430px;
    }
    .icon h2 {
        font-size: 28px;
        padding: 78px 0 0 20px;
    }
    .icon .icon_inner > ul > li > button {
        font-size: 20px;
    }
    .icon .icon_inner > ul > li:first-child {
        padding-left: 220px;
    }
    .icon .icon_inner > ul > li .swiper {
        left: 0;
        width: 98%;
    }
    .icon .icon_inner > ul > li .swiper ul li a span {
        width: 88px;
        height: 88px;
    }
    .icon .icon_inner > ul > li .swiper ul li a img {
        width: 55%;
        margin-top: 22px;
    }
}
@media screen and (max-width:768px) {
    .icon::before {
        border-radius: 0;
        height: 395px;
        right: auto;
    }
    .icon .icon_inner > ul > li .swiper {
        top: 110px;
        left: 50px;
        width: calc(100% - 100px);
    }
    .icon h2 {
        font-size: 25px;
        padding: 70px 0 0 20px;
    }
    .icon .icon_inner ul {
        padding-top: 59px;
    }
    .icon .icon_inner > ul > li:first-child {
        padding-left: 192px;
    } 
    .icon .icon_inner > ul li .pagination {
        bottom: 89px;
        left: calc(50% - 24px);
        width: 50px;
        height: 17px;
        position: absolute;
    }
    .icon .icon_inner > ul li.active .pagination {
        display: block
    }
}
@media screen and (max-width:450px) {
    .icon {
        height: 340px;
    }
    .icon::before {
        height: 320px;
    }
    .icon .icon_inner {
        height: 350px; 
    }
    .icon h2 {
        font-size: 19px;
        padding: 56px 0 0 0;
    }
    .icon .icon_inner > ul > li > button {
        padding: 5px;
        margin: 0px 5px;
        font-size: 15px;
    }
    .icon .icon_inner > ul > li:first-child {
        padding-left: 125px;
    }
    .icon .icon_inner > ul > li:first-child button::before {
        right: -11.5px;
        top: 17px;
        width: 2px;
        height: 2px;
    }
    .icon .icon_inner ul {
        padding-top: 50px;
    }
    .icon .icon_inner > ul > li .swiper {
        top: 75px;
        left: 0;
        width: 100%;
    }
    .icon .icon_inner > ul > li .swiper ul li a span {
        width: 70px;
        height: 70px;
    }
    .icon .icon_inner > ul > li .swiper ul li a img {
        width: 50%;
        margin-top: 18px;
    }
    .icon .icon_inner > ul li .pagination {
        bottom: 54px;
    }
}

.notice {
    position: relative;
}
.notice h2 {
    font-size: 33px;
    font-weight: 700;
    position: absolute;
    margin: 10px 0 10px 20px;
}
.notice .notice_wrap {
    position: relative;
    height: 495px;
    margin-top: 77px;
}
.notice .notice_wrap > ul {
    display: flex;
}
.notice .notice_wrap > ul > li:first-child {
    padding-left: 250px;
}
.notice .notice_wrap > ul  > li > button {
    padding: 10px;
    font-size: 23px;
    font-weight: 500;
    position: relative;
    margin: 0 15px;
}
.notice .notice_wrap > ul > li.active > button {
    font-weight: 700;
}
.notice .notice_wrap > ul  > li.active > button.y {
    color: #EBB116;
}
.notice .notice_wrap > ul  > li.active > button.b {
    color: #498dd5;
}
.notice .notice_wrap > ul  > li.active > button.g {
    color: #2b9f76;
}
.notice .notice_wrap > ul > li > button::before {
    position: absolute;
    right: -15.5px;
    top: 24px;
    width: 3px;
    height: 3px;
    background-color: #666;
    content: "";

}
.notice .notice_wrap > ul > li > button::after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 3px;
    content: "";
    transform: translate(0%, 0);
    transition: 0.7s;
}
.notice .notice_wrap > ul > li.active > button::after {
    width: 100%;
}
.notice .notice_wrap > ul > li.active > button.y::after {
    background-color: #EBB116;
}
.notice .notice_wrap > ul > li.active > button.b::after {
    background-color: #498dd5;
}
.notice .notice_wrap > ul > li.active > button.g::after {
    background-color: #2b9f76;
}
.notice .notice_wrap > ul > li:last-child > button::before {
    display: none;
}
.notice .notice_wrap > ul  > li .detail {
    position: absolute;
    left: 0;
    top: 75px;
    width: 100%;
    display: none;
}
.notice .notice_wrap > ul  > li.active .detail {
    display: block;
}
.notice .notice_wrap > ul  > li.active .detail ul {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
}
.notice .notice_wrap > ul  > li.active .detail ul li {
    width: calc(25% - 20px);
}
.notice .notice_wrap > ul  > li.active .detail ul li a {
    display: block;
    height: 280px;
    border: 1px solid #CFCFCF;
    border-radius: 20px;
    padding: 2px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.notice .notice_wrap > ul  > li.active .detail ul li a:hover {
    transform: translate(-3px, -3px);
}
.notice .notice_wrap > ul  > li.active .detail ul li a::before,
.notice .notice_wrap > ul  > li.active .detail ul li a::after {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    content: "";
    box-sizing: border-box;
}
.notice .notice_wrap > ul  > li.active .detail ul li a::before {
    z-index: -2;
    background-color: #CFCFCF;
}
.notice .notice_wrap > ul  > li.active .detail ul li a::after {
    z-index: -1;
    top: 100%;
    background: linear-gradient(-15deg, #9ab3d9 0%, #c9f1ef 50%, #dfffe6 100%);
    transition: top 400ms ease-in-out;
}
.notice .notice_wrap > ul  > li.active .detail ul li a:hover:after {
    top:0px;
}
.notice .notice_wrap > ul  > li.active .detail ul li a .inner {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 30px;
    background-color: #FFF;
    border-radius: 18px;
    box-sizing: border-box;
}
.notice .notice_wrap > ul  > li.active .detail ul li a .inner::after {
    position: absolute;
    left: 15px;
    bottom: 71px;
    width: calc(100% - 30px);
    height: 1px;
    background-color: #CFCFCF;
    content: "";
}
.notice .notice_wrap > ul  > li.active .detail ul li a span {
    font-size: 15px;
    font-weight: 500;
    color: #FFF;
    display: inline-block;
    padding: 5px 20px;
    border-radius: 20px;
    margin-left: -10px;
}
.notice .notice_wrap > ul  > li.active .no01 ul li a span {
    background: #f9ba68;
}
.notice .notice_wrap > ul  > li.active .no01 ul li a span.color {
    background: #e9c63ee0;;
}
.notice .notice_wrap > ul  > li.active .no02 ul li a span {
    background: #6a8ad1;
}
.notice .notice_wrap > ul  > li.active .no02 ul li a span.color {
    background: #75c5e5;
}
.notice .notice_wrap > ul  > li.active .no03 ul li a span {
    background: #538f6b;
    padding: 5px 15px;
}
.notice .notice_wrap > ul  > li.active .no03 ul li a span.color {
    background: #63c770;
    padding: 5px 15px;
}
.notice .notice_wrap > ul  > li.active .detail ul li a h3 {
    font-size: 20px;
    font-weight: 500;
    margin: 20px 0 33px 0;
    line-height: 1.4;
    height: 5.6em;
    overflow: hidden;
}
.notice .notice_wrap > ul  > li.active .detail ul li a p {
    font-size: 18px;
}
.notice .notice_wrap > ul > li .detail .more {
    position: absolute;
    right: 0;
    top: 4px;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.notice .notice_wrap > ul > li .detail .more a {
    display: block;
    padding: 7px 30px 5px 5px;
}
.notice .notice_wrap > ul > li .detail .more a::before {
    position: absolute;
    right: 0;
    top: 10px;
    width: 13px;
    height: 13px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75 7.24998H0.75C0.5375 7.24998 0.359375 7.17808 0.215625 7.03428C0.071875 6.89046 0 6.71226 0 6.49967C0 6.28707 0.071875 6.10898 0.215625 5.9654C0.359375 5.82181 0.5375 5.75002 0.75 5.75002H5.75V0.750003C5.75 0.537502 5.8219 0.359376 5.9657 0.215626C6.10952 0.0718753 6.28772 0 6.5003 0C6.7129 0 6.89099 0.0718753 7.03457 0.215626C7.17816 0.359376 7.24995 0.537502 7.24995 0.750003V5.75002H12.25C12.4625 5.75002 12.6406 5.82192 12.7843 5.96572C12.9281 6.10954 13 6.28774 13 6.50032C13 6.71293 12.9281 6.89102 12.7843 7.0346C12.6406 7.17819 12.4625 7.24998 12.25 7.24998H7.24995V12.25C7.24995 12.4625 7.17805 12.6406 7.03425 12.7844C6.89043 12.9281 6.71223 13 6.49965 13C6.28705 13 6.10896 12.9281 5.96537 12.7844C5.82179 12.6406 5.75 12.4625 5.75 12.25V7.24998Z' fill='%23666666'/%3E%3C/svg%3E%0A");
    content: "";
    transition-duration: 300ms;
    transition-timing-function: ease-in-out;
}
.notice .notice_wrap > ul > li .detail .more:hover a::before {
    transform: rotate(180deg);
}
.notice .notice_wrap > ul > li .detail .more:hover a::after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #CFCFCF;
    content: "";
}
@media screen and (max-width:1280px) {
    .notice h2 {
        font-size: 30px;
        margin: 10px 0 0 20px;
    }
}
@media screen and (max-width:1024px) {
    .notice h2 {
        font-size: 28px;
    }
    .notice .notice_wrap > ul > li .detail {
        top: 50px;
    }
    .notice .notice_wrap > ul > li > button {
        padding: 10px 10px;
        font-size: 20px;
        margin: 0 10px;
    }
    .notice .notice_wrap > ul > li:first-child {
        padding-left: 185px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li {
        width: calc(25% - 10px);
    }
    .notice .notice_wrap > ul > li.active .detail ul li a {
        height: 260px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a .inner {
        padding: 23px;
        
    }
    .notice .notice_wrap > ul > li.active .detail ul li a h3 {
        font-size: 17px;
        margin: 16px 0 46px 0;
        line-height: 1.5;
        height: 6em;
    }   
    .notice .notice_wrap > ul > li.active .detail ul li a span {
        font-size: 13px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a p {
        font-size: 15px;
    }
    .notice .notice_wrap {
        height: 460px;
        margin-top: 73px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a .inner::after {
        bottom: 67px;
    }

}
@media screen and (max-width:768px) {
    .notice h2 {
        font-size: 25px;
        display: block;
        text-align: center;
        position: relative;
        margin: 70px 0 0 0;
    }
    .notice .notice_wrap {
        height: 665px;
        margin-top: 10px;
    }
    .notice .notice_wrap > ul > li > button {
        font-size: 17px;
    }
    .notice .notice_wrap > ul {
        display: flex;
        justify-content: center;
    }
    .notice .notice_wrap > ul > li:first-child {
        padding-left: 0;
    }
    .notice .notice_wrap > ul > li > button::before {
        right: -10px;
        top: 22px;
        width: 2px;
        height: 2px;
    }
    .notice .notice_wrap > ul > li .detail .more {
        position: absolute;
        right: calc(50% - 17px);
        top: 102%;
        width: 38px;
        height: 38px;
        border: 1px solid #CFCFCF;
        border-radius: 100%;
    }
    .notice .notice_wrap > ul > li .detail .more a {
        display: block;
        font-size: 0;
        line-height: 0;
    }
    .notice .notice_wrap > ul > li .detail .more a::before {
        right: 12px;
        top: 13px;
        width: 10px;
        height: 10px;
    }
    .notice .notice_wrap > ul > li.active .detail ul {
        display: flex;
        justify-content: space-between;
        margin-top: 35px;
        flex-direction: column;
        align-items: center;
    }
    .notice .notice_wrap > ul > li.active .detail ul li {
        width: 100%;
        margin-bottom: 10px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a {
        display: block;
        height: 110px;
        border: 1px solid #CFCFCF;
        border-radius: 20px;
        padding: 0;
        position: relative;
        overflow: hidden;
        z-index: 1;
        width: 100%;
        box-sizing: border-box;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a .inner::after {
        display: none;
    }
    .notice .notice_wrap > ul > li .detail .more:hover a::after {
        display: none;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a h3 {
        margin: 16px 0 0 0;
        height: auto;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a p {
        display: none;
    }
    
    
}
@media screen and (max-width:450px) {
    .notice h2 {
        font-size: 19px;
        margin: 70px 0 0 0;
    }
    .notice .notice_wrap > ul > li > button {
        font-size: 15px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a h3 {
        font-size: 15px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a .inner {
        padding: 15px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a span::before {
        left: -14px;
        top: -7px;
        padding: 14px 40px;
    }
    .notice .notice_wrap > ul > li.active .detail ul li a span {
        margin-left: -5px;
        margin-top: -5px;
    }
    
}

.schedule {
    position: relative;
}
.schedule::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 500px;
    z-index: -1;
    background: linear-gradient(#FFF, #e7f0f5);
    border-radius: 0 0 10% 10%;
    content: "";
}
.schedule .wrapper {
    position: relative;
}
.schedule h2 {
    font-size: 33px;
    font-weight: 700;
    padding-top: 60px;
    padding-left: 20px;
    position: relative;
}
.schedule .more {
    float: right;
    margin-top: 20px;
    transition-duration: 100ms;
    transition-timing-function: ease-in-out;
    position: relative;
}
.schedule .more a {
    display: inline-block;
    padding: 7px 30px 5px 5px;
}
.schedule .more a::before {
    position: absolute;
    right: 0;
    top: 8px;
    width: 13px;
    height: 13px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75 7.24998H0.75C0.5375 7.24998 0.359375 7.17808 0.215625 7.03428C0.071875 6.89046 0 6.71226 0 6.49967C0 6.28707 0.071875 6.10898 0.215625 5.9654C0.359375 5.82181 0.5375 5.75002 0.75 5.75002H5.75V0.750003C5.75 0.537502 5.8219 0.359376 5.9657 0.215626C6.10952 0.0718753 6.28772 0 6.5003 0C6.7129 0 6.89099 0.0718753 7.03457 0.215626C7.17816 0.359376 7.24995 0.537502 7.24995 0.750003V5.75002H12.25C12.4625 5.75002 12.6406 5.82192 12.7843 5.96572C12.9281 6.10954 13 6.28774 13 6.50032C13 6.71293 12.9281 6.89102 12.7843 7.0346C12.6406 7.17819 12.4625 7.24998 12.25 7.24998H7.24995V12.25C7.24995 12.4625 7.17805 12.6406 7.03425 12.7844C6.89043 12.9281 6.71223 13 6.49965 13C6.28705 13 6.10896 12.9281 5.96537 12.7844C5.82179 12.6406 5.75 12.4625 5.75 12.25V7.24998Z' fill='%23666666'/%3E%3C/svg%3E%0A");
    content: "";
    transition-duration: 300ms;
    transition-timing-function: ease-in-out;
}
.schedule .more a:hover:before {
    transform: rotate(180deg);
}
.schedule .more a:hover:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #CFCFCF;
    content: "";
}
.schedule .swiper_wrap {
    margin: 85px 50px 50px 50px;
}
.schedule .swiper_wrap .swiper {
    position: relative;
}
.schedule .swiper_wrap .swiper ul li {
    position: relative;
    padding: 30px 0;
}
.schedule .swiper_wrap .swiper ul li::before {
    position: absolute;
    left: 47%;
    bottom: 0;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    content: "";
}
.schedule .swiper_wrap .swiper ul li.green::before {
background-color: #4BBF6B;
}
.schedule .swiper_wrap .swiper ul li.blue::before  {
    background-color: #2CA5DF;
}
.schedule .swiper_wrap .swiper ul li.yellow::before {
    background-color: #FDD02B;
}
.schedule .swiper_wrap .swiper ul li a {
    display: block;
    text-align: center;
    font-size: 23px;
    font-weight: 500;
}
.schedule .swiper_wrap .swiper ul li a:hover {
    transform: scale3d(1.1, 1.1, 1);
    font-weight: 700;
}
.schedule .swiper_wrap .swiper ul li a span {
    position: relative;
    display: block;
    margin-bottom: 30px;
}
.schedule .swiper_wrap .swiper ul li a span::before {
    position: absolute;
    left: 25%;
    top: 43px;
    width: calc(100% - 50%);
    height: 1px;
    background-color: #CFCFCF;
    content: "";
}
.schedule .swiper_wrap .swiper ul li a span.sat {
    color: #4267B2;
}
.schedule .swiper_wrap .swiper ul li a span.sun {
    color: #D3344C;
}
.schedule .prev,
.schedule .next {
    position: absolute;
    top: 238px;
    width: 44px;
    height: 44px;
    background-color: #F4F8FA;
    border-radius: 100%;
    box-shadow: 0 0 7px rgba(0, 0, 0, 0.12);
    font-size: 0;
    line-height: 0;
    content: "";
}
.schedule .next {
    right: 0;
}
.schedule .prev {
    left: -0;
}
.schedule .prev:hover,
.schedule .next:hover {
    background-color: #37a9e18c;
}
.schedule .prev::before,
.schedule .next::before {
    position: absolute;
    top: 16px;
    width: 7px;
    height: 11px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
}
.schedule .prev::before {
    left: 17px;
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='11' viewBox='0 0 7 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.7096 5.34422L6.78267 1.27112C6.92114 1.13267 6.99197 0.958642 6.99517 0.749025C6.99839 0.539425 6.92756 0.362192 6.78267 0.217325C6.63781 0.0724415 6.46217 0 6.25577 0C6.04937 0 5.87374 0.0724415 5.72887 0.217325L1.23465 4.71155C1.14105 4.80513 1.07502 4.90385 1.03657 5.0077C0.998108 5.11153 0.978875 5.22371 0.978875 5.34422C0.978875 5.46474 0.998108 5.57692 1.03657 5.68075C1.07502 5.7846 1.14105 5.88332 1.23465 5.9769L5.72887 10.4711C5.86732 10.6096 6.04136 10.6804 6.25098 10.6836C6.46058 10.6868 6.63781 10.616 6.78267 10.4711C6.92756 10.3263 7 10.1506 7 9.94422C7 9.73782 6.92756 9.56219 6.78267 9.41732L2.7096 5.34422Z' fill='%23555555'/%3E%3C/svg%3E%0A");
}
.schedule .next::before {
    right: 17px;
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='11' viewBox='0 0 7 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.2904 5.65578L0.217325 9.72888C0.0788588 9.86733 0.00802551 10.0414 0.00482553 10.251C0.00160888 10.4606 0.0724422 10.6378 0.217326 10.7827C0.362192 10.9276 0.537825 11 0.744225 11C0.950625 11 1.12626 10.9276 1.27113 10.7827L5.76535 6.28845C5.85895 6.19487 5.92497 6.09615 5.96343 5.9923C6.00189 5.88847 6.02112 5.77629 6.02112 5.65578C6.02112 5.53526 6.00189 5.42308 5.96343 5.31925C5.92497 5.2154 5.85895 5.11668 5.76535 5.0231L1.27112 0.528875C1.13267 0.390408 0.958641 0.319575 0.749024 0.316376C0.539424 0.313159 0.362191 0.383992 0.217325 0.528875C0.0724414 0.673742 -8.87396e-07 0.849376 -8.69352e-07 1.05578C-8.51308e-07 1.26218 0.0724414 1.43781 0.217325 1.58267L4.2904 5.65578Z' fill='%23555555'/%3E%3C/svg%3E%0A");
}
.schedule .prev:hover:before {
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='11' viewBox='0 0 7 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.7096 5.34422L6.78267 1.27112C6.92114 1.13267 6.99197 0.958642 6.99517 0.749025C6.99839 0.539425 6.92756 0.362192 6.78267 0.217325C6.63781 0.0724415 6.46217 0 6.25577 0C6.04937 0 5.87374 0.0724415 5.72887 0.217325L1.23465 4.71155C1.14105 4.80513 1.07502 4.90385 1.03657 5.0077C0.998108 5.11153 0.978875 5.22371 0.978875 5.34422C0.978875 5.46474 0.998108 5.57692 1.03657 5.68075C1.07502 5.7846 1.14105 5.88332 1.23465 5.9769L5.72887 10.4711C5.86732 10.6096 6.04136 10.6804 6.25098 10.6836C6.46058 10.6868 6.63781 10.616 6.78267 10.4711C6.92756 10.3263 7 10.1506 7 9.94422C7 9.73782 6.92756 9.56219 6.78267 9.41732L2.7096 5.34422Z' fill='white'/%3E%3C/svg%3E%0A");
}
.schedule .next:hover:before {
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='11' viewBox='0 0 7 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.2904 5.65577L0.217325 9.72888C0.0788588 9.86733 0.00802551 10.0414 0.00482553 10.251C0.00160888 10.4606 0.0724422 10.6378 0.217326 10.7827C0.362192 10.9276 0.537825 11 0.744225 11C0.950625 11 1.12626 10.9276 1.27113 10.7827L5.76535 6.28845C5.85895 6.19487 5.92498 6.09615 5.96343 5.9923C6.00189 5.88847 6.02112 5.77629 6.02112 5.65577C6.02112 5.53526 6.00189 5.42308 5.96343 5.31925C5.92498 5.2154 5.85895 5.11668 5.76535 5.0231L1.27112 0.528875C1.13267 0.390409 0.958641 0.319575 0.749024 0.316376C0.539424 0.313159 0.362191 0.383992 0.217325 0.528876C0.0724414 0.673742 -8.87396e-07 0.849375 -8.69352e-07 1.05578C-8.51308e-07 1.26218 0.0724414 1.43781 0.217325 1.58268L4.2904 5.65577Z' fill='white'/%3E%3C/svg%3E%0A");
}
.schedule .today {
    background-color: #FFF;
    width: 57%;
    height: 165px;
    border-radius: 37px;
    text-align: center;
    color: #777;
    margin: 0 auto;
    padding: 20px 60px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.schedule .today h3 {
    font-size: 45px;
}
.schedule .today strong {
    text-align: left;
    line-height: 2;
    font-size: 17px;
    display: block;
    position: relative;
}
.schedule .today strong::before {
    position: absolute;
    left: -18px;
    top: 15px;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    background-color: #4BBF6B;
    content: "";
}
.schedule .side {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}
.schedule .side span {
    display: block;
    padding: 10px;
    margin: 0 20px;
    position: relative;
}
.schedule .side span::before {
    position: absolute;
    left: -6px;
    top: 15px;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    content: "";
}
.schedule .side span.green::before {
    background-color: #4BBF6B;
}
.schedule .side span.blue::before {
    background-color: #2CA5DF;
}
.schedule .side span.yellow::before {
    background-color: #FDD02B;
}
@media screen and (max-width:1280px) {
    .schedule h2 {
        font-size: 30px;
    }
    .schedule .today h3 {
        font-size: 40px;
    }
}
@media screen and (max-width:1024px) {
    .schedule h2 {
        font-size: 28px;
    }
    .schedule .side span {
        margin: 0 10px;
    }
    .schedule .swiper_wrap .swiper ul li a {
        font-size: 20px;
    }
    .schedule .swiper_wrap {
        margin: 85px 70px 50px 70px;
    }

}
@media screen and (max-width:768px) {
    .schedule h2 {
        font-size: 25px;
    }
    .schedule .today h3 {
        font-size: 25px;
    }
    .schedule .swiper_wrap .swiper ul li a {
        font-size: 18px;
    }
    .schedule .more {
        float: right;
        margin-top: auto;
        line-height: 0;
        font-size: 0;
    }
    .schedule .more a {
        padding: 18px;
        border-radius: 100%;
        border: 1px solid #CFCFCF;
    }
    .schedule .more a::before {
        right: 14px;
        top: 14px;
        width: 10px;
        height: 10px;
    }
    .schedule .more a:hover:after {
        display: none;
    }
    .schedule .today strong {
        line-height: 1.4;
        font-size: 15px;
        margin-left: 7px;
    }
    .schedule .today {
        width: 90%;
        height: 144px;
        padding: 20px 0;
        border-radius: 19px;
        display: flex;
        align-content: center;
        flex-direction: column;
    }
    .schedule .today strong::before {
        left: -10px;
        top: 7px;
        width: 5px;
        height: 5px;
    }
}
@media screen and (max-width:450px) {
    .schedule h2 {
        font-size: 19px;
        font-weight: 700;
        padding-top: 0;
    }
    .schedule .swiper_wrap .swiper ul li a {
        font-size: 15px;
    }
    .schedule .swiper_wrap {
        margin: 60px 30px;
    }
    .schedule .swiper_wrap .swiper ul li::before {
        left: 15px;
        width: 5px;
        height: 5px;
    }
    .schedule .prev, .schedule .next {
        top: 143px;
        width: 27px;
        height: 27px;
    }
    .schedule .prev::before, .schedule .next::before {
        top: 10px;
        width: 6px;
        height: 10px;
    }
    .schedule .prev::before {
        left: 9px;
    }
    .schedule .next::before {
        right: 10px;
    }
    
    .schedule .side span {
        padding: 7px;
        margin: 0 5px;
    }
    .schedule .side span::before {
        left: -4px;
        top: 13px;
        width: 5px;
        height: 5px;
    }
}

.data {
    width: 100%;
    height: 770px;
    background-color: #fbfbfb;
    padding: 70px 0;
    margin-top: 100px;

}
.data .wrapper {
    position: relative;
}
.data h2 {
    font-size: 33px;
    font-weight: 700;
    padding-left: 20px;
}
.data .more {
    position: absolute;
    right: 0;
    top: 57px;
    content: "";
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.data .more a {
    display: inline-block;
    padding: 7px 30px 5px 5px;
}
.data .more a::before {
    position: absolute;
    right: 0;
    top: 10px;
    width: 13px;
    height: 13px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75 7.24998H0.75C0.5375 7.24998 0.359375 7.17808 0.215625 7.03428C0.071875 6.89046 0 6.71226 0 6.49967C0 6.28707 0.071875 6.10898 0.215625 5.9654C0.359375 5.82181 0.5375 5.75002 0.75 5.75002H5.75V0.750003C5.75 0.537502 5.8219 0.359376 5.9657 0.215626C6.10952 0.0718753 6.28772 0 6.5003 0C6.7129 0 6.89099 0.0718753 7.03457 0.215626C7.17816 0.359376 7.24995 0.537502 7.24995 0.750003V5.75002H12.25C12.4625 5.75002 12.6406 5.82192 12.7843 5.96572C12.9281 6.10954 13 6.28774 13 6.50032C13 6.71293 12.9281 6.89102 12.7843 7.0346C12.6406 7.17819 12.4625 7.24998 12.25 7.24998H7.24995V12.25C7.24995 12.4625 7.17805 12.6406 7.03425 12.7844C6.89043 12.9281 6.71223 13 6.49965 13C6.28705 13 6.10896 12.9281 5.96537 12.7844C5.82179 12.6406 5.75 12.4625 5.75 12.25V7.24998Z' fill='%23666666'/%3E%3C/svg%3E%0A");
    content: "";
    transition-duration: 300ms;
    transition-timing-function: ease-in-out;
}
.data .more a:hover:before {
    transform: rotate(180deg);
}
.data .more a:hover:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #CFCFCF;
    content: "";
}
.data .data_inner {
    margin-top: 77px;
}
.data .data_inner ul {
    display: flex;
    justify-content: space-between;
}
.data .data_inner ul li {
    width: calc(25% - 14px)
}
.data .data_inner ul li a {
    display: block;
    text-align: center;
}
.data .data_inner ul li a .photo {
    background-color: #e8ebef;;
    height: 380px;
    border-radius: 20px;
    position: relative;
}
.data .data_inner ul li a span {
    position: absolute;
    left: 0;
    top: 0;
    width: 139px;
    height: 46px;
    background-color: #6394d3;
    color: #FFF;
    border-radius: 20px 0 20px 0;
    line-height: 46px;
}
.data .data_inner ul li a span.green {
    background-color: #59a78c;
}
.data .data_inner ul li a img {
    position: absolute;
    left: 50%;
    top: 51%;
    width: 49%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    transition-duration: 300ms;
    transition-timing-function: ease-in-out;
}
.data .data_inner ul li a:hover img {
    transform: translate(-50%, -50%) scale3d(1.15, 1.15, 1);
}
.data .data_inner ul li a p {
    margin-top: 10px;
    font-weight: 500;
}
@media screen and (max-width:1280px) {
    .data .data_inner ul li a .photo {
        height: 360px;
    }
    .data h2 {
        font-size: 30px;
    }
}
@media screen and (max-width:1024px) {
    .data h2 {
        font-size: 28px;
    }
    .data {
        height: 660px;
    }
    .data .data_inner ul li a .photo {
        height: 285px;
    }
} 
@media screen and (max-width:768px) {
    .data {
        height: 560px;
    }
    .data h2 {
        font-size: 25px;
    }
    .data .data_inner ul li:last-child {
        display: none;
    }
    .data .data_inner ul li {
        width: calc(33.3% - 15px);
    }
    .data .data_inner ul li a .photo {
        height: 200px;
    }
    .data .data_inner ul li a span {
        width: 100px;
        height: 29px;
        line-height: 29px;
        font-size: 11px;
    }
    .data .more a:hover:after {
        display: none;
    }
    .data .more a {
        padding: 18px;
        border: 1px solid #CFCFCF;
        border-radius: 100%;
        line-height: 0;
        font-size: 0;
    }
    .data .more a::before {
        right: 13px;
        top: 14px;
        width: 10px;
        height: 10px;
    }
} 
@media screen and (max-width:450px) {
    .data h2 {
        font-size: 19px;
    }
    .data {
        margin-top: 60px;
        height: 584px;
    }
    .data .data_inner ul li:nth-child(3) {
        display: none;
    }
    .data .data_inner ul li {
        width: calc(50% - 10px);
    }
    .data .data_inner ul li a .photo {
        height: 222px;
    }
    .data .data_inner ul li a span {
        width: 108px;
        height: 40px;
        line-height: 40px;
    }
    .data .data_inner ul li a img {
        width: 53%;
    }
}