@charset "UTF-8";
/*!
Theme Name: Original Theme
Description: Cocoon専用の子テーマで作ったオリジナルテーマ
Template:   cocoon-master
Version:    1.1.3
*/
/************************************
** 子テーマ用のスタイルを書く
************************************/
/* 必要ならばここにコードを書く */
a:hover {
  color: inherit;
}

.a-wrap:hover,
.navi-in a:hover,
.widget_block ul li a:hover {
  background-color: transparent;
}

.header-in .site-name-text-link {
  padding: 0;
}

.header-container,
.main,
.navi,
.sidebar,
.footer {
  background-color: transparent;
}

.main {
  padding: 0;
}

.main,
.sidebar {
  width: 100%;
}

.entry-content {
  margin-top: 0;
  margin-bottom: 0;
}
.entry-content > *:last-child {
  margin-bottom: 0;
}

#list,
.list-wrap {
  margin-bottom: 0;
}

.ect-entry-card .a-wrap:not(.ec-big-card-first) .card-thumb,
.rect-entry-card .a-wrap:not(.ec-big-card-first) .card-thumb,
.ect-big-card-first .a-wrap:not(.ec-big-card-first) .card-thumb {
  margin-bottom: 0;
}

.entry-categories-tags .entry-categories .cat-link {
  margin: 0;
}

.author-box .author-thumb {
  margin: 0;
}
.author-box .author-content {
  margin-left: 0;
}
.author-box .author-content .author-name {
  margin-bottom: 0;
}
.author-box .author-content .author-description {
  margin-bottom: 0;
}
.author-box .author-content .author-description p {
  margin: 0;
}
.author-box.cf::after {
  display: none;
}

html {
  font-size: 16px;
}

body {
  font-family: "Montserrat", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "遊ゴシック", Meiryo, sans-serif;
  background-color: #f5f5f5;
}
@media screen and (width <= 834px) {
  body[class*=fz-] {
    font-size: 1rem;
  }
}
@media screen and (width <= 480px) {
  body[class*=fz-] {
    font-size: 0.9rem;
  }
}

.header {
  width: 100%;
}

.header-container {
  position: sticky;
  top: 0;
  z-index: calc(infinity);
  width: 100%;
  padding: 1em clamp(1.25rem, 1.077rem + 0.769vw, 2rem);
  transition: 0.3s;
}
.scrolled .header-container {
  background-color: rgba(245, 245, 245, 0.8);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
@media screen and (max-width: 1023px) {
  .header-container {
    display: none;
  }
}

.header-in {
  flex-direction: row;
  place-content: space-between;
  place-items: center;
}

.site-name-text {
  font-weight: bold;
}

.header-container-in.hlt-top-menu .site-name-text {
  font-size: 28px;
}

.navi-in .item-label {
  position: relative;
  width: -moz-fit-content !important;
  width: fit-content !important;
  font-weight: bold;
}
.navi-in .item-label::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 2px;
  content: "";
  background-color: #0aa864;
  transition: 0.3s;
}
.navi-in .item-label:hover::after {
  width: 100%;
}

.mobile-header-menu-buttons {
  padding: 1.25rem 1.5rem;
}

