.container {
  width: 100%;
  margin: auto;
  padding: 0 1rem;
}

/* Big Screen Device */
@media only screen and (min-width: 112.5rem) {
  .container {
    max-width: 95.9375rem;
  }
  .about__content {
    padding: 0rem 2.5rem;
  }
  .attend__card-content {
    padding: 1.5rem 0rem 0rem;
  }
  .attend-card__row {
    --bs-gutter-y: 3.125rem;
    --bs-gutter-x: 3.125rem;
    margin-bottom: 5rem;
  }
}

/* XXL+ Device. */
@media only screen and (max-width: 112.4375rem) {
}

/* XXL Device. */
@media only screen and (max-width: 100rem) {
  .container {
    max-width: 82.5rem;
  }
  .fs-2 {
    font-size: 2.375rem !important;
    line-height: 3.75rem !important;
  }
  .about__content {
    padding: 0rem 2.5rem;
  }
  .attend-card__row {
    --bs-gutter-y: 3.125rem;
    --bs-gutter-x: 3.125rem;
    margin-bottom: 5rem;
  }
  .attend__card-content h3 {
    font-size: 1.3125rem;
    margin-bottom: 0.875rem;
  }
  .header__menu nav ul {
    gap: 2rem;
  }
  .panelist--section {
    padding: 7rem 0;
    background-color: #db9825;
  }
  .panelist--section .section__head {
    margin-bottom: 3.75rem;
  }
  .panelist__wrapper__row.g-5 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 2rem;
  }
  .panelist__wrapper {
    max-width: 1300px;
    margin: 0 auto;
  }
}

/* XL Device :80rem. */
@media only screen and (max-width: 93.6875rem) {
  .container {
    width: 71.25rem;
  }
  .fs-2 {
    font-size: 2.25rem !important;
    line-height: 2.875rem !important;
  }
  .header__logo p {
    font-size: 0.75rem;
  }
  .header__logo a img {
    max-width: 7.5rem;
  }
  .header__menu nav ul li a {
    font-size: 1rem;
    padding: 2.875rem 0rem;
  }
  .btn {
    font-size: 0.875rem;
    padding: 1rem 1.5625rem;
    gap: 0.5rem;
  }
  .hero__content-main {
    max-width: 35vw;
    padding-bottom: 8vh;
  }
  .hero__content {
    padding-top: 10rem;
  }
  .hero__content-main p {
    font-size: 1.7vw;
    line-height: 1.7;
  }
  .hero__content-preTitle {
    font-size: 1rem;
  }
  .section__title h2 {
    margin-bottom: 1.875rem;
  }
  .about__content-text h3 {
    line-height: 2.4375rem;
    margin-bottom: 2rem;
    font-size: 1.25rem !important;
  }
  .about__content-text .section__title-devider {
    margin-bottom: 1.5625rem;
  }
  .about__content-text p {
    font-size: 1rem;
    line-height: 2.125rem;
  }
  .video__btn {
    width: 10.625rem;
    height: 10.625rem;
  }
  .gallery-img img {
    border-radius: 0.9375rem;
    height: 15.4375rem;
  }
  .about--section {
    padding: 11.25rem 0rem 5rem;
  }
  .features__item {
    width: 15rem;
    height: 15rem;
    margin-bottom: 4.375rem;
  }
  .features__item h3 {
    font-size: 3.625rem;
    line-height: 4.6875rem;
  }
  .features__item p {
    font-size: 1.25rem;
  }
  .features__btns a.btn {
    min-width: 19rem;
    font-size: 0.875rem;
    padding: 1.75rem 1.25rem;
  }
  .features__title {
    margin-bottom: 3.75rem;
  }
  .features__btns {
    margin-bottom: 3rem;
  }
  .join--section {
    padding: 6.25rem 0rem 6.25rem;
  }
  .join__content-main p {
    font-size: 1.125rem;
    line-height: 2rem;
  }
  .event-info {
    margin-bottom: 1.875rem;
  }
  .join__content-main strong {
    font-size: 1.125rem;
    line-height: 2rem;
  }
  .attend__card-content h3 {
    font-size: 1.125rem;
    margin-bottom: 0.6875rem;
  }
  .attend__card-content p {
    font-size: 1rem;
    line-height: 1.625rem;
  }
  .attend__card {
    padding: 1.375rem 1.25rem;
  }
  .btn--register {
    min-width: 14.375rem;
    border-width: 0.3125rem;
  }
  .support__content {
    max-width: 56.25rem;
    margin: 0 auto;
  }
  .footer__top {
    padding: 6.25rem 0.9375rem;
  }
  .header__end p.small {
    font-size: 0.8125rem;
    top: -2.125rem;
  }
  .attend__card-img {
    border-radius: 1.25rem;
    height: 12.5rem;
    width: 100%;
  }
  .panelist__wrapper {
    max-width: 1300px;
    margin: 0 auto;
  }
}
/* XL Device :80rem. */
@media only screen and (max-width: 87.4375rem) {
  .container {
    width: 71.25rem;
  }

  .header__menu nav ul {
    gap: 1.5rem;
  }
  .header__menu nav ul li a {
    font-size: 0.9375rem;
    padding: 2.875rem 0rem;
  }
  .header__logo {
    gap: 1.125rem;
  }
  .hero__content {
    padding-top: 10rem;
    max-width: 62.5rem;
  }
  .hero__content-bottom ul li,
  .hero__content-bottom ul li a {
    gap: 0.5rem;
    font-size: 0.875rem;
  }
  .section__title h2 {
    margin-bottom: 1.25rem;
    font-size: 1.875rem !important;
  }
  .about__content-text h3 {
    line-height: 2.125rem;
    margin-bottom: 2rem;
    font-size: 1rem !important;
  }
  .video__btn {
    width: 10rem;
    height: 10rem;
  }
  .features__item h3 {
    font-size: 2.75rem;
    line-height: 4.5rem;
  }
  .features__item {
    width: 13.125rem;
    height: 13.125rem;
    margin-bottom: 4.375rem;
  }
  .features__btns a.btn {
    min-width: 18.5rem;
    font-size: 0.875rem;
    padding: 1.5rem 1.25rem;
  }
  .footer__logo img {
    max-width: 9.375rem;
  }
  .footer__top-wrapper h2 {
    font-size: 0.875rem;
  }
  .social__text {
    font-size: 0.875rem;
  }
  .social__icon {
    gap: 1rem;
  }
  .hero__content-bottom {
    padding: 1.25rem 1.875rem;
  }
  .gallery-img img {
    border-radius: 0.9375rem;
    height: 14.375rem;
  }
  .program__head__text,
  .program--area .accordion-button {
    padding: 2rem;
  }
  .program__info {
    gap: 1.5rem;
  }
  .program__head__title {
    font-size: 1.625rem;
  }
  .program__head__para,
  .program__description__text {
    font-size: 1.125rem;
  }
  .program__name,
  .program__time {
    font-size: 1.375rem;
  }
  .program__time {
    min-width: 8rem;
  }
  .accordion__icon {
    --size: 1.5rem;
  }
  .program--area .accordion-body {
    padding: 3.75rem;
  }
  .panel-member__name {
    font-size: 1.5rem;
  }
  .attend-card__row {
    --bs-gutter-y: 2.1875rem;
    --bs-gutter-x: 2.1875rem;
    margin-bottom: 2.625rem;
  }

  /* dev 2 */
  .recap-button {
    width: 10rem;
    height: 10rem;
    margin-bottom: -5rem;
  }
  .panelist__wrapper {
    max-width: 1160px;
  }
}

