/*====================================================================================
START TABLE OF CONTENT

1. START COMMON ONLY TOP PAGE.
2. START SECTION MAIN VISUAL.
3. START SECTION TOP ABOUT.
4. START SECTION TOP.
5. START SECTION TOP LEARN.
6. START SECTION TOP SNS.
7. START SECTION TOP NEWS.

====================================================================================*/
/*====================================================================================
1. START COMMON ONLY TOP PAGE.
====================================================================================*/
/*---------- START KEYFRAMES ----------*/
@keyframes zoomOut {
  0% {
    opacity: 0;
    transform: scale(1.4);
  }
  40% {
    color: var(--theme-color-eighteenth);
  }
  100% {
    color: var(--theme-color-secondary);
    opacity: 1;
    transform: scale(1);
  }
}
/*---------- START LAYOUT HEADER ----------*/
.l-header.is-fixed {
  background-color: var(--theme-color-secondary);
}
.l-header.is-fixed .l-header__line {
  display: none;
}
.l-header.is-fixed .l-header__left {
  padding: 0;
}
.l-header.is-fixed .l-header__left::before, .l-header.is-fixed .l-header__left::after {
  content: none;
}
.l-header.is-fixed .l-header__right {
  padding-top: 0;
}
.l-header.is-fixed .l-header__control {
  margin-left: 0;
}
.l-header.is-fixed .c-logo {
  display: flex;
  align-items: center;
  margin-top: 0;
}
.l-header.is-fixed .c-logo__img {
  margin-bottom: 0;
}
.l-header.is-fixed .c-btn-hamburger {
  border-radius: 0;
}
.l-header__left {
  position: relative;
  background-color: var(--theme-color-secondary);
}
.l-header__left::before, .l-header__left::after {
  position: absolute;
  content: "";
  background: url("./../common_img/bd-header.svg") no-repeat center center/100% auto;
}
.l-header__left::before {
  top: 0;
}

