body {
    background: #fff;
}

/*-----inner Menu-----*/
.tabWrap {
    width: 100%;
    max-width: 1200px;
    display: grid;
    gap: 20px;
}

.tab2 {
    grid-template-columns: repeat(2, 1fr);
}

.tab3 {
    grid-template-columns: repeat(3, 1fr);
}

@media only screen and (max-width: 768px) {

    .tab2,
    .tab3 {
        grid-template-columns: 1fr;
    }
}

.tabWrap .imgGrid {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #ec1c23;
    border-radius: 0 40px 40px 40px;
    overflow: hidden;
    position: relative;
    transition: width, display 1s ease;
    height: auto;
}

.tabWrap .imgGrid:hover {
    box-shadow: 0 0 10px #00000080;
}

.tabWrap .imgGrid .imgContainer {
    background-color: #ec1c23;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.tabWrap .imgGrid img {
    width: 100%;
    height: auto;
    padding: 20px;
    max-width: 500px;
}

.tabWrap .imgGrid h2 {
    width: 100%;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #fff;
    background-color: #ec1c23;
    flex: 1;
}

/*-----other page-----*/
.otherPage {
    border-top: 5px solid #e7e7e7;
}

.footer {
    border-top: 1px solid #e7e7e7;
}

.contentWrap {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

@media only screen and (max-width: 1024px) {
    .contentWrap {
        gap: 30px;
    }
}

.contentWrap .title {
    padding-bottom: 50px;
}

.greyWrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 40px;
}

.greyWrap .bgGrey {
    position: relative;
    margin-top: -15px;
    left: 0;
    width: 100%;
    height: 100%;
    margin-bottom: -50px;
}

@media only screen and (max-width: 1024px) {
    .greyWrap .bgGrey {
        margin-top: -30px;
    }
}

.greyWrap .bgGrey h1 {
    left: 50%;
    width: calc(100% - 60px);
    max-width: 1260px;
    padding: 40px 40px 0px;
    transform: translateX(-50%);
    position: relative;
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .greyWrap .bgGrey h1 {
        padding: 30px 30px 0;
    }
}

@media only screen and (max-width: 768px) {
    .greyWrap .bgGrey h1 {
        width: calc(100% - 40px);
        padding: 10px 10px 0;
    }
}

.greyWrap .bgGrey>div:first-child,
.greyWrap>.bgGrey>h1:first-child,
.greyWrap .bgGrey>p:first-child {
    padding-top: 85px;
}

@media only screen and (max-width: 1024px) {

    .greyWrap .bgGrey>div:first-child,
    .greyWrap .bgGrey>p:first-child {
        padding-top: 65px;
    }
}

@media only screen and (max-width: 768px) {

    .greyWrap .bgGrey>div:first-child,
    .greyWrap .bgGrey>p:first-child {
        padding-top: 45px;
    }
}

.greyWrap .bgGrey>.bgGreyRedLine {
    top: 0;
    width: 50%;
    position: absolute;
    margin-top: 40px;
    border-top: 5px solid #ec1c23;
    z-index: 10;
}

@media only screen and (max-width: 1024px) {
    .greyWrap .bgGrey>.bgGreyRedLine {
        margin-top: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .greyWrap .bgGrey>.bgGreyRedLine {
        margin-top: 20px;
    }
}

.greyWrap .bgGrey::before {
    top: 40px;
    left: 50%;
    width: calc(100% - 160px);
    max-width: 1260px;
    position: absolute;
    content: '';
    border-top: 5px solid #ec1c23;
    transform: translateX(-50%);
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .greyWrap .bgGrey::before {
        top: 30px;
        width: calc(100% - 120px);
    }
}

@media only screen and (max-width: 768px) {
    .greyWrap .bgGrey::before {
        top: 20px;
        width: calc(100% - 60px);
    }
}

.greyWrap .bgGrey::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: calc(100% - 60px);
    max-width: 1260px;
    height: calc(100% - 50px);
    background-color: #f0f0f0;
    transform: translateX(-50%);
    border-radius: 0 0 50px 0;
    z-index: 0;
}