.mobile-menu-buttons {
  z-index: 100000 !important;
  gap: 1em;
}
.mobile-menu-buttons .logo-menu-button {
  justify-content: flex-start;
  font-size: 1.8rem;
  line-height: 1;
}
.mobile-menu-buttons .logo-menu-button .menu-button-in {
  z-index: calc(infinity);
  color: #f5f5f5;
  mix-blend-mode: difference;
}
@media screen and (max-width: 834px) {
  .mobile-menu-buttons .logo-menu-button {
    font-size: 1.5rem;
  }
}
.mobile-menu-buttons .menu-button {
  width: initial;
}
.mobile-menu-buttons .navi-menu-icon {
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  grid-template-columns: repeat(3, 1fr);
  gap: 0.25rem;
  width: 2rem;
  aspect-ratio: 1;
}
.mobile-menu-buttons .navi-menu-icon span {
  display: block;
  transition: 0.3s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(1) {
  background-color: #099e5e;
  transition-delay: 0.05s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(2) {
  background-color: #099559;
  transition-delay: 0.1s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(3) {
  background-color: #088b53;
  transition-delay: 0.15s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(4) {
  background-color: #08814d;
  transition-delay: 0.2s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(5) {
  background-color: #077847;
  transition-delay: 0.25s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(6) {
  background-color: #076e42;
  transition-delay: 0.3s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(7) {
  background-color: #06653c;
  transition-delay: 0.35s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(8) {
  background-color: #055b36;
  transition-delay: 0.4s;
}
.mobile-menu-buttons .navi-menu-icon span:nth-of-type(9) {
  background-color: #055130;
  transition-delay: 0.45s;
}
.mobile-menu-buttons #navi-menu-input:checked + #navi-menu-open .navi-menu-icon span {
  background-color: #f5f5f5;
}
.mobile-menu-buttons #navi-menu-input:checked + #navi-menu-open .navi-menu-icon span:nth-of-type(even) {
  opacity: 0;
  transform: translateY(-100%);
}
.mobile-menu-buttons .menu-caption {
  display: none;
}
.mobile-menu-buttons .menu-open {
  z-index: calc(infinity);
}
.mobile-menu-buttons .navi-menu-content {
  display: flex;
  flex-direction: column;
  gap: 3em;
  place-content: center;
  place-items: center;
  background: rgba(30, 37, 37, 0.95);
}
@media screen and (max-width: 1023px) {
  .mobile-menu-buttons .navi-menu-content {
    max-width: 100%;
    overflow-x: hidden;
  }
}
.mobile-menu-buttons .menu-drawer {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 1.5rem;
}
.mobile-menu-buttons .menu-item {
  font-size: 8.4vw;
  font-weight: bold;
}
.mobile-menu-buttons .menu-item a {
  padding-block: 1rem;
  color: #f5f5f5;
  border-top: 1px solid #698076;
}
.mobile-menu-buttons .menu-item a:hover {
  background-color: rgba(105, 128, 118, 0.1);
}
.mobile-menu-buttons .menu-item:last-of-type a {
  border-bottom: 1px solid #698076;
}
.mobile-menu-buttons .search-box {
  width: calc(100% - 3rem);
  margin: 0;
}
.mobile-menu-buttons .search-box .search-edit {
  height: 4em;
}
.mobile-menu-buttons .sns-list__link {
  color: #f5f5f5;
}

.footer-bottom {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  place-content: center;
}

.footer-bottom-logo {
  position: initial;
}
.footer-bottom-logo .site-name-text {
  font-size: 2rem;
  font-weight: bold;
  line-height: 1;
}

.footer-bottom-content,
.copyright {
  text-align: center;
}

.navi-footer-in > .menu-footer {
  justify-content: center;
}

.content {
  padding: 0 clamp(1.25rem, 1.077rem + 0.769vw, 2rem) 4em;
  margin-top: 0;
}
@media screen and (max-width: 834px) {
  .content {
    margin-top: 6rem;
  }
}

.wrap {
  width: 100%;
  max-width: 1024px;
}

main.main {
  padding: 0 0 4em;
  margin: 0;
}
@media screen and (max-width: 834px) {
  main.main {
    padding: 0 0 2em;
  }
}

.content-top {
  padding-inline: clamp(1.25rem, 1.077rem + 0.769vw, 2rem);
  margin: 0;
  background-color: #1e2525;
}
@media screen and (max-width: 1023px) {
  .content-top {
    margin: 4.5rem 0 0;
  }
}
@media screen and (max-width: 834px) {
  .content-top {
    display: none;
  }
}

.toc {
  width: 100%;
  max-width: 480px;
  font-weight: 600;
  background-color: #eaeeec;
  border: none;
  border-radius: 0.5em;
}
.toc a {
  color: #4c5d5d;
}

.cocoon-block-balloon.not-nested-style > .speech-balloon {
  background-color: #dce3df;
}

.cocoon-block-balloon.not-nested-style.sbs-flat > .speech-balloon::before,
.cocoon-block-balloon.not-nested-style.sbs-flat > .speech-balloon::after {
  border-right-color: #dce3df;
  border-left-color: #dce3df;
}

.marker-under {
  padding: 0.15em 0.125em;
  background: repeating-linear-gradient(-45deg, #f2ec99, #f2ec99 2px, transparent 2px, transparent 4px) no-repeat 0 0.75em;
}

.page .entry-title, .home .section__title {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  place-content: start;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  border-left: 2px solid #0aa864;
}
.page .entry-title::after, .home .section__title::after {
  font-size: 2.5rem;
  color: #0aa864;
  content: attr(data-en-title);
}

.home .main-visual {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding-block: 6rem clamp(4rem, 3.538rem + 2.051vw, 6rem);
}
@media screen and (max-width: 480px) {
  .home .main-visual {
    padding-block-start: 2rem;
  }
}
.home .main-visual__title .en {
  font-size: min(20vw, 8rem);
  line-height: 1.1;
  color: transparent;
  background: linear-gradient(160deg, #117248, #0aa864, #4caf50);
  -webkit-background-clip: text;
          background-clip: text;
}
.home .main-visual__title .ja {
  margin-top: 0.5em;
  font-size: min(8vw, 3rem);
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.home .main-visual__description {
  padding-left: 0.5rem;
}
@media screen and (max-width: 480px) {
  .home .main-visual__description {
    padding-left: 0;
  }
}
.home .section {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding-block: clamp(6rem, 5.538rem + 2.051vw, 8rem);
}
.home .section::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: 60%;
  max-width: 440px;
  aspect-ratio: 1;
  content: "";
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.home .section#about::before {
  top: 5rem;
  max-width: 640px;
  aspect-ratio: 610/261;
  background-image: url("https://mimihokuro.com/wp-content/uploads/2025/02/undraw_hello_1nh3-1.png");
}
@media screen and (max-width: 480px) {
  .home .section#about::before {
    top: 4rem;
    width: 73%;
  }
}
.home .section#skill::before {
  max-width: 440px;
  aspect-ratio: 405/329;
  background-image: url("https://mimihokuro.com/wp-content/uploads/2025/02/undraw_design-notes_vwa7-1.png");
}
.home .section#app::before {
  top: 1rem;
  width: 45%;
  max-width: 380px;
  aspect-ratio: 161/187;
  background-image: url("https://mimihokuro.com/wp-content/uploads/2025/02/undraw_futuristic-interface_sv51-1.png");
}
.home .section__summary {
  font-size: clamp(1.4rem, 1.146rem + 1.128vw, 2.5rem);
  font-weight: 600;
  line-height: 1.5;
}
.home .section__description {
  line-height: 2;
}

#blog.section {
  place-items: center;
}
#blog .section__title {
  text-align: center;
  border-left: none;
}

.page .article {
  display: grid;
  grid-template-columns: 14rem 1fr;
  gap: 2rem;
}
@media screen and (width <= 834px) {
  .page .article {
    grid-template-columns: 1fr;
  }
}
.page .article h2 {
  padding: 1.5rem 0;
  margin-bottom: 0;
  font-size: clamp(1.75rem, 1.577rem + 0.769vw, 2.5rem);
  background-color: transparent;
}
.page .article h2:not(:first-of-type) {
  margin-top: 3em;
}
.page .entry-title {
  position: sticky;
  top: 10rem;
  flex-direction: column-reverse;
  margin: 0;
}
@media screen and (width <= 834px) {
  .page .entry-title {
    position: static;
    margin-top: 5rem;
  }
  .page .entry-title::after {
    font-size: 3rem;
  }
}
.page .entry-title::after {
  text-transform: capitalize;
}
.page .content__wrapper {
  margin-top: 10rem;
}
@media screen and (width <= 834px) {
  .page .content__wrapper {
    margin-top: 0;
  }
}
.page .wpcf7 .contact__label {
  display: flex;
  gap: 1em;
  place-content: space-between;
  place-items: center;
}
@media screen and (max-width: 834px) {
  .page .wpcf7 .contact__label {
    flex-direction: column;
    gap: 0.5em;
    place-content: start;
    place-items: start;
  }
}
.page .wpcf7 .contact__label .label-text {
  display: flex;
  flex-basis: 30%;
  gap: 0.5em;
  place-content: space-between;
  place-items: center;
}
@media screen and (max-width: 834px) {
  .page .wpcf7 .contact__label .label-text {
    flex-basis: initial;
    gap: 1em;
    place-content: start;
  }
}
.page .wpcf7 .contact__label .label-text.required::after {
  padding: 0.25em 0.5em;
  font-size: 0.9em;
  line-height: 1;
  color: #0aa864;
  white-space: nowrap;
  content: "必須";
  border: 1px solid #0aa864;
  border-radius: 0.25em;
}
.page .wpcf7 .contact__label .wpcf7-form-control-wrap {
  flex-basis: 70%;
}
.page .wpcf7 .contact__label .wpcf7-form-control-wrap textarea {
  field-sizing: content;
}
@media screen and (max-width: 834px) {
  .page .wpcf7 .contact__label .wpcf7-form-control-wrap {
    flex-basis: initial;
    width: 100%;
  }
}

.single main.main {
  width: calc(100% - 2rem - 296px);
}
@media screen and (max-width: 834px) {
  .single main.main {
    width: 100%;
  }
}
.single.no-mobile-sidebar .sidebar {
  width: 296px;
  padding: 0 0 4em;
  margin: 1.25em 0 0;
}
@media screen and (max-width: 1023px) {
  .single.no-mobile-sidebar .sidebar {
    display: block;
  }
}
@media screen and (max-width: 834px) {
  .single.no-mobile-sidebar .sidebar {
    display: none;
    width: 100%;
  }
}
.single .sidebar-scroll {
  top: 7rem;
}
.single .nwa .toc {
  padding: 1.5em;
}
.single .multi-column {
  flex-wrap: nowrap;
}
@media screen and (max-width: 1023px) {
  .single .multi-column {
    display: flex;
  }
}
@media screen and (max-width: 834px) {
  .single .multi-column {
    display: block;
    flex-wrap: wrap;
  }
}
.single .entry-header {
  position: relative;
  padding-top: 3em;
  margin-top: 1.5em;
}
.single .entry-title {
  z-index: 1;
  max-width: 100%;
  padding: 0;
  font-size: clamp(1.375rem, 1.173rem + 0.897vw, 2.25rem);
  line-height: 1.5;
}
@media screen and (width <= 480px) {
  .single .entry-title {
    margin-bottom: 1em;
  }
}
.single .entry-title-category {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  font-size: 4.5em;
  font-weight: bold;
  line-height: 1;
  color: #4caf50;
  opacity: 0.2;
}
.single .date-tags {
  display: flex;
  gap: 1.25em;
  place-items: center;
  margin-bottom: 2em;
  text-align: left;
}
.single .date-tags .post-date,
.single .date-tags .post-update {
  margin-right: 0;
}
.single .eye-catch {
  margin-bottom: 2em;
}
.single .eye-catch img {
  border-radius: 0.5em;
}
.single .article {
  /* stylelint-disable-next-line no-descending-specificity */
  /* stylelint-disable-next-line no-descending-specificity */
}
.single .article h2 {
  position: relative;
  padding: 0.8em 0.25em;
  font-size: clamp(1.25rem, 1.135rem + 0.513vw, 1.75rem);
  font-weight: 700;
  line-height: 1.5;
  background-color: transparent;
}
.single .article h2::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #0aa864 30%, #8f8f8f 30%);
}
.single .article h3 {
  padding: 0.5em 1em;
  font-size: clamp(1.125rem, 1.038rem + 0.385vw, 1.5rem);
  line-height: 1.5;
  border: none;
  border-left: 6px solid #0aa864;
}
.single .article p code {
  padding: 0.2em;
  font-weight: 600;
  color: #099056;
  background-color: #ededed;
  border-radius: 0.25em;
}
.single .article h4 {
  display: flex;
  gap: 0.5em;
  place-items: center;
  padding-inline: 0.25em;
  font-size: clamp(1rem, 0.942rem + 0.256vw, 1.25rem);
  border: none;
}
.single .article h4::before {
  display: block;
  width: 1em;
  height: 0.6em;
  content: "";
  border-bottom: 3px solid #0aa864;
  border-left: 3px solid #0aa864;
  transform: translateY(-0.2em) rotate(-45deg);
}
.single .article * + h2,
.single .article * + h3,
.single .article * + h4 {
  margin-top: 2em;
  margin-bottom: 1em;
}
.single .wp-block-quote {
  padding-block: 2em;
  border: none;
  border-radius: 0.5em;
}
* + .single .wp-block-cocoon-blocks-blogcard {
  margin-block: 2em 4em;
}
.single .wp-block-cocoon-blocks-blogcard .blogcard-wrap {
  width: 100%;
  border-radius: 0.5em;
}
.single .wp-block-cocoon-blocks-blogcard .blogcard {
  padding: 1.6em 1.5em 1em;
  border-color: #0aa864;
}
.single .wp-block-cocoon-blocks-blogcard .blogcard-label {
  background-color: #0aa864;
}
.single .hcb_wrap.hcb_wrap > pre {
  border-radius: 0.5em;
}
.single .hcb_wrap.hcb_wrap > pre::before {
  min-width: 3em;
  border-radius: 0.5em 0 0 0.5em;
}
.single .wp-block-code {
  border-radius: 0.5em;
}
.single .wp-block-image img {
  border-radius: 0.5em;
}
.single .wp-block-table {
  background-color: #f5f5f5;
  border: 1px solid #bfbfbf;
  border-radius: 0.5em;
}
.single .wp-block-table tr:nth-of-type(2n + 1) {
  background-color: #eaeeec;
}
.single .entry-categories-tags {
  margin-block: 2em;
}
.single .entry-categories-tags .entry-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}

.archive .archive-title {
  font-size: 3em;
}
.archive .archive-title .fas {
  display: none;
}

.button {
  display: flex;
  gap: 2rem;
  place-content: space-between;
  place-items: center;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1rem 1.5rem;
  font-size: 1.2em;
  line-height: 1;
  text-decoration: none;
  border: 1px solid #0aa864;
  border-radius: calc(infinity * 1px);
  transition: color 0.3s, background-color 0.3s;
}
.button.button--primary {
  color: #f5f5f5;
  background-color: #0aa864;
}
.button::after {
  display: block;
  width: 1.2em;
  height: 1.2em;
  content: "";
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path  fill="%23ffffff" d="M13.267 4.209a.75.75 0 0 0-1.034 1.086l6.251 5.955H3.75a.75.75 0 0 0 0 1.5h14.734l-6.251 5.954a.75.75 0 0 0 1.034 1.087l7.42-7.067a1 1 0 0 0 .3-.58a.8.8 0 0 0-.001-.29a1 1 0 0 0-.3-.578z"/></svg>');
  background-repeat: no-repeat;
  background-size: 100%;
  transition: transform 0.3s;
}
.button:hover {
  color: #0aa864;
  background-color: transparent;
}
.button:hover::after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path  fill="%230aa864" d="M13.267 4.209a.75.75 0 0 0-1.034 1.086l6.251 5.955H3.75a.75.75 0 0 0 0 1.5h14.734l-6.251 5.954a.75.75 0 0 0 1.034 1.087l7.42-7.067a1 1 0 0 0 .3-.58a.8.8 0 0 0-.001-.29a1 1 0 0 0-.3-.578z"/></svg>');
  transform: translateX(0.5em);
}