@media only screen and (max-width: 767px) {
  .l-header.is-fixed {
    box-shadow: 0.1rem 0.4rem 0.8rem -0.4rem rgba(0, 0, 0, 0.1);
  }
  .l-header.is-fixed .l-header__row {
    padding: 0 0 0 1.5rem;
  }
  .l-header.is-fixed .c-logo__img img {
    height: 5rem;
  }
  .l-header.is-fixed .c-logo__text {
    padding-left: 1rem;
    font-size: 1.1rem;
  }
  .l-header.is-fixed .p-nav {
    padding-top: 6.6rem;
  }
  .l-header.is-fixed .p-nav__wrap {
    height: calc(100dvh - 6.6rem);
  }
  .l-header.is-fixed .c-btn-hamburger {
    width: 6.5rem;
    height: 6.5rem;
  }
  .l-header__line--top {
    height: 1.5rem;
  }
  .l-header__line--left, .l-header__line--right {
    width: 1.5rem;
    height: 15rem;
  }
  .l-header__row {
    padding: 1.5rem 3rem 0 1.5rem;
  }
  .l-header__left {
    padding: 0 1.5rem 1rem 0;
    border-bottom-right-radius: 1.5rem;
  }
  .l-header__left::before, .l-header__left::after {
    width: 1.7rem;
    height: 1.7rem;
  }
  .l-header__left::before {
    top: -1px;
    right: -1.7rem;
  }
  .l-header__left::after {
    left: -1px;
    bottom: -1.6rem;
  }
  .l-header__left .c-logo {
    margin-top: -0.5rem;
  }
  .l-header .p-nav {
    padding-top: 9.5rem;
  }
  .l-header .p-nav__wrap {
    height: calc(100dvh - 9.5rem);
  }
}
@media only screen and (min-width: 768px) {
  .l-header.is-fixed {
    box-shadow: 0.1rem 0.4rem 0.8rem -0.4rem rgba(0, 0, 0, 0.15);
  }
  .l-header.is-fixed .p-group {
    border-radius: 0;
  }
  .l-header.is-fixed .p-nav__body {
    right: 1.5rem;
  }
  .l-header__line--top {
    height: 5rem;
  }
  .l-header__line--left, .l-header__line--right {
    width: 5rem;
    height: 23vw;
  }
  .l-header__left {
    padding: 0 5rem 3rem 0;
    border-bottom-right-radius: 4rem;
  }
  .l-header__left::before, .l-header__left::after {
    width: 3.7rem;
    height: 3.7rem;
  }
  .l-header__left::before {
    right: -3.5rem;
  }
  .l-header__left::after {
    left: -2px;
    bottom: -3.6rem;
  }
  .l-header__left .c-logo {
    margin-top: -1rem;
  }
  .l-header__right {
    padding-top: 3rem;
  }
  .l-header__control {
    margin-left: 2rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .l-header__row {
    padding: 5rem 1.5rem 0 1.5rem;
  }
  .l-header .p-nav__body {
    right: 0;
  }
  .l-header__line--left {
    width: 1.5rem;
  }
}
@media only screen and (min-width: 1200px) {
  .l-header__row {
    padding: 5rem 10rem 0 5rem;
  }
}
/*---------- START COMPONENT PROJECT GROUP ----------*/
@media only screen and (min-width: 768px) {
  .p-group {
    border-radius: 2rem;
  }
  .p-group__list {
    min-height: 9.5rem;
    padding: 1rem 4.5rem 1rem 6.5rem;
  }
  .p-group__btn {
    width: 13rem;
  }
}
/*---------- START COMPONENT LOGO ----------*/
.c-logo {
  display: inline-block;
}

@media only screen and (max-width: 767px) {
  .c-logo__img {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-logo__img {
    margin-bottom: 1.7rem;
  }
}
/*---------- START COMPONENT HAMBURGER ----------*/
@media only screen and (max-width: 767px) {
  .c-btn-hamburger {
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-btn-hamburger {
    width: 9.5rem;
    height: 9.5rem;
    border-radius: 2rem;
  }
  .c-btn-hamburger.is-active::before {
    width: 14.5rem;
    height: 14.5rem;
  }
}
/*---------- START COMPONENT BUTTON HEADER ----------*/
@media only screen and (min-width: 768px) {
  .c-btn-header:hover::before {
    width: 17rem;
    height: 17rem;
  }
}
/*====================================================================================
2. START SECTION MAIN VISUAL.
====================================================================================*/
/*---------- START PROJECT TITLE MAIN VISUAL ----------*/
.p-title-mv {
  color: var(--theme-color-secondary);
  line-height: 1.35;
  font-weight: 500;
}
.p-title-mv span {
  display: inline-block;
  color: var(--theme-color-eighteenth);
  opacity: 0;
  animation-name: zoomOut;
  animation-duration: 0.4s;
  animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  animation-fill-mode: forwards;
}
.p-title-mv span:nth-child(1) {
  animation-delay: 0.1s;
}
.p-title-mv span:nth-child(2) {
  animation-delay: 0.2s;
}
.p-title-mv span:nth-child(3) {
  animation-delay: 0.3s;
}
.p-title-mv span:nth-child(4) {
  animation-delay: 0.4s;
}
.p-title-mv span:nth-child(5) {
  animation-delay: 0.5s;
}
.p-title-mv span:nth-child(6) {
  animation-delay: 0.6s;
}
.p-title-mv span:nth-child(7) {
  animation-delay: 0.7s;
}
.p-title-mv span:nth-child(8) {
  animation-delay: 0.8s;
}
.p-title-mv span:nth-child(9) {
  animation-delay: 0.9s;
}
.p-title-mv span:nth-child(10) {
  animation-delay: 1s;
}
.p-title-mv span:nth-child(11) {
  animation-delay: 1.1s;
}
.p-title-mv span:nth-child(12) {
  animation-delay: 1.2s;
}
.p-title-mv span:nth-child(13) {
  animation-delay: 1.3s;
}
.p-title-mv span:nth-child(14) {
  animation-delay: 1.4s;
}
.p-title-mv span:nth-child(15) {
  animation-delay: 1.5s;
}

@media only screen and (max-width: 767px) {
  .p-title-mv {
    font-size: clamp(3rem, 10vw, 5rem);
  }
}
@media only screen and (min-width: 768px) and (max-width: 1919px) {
  .p-title-mv {
    font-size: 5vw;
  }
}
@media only screen and (min-width: 1920px) {
  .p-title-mv {
    font-size: 8.5rem;
  }
}
/*---------- START PROJECT MAIN VISUAL ----------*/
.p-mv .c-deco__img--v1 {
  right: 0;
}
.p-mv .c-deco__img--v2 {
  left: 0;
}
.p-mv__head .l-container-lg {
  padding-right: 0;
}
.p-mv__body {
  position: absolute;
  content: "";
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.p-mv__body .l-container {
  height: 100%;
}
.p-mv__row {
  width: 100%;
  height: 100%;
  display: flex;
}

@media only screen and (max-width: 575px) {
  .p-mv__row {
    align-items: flex-end;
    padding: 0 1.5rem 20% 1.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .p-mv__row {
    align-items: center;
    padding-top: 21.5%;
  }
}
@media only screen and (max-width: 767px) {
  .p-mv {
    padding-top: 1.5rem;
  }
  .p-mv .c-deco__img--v1 {
    bottom: -7rem;
  }
  .p-mv .c-deco__img--v2 {
    top: 30%;
    width: 40%;
  }
}
@media only screen and (min-width: 768px) {
  .p-mv .c-deco__img--v1 {
    top: 0;
  }
  .p-mv .c-deco__img--v2 {
    top: 32%;
    width: 40%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 1399px) {
  .p-mv__row {
    padding-left: 2rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-mv__head .l-container-lg {
    padding: 5rem 0 0 1.5rem;
  }
}
@media only screen and (min-width: 1200px) {
  .p-mv__head .l-container-lg {
    padding: 5rem 0 0 5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1919px) {
  .p-mv .c-deco__wrap {
    left: 0;
    width: 100%;
    margin-left: 0;
  }
  .p-mv .c-deco__img--v1 {
    right: -8.5%;
    width: 65%;
  }
  .p-mv .c-deco__img--v2 {
    width: 40%;
  }
}
/*---------- START PROJECT SLIDER MAIN VISUAL ----------*/
.p-slider-mv {
  overflow: hidden;
  white-space: nowrap;
}
.p-slider-mv__list {
  display: inline-flex;
  align-items: center;
  height: 100%;
}

@media only screen and (max-width: 575px) {
  .p-slider-mv .c-slide-mv {
    width: 90vw;
    height: 65vh;
    max-height: 44rem;
  }
}
@media only screen and (min-width: 576px) {
  .p-slider-mv .c-slide-mv {
    width: 50vw;
    height: calc(100dvh - 10rem);
  }
}
/*---------- START COMPONENT SLIDER MAIN VISUAL ----------*/
.c-slide-mv img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media only screen and (max-width: 767px) {
  .c-slide-mv img {
    border-radius: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-slide-mv img {
    border-radius: 3rem;
  }
}
/*---------- START KEYFRAMES SLIDES ----------*/
@keyframes keySlides {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
/*====================================================================================
3. START SECTION TOP ABOUT.
====================================================================================*/
/*---------- START PROJECT TOP ABOUT ----------*/
.p-top-about .c-deco__img--v2 {
  left: 0;
}
.p-top-about .c-title {
  margin-bottom: var(--spacing-sp-25-pc-50);
}
.p-top-about__row {
  display: flex;
}
.p-top-about__item-btn:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .p-top-about {
    padding-top: 5rem;
  }
  .p-top-about .c-deco__img--v1 {
    top: 4rem;
    left: -20%;
    width: 40%;
  }
  .p-top-about .c-deco__img--v2 {
    left: -17%;
    bottom: -14%;
    width: 80%;
  }
  .p-top-about .c-deco__img--v3 {
    top: 50%;
    right: 0;
    width: 70%;
  }
  .p-top-about__row {
    flex-direction: column-reverse;
  }
  .p-top-about__right {
    text-align: center;
    margin-bottom: 3.5rem;
  }
  .p-top-about__right img {
    max-width: 24rem;
    border-radius: 1.5rem;
  }
  .p-top-about__item {
    margin-top: 4rem;
  }
  .p-top-about__item:first-child {
    margin-top: 0;
  }
  .p-top-about__item .c-title-base {
    margin-bottom: 1.5rem;
  }
  .p-top-about__item-btns {
    margin-top: 2.5rem;
  }
  .p-top-about__item-btn {
    margin-top: 2rem;
    text-align: center;
  }
  .p-top-about__video {
    margin-top: 4rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-top-about {
    padding-top: 7rem;
  }
  .p-top-about .c-deco__img--v1 {
    top: 3.2rem;
    left: 3.7rem;
  }
  .p-top-about .c-deco__img--v2 {
    top: 13.7rem;
  }
  .p-top-about .c-deco__img--v3 {
    top: 57.8rem;
    right: 16.3rem;
  }
  .p-top-about__left {
    flex: 1;
    min-width: 1px;
    padding-right: 5rem;
  }
  .p-top-about__right {
    width: 44.5rem;
  }
  .p-top-about__right img {
    border-radius: 2rem;
  }
  .p-top-about__item:not(:first-child) {
    margin-top: var(--spacing-sp-30-pc-60);
  }
  .p-top-about__item:last-child {
    margin-bottom: -23.5rem;
  }
  .p-top-about__item:last-child .c-title-base {
    margin-right: -49rem;
  }
  .p-top-about__item:last-child .p-top-about__item-desc {
    margin-right: -49rem;
  }
  .p-top-about__item .c-title-base {
    margin-right: -2rem;
    margin-bottom: 2.5rem;
  }
  .p-top-about__item-btns {
    margin-top: 4.5rem;
  }
  .p-top-about__item-btn {
    margin-top: 2.5rem;
  }
  .p-top-about__video {
    margin-top: 6rem;
    padding-left: 41rem;
  }
}
/*---------- START COMPONENT VIDEO ----------*/
.c-video {
  position: relative;
  padding-bottom: 56.25%;
  overflow: hidden;
}
.c-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*====================================================================================
4. START SECTION TOP.
====================================================================================*/
/*---------- START PROJECT TOP ----------*/
.p-top {
  position: relative;
  padding: var(--spacing-sp-75-pc-150) 0 var(--spacing-sp-65-pc-130) 0;
}
.p-top .c-deco__img--v2 {
  left: 0;
}
.p-top .c-deco__img--v3 {
  right: 0;
}
.p-top .p-gallery {
  margin-top: var(--spacing-sp-40-pc-80);
}

@media only screen and (max-width: 767px) {
  .p-top .c-deco__img--v1 {
    top: 35%;
    right: 0;
    width: 30%;
  }
  .p-top .c-deco__img--v2 {
    top: 80%;
    left: 0%;
    width: 50%;
  }
  .p-top .c-deco__img--v3 {
    bottom: 3%;
    width: 30%;
  }
}
@media only screen and (min-width: 768px) {
  .p-top .c-deco__img--v1 {
    top: 22.5rem;
    right: 3.5rem;
  }
  .p-top .c-deco__img--v2 {
    top: 51rem;
    width: 41.5%;
  }
  .p-top .c-deco__img--v3 {
    top: 55.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1499px) {
  .p-top .c-deco__img--v1 {
    top: 20rem;
  }
  .p-top .c-deco__img--v2 {
    top: 46.5rem;
  }
}
/*---------- START PROJECT POST ----------*/
.p-post__body {
  text-align: center;
}
.p-post .c-title {
  margin-bottom: var(--spacing-sp-15-pc-25);
}
.p-post__btn {
  margin-top: var(--spacing-sp-25-pc-50);
}

@media only screen and (max-width: 767px) {
  .p-post {
    padding: 0 1.5rem;
  }
  .p-post__left {
    margin-bottom: 2.5rem;
  }
  .p-post .c-title-base {
    margin-bottom: 1.7rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-post__row {
    display: flex;
    align-items: center;
  }
  .p-post__left {
    width: calc(50% + 4rem);
  }
  .p-post__left img {
    min-height: 50rem;
    object-fit: cover;
    object-position: right center;
    border-radius: 0 2rem 2rem 0;
  }
  .p-post__right {
    flex: 1;
  }
  .p-post__body {
    width: 100%;
    max-width: 56rem;
  }
  .p-post .c-title-base {
    margin-bottom: 2.7rem;
  }
}
/*---------- START PROJECT GALLERY ----------*/
.p-gallery {
  overflow: hidden;
  white-space: nowrap;
}
.p-gallery__list {
  display: inline-flex;
  align-items: center;
  height: 100%;
}
.p-gallery__item {
  max-width: none;
}
.p-gallery__item img {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .p-gallery__list {
    animation: 45s keySlides infinite linear;
  }
  .p-gallery__item {
    width: 40vw;
    margin: 0 0.5rem;
  }
  .p-gallery__item img {
    border-radius: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-gallery__list {
    animation: 60s keySlides infinite linear;
  }
  .p-gallery__item {
    width: 36rem;
    margin: 0 1.5rem;
  }
  .p-gallery__item img {
    border-radius: 2rem;
  }
}
/*====================================================================================
5. START SECTION TOP LEARN.
====================================================================================*/
/*---------- START PROJECT TOP LEARN ----------*/
.p-top-learn .c-deco__img--v1, .p-top-learn .c-deco__img--v2 {
  right: 0;
}
.p-top-learn__body {
  border-radius: 2rem;
  background-color: rgba(241, 241, 241, 0.63);
}
.p-top-learn .c-title {
  margin-bottom: var(--spacing-sp-20-pc-35);
}
.p-top-learn .c-title-base, .p-top-learn__desc {
  text-align: center;
}
.p-top-learn .c-title-base {
  margin-bottom: var(--spacing-sp-15-pc-25);
}
.p-top-learn .c-list-box-top {
  margin-top: var(--spacing-sp-20-pc-40);
}

@media only screen and (max-width: 767px) {
  .p-top-learn .c-deco__img {
    max-width: 37.5rem;
  }
  .p-top-learn .c-deco__img--v1 {
    bottom: 0;
  }
  .p-top-learn .c-deco__img--v2 {
    top: 0;
    width: 25%;
  }
  .p-top-learn__body {
    padding: 4rem 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-top-learn .c-deco__img--v1 {
    top: -51rem;
  }
  .p-top-learn .c-deco__img--v2 {
    top: 17rem;
  }
  .p-top-learn__body {
    padding: 8rem 6rem 9rem 6rem;
  }
}
/*---------- START COMPONENT LIST BOX TOP ----------*/
@media only screen and (max-width: 767px) {
  .c-list-box-top .c-box-top {
    margin-top: 2.5rem;
  }
  .c-list-box-top .c-box-top:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-box-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: -3rem;
  }
  .c-list-box-top .c-box-top {
    width: 47.5rem;
    margin: 3rem;
  }
}
/*---------- START COMPONENT BOX TOP ----------*/
.c-box-top__link {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.c-box-top__desc {
  margin-top: 0.4rem;
}

@media only screen and (max-width: 767px) {
  .c-box-top__left {
    width: 9rem;
  }
  .c-box-top__right {
    flex: 1;
    padding-left: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-top__link:hover .c-link-main__text {
    background-position: 0 100%;
    background-size: 100% 0.1rem;
  }
  .c-box-top__link:hover .c-circle::after {
    width: 100%;
    height: 100%;
  }
  .c-box-top__link:hover .c-circle__arrow {
    fill: var(--theme-color-primary);
  }
  .c-box-top__link:hover .c-box-top__left img {
    transform: scale(1.05);
  }
  .c-box-top__left {
    width: 12.1rem;
  }
  .c-box-top__right {
    flex: 1;
    padding-left: 3rem;
  }
}
/*====================================================================================
6. START SECTION TOP SNS.
====================================================================================*/
/*---------- START PROJECT TOP SNS ----------*/
.p-top-sns {
  padding-top: var(--spacing-sp-65-pc-130);
}
.p-top-sns .c-deco__img--v1 {
  right: 0;
}
.p-top-sns .c-deco__img--v2 {
  left: 0;
}
.p-top-sns .c-title {
  margin-bottom: var(--spacing-sp-15-pc-30);
}
.p-top-sns .c-title-base {
  margin-bottom: var(--spacing-sp-15-pc-25);
  text-align: center;
}
.p-top-sns__desc {
  text-align: center;
}
.p-top-sns .c-list-post-social {
  margin-top: var(--spacing-sp-35-pc-65);
}
.p-top-sns .c-bnr-top {
  display: grid;
  margin-top: var(--spacing-sp-40-pc-80);
}

@media only screen and (max-width: 767px) {
  .p-top-sns .c-deco__img {
    max-width: 37.5rem;
  }
  .p-top-sns .c-deco__img--v1 {
    bottom: -10rem;
    width: 40%;
  }
  .p-top-sns .c-deco__img--v2 {
    bottom: -25rem;
    width: 30%;
  }
  .p-top-sns .c-deco__img--v3 {
    top: 0;
    width: 40%;
  }
  .p-top-sns .c-bnr-top {
    grid-template-columns: repeat(1, 1fr);
    gap: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-top-sns .c-deco__img--v1 {
    bottom: -28rem;
  }
  .p-top-sns .c-deco__img--v2 {
    top: 36.5%;
  }
  .p-top-sns .c-deco__img--v3 {
    left: 27rem;
    bottom: -7.5rem;
  }
  .p-top-sns .c-bnr-top {
    grid-template-columns: repeat(2, 1fr);
    gap: 4.5rem;
  }
}
/*---------- START COMPONENT LIST POST SOCIAL ----------*/
@media only screen and (max-width: 575px) {
  .c-list-post-social .c-post-social {
    margin-top: 3.5rem;
  }
  .c-list-post-social .c-post-social:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-post-social {
    display: flex;
    justify-content: center;
  }
  .c-list-post-social .c-post-social--ins {
    width: 66rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-post-social .c-post-social--x {
    width: 45%;
    padding-left: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-post-social .c-post-social--x {
    width: 48rem;
    padding-left: 5rem;
  }
}
/*---------- START COMPONENT POST SOCIAL ----------*/
.c-post-social .c-heading-social {
  margin-bottom: var(--spacing-sp-15-pc-20);
}
.c-post-social__plugin {
  background-color: var(--theme-color-primary);
}

@media only screen and (max-width: 575px) {
  .c-post-social__plugin {
    height: 40rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-post-social__plugin {
    height: 52.5vw;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-social__plugin {
    height: 66rem;
  }
}
/*---------- START COMPONENT GALLERY INSTAGRAM ----------*/
.c-gallery-ins {
  overflow: hidden;
}
.c-gallery-ins iframe {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .c-gallery-ins iframe {
    aspect-ratio: 1/1.4;
  }
}
@media only screen and (min-width: 768px) {
  .c-gallery-ins iframe {
    aspect-ratio: 765/1035;
  }
}
/*---------- START COMPONENT HEADING SOCIAL ----------*/
.c-heading-social__link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.c-heading-social__right {
  flex: 1;
  padding-left: 1.5rem;
}
.c-heading-social__text, .c-heading-social__title {
  font-weight: 500;
}
.c-heading-social__title {
  letter-spacing: 0.05em;
}

@media only screen and (max-width: 767px) {
  .c-heading-social__left {
    width: 4.5rem;
  }
  .c-heading-social__title {
    font-size: 1.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-social__link:hover .c-heading-social__left img {
    transform: scale(1.08);
  }
  .c-heading-social__left {
    width: 5.5rem;
  }
  .c-heading-social__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT BANNER TOP ----------*/
.c-bnr-top {
  text-align: center;
}
.c-bnr-top__link {
  position: relative;
  display: inline-block;
  border-radius: 1rem;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.3s ease;
}

@media only screen and (min-width: 768px) {
  .c-bnr-top__link:hover {
    transform: scale(0.985);
  }
  .c-bnr-top__link:hover img {
    transform: scale(1.015);
  }
}
/*====================================================================================
7. START SECTION TOP NEWS.
====================================================================================*/
/*---------- START PROJECT TOP NEWS ----------*/
.p-top-news {
  padding-top: var(--spacing-sp-75-pc-150);
}
.p-top-news .c-title {
  margin-bottom: var(--spacing-sp-25-pc-50);
}
.p-top-news__btn {
  margin-top: var(--spacing-sp-40-pc-80);
  text-align: center;
}
.p-top-news .c-tag {
  background-color: color-mix(in srgb, var(--theme-color-tag) 30%, transparent);
}

/*---------- START COMPONENT LIST CARD TOP ----------*/
.c-list-card-top {
  display: flex;
  flex-wrap: wrap;
}

@media only screen and (max-width: 575px) {
  .c-list-card-top {
    margin: -1.5rem -0.75rem;
  }
  .c-list-card-top .c-card-top {
    width: calc(50% - 1.5rem);
    margin: 1.5rem 0.75rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-card-top {
    margin: -1.5rem;
  }
  .c-list-card-top .c-card-top {
    width: calc(50% - 3rem);
    margin: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-top {
    margin: -2.25rem;
  }
  .c-list-card-top .c-card-top {
    width: calc(33.333% - 4.5rem);
    margin: 2.25rem;
  }
}
/*---------- START COMPONENT CARD TOP ----------*/
.c-card-top__link {
  text-decoration: none;
}
.c-card-top__img {
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  & img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
.c-card-top__title {
  font-weight: 400;
}

@media only screen and (min-width: 576px) {
  .c-card-top__head {
    display: flex;
    flex-wrap: wrap;
  }
  .c-card-top__time {
    margin-right: 1.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-card-top__img {
    margin-bottom: 1.5rem;
    border-radius: 1rem;
  }
  .c-card-top__time {
    margin-bottom: 0.5rem;
  }
  .c-card-top__title {
    margin-top: 1rem;
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-top__link:hover .c-card-top__img img {
    transform: scale(1.05);
  }
  .c-card-top__img {
    margin-bottom: 2.2rem;
    border-radius: 2rem;
  }
  .c-card-top__title {
    margin-top: 0.8rem;
    margin-right: -1rem;
    font-size: 1.6rem;
  }
}