/* Large Device :62rem. */
@media only screen and (max-width: 74.9375rem) {
  .container {
    width: 60rem;
  }
  .about__gallery {
    gap: 1rem;
    width: 44vw;
    top: 4.0625rem;
    z-index: 1;
    opacity: 0.1;
  }
  .about__content {
    max-width: 55vw;
    width: 100%;
  }
  .join__content-main {
    padding-left: 1.875rem;
  }
  .join__content-main p {
    font-size: 1rem;
    line-height: 1.875rem;
  }
  .join__content-main strong {
    font-size: 1rem;
    line-height: 1.875rem;
  }
  .event-info {
    margin-bottom: 0.875rem;
  }
  .about--section {
    padding: 6.25rem 0rem 5rem;
  }
  .features--section {
    padding: 2.5rem 0rem 3.75rem;
  }
  .join--section {
    padding: 3.75rem 0rem 4.6875rem;
  }
  .attend--section {
    padding: 3.75rem 0rem 4.6875rem;
  }
  .attend--section .section__title {
    margin-bottom: 3.125rem;
  }
  .support--section {
    padding: 3.75rem 0rem 4.6875rem;
  }
  .panelist--section {
    padding: 5rem 0;
  }
  .panelist--section .section__title {
    font-size: 2.5rem;
  }
  .program--area {
    padding: 6rem 0;
  }
  .hero__wrapper {
    padding-top: 3rem;
  }
  .hero__program__obj {
    width: 1.25rem;
  }
  .attend-card__row {
    --bs-gutter-y: 2.1875rem;
    --bs-gutter-x: 2.1875rem;
    margin-bottom: 2.625rem;
  }
  .attend__card-img {
    border-radius: 0.625rem;
    height: 10.4375rem;
    width: 100%;
  }
  .panelist__wrapper {
    max-width: 920px;
    margin: 0 auto;
  }
}