input[type=submit] {
  padding-block: 2rem;
  font-size: 1.2em;
  color: #f5f5f5;
  background-color: #0aa864;
  border: 1px solid #0aa864;
  border-radius: 0.5rem;
  transition: all 0.3s;
}
input[type=submit]:hover {
  color: #0aa864;
  background-color: transparent;
}

.background-grid {
  position: fixed;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100lvh;
}

.background-grid__line-item {
  position: absolute;
  background: #eaeeec;
}

.dot {
  position: absolute;
  width: 4px;
  height: 4px;
  background-color: #d9d9d9;
  transform: translate(-50%, -50%);
}

.background-grid__line.horizontal .background-grid__line-item {
  left: 0;
  width: 100%;
  height: 1px;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(1) {
  top: 12.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(1) .dot {
  animation-delay: -10s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(1) {
    top: 8.3333333333lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(2) {
  top: 25lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(2) .dot {
  animation-delay: -20s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(2) {
    top: 16.6666666667lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(3) {
  top: 37.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(3) .dot {
  animation-delay: -30s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(3) {
    top: 25lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(4) {
  top: 50lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(4) .dot {
  animation-delay: -40s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(4) {
    top: 33.3333333333lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(5) {
  top: 62.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(5) .dot {
  animation-delay: -50s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(5) {
    top: 41.6666666667lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(6) {
  top: 75lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(6) .dot {
  animation-delay: -60s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(6) {
    top: 50lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(7) {
  top: 87.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(7) .dot {
  animation-delay: -70s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(7) {
    top: 58.3333333333lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(8) {
  top: 100lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(8) .dot {
  animation-delay: -80s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(8) {
    top: 66.6666666667lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(9) {
  top: 112.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(9) .dot {
  animation-delay: -90s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(9) {
    top: 75lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(10) {
  top: 125lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(10) .dot {
  animation-delay: -100s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(10) {
    top: 83.3333333333lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(11) {
  top: 137.5lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(11) .dot {
  animation-delay: -110s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(11) {
    top: 91.6666666667lvh;
  }
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(12) {
  top: 150lvh;
}
.background-grid__line.horizontal .background-grid__line-item:nth-of-type(12) .dot {
  animation-delay: -120s;
}
@media screen and (max-width: 480px) {
  .background-grid__line.horizontal .background-grid__line-item:nth-of-type(12) {
    top: 100lvh;
  }
}
.background-grid__line.horizontal .dot {
  top: 50%;
  animation: move-dot-h 24s infinite ease;
}
@keyframes move-dot-h {
  0% {
    left: -1%;
  }
  100% {
    left: 101%;
  }
}
.background-grid__line.vertical .background-grid__line-inner {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  max-width: 1024px;
  height: 100%;
  transform: translateX(-50%);
}
.background-grid__line.vertical .background-grid__line-item {
  top: 0;
  width: 1px;
  height: 100%;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(1) {
  left: -384px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(1) .dot {
  animation-delay: -13s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(1) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 0 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(1) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 0 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(2) {
  left: -256px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(2) .dot {
  animation-delay: -26s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(2) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 1 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(2) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 1 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(3) {
  left: -128px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(3) .dot {
  animation-delay: -39s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(3) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 2 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(3) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 2 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(4) {
  left: 0px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(4) .dot {
  animation-delay: -52s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(4) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 3 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(4) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 3 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(5) {
  left: 128px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(5) .dot {
  animation-delay: -65s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(5) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 4 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(5) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 4 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(6) {
  left: 256px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(6) .dot {
  animation-delay: -78s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(6) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 5 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(6) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 5 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(7) {
  left: 384px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(7) .dot {
  animation-delay: -91s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(7) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 6 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(7) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 6 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(8) {
  left: 512px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(8) .dot {
  animation-delay: -104s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(8) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 7 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(8) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 7 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(9) {
  left: 640px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(9) .dot {
  animation-delay: -117s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(9) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 8 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(9) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 8 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(10) {
  left: 768px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(10) .dot {
  animation-delay: -130s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(10) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 9 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(10) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 9 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(11) {
  left: 896px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(11) .dot {
  animation-delay: -143s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(11) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 10 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(11) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 10 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(12) {
  left: 1024px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(12) .dot {
  animation-delay: -156s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(12) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 11 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(12) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 11 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(13) {
  left: 1152px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(13) .dot {
  animation-delay: -169s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(13) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 12 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(13) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 12 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(14) {
  left: 1280px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(14) .dot {
  animation-delay: -182s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(14) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 13 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(14) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 13 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(15) {
  left: 1408px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(15) .dot {
  animation-delay: -195s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(15) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 14 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(15) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 14 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(16) {
  left: 1536px;
}
.background-grid__line.vertical .background-grid__line-item:nth-of-type(16) .dot {
  animation-delay: -208s;
}
@media screen and (max-width: 1023px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(16) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 8 * 15 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
@media screen and (max-width: 834px) {
  .background-grid__line.vertical .background-grid__line-item:nth-of-type(16) {
    left: calc((100% - clamp(1.25rem, 1.077rem + 0.769vw, 2rem) * 2) / 4 * 15 + clamp(1.25rem, 1.077rem + 0.769vw, 2rem));
  }
}
.background-grid__line.vertical .background-grid__line-item .dot {
  left: 50%;
  animation: move-dot-v 24s infinite ease;
}
@keyframes move-dot-v {
  0% {
    top: -1%;
  }
  100% {
    top: 101%;
  }
}

#loading-screen {
  position: fixed;
  top: 0;
  left: 0;
  z-index: calc(infinity);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: #f5f5f5;
}

.loader {
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  width: 4rem;
  height: 4rem;
}

.loader span {
  background: #0aa864;
  animation: loader-scale 1.9s infinite, loader-fade 1.9s infinite;
  animation-timing-function: ease-in-out;
}

.loader span:nth-child(1) {
  animation-delay: 0s;
}

.loader span:nth-child(2) {
  animation-delay: 0.15s;
}

.loader span:nth-child(3) {
  animation-delay: 0.3s;
}

.loader span:nth-child(4) {
  animation-delay: 0.15s;
}

.loader span:nth-child(5) {
  animation-delay: 0.3s;
}

.loader span:nth-child(6) {
  animation-delay: 0.45s;
}

.loader span:nth-child(7) {
  animation-delay: 0.3s;
}

.loader span:nth-child(8) {
  animation-delay: 0.45s;
}

.loader span:nth-child(9) {
  animation-delay: 0.6s;
}

@keyframes loader-scale {
  0%, 47.36842105263158%, 100% {
    transform: scale(1);
  }
  23.68421052631579% {
    transform: scale(0);
  }
}
@keyframes loader-fade {
  0%, 47.36842105263158%, 100% {
    opacity: 1;
  }
  23.68421052631579% {
    opacity: 1;
  }
}
.skill-list__item {
  display: flex;
  gap: 2rem;
  place-content: space-between;
  padding: 2rem 1rem;
  border-block: 1px solid #bfbfbf;
}
@media screen and (width <= 834px) {
  .skill-list__item {
    flex-direction: column;
  }
}
@media screen and (width <= 480px) {
  .skill-list__item {
    padding-inline: 0;
  }
}

.skill-list__main {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 256px;
}
@media screen and (width <= 834px) and (width > 480px) {
  .skill-list__main {
    flex-flow: row wrap;
    gap: 2rem;
  }
}

.skill-list__heading {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  line-height: 1;
}
.skill-list__heading .en {
  font-size: clamp(1.25rem, 1.192rem + 0.256vw, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  background-color: rgba(var(--color-primary, 0.3));
}
.skill-list__heading .ja {
  font-size: 1rem;
}

.skill-list__skill-images {
  display: flex;
  gap: 1rem;
}

.skill-list__sub {
  max-width: 540px;
  font-size: clamp(0.9rem, 0.877rem + 0.103vw, 1rem);
}
@media screen and (width <= 834px) {
  .skill-list__sub {
    max-width: initial;
  }
}

.related-entry-card-wrap,
.entry-card-wrap {
  position: relative;
  padding-block: 2rem;
  border-bottom: 1px solid #bfbfbf;
}
.related-entry-card-wrap::after,
.entry-card-wrap::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 1px;
  content: "";
  background-color: #0aa864;
  transition: width 0.3s;
}
.related-entry-card-wrap:hover::after,
.entry-card-wrap:hover::after {
  width: 100%;
}

.related-entry-card-wrap:first-of-type {
  border-top: 1px solid #bfbfbf;
}

.related-entry-card,
.entry-card {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 3rem;
}
@media screen and (width <= 834px) {
  .related-entry-card,
  .entry-card {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}
.related-entry-card .admin-pv,
.entry-card .admin-pv {
  margin: 1rem 0 0;
}

.post-date,
.post-update {
  font-size: 1rem;
}

.related-entry-card-content,
.entry-card-content {
  display: flex;
  flex-direction: column;
  padding-bottom: 0;
  margin-left: 0;
}
.related-entry-card-content > *:not(:first-child),
.entry-card-content > *:not(:first-child) {
  margin: 0;
  margin-top: 1rem;
}

.related-entry-card-title,
.entry-card-title {
  margin-bottom: 0;
}

.related-entry-card-thumb,
.entry-card-thumb {
  width: 100%;
  margin: 0;
}
.related-entry-card-thumb > img,
.entry-card-thumb > img {
  border-radius: 0.5rem;
}

.related-entry-card-meta,
.entry-card-meta {
  position: initial;
  text-align: initial;
}

.e-card-info {
  gap: 1rem;
  justify-content: flex-start;
}

.related-list,
.list {
  gap: 0;
}

.cat-label {
  position: initial;
  padding: 0.25rem 0.5rem;
  border: none;
  border-radius: calc(infinity * 1px);
}

.related-entry-card-snippet,
.entry-card-snippet {
  line-height: 1.8;
}

.page-numbers {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border-color: #8f8f8f;
  border-radius: 50%;
  transition: 0.3s;
}
.page-numbers:not(.dots, .current):hover {
  border-color: #0aa864;
}
@media screen and (width <= 480px) {
  .page-numbers.dots {
    display: block;
  }
}
.page-numbers.current {
  font-weight: bold;
  color: #f5f5f5;
  background-color: #0aa864;
  border-color: #0aa864;
}

/* stylelint-disable font-family-no-missing-generic-family-keyword */
.sns-list {
  display: flex;
  gap: clamp(1.5rem, 1.385rem + 0.513vw, 2rem);
  place-content: center;
  place-items: center;
}

.sns-list__link {
  font-family: "Font Awesome 5 Free";
  font-size: 2em;
  font-weight: 900;
  color: #1e2525;
  text-decoration: none;
}
.sns-list__link i::before {
  font-style: normal;
}
.sns-list__link .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  clip: rect(0, 0, 0, 0);
}

@media screen and (width <= 480px) {
  .ss-col-4 .sns-share-buttons {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .ss-col-4 .sns-share-buttons a {
    width: 100%;
  }
}

.author-box .sns-follow-buttons a.follow-button {
  display: block;
  width: initial;
  height: initial;
  font-size: 2em;
  line-height: 1;
  border: none;
}

.widget .author-box {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 1rem;
  padding: 1.6em 1.5em 2em;
  background-color: #eaeeec;
  border: none;
  border-radius: 0.5em;
}
@media screen and (max-width: 480px) {
  .widget .author-box {
    grid-template-columns: 1fr;
    place-items: center;
  }
}
.widget .author-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media screen and (max-width: 480px) {
  .widget .author-content {
    place-items: center;
  }
}
.widget .widget-sidebar-title {
  position: relative;
  margin: 0;
}
.widget .widget-sidebar-title::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #0aa864 30%, #8f8f8f 30%);
}
.widget .popular-entry-card-link,
.widget .new-entry-card-link {
  position: relative;
  padding-block: 1em;
  margin-bottom: 0;
  border-bottom: 1px solid #bfbfbf;
}
.widget .popular-entry-card-link::after,
.widget .new-entry-card-link::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 1px;
  content: "";
  background-color: #0aa864;
  transition: width 0.3s;
}
.widget .popular-entry-card-link:hover::after,
.widget .new-entry-card-link:hover::after {
  width: 100%;
}
.widget .popular-entry-card-thumb {
  display: none;
}
.widget .popular-entry-card-content {
  margin-left: 0;
}
.widget.widget-content-top {
  margin-bottom: 0;
}
.home .widget.widget-content-top, .page .widget.widget-content-top {
  display: none;
}
.widget.widget-content-top.widget_categories > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1rem;
  place-items: center;
}
.widget.widget-content-top.widget_categories > ul li a {
  padding-block: 1em;
  line-height: 1;
  color: #f5f5f5;
}
.widget.widget-content-top.widget_categories > ul li a:hover {
  background-color: transparent;
}

.widget-index-bottom {
  margin-top: 2em;
}

.widget-single-content-middle,
.widget-single-content-bottom {
  margin-block: 3em;
}

.contact-area {
  padding: clamp(6rem, 4.615rem + 6.154vw, 12rem) 1.5rem clamp(5rem, 3.615rem + 6.154vw, 11rem);
  color: #f5f5f5;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://mimihokuro.com/wp-content/uploads/2024/11/pexels-miriamespacio-365633.jpg");
  background-position: bottom;
  background-size: cover;
}

.contact-area__wrapper {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.contact-area__heading {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
}

.contact-area__heading-en {
  width: 100%;
  max-width: 480px;
  height: 100%;
  aspect-ratio: 16/3;
}
.contact-area__heading-en svg {
  width: 100%;
}

.contact-area__description {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/* 1023px以下 */
@media screen and (width <= 1023px) {
  /* 必要ならばここにコードを書く */
}
/* 834px以下 */
@media screen and (width <= 834px) {
  /* 必要ならばここにコードを書く */
}
/* 480px以下 */
@media screen and (width <= 480px) {
  /* 必要ならばここにコードを書く */
}/*# sourceMappingURL=style.css.map */