/* ========== Component ========== */

.c-btn_txt,
.c-archive-ttl,
.c-page-ttl,
.c-pagination_item a {
 font-size: calc(var(--base-font-size) * var(--font-scale));
}

.c-menuBtn {
 display: flex;
 justify-content: center;
 align-items: center;
 flex-direction: column;
 gap: 10.6px;
 /* position: fixed;
 top: 0;
 right: 0; */
 z-index: 70;
 width: 80px;
 height: 80px;
 background: var(--colorLight1);
 border: 0;
 cursor: pointer;
}
@media screen and (max-width: 1920px) {
 .c-menuBtn {
  gap: 0.55vw;
  width: 4.01vw;
  height: 4.01vw;
 }
}
@media screen and (max-width: 768px) {
 .c-menuBtn {
  gap: 6.6px;
  width: 50px;
  height: 50px;
 }
}

.c-menuBtn span {
 align-items: center;
 width: 7.8px;
 height: 7.8px;
 background: var(--colorPoint1);
 border-radius: 15px;
}
@media screen and (max-width: 1920px) {
 .c-menuBtn span {
  width: 0.406vw;
  height: 0.406vw;
 }
}
@media screen and (max-width: 768px) {
 .c-menuBtn span {
  width: 4px;
  height: 4px;
 }
}

.c-btn {
 display: flex;
 align-items: center;
 position: relative;
}
.c-btn_line {
 width: 112px;
 height: 1px;
 background: var(--colorDark2);
}
@media screen and (max-width: 1920px) {
 .c-btn_line {
  width: 5.83vw;
 }
}
.c-btn_txt {
 padding-left: 26px;
 --base-font-size: var(--fz-body);
 letter-spacing: 0.3em;
}
@media screen and (max-width: 1920px) {
 .c-btn_txt {
  padding-left: 1.35vw;
 }
}

.c-btn--more .c-btn_line {
 margin-top: 8px;
 width: 95px;
}
@media screen and (max-width: 1920px) {
 .c-btn--more .c-btn_line {
  margin-top: 0.42vw;
  width: 4.95vw;
 }
}
.c-btn--more .c-btn_txt {
 padding-left: 13px;
 --base-font-size: 1.125rem;
 font-weight: var(--weightMiddle);
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1920px) {
 .c-btn--more .c-btn_txt {
  padding-left: 0.68vw;
 }
}
@media screen and (max-width: 768px) {
 .c-btn--more .c-btn_txt {
  font-size: 0.6rem;
 }
}

.c-dot {
 display: inline-block;
 position: relative;
 width: 7.8px;
 height: 26.2px;
}
@media screen and (max-width: 1920px) {
 .c-dot {
  height: 1.45vw;
 }
}
@media screen and (max-width: 768px) {
 .c-dot {
  height: 15px;
 }
}

.c-dot::before,
.c-dot::after {
 content: "";
 position: absolute;
 left: 0;
 width: 7.8px;
 height: 7.8px;
 border-radius: 50%;
 background: var(--colorPoint1);
}
@media screen and (max-width: 1920px) {
 .c-dot::before,
 .c-dot::after {
  width: 0.406vw;
  height: 0.406vw;
 }
}
@media screen and (max-width: 768px) {
 .c-dot::before,
 .c-dot::after {
  width: 4px;
  height: 4px;
 }
}
.c-dot::before {
 top: 0;
}
.c-dot::after {
 bottom: 0;
}

.c-dot--footer {
 display: inline-block;
 position: relative;
 margin-right: 8px;
 width: 3.5px;
 height: 11.8px;
}
@media screen and (max-width: 1920px) {
 .c-dot--footer {
  margin-right: 0.42vw;
  width: 0.18vw;
  height: 0.61vw;
 }
}
@media screen and (max-width: 768px) {
 .c-dot--footer {
  margin-right: 4px;
  width: 1.75px;
  height: 5.9px;
 }
}
.c-dot--footer::before,
.c-dot--footer::after {
 content: "";
 width: 3.5px;
 height: 3.5px;
}
@media screen and (max-width: 1920px) {
 .c-dot--footer::before,
 .c-dot--footer::after {
  width: 0.18vw;
  height: 0.18vw;
 }
}
@media screen and (max-width: 768px) {
 .c-dot--footer::before,
 .c-dot--footer::after {
  width: 1.75px;
  height: 1.75px;
 }
}

.c-pagination {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 column-gap: 60%;
 justify-content: center;
 margin: 0 auto 10%;
 width: fit-content;
}
.c-pagination_item {
 min-width: 80px;
 text-align: center;
}
.c-pagination_item a {
 display: inline-block;
 --base-font-size: var(--fz-body);
 letter-spacing: 0.5em;
}

.c-sec-title {
 display: flex;
 justify-content: flex-end;
 align-items: center;
 padding-right: 35px;
}
@media screen and (max-width: 1920px) {
 .c-sec-title {
  padding-right: 1.82vw;
 }
}
@media screen and (max-width: 768px) {
 .c-sec-title {
  padding-right: 19px;
 }
}
.c-sec-title span:nth-child(1) {
 margin-bottom: -6px;
 margin-right: 24px;
 font-weight: var(--weightMiddle);
 letter-spacing: 0.1em;
}
@media screen and (max-width: 1920px) {
 .c-sec-title span:nth-child(1) {
  margin-bottom: -0.31vw;
  margin-right: 0.7em;
 }
}

.c-sec-headimage {
 margin: 2% auto 4.5%;
 max-width: 1480px;
}
@media screen and (max-width: 1500px) {
 .c-sec-headimage {
  max-width: calc(100% - (2vw *2));
 }
}
@media screen and (max-width:768px) {
 .c-sec-headimage {
  margin: 0 auto 5.5%;
  max-width: 100%;
 }
}

.c-archive-ttl {
 /* margin-top: 0.5%; */
 --base-font-size: 2.875rem;
 font-weight: var(--weightMiddle);
 text-align: center;
 transform: translateY(-93%);
}

.c-page-ttl {
 margin-top: 20px;
 --base-font-size: 2.875rem;
 font-weight: var(--weightMiddle);
 text-align: center;
}
@media screen and (max-width: 1920px) {
 .c-page-ttl {
  margin-top: 1.04vw;
 }
}