@media only screen and (max-width: 768px) {
    .greyWrap .bgGrey::after {
        width: calc(100% - 20px);
        height: calc(100% - 20px);
    }
}

.bgGreyRedLine .greyWrap>h1 {
    width: 100%;
    font-size: 30px;
    text-align: left;
    z-index: 1;
}

.greyWrap>.bgGrey>p,
.greyWrap>.bgGrey ul,
.greyWrap>.bgGrey>ol,
.greyWrap>.bgGrey .longImg {
    position: relative;
    left: 50%;
    width: calc(100% - 60px);
    max-width: 1260px;
    padding: 40px 40px 80px;
    transform: translateX(-50%);
    z-index: 1;
}

.greyWrap>.bgGrey>ol,
.greyWrap>.bgGrey ul,
.greyWrap>.bgGrey>ol li,
.greyWrap>.bgGrey ul li,
.greyWrap>.bgGrey>ol li::before {
    margin: 0;
    color: #000;
    font-weight: 400;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    letter-spacing: 0.7px;
    text-decoration: none;
    line-height: 2;
    letter-spacing: 0.7px;
    font-size: 19px;
}

.greyWrap>.bgGrey>ol {
    margin-top: -40px;
    padding: 0 40px;
}

@media only screen and (max-width: 1024px) {
    .greyWrap>.bgGrey>p {
        padding: 30px 30px 80px;
    }

    .greyWrap>.bgGrey>ol li {
        font-size: 16px;
        padding: 0 30px;
    }

    .greyWrap>.bgGrey>ol li:before {
        left: -10px;
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {

    .greyWrap>.bgGrey>p,
    .greyWrap>.bgGrey .longImg {
        width: calc(100% - 40px);
        padding: 10px 10px 40px;
    }

    .greyWrap>.bgGrey>ol,
    .greyWrap>.bgGrey>ol li {
        padding: 10px 10px;
    }
}

.greyWrap:has(.bgGrey>p),
.greyWrap:has(.bgGrey>ol),
.greyWrap:has(.bgGrey>.heroImg),
.greyWrap:has(.bgGrey>.imgGallery2),
.greyWrap:has(.bgGrey>.imgGalleryAlt),
.greyWrap:has(.bgGrey>.longImg),
.greyWrap:has(.bgGrey>.imgGallery5) {
    margin-bottom: 50px;
}

.greyWrap .bgGrey:has(> p:last-child) {
    margin-bottom: -60px;
}

.greyWrap>.bgGrey>.heroImg:last-child,
.greyWrap>.bgGrey>.imgGallery2:last-child,
.greyWrap>.bgGrey>.imgGalleryAlt:last-child,
.greyWrap>.bgGrey>.longImg:last-child,
.greyWrap>.bgGrey>.imgGallery5:last-child {
    margin-top: -50px;
}

@media only screen and (max-width: 768px) {

    .greyWrap>.bgGrey>.heroImg:last-child,
    .greyWrap>.bgGrey>.imgGallery2:last-child,
    .greyWrap>.bgGrey>.imgGalleryAlt:last-child,
    .greyWrap>.bgGrey>.longImg:last-child,
    .greyWrap>.bgGrey>.imgGallery5:last-child {
        margin-top: -30px;
    }
}

.greyWrap>.bgGrey.textonly {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.greyWrap>.bgGrey.textonly * {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.greyWrap>.bgGrey.textonly .bgGreyRedLine {
    margin-top: 40px;
}

.greyWrap>.bgGrey.textonly>.ulGrid>ul:last-child,
.greyWrap>.bgGrey.textonly>p:last-child {
    margin-bottom: 0;
    padding-bottom: 40px;
}

@media only screen and (max-width:1024px) {
    .greyWrap>.bgGrey.textonly .bgGreyRedLine {
        margin-top: 30px;
    }

    .greyWrap>.bgGrey.textonly>.ulGrid>ul:last-child,
    .greyWrap>.bgGrey.textonly>p:last-child {
        padding-bottom: 30px;
    }
}

@media only screen and (max-width:768px) {
    .greyWrap>.bgGrey.textonly .bgGreyRedLine {
        margin-top: 20px;
    }

    .greyWrap>.bgGrey.textonly>.ulGrid>ul:last-child,
    .greyWrap>.bgGrey.textonly>p:last-child {
        padding-bottom: 10px;
    }
}

.greyWrap .bgGrey.textonly::after {
    height: 100%;
}

.greyWrap .bgGrey.textonly .ulGrid {
    width: 100%;
    max-width: 1260px;
    padding: 0 40px 0 80px;
    display: flex;
    justify-content: flex-end;
    align-self: center;
}

.greyWrap .bgGrey.textonly .ulGrid ul {
    width: 100%;
    max-width: 1100px;
    padding: 0;
    transform: none;
    left: unset;
}

.subWrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 40px;
}

.subWrap.textonly {
    gap: 30px;
}

@media only screen and (max-width: 1024px) {
    .subWrap {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {

    .subWrap,
    .subWrap.textonly {
        gap: 20px;
    }
}

.subWrap h1 {
    position: relative;
    width: 100%;
    margin-bottom: 5px;
    padding: 0px 20px 20px 0;
    font-size: 25px;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    font-style: italic;
    text-align: left;
}

.subWrap h1:first-child::before {
    content: '';
    position: absolute;
    width: calc(100% - 120px);
    max-width: 1260px;
    top: 100%;
    width: 50%;
    position: absolute;
    border-top: 5px solid #ec1c23;
    z-index: 10;
}

.subWrap h1:first-child:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    width: calc(100% - 160px);
    max-width: 1260px;
    border-bottom: 5px solid #ec1c23;
    transform: translateX(-50%);
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .subWrap h1:after {
        width: calc(100% - 120px);
    }
}

@media only screen and (max-width: 768px) {
    .subWrap h1:after {
        width: calc(100% - 60px);
    }
}

.subWrap p {
    position: relative;
    width: 100%;
}

.pointWrap {
    width: 100%;
    padding-left: 75px;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    gap: 60px;
}

@media only screen and (max-width:1024px) {
    .pointWrap {
        padding-left: 45px;
    }
}

@media only screen and (max-width:768px) {
    .pointWrap {
        gap: 30px;
    }
}

.pointWrap>li {
    list-style-type: none;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    font-weight: bold;
    font-size: 40px;
    counter-increment: list-counter;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

@media only screen and (max-width:1024px) {
    .pointWrap>li {
        font-size: 24px;
        gap: 30px;
    }
}

@media only screen and (max-width:768px) {
    .pointWrap>li {
        gap: 20px;
    }
}

.pointWrap>li::marker {
    display: none;
}

.pointWrap>li:before {
    content: "(" counter(list-counter) ")";
    position: absolute;
    top: 0;
    left: -70px;
    color: #ec1c23;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    font-weight: bold;
    font-size: 40px;
}

@media only screen and (max-width:1024px) {
    .pointWrap>li:before {
        left: -40px;
        font-size: 26px;
    }
}

.pointWrap>li>.subWrap.textonly>h1 {
    font-style: inherit;
}

.pointWrap>li>.subWrap.textonly>h1:not(:first-child) {
    margin-top: 30px;
    padding: 20px 0 0 0;
}

.pointWrap>li>.subWrap.textonly> :nth-child(2) {
    margin-top: 0 !important;
    padding: 0 !important;
}

.pointWrap>li>.subWrap.textonly>ul {
    padding-left: 22px;
}

.pointWrap>li>.subWrap.textonly>ul>li {
    list-style-type: disc;
    position: inherit;
    display: list-item;
    gap: 40px;
    margin: 0;
    color: #000;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    font-weight: 400;
    letter-spacing: 0.7px;
    text-decoration: none;
    line-height: 2;
    letter-spacing: 0.7px;
    font-size: 19px;
}

@media only screen and (max-width:1024px) {
    .pointWrap>li>.subWrap.textonly>ul>li {
        font-size: 16px;
        gap: 30px;
    }
}

@media only screen and (max-width:768px) {
    .pointWrap>li>.subWrap.textonly>ul>li {
        gap: 20px;
    }
}

.pointWrap>li>.subWrap.textonly>ul>li::marker {
    display: inherit;
}

.pointWrap>li>.subWrap.textonly>ul>li::before {
    list-style-type: disc;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    font-weight: bold;
    font-size: 19px;
    position: inherit;
    display: inherit;
    gap: inherit;
}

.pointWrap>li>.subWrap.textonly>.tableGrid {
    display: flex;
    gap: 30px;
}

@media only screen and (max-width: 1200px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid:has(.t3) {
        flex-direction: column;
    }
}

@media only screen and (max-width: 1024px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid {
        flex-direction: column;
    }
}

@media only screen and (max-width: 1024px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

.pointWrap>li>.subWrap.textonly>.tableGrid h1 {
    font-style: inherit;
}


.pointWrap>li>.subWrap.textonly>.tableGrid>.tableText {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 150px 310px;
    gap: 5px;
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table.t3 {
    grid-template-columns: 200px auto auto;
    min-width: 780px;
    overflow: hidden;
}

@media only screen and (max-width: 1024px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid>.table {
        width: unset;
        grid-template-columns: 150px auto;
    }

    .pointWrap>li>.subWrap.textonly>.tableGrid>.table.t3 {
        grid-template-columns: 150px auto auto;
        min-width: unset;
        overflow-x: auto;
    }
}

@media only screen and (max-width: 768px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid>.table.t3 {
        grid-template-columns: auto auto auto;
    }
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table * {
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: #fef7f8;
}

@media only screen and (max-width: 768px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid>.table>.list {
        gap: 10px;
    }
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table>.list>p {
    padding: 0;
}

@media only screen and (max-width: 768px) {

    .pointWrap>li>.subWrap.textonly>.tableGrid>.table p,
    .pointWrap>li>.subWrap.textonly>.tableGrid>.table>.list>p {
        font-size: 12px;
        line-height: 1.5;
    }
}

.pointWrap>li>.subWrap.textonly>.tableGrid h1:before,
.pointWrap>li>.subWrap.textonly>.tableGrid h1:after {
    display: none;
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table>h1 {
    margin: 0;
}

@media only screen and (max-width: 768px) {
    .pointWrap>li>.subWrap.textonly>.tableGrid>.table>h1 {
        font-size: 16px;
    }
}

.pointWrap>li>.subWrap.textonly>.tableGrid>.table>.chairman {
    background-color: #fdebec;
}


.swiper {
    width: 100%;
}

.hiddenImg {
    display: none;
}

.swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    height: auto !important;
}

.swiper-slide img {
    width: auto;
    height: 100%;
    display: block;
    border-radius: 0 40px 40px 40px;
    border: 1px solid #e7e7e7;
}

@media only screen and (max-width: 1024px) {
    .swiper-slide img {
        border-radius: 0 30px 30px 30px;
    }
}

@media only screen and (max-width: 768px) {
    .swiper-slide img {
        border-radius: 0 20px 20px 20px;
    }
}

.swiper-button-next,
.swiper-button-prev {
    color: #ec1c23;
}

.swiper-slide img {
    width: 100%;
    height: auto;
}

.fancybox__content {
    width: 100%;
    height: 100%;
}

.swiper-button-next,
.swiper-button-prev {
    z-index: 10;
}

@media only screen and (max-width: 768px) {

    .swiper-button-next,
    .swiper-rtl .swiper-button-prev {
        right: 3px;
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
        left: 3px;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after {
        font-size: 25px;
    }
}

.swiper-button-lock {
    display: flex;
}

/*-----heroImg-----*/

.heroImg {
    width: 100%;
    display: grid;
    justify-content: end;
}

.heroImg>a,
.heroImg>.swiper {
    width: 100%;
    max-width: 1000px;
    overflow: hidden;
    z-index: 1;
}

.heroImg>a>img {
    width: 100%;
    border-radius: 0 70px 70px 70px;
    border: 1px solid #e7e7e7;
}

@media only screen and (max-width: 768px) {
    .heroImg>a>img {
        border-radius: 0 20px 20px 20px;
    }
}


/*-----imgGallery2-----*/
.imgGallery2 {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
    gap: 40px;
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .imgGallery2 {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGallery2 {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

/*-----imgGallery3-----*/

.imgGallery3 {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .imgGallery3 {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGallery3 {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

.imgGallery3 .imgContainer {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.imgGallery3 img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    z-index: 1;
    border-radius: 0 40px 40px 40px;
    border: 1px solid #e7e7e7;
    overflow: hidden;
}

@media only screen and (max-width: 1024px) {
    .imgGallery3 img {
        border-radius: 0 30px 30px 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGallery3 img {
        border-radius: 0 20px 20px 20px;
    }
}

.imgContainer.filterAdd>a {
    position: relative;
    overflow: hidden;
}

.imgContainer.filterAdd>a:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 0 40px 40px 40px;
    background-color: #e7e7e780;
    z-index: 10;
    box-sizing: border-box;
}

@media only screen and (max-width: 1024px) {
    .imgContainer.filterAdd>a:before {
        border-radius: 0 30px 30px 30px;
    }
}

.imgContainer.filterAdd>a:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    width: 100px;
    height: 100px;
    transform: translate(-50%, -50%);
    background-image: url(../../assets/images/add.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    z-index: 200;
    box-sizing: border-box;
}

@media only screen and (max-width: 768px) {

    .imgGallery3>.imgContainer.filterAdd,
    .imgGallery3>.imgContainer:nth-child(3):not(.hiddenImg) {
        display: none;
    }

    .imgGallery3>.imgContainer:nth-of-type(2) a {
        position: relative;
        overflow: hidden;
    }

    .imgGallery3>.imgContainer:nth-of-type(2):not(.hiddenImg)>a:before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius: 0 20px 20px 20px;
        background-color: #e7e7e780;
        z-index: 10;
        box-sizing: border-box;
    }

    .imgGallery3>.imgContainer:nth-of-type(2):not(.hiddenImg)>a:after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        color: #fff;
        width: 100px;
        height: 100px;
        transform: translate(-50%, -50%);
        background-image: url(../../assets/images/add.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        z-index: 200;
        box-sizing: border-box;
    }
}

/*-----longImg-----*/

.longImg {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 3.5fr;
    gap: 40px;
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .longImg {
        gap: 20px;
        grid-template-columns: 1fr 2fr;
    }
}

@media only screen and (max-width: 768px) {
    .longImg {
        grid-template-columns: 1fr 1fr;
    }
}

.longImg .longImgContainer {
    width: 100%;
    align-self: start;
    position: relative;
    border: none;
}

.longImg .longImgContainer .swiper {
    height: 100%;
    border: none;
    width: 100%;
}

.longImg .longImgContainer .swiper .swiper-wrapper .swiper-slide {
    align-self: center;
    border: none;
    width: 100% !important;
}

.longImg .longImgContainer .swiper .swiper-wrapper .swiper-slide a {
    height: 100%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.longImg .longImgContainer .swiper .swiper-wrapper .swiper-slide>a>img {
    width: 100%;
    object-fit: contain;
    object-position: center;
    border: none;
    border-radius: 0 40px 40px 40px;
    border: 1px solid #e7e7e7;
    overflow: hidden;
}

@media only screen and (max-width: 1024px) {
    .longImg .longImgContainer .swiper .swiper-wrapper .swiper-slide>a>img {
        border-radius: 0 30px 30px 30px;
    }
}

@media only screen and (max-width: 768px) {
    .longImg .longImgContainer .swiper .swiper-wrapper .swiper-slide>a>img {
        border-radius: 0 20px 20px 20px;
    }
}

.longImg:nth-child(even) {
    grid-template-columns: 3.5fr 1fr;
}

@media only screen and (max-width: 1024px) {
    .longImg:nth-child(even) {
        grid-template-columns: 2fr 1fr;
    }
}

@media only screen and (max-width: 768px) {
    .longImg:nth-child(even) {
        grid-template-columns: 1fr 1fr;
    }
}

.longImg:nth-child(even) .longImgContainer {
    order: 2;
}

/*-----imgGallery5-----*/
.imgGallery5 {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1.13fr 1fr 1fr;
    gap: 40px;
}

@media only screen and (max-width: 1024px) {
    .imgGallery5 {
        grid-template-columns: repeat(4, auto);
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGallery5 {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

.imgGallery5 .imgContainer {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}

.imgGallery5 .imgContainer:first-child {
    width: 100%;
    grid-area: 1 / 1 / span 2 / span 2
}

.imgGallery5 img {
    width: 100%;
    border-radius: 0 40px 40px 40px;
    border: 1px solid #e7e7e7;
}

@media only screen and (max-width: 1024px) {
    .imgGallery5 img {
        border-radius: 0 30px 30px 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGallery5 img {
        border-radius: 0 20px 20px 20px;
    }
}

/*-----imgAlterGrid-----*/
.imgGalleryAlt {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

@media only screen and (max-width: 1024px) {
    .imgGalleryAlt {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGalleryAlt {
        gap: 20px;
    }
}

.imgGalleryAlt>.AlterGrid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
    gap: 40px;
    z-index: 1;
}

@media only screen and (max-width: 1024px) {
    .imgGalleryAlt>.AlterGrid {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGalleryAlt>.AlterGrid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

.imgGalleryAlt>.AlterGrid>.imgContainer {
    width: 100%;
}


.imgGalleryAlt>.AlterGrid>.imgAlterGridText {
    display: flex;
    flex-direction: column;
    gap: 40px
}

@media only screen and (max-width: 1024px) {
    .imgGalleryAlt>.AlterGrid>.imgAlterGridText {
        gap: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .imgGalleryAlt>.AlterGrid>.imgAlterGridText {
        gap: 20px;
    }
}

.imgGalleryAlt>.AlterGrid:nth-child(odd)>.imgContainer,
.imgGalleryAlt>.AlterGrid:nth-child(even)>.imgAlterGridText {
    order: 1;
}

.imgGalleryAlt>.AlterGrid:nth-child(odd)>.imgAlterGridText,
.imgGalleryAlt>.AlterGrid:nth-child(even)>.imgContainer {
    order: 2;
}

@media only screen and (max-width: 768px) {
    .imgGalleryAlt>.AlterGrid:nth-child(even)>.imgAlterGridText {
        order: 2;
    }

    .imgGalleryAlt>.AlterGrid:nth-child(even)>.imgContainer {
        order: 1;
    }
}

/*-----imgChart-----*/
.Imgchart {
    width: 100%;
    display: flex;
    align-items: center;
}

.Imgchart>.imgContainer {
    width: 100%;
    max-width: 1000px;
    display: flex;
}

.Imgchart>.imgContainer a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.imgContainer>.swiper-wrapper>.swiper-slide a {
    width: 100%;
}

.contentWrap img {
    width: 100%;
    object-fit: contain;
    display: flex;
    object-position: center;
    z-index: 1;
}

.contentWrap a:hover {
    color: #ec1c23;
}

.video {
    position: relative;
}

.video:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    width: 100px;
    height: 100px;
    transform: translate(-50%, -50%);
    background-image: url(../../assets/images/play.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    z-index: 200;
    box-sizing: border-box;
    opacity: 0.7;
}


/*-----lightbox-----*/
.fancybox__caption {
    align-self: center;
    max-width: 100%;
    flex-shrink: 0;
    margin: 0;
    padding: 14px 0 4px 0;
    overflow-wrap: anywhere;
    line-height: 1.375;
    color: var(--fancybox-color, currentColor);
    opacity: var(--fancybox-opacity, 1);
    cursor: auto;
    visibility: visible;

    font-weight: 400;
    font-family: Roboto, Monsterrat, Noto Sans, sans-serif;
    letter-spacing: 0.7px;
    text-decoration: none;
    line-height: 2;
    letter-spacing: 0.7px;
    font-size: 19px;
}

.has-iframe div {
    background: rgba(24, 24, 27, 0.98);
}

.scrollToTop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    width: 50px;
    height: 50px;
    border: none;
    outline: none;
    background-color: red;
    cursor: pointer;
    border-radius: 0 20px 20px 20px;
    z-index: 99;
    opacity: 0.3;
}

.scrollToTop:hover {
    opacity: 1;
}