.component-navigation {
  grid-column: 1 / -1;
  align-items: center;
  gap: 24px;
  margin-top: 60px;
  display: flex;
}

.component-navigation > .prev circle {
  fill: #0000;
  transition: fill .3s;
}

.component-navigation > .prev path {
  transition: stroke .3s;
}

.component-navigation > .prev:hover circle {
  fill: var(--color-primary-4);
}

.component-navigation > .prev:hover path {
  stroke: #fff;
}

.component-navigation > .prev.disabled {
  pointer-events: none;
  opacity: .2;
}

.component-navigation > .next circle {
  fill: #0000;
  transition: fill .3s;
}

.component-navigation > .next path {
  transition: stroke .3s;
}

.component-navigation > .next:hover circle {
  fill: var(--color-primary-4);
}

.component-navigation > .next:hover path {
  stroke: #fff;
}

.component-navigation > .next.disabled {
  pointer-events: none;
  opacity: .2;
}

.component-navigation > .pagination {
  width: auto;
}

.component-navigation > .pagination > p {
  letter-spacing: 3px;
  color: var(--color-primary-2);
  font-family: Poppins, sans-serif;
  font-size: 32px;
  font-weight: 200;
  line-height: 1.2;
}

.component-navigation > .left-line {
  background-color: var(--color-primary-4);
  flex-grow: 1;
  height: 1px;
}

.component-navigation > .right-line {
  background-color: var(--color-primary-4);
  flex-grow: 1;
  height: 1px;
}

.component-navigation.hidden {
  display: none;
}

.component-navigation.right-line-only > .left-line {
  display: none;
}

.component-navigation.no-line {
  justify-content: center;
  gap: 40px;
}

.component-navigation.no-line > .left-line {
  display: none;
}

.component-navigation.no-line > .right-line {
  display: none;
}

@media screen and (max-width: 575px) {
  .component-navigation {
    gap: 16px;
    margin-top: 24px;
  }
}
.component-sharing-card {
  grid-template-rows: subgrid;
  grid-row: span 4;
  margin-bottom: 60px;
  display: grid;
}

.component-sharing-card > .img {
  aspect-ratio: 3 / 2;
  border-radius: 10px;
  margin-bottom: 24px;
  overflow: hidden;
}

.component-sharing-card > .img > img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: transform .3s;
}

.component-sharing-card > .img.square {
  aspect-ratio: 1;
}

.component-sharing-card > h4 {
  margin-bottom: 16px;
  transition: color .3s;
}

.component-sharing-card > p {
  color: var(--color-gray-3);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}

.component-sharing-card > .tags {
  flex-wrap: wrap;
  align-items: start;
  gap: 10px;
  margin-top: 16px;
  display: flex;
}

.component-sharing-card > .tags > p {
  background-color: color-mix(in oklab, var(--color-primary-2) 10%, transparent);
  color: var(--color-primary-2);
  border-radius: 6px;
  padding: 4px 16px;
}

.component-sharing-card:hover > .img > img {
  transform: scale(1.1);
}

.component-sharing-card:hover > h4 {
  color: var(--color-primary-2);
}

.component-sharing-card.swiper-slide {
  margin-bottom: 0;
}

@media screen and (max-width: 575px) {
  .component-sharing-card {
    margin-bottom: 40px;
  }

  .component-sharing-card > .tags {
    gap: 4px;
  }

  .component-sharing-card > .tags > p {
    padding: 4px 8px;
  }
}

.component-share-swiper .swiper-wrapper{
    display: grid;
    grid-auto-flow: column;
	grid-auto-columns: max-content;
}.home-sharing{padding-top:80px;padding-bottom:80px}.home-sharing>a{margin:40px auto 0;display:none}.home-sharing-intro{grid-template-columns:repeat(12,1fr);align-items:end;gap:24px;margin-bottom:60px;display:grid}.home-sharing-title{z-index:1;grid-column:span 5;position:relative}.home-sharing-title>h2{color:var(--color-primary-2);margin-bottom:24px}.home-sharing-title>h3>span{font-family:inherit;display:block}.home-sharing-title>h3>span:nth-child(2){text-align:end}.home-sharing-title>.circle{z-index:-1;aspect-ratio:1;background-color:var(--color-primary-3);border-radius:50%;width:60px;position:absolute;bottom:57px;right:-30px}.home-sharing-content{grid-column:span 6 / -1}.home-sharing-content>p{white-space:pre-line;margin-bottom:24px}.home-sharing-content>a{margin-left:auto}@media screen and (max-width:1023px){.home-sharing-title{grid-column:span 6}.home-sharing-title>.circle{bottom:52px;right:-10px}}@media screen and (max-width:767px){.home-sharing>a{display:flex}.home-sharing-intro{grid-template-columns:100%;gap:40px;margin-bottom:40px}.home-sharing-title{grid-column:auto;max-width:350px}.home-sharing-title>.circle{bottom:15px;right:-34px}.home-sharing-content{grid-column:auto}.home-sharing-content>p{margin-bottom:0}.home-sharing-content>a{display:none}}@media screen and (max-width:575px){.home-sharing{padding-top:60px;padding-bottom:60px}.home-sharing-title>.circle{bottom:15px;right:-20px}}