/* Medium Device :48rem. */
@media only screen and (max-width: 61.9375rem) {
  .container {
    width: 45rem;
  }
  .btn {
    font-size: 0.8125rem;
    padding: 0.875rem 1rem;
    gap: 0.5rem;
  }
  .social__icon a {
    font-size: 1.5rem;
  }
  .footer__top {
    padding: 4.0625rem 0.9375rem;
  }
  .footer__bottom p {
    font-size: 0.875rem;
  }
  .support__content h2 {
    margin-bottom: 2.5rem;
  }
  .hero__content-main {
    max-width: 30.5rem;
    padding-bottom: 7.5rem;
  }
  .hero__content-main p {
    font-size: 1.5rem;
    line-height: 2.3125rem;
  }
  .hero__content-preTitle {
    font-size: 1rem;
    margin-bottom: 2.375rem;
  }
  .hero__content {
    max-width: 100%;
    padding: 0rem 0rem;
    padding-top: 12.5rem;
  }
  .hero__content-bottom {
    padding: 1.0625rem 0.3125rem;
  }
  .hero__content-bottom ul li,
  .hero__content-bottom ul li a {
    gap: 0.25rem;
    font-size: 0.75rem;
  }
  .hero__content-bottom ul li a.btn {
    font-size: 0.75rem;
  }
  .hero__content-bottom ul li span.icon img {
    max-width: 0.875rem;
    max-height: 0.875rem;
  }
  .about__content {
    max-width: 31.875rem;
    width: 100%;
    padding: 0rem;
  }
  .gallery-img img {
    border-radius: 0.9375rem;
    height: 11.5625rem;
  }
  .about--section {
    padding: 3.75rem 0rem 2.0625rem;
  }
  .fs-2 {
    font-size: 2rem !important;
    line-height: 2.625rem !important;
  }
  .features__title {
    margin-bottom: 2.25rem;
  }
  .features__item h3 {
    font-size: 2.1875rem;
    line-height: 3.5rem;
  }
  .features__item p {
    font-size: 1rem;
  }
  .features__item {
    width: 13.125rem;
    height: 13.125rem;
    margin-bottom: 1.75rem;
  }
  .join__content {
    max-width: 31.875rem;
    flex-wrap: wrap;
  }
  .join__content-thumb {
    width: 100%;
    flex: 0 0 auto;
    margin-bottom: 1.875rem;
  }
  .join__content {
    max-width: 27.625rem;
    margin: 0 auto;
    flex-wrap: wrap;
  }
  .join__content-main {
    padding-left: 0rem;
    padding-top: 2.5rem;
    text-align: center;
  }
  .join--section .section__title {
    margin-bottom: 2.625rem;
  }
  .join--section {
    padding: 2.875rem 0rem 4rem;
  }

  .attend-card__row {
    --bs-gutter-y: 1.5rem;
    --bs-gutter-x: 1.5rem;
    margin-bottom: 5rem;
  }
  .btn--register {
    min-width: 15rem;
    border-width: 0.375rem;
  }
  .program__head__text,
  .program--area .accordion-button {
    padding: 1.5rem;
  }
  .program__head__title {
    font-size: 1.375rem;
  }
  .program__head__para,
  .program__description__text {
    font-size: 1rem;
  }
  .program__info {
    gap: 0.5rem;
  }
  button:not(.collapsed) .accordion__icon {
    --size: 1.25rem;
  }
  .program--area .accordion-body {
    padding: 2rem;
  }
  .panelist--section {
    padding: 4rem 0;
  }
  .panelist--section .section__head {
    margin-bottom: 3rem;
  }
  .panelist--section .section__title {
    font-size: 2rem;
  }
  .program--area {
    padding: 4rem 0;
  }
  .hero--program {
    padding: 5rem 0;
    min-height: 32rem;
  }
  .hero__wrapper {
    padding-top: 4rem;
  }
  .hero__para {
    font-size: 1rem;
    line-height: 2;
  }
  .page-title,
  .programm__text__block__title {
    font-size: 2rem;
  }
  .attend__card-img {
    border-radius: 0.625rem;
    height: 12.25rem;
    width: 100%;
  }
  .attend-card__row {
    margin-bottom: 3.5625rem;
  }

  /* dev 2 */
  .recap-button {
    width: 6.25rem;
    height: 6.25rem;
    margin-bottom: -3.125rem;
    margin-right: 3rem;
  }
  .panelist__wrapper {
    max-width: 720px;
    margin: 0 auto;
  }
}

/* Small Device :34.375rem. */
@media only screen and (max-width: 47.9375rem) {
  .container {
    width: 33.75rem;
  }
  .features__item {
    width: 9.375rem;
    height: 9.375rem;
    margin-bottom: 1.1875rem;
  }
  .footer__top-wrapper {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }
  .footer__nav ul li a {
    font-size: 0.9375rem;
    line-height: 1.9375rem;
  }
  .footer__top {
    padding: 1.75rem 0.9375rem;
  }
  .footer__bottom {
    padding: 0.8125rem 0.9375rem;
  }
  .support--section {
    padding: 2.5rem 0rem 2.5rem;
  }
  .header__logo a img {
    max-width: 6.875rem;
  }
  .hero__content-preTitle {
    font-size: 0.8125rem;
    margin-bottom: 1.75rem;
  }
  .hero__content-main {
    max-width: 20.625rem;
    padding-bottom: 3.75rem;
  }
  .hero__content-main p {
    font-size: 1rem;
    line-height: 1.5625rem;
  }
  .hero__content-bottom ul {
    flex-direction: column;
    line-height: 1;
  }
  .hero--section {
    justify-content: center;
    align-items: center;
    padding-bottom: 150px;
  }

  .hero__content-bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: auto;
  }
  .hero__content {
    position: initial;
  }

  .about--section {
    padding: 2.1875rem 0rem 1.875rem;
  }
  .section__title h2 {
    margin-bottom: 0.625rem;
    font-size: 1.1875rem !important;
  }
  .about__content-text h3 {
    line-height: 1.375rem;
    margin-bottom: 1.25rem;
    font-size: 0.9375rem !important;
  }
  .about__content-text .section__title-devider {
    margin-bottom: 1rem;
  }
  .about__content-text p {
    font-size: 1rem;
    line-height: 1.5625rem;
  }
  .about__content-text {
    margin-bottom: 1.9375rem;
  }
  .fs-2 {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
  }
  .features__item h3 {
    font-size: 1.75rem;
    line-height: 2.3125rem;
  }
  .features__item p {
    font-size: 0.875rem;
  }
  .features__btns {
    margin-bottom: 0.625rem;
  }
  body {
    font-size: 1rem;
    line-height: 1.5rem;
  }
  .features__btns a.btn {
    min-width: 100%;
    font-size: 0.8125rem;
    padding: 1.125rem 1.1875rem;
  }
  .join--section {
    padding: 2.1875rem 0rem 2.3125rem;
  }
  .join--section .section__title {
    margin-bottom: 1.875rem;
  }
  .join__content-thumb {
    width: 100%;
    flex: 0 0 auto;
    margin-bottom: 0rem;
  }
  .join__content-main {
    padding-top: 1.25rem;
  }
  .join__content-main p {
    font-size: 0.875rem;
    line-height: 1.6875rem;
  }
  .attend--section {
    padding: 2.1875rem 0rem 2.5rem;
  }

  .program__head__text,
  .program--area .accordion-button {
    padding: 1.25rem;
  }
  .program__name,
  .program__time {
    font-size: 1.125rem;
  }
  .accordion__icon {
    --size: 1.125rem;
  }
  button:not(.collapsed) .accordion__icon {
    --size: 0.875rem;
  }
  .program--area .accordion-body {
    padding: 1.5rem 1.25rem;
  }

  .panelist--section {
    padding: 3rem 0;
  }
  .panelist--section .section__head {
    margin-bottom: 2rem;
  }
  .panelist--section .section__title {
    font-size: 1.5rem;
  }
  .panelist__wrapper__row.g-5 {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1.25rem;
  }
  .panel-member__thumb {
    margin-bottom: 1rem;
  }
  .panel-member__name {
    font-size: 1.375rem;
    margin-bottom: 0.25rem;
  }
  .panel-member__info {
    font-size: 1rem;
  }

  .hero--program {
    padding: 3.75rem 0;
    min-height: auto;
  }
  .hero__wrapper {
    padding-top: 6rem;
  }
  .hero__program__obj {
    width: 0.625rem;
  }
  .programm__text__block__title {
    font-size: 1.5rem;
  }
  .panelist__box {
    max-width: 340px;
    margin: 0 auto;
  }
  .recap-button {
    width: 7rem;
    height: 7rem;
    margin: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: -3.5rem;
  }
}

/* Extra small Device. */
@media only screen and (max-width: 35.9375rem) {
  .container {
    width: 100%;
    padding: 0 0.9375rem;
  }

  .program--area {
    padding: 3rem 0;
  }
  .program__thumb {
    width: 100%;
  }
  .panel-member__name {
    font-size: 1.25rem;
  }

  /* dev 2 */
  .recap-button {
    width: 7rem;
    height: 7rem;
    margin: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: -3.5rem;
  }
}

@media only screen and (max-width: 21.25rem) {
  .hero__content-bottom ul li,
  .hero__content-bottom ul li a {
    gap: 0.25rem;
    font-size: 0.6875rem;
  }
}