﻿#sectionAbout_TopBanner { position: relative; margin-bottom: 0; height: 450px; color: #fff; text-align: center;  }
#sectionAbout_TopBanner .bg { position: absolute; width: 100%; height: 100%; background: url('/Images/Custom/About/topbanner.jpg') no-repeat center / cover; filter: brightness(0.75); z-index: -1; }
#sectionAbout_TopBanner .container { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; }
#sectionAbout_TopBanner .container .title { margin-bottom: 1rem; line-height: 120%; font-size: 2.75rem; font-weight: 700; }
#sectionAbout_TopBanner .container .description { margin-bottom: 1.5rem; font-size: 1.25rem; }
#sectionAbout_TopBanner .container .description br { display: none; }
#sectionAbout_TopBanner .container .list i { margin-right: 0.2rem; }
#sectionAbout_TopBanner .container .list i ~ i { margin-left: 0.75rem; }
/*xxl*/ @media (max-width: 1399px) {
    #sectionAbout_TopBanner { height: 350px; }
}
/*md*/ @media (max-width: 767px) {
    #sectionAbout_TopBanner { height: 290px; }
    #sectionAbout_TopBanner .container .title { font-size: 2rem; }
    #sectionAbout_TopBanner .container .description br { display: block; }
}
/*sm*/ @media (max-width: 575px) {
    #sectionAbout_TopBanner { height: 230px; }
}

#sectionAbout_MainEvent .blocks .block { margin-top: var(--section-margin); padding: 1.5rem; background-color: #fff; border-radius: 1rem; box-shadow: 2px 2px 9px 0px rgb(0 0 0 / 9%); }
#sectionAbout_MainEvent .blocks .block .title { font-size: 1.5rem; font-weight: 700; }
#sectionAbout_MainEvent .blocks .block .description { display: flex; flex-wrap: wrap; gap: 0 1rem; font-size: 1rem; font-weight: 300; color: var(--color-text-light); }
#sectionAbout_MainEvent .blocks .block .description i { margin-right: 0.25rem; }
#sectionAbout_MainEvent .blocks .block .photos { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px dashed var(--color-gray-light); }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__slide { background: no-repeat center / cover; border-radius: 1rem; cursor: pointer; transition: 0.4s; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__slide:after { content: ""; display: block; padding-bottom: 80%; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__slide:hover { opacity: 0.8; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow { width: 2rem; height: 2rem; background-color: #fff!important; border-radius: 0; border-radius: 0.5rem; box-shadow: 2px 2px 6px 0px rgb(0 0 0 / 9%); opacity: 1; transition: all 0.4s; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow:hover { box-shadow: 1px 2px 4px 1px rgb(0 0 0 / 19%); }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow svg { width: 1rem; height: 1rem; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow svg path { fill: var(--color-gray-dark); }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow.splide__arrow--prev { left: -2.5rem; }
#sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrows .splide__arrow.splide__arrow--next { right: -2.5rem; }
#sectionAbout_MainEvent .modal_bigimage .modal-dialog { max-width: 1000px; }
#sectionAbout_MainEvent .modal_bigimage .modal-content { background-color: transparent; border: 0; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .btn-close {  }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__track { }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__track .splide__list { width: 100%; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__track .splide__list .splide__slide { width: 100%; background: no-repeat center / cover; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__track .splide__list .splide__slide:after { content: ""; display: block; padding-bottom: 60%; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__arrows .splide__arrow { height: 100%; background-color: transparent; border-radius: 0; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__arrows .splide__arrow.splide__arrow--prev { justify-content: flex-start; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__arrows .splide__arrow.splide__arrow--next { justify-content: flex-end; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__arrows .splide__arrow svg { width: 2rem; height: 2rem; }
#sectionAbout_MainEvent .modal_bigimage .modal-content .splide__arrows .splide__arrow svg path { fill: #fff; }
#sectionAbout_MainEvent .modal_bigimage .close { position: absolute; width: 4rem; height: 4rem; top: -4rem; right: 0; cursor: pointer; }
#sectionAbout_MainEvent .modal_bigimage .close .times { position: relative; width: 100%; height: 100%; }
#sectionAbout_MainEvent .modal_bigimage .close .times::before { content: ""; position: absolute; width: 2px; height: 100%; left: 50%; transform: rotate(-45deg); background-color: #fff; }
#sectionAbout_MainEvent .modal_bigimage .close .times::after { content: ""; position: absolute; width: 2px; height: 100%; left: 50%; transform: rotate(45deg); background-color: #fff; }
/*xxl*/ @media (max-width: 1399px) {
    #sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrow.splide__arrow--prev { left: -1.5rem; }
    #sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrow.splide__arrow--next { right: -1.5rem; }
}
/*md*/ @media (max-width: 767px) {
}
/*sm*/ @media (max-width: 575px) {
    #sectionAbout_MainEvent .blocks .block { margin-top: var(--section-margin-sm); }
    #sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrow.splide__arrow--prev { display: none; }
    #sectionAbout_MainEvent .blocks .block .photos .splide .splide__arrow.splide__arrow--next { display: none; }
}

#sectionAbout_SubEvent {  }
#sectionAbout_SubEvent .blocks { display: flex; flex-wrap: wrap; gap: 1rem; }
#sectionAbout_SubEvent .blocks .block { flex-grow: 1; padding: 1.5rem; background-color: #fff; border-radius: 1rem; box-shadow: 2px 2px 9px 0px rgb(0 0 0 / 9%); }
#sectionAbout_SubEvent .blocks .block .title { margin-bottom: 0.25rem; font-size: 1.1rem; font-weight: 500; }
#sectionAbout_SubEvent .blocks .block .description { display: flex; flex-wrap: wrap; gap: 0 1rem; font-size: 1rem; font-weight: 300; color: var(--color-text-light); }
#sectionAbout_SubEvent .blocks .block .description i { margin-right: 0.25rem; }