@charset "UTF-8";
/*
Theme Name: YURI TORIYAMA Portfolio
*/
* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  padding-inline-start: 0;
  margin-block: 0;
  list-style-type: "";
}

h1,
h2,
h3,
h4 {
  margin-block: 0;
  font-size: 1em;
  font-weight: normal;
}

p {
  margin-block: 0;
}

address {
  font-style: normal;
}

button {
  padding: 0;
  background-color: transparent;
  border: none;
}

input,
textarea {
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  padding: 0;
  background-color: transparent;
  border: none;
}

input[type=submit] {
  font-size: 1em;
}

textarea {
  display: block;
}

small {
  font-size: 1em;
}

label {
  display: block;
}

html {
  scrollbar-gutter: stable;
}

body {
  font-family: "Helvetica Neue", arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  color: #222;
  line-break: strict;
  overflow-wrap: anywhere;
  background-color: #f5f5f5;
  transition-duration: var(--base-transition-duration);
  transition-property: color, background-color;
}
@supports (word-break: auto-phrase) {
  body {
    word-break: auto-phrase;
  }
}

body.is-dark {
  color: #f5f5f5;
  background-color: #222;
}
body.is-no-scroll {
  overflow-y: hidden;
}

img {
  display: block;
  max-inline-size: 100%;
  block-size: auto;
}

a {
  display: block;
}

svg {
  display: block;
}

input {
  display: block;
}

input,
textarea {
  transition-duration: var(--base-transition-duration);
  transition-property: color border-color;
}

.is-dark input,
.is-dark textarea {
  color: #f5f5f5;
  border-color: #f5f5f5;
}

input[type=submit] {
  cursor: pointer;
  transition-duration: var(--base-transition-duration);
  transition-property: color;
}

.is-dark input[type=submit] {
  color: #f5f5f5;
}

button {
  cursor: pointer;
}

.l-header {
  position: sticky;
  inset-block-start: 0;
  z-index: calc(infinity);
  max-inline-size: 768px;
  padding-block: 1rem;
  margin-inline: auto;
  background-color: #f5f5f5;
  transition-duration: var(--base-transition-duration);
  transition-property: background-color;
}

.is-dark .l-header {
  background-color: #222;
}

.l-header__inner {
  display: block grid;
  row-gap: 0.5rem;
  padding-inline: 1rem;
}

.l-header__above {
  display: block flex;
  align-items: center;
  justify-content: space-between;
}

.l-header__under {
  display: block flex;
  align-items: center;
  justify-content: space-between;
}

.l-main {
  min-block-size: calc(100dvh - var(--header-height) - var(--footer-height));
  padding-block: 2rem;
}

.l-footer {
  padding-block: 1rem;
}

.l-footer__inner {
  padding-inline: 1rem;
}

.c-author {
  display: block flex;
  flex-wrap: wrap;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
  align-items: center;
  justify-content: center;
}

.c-author__text {
  margin-block-end: 1rem;
}

.c-author__name {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

.c-suthor__occupation {
  text-align: center;
}

.c-author__image {
  inline-size: 150px;
}

.c-background-and-skills__list {
  display: block flex;
  flex-wrap: wrap;
  row-gap: 1rem;
  justify-content: space-between;
}

.c-breadcrumbs {
  overflow-x: auto;
}

.c-breadcrumbs__list {
  display: block flex;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}

.c-breadcrumbs__item {
  display: block flex;
  flex-shrink: 0;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  padding: 0.25rem;
}

.c-breadcrumbs__link {
  display: block flex;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
  font-size: 0.75rem;
}

.c-breadcrumbs__link--current {
  color: gray;
}

.c-hamburger-button {
  position: relative;
  cursor: pointer;
}

.c-hamburger-button__menu-icon,
.c-hamburger-button__close-icon {
  inline-size: 24px;
  transition-duration: var(--base-transition-duration);
  transition-property: visibility, opacity, fill;
}

.is-dark .c-hamburger-button__menu-icon,
.is-dark .c-hamburger-button__close-icon {
  fill: #f5f5f5;
}

.c-hamburger-button.is-active .c-hamburger-button__menu-icon {
  visibility: hidden;
  opacity: 0;
}

.c-hamburger-button__close-icon {
  position: absolute;
  inset: 0;
  visibility: hidden;
  opacity: 0;
}

.c-hamburger-button.is-active .c-hamburger-button__close-icon {
  visibility: visible;
  opacity: 1;
}

.c-theme-switch {
  position: relative;
}

.c-theme-switch__light-mode-icon,
.c-theme-switch__dark-mode-icon {
  inline-size: 24px;
  transition-duration: var(--base-transition-duration);
  transition-property: visibility, opacity;
}

.is-light .c-theme-switch__light-mode-icon {
  visibility: visible;
  opacity: 1;
}

.is-dark .c-theme-switch__light-mode-icon {
  visibility: hidden;
  opacity: 0;
}

.c-theme-switch__dark-mode-icon {
  position: absolute;
  inset: 0;
  fill: #f5f5f5;
}

.is-light .c-theme-switch__dark-mode-icon {
  visibility: hidden;
  opacity: 0;
}

.is-dark .c-theme-switch__dark-mode-icon {
  visibility: visible;
  opacity: 1;
}

.c-more-button {
  position: relative;
  padding-block: 0.25rem;
  font-weight: bold;
  text-align: center;
  border: 1px solid;
  border-radius: calc(infinity * 1px);
}

.c-more-button__icon {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: 0.5rem;
  translate: 0 -50%;
}

.c-contact-form-input,
.c-contact-form-textarea,
.c-contact-form-submit-button {
  padding: 0.5rem;
  border: 1px solid;
  border-radius: 4px;
}

.c-contact-form-label {
  margin-block-end: 1rem;
}

.c-contact-form-submit-button {
  font-weight: bold;
}

.c-content {
  margin-block-end: 2rem;
}

.c-content p {
  margin-block: revert;
}

.c-content .wp-block-heading {
  margin-block: revert;
  font-size: revert;
  font-weight: revert;
}

.c-content ul {
  padding-inline-start: revert;
  margin-block: revert;
  list-style-type: revert;
}

.c-content a {
  -webkit-text-decoration: revert;
          text-decoration: revert;
  text-underline-offset: 0.25em;
}

.c-copyright {
  font-size: 0.75rem;
  text-align: center;
}

.c-search-icon {
  inline-size: 24px;
  transition-duration: var(--base-transition-duration);
  transition-property: fill;
}

.is-dark .c-search-icon {
  fill: #f5f5f5;
}

.c-time-icon {
  inline-size: 16px;
  transition-duration: var(--base-transition-duration);
  transition-property: fill;
}

.is-dark .c-time-icon {
  fill: #f5f5f5;
}

.c-chevron-right-icon {
  transition-duration: var(--base-transition-duration);
  transition-property: fill rotate;
}

.c-chevron-right-icon--md {
  inline-size: 16px;
}

.c-chevron-right-icon--lg {
  inline-size: 24px;
}

.is-dark .c-chevron-right-icon {
  fill: #f5f5f5;
}

.c-accordion-button .c-chevron-right-icon {
  rotate: 90deg;
}
.c-accordion-button .c-chevron-right-icon.is-active {
  rotate: -90deg;
}

.c-home-icon {
  inline-size: 16px;
}

.is-dark .c-home-icon {
  fill: #f5f5f5;
}

.c-url__link,
.c-github__link {
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.c-loading {
  position: absolute;
  inset: 0;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: calc(infinity);
  display: block grid;
  place-content: center;
  background-color: inherit;
  transition-duration: var(--base-transition-duration);
  transition-property: visibility, opacity;
}
.c-loading.is-hidden {
  visibility: hidden;
  opacity: 0;
}

.c-nav {
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: 0;
  visibility: hidden;
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  block-size: calc(100dvh - var(--header-height));
  overflow-y: auto;
  background-color: rgba(34, 34, 34, 0.3);
  opacity: 0;
  backdrop-filter: blur(5px);
  transition-duration: var(--base-transition-duration);
  transition-property: background-color visibility opacity;
}
.c-nav.is-active {
  visibility: visible;
  opacity: 1;
}

.is-dark .c-nav {
  background-color: rgba(245, 245, 245, 0.3);
}

.c-nav__list {
  inline-size: 75%;
  padding-block: 1rem;
  background-color: #f5f5f5;
  translate: -100% 0;
  transition-duration: var(--base-transition-duration);
  transition-property: background-color translate;
}

.is-dark .c-nav__list {
  background-color: #222;
}

.is-active .c-nav__list {
  translate: 0;
}

.c-nav__item:not(:last-child),
.c-nav__child-item:not(:last-child),
.c-nav__grandchild-item:not(:last-child) {
  border-block-end: 1px solid;
}

.c-nav__link-container,
.c-nav__child-link-container {
  display: block flex;
  justify-content: space-between;
  padding-inline-end: 1rem;
}

.c-nav__link {
  display: block flex;
  justify-content: space-between;
  padding: 1rem;
}

.c-nav__child-list,
.c-nav__grandchild-list {
  padding-inline-start: 1em;
}

.c-nav__child-list,
.c-nav__grandchild-list {
  block-size: 0;
  overflow-y: hidden;
}
.c-nav__child-list.is-active,
.c-nav__grandchild-list.is-active {
  border-block-start: 1px solid;
}

.c-nav__child-link,
.c-nav__grandchild-link {
  display: block flex;
  justify-content: space-between;
  padding-block: 1rem;
  padding-inline: 1em 1rem;
}

/* ページネーションの汎用スタイル */
.nav-links ul {
  display: block flex;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  justify-content: center;
}

.nav-links li > * {
  display: block flex;
  align-items: center;
  justify-content: center;
  block-size: 40px;
  font-size: 0.875rem;
}

.nav-links li > *:not(.dots) {
  inline-size: 40px;
  border-radius: 50%;
  transition-duration: var(--base-transition-duration);
  transition-property: color, background-color;
}

.nav-links li > *:not(.current) {
  color: #f5f5f5;
  background-color: #222;
}

.is-dark .nav-links li > *:not(.current) {
  color: #222;
  background-color: #f5f5f5;
}

.c-works-cards,
.c-blog-cards {
  display: block grid;
}

.c-works-card,
.c-blog-card {
  display: block grid;
  grid-template-rows: subgrid;
  grid-row-start: span 3;
  row-gap: 0.5rem;
  padding-block: 1rem;
}
.c-works-card:not(:last-child),
.c-blog-card:not(:last-child) {
  border-block-end: 1px solid;
}

.c-works-meta,
.c-blog-meta {
  display: block flex;
  justify-content: space-between;
}

.c-works-categories,
.c-blog-categories {
  display: block flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-start;
}

.c-works-category,
.c-blog-category {
  padding-inline: 0.5rem;
  font-size: 0.75rem;
  border: 1px solid;
  border-radius: calc(infinity * 1px);
}

@media (width >= 768px) {
  .c-works-cards,
  .c-blog-cards {
    grid-template-columns: repeat(2, 1fr);
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
  }
  .c-works-card:not(:last-child),
  .c-blog-card:not(:last-child) {
    border-block-end: none;
  }
}
.c-search-form {
  display: block flex;
  border: 1px solid #222;
  border-radius: 4px;
  transition-duration: var(--base-transition-duration);
  transition-property: border-color;
}

.is-dark .c-search-form {
  border-color: #f5f5f5;
}

.c-search-form__input {
  padding: 0.5rem;
  transition-duration: var(--base-transition-duration);
  transition-property: color;
}

.is-dark .c-search-form__input {
  color: #f5f5f5;
}

.c-search-form__submit-button {
  padding-inline: 0.5rem;
}

.c-tags {
  display: block flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  transition-duration: var(--base-transition-duration);
  transition-property: padding-block;
}
.c-tags.is-active {
  padding-block: 1rem;
}

.c-tag__link {
  padding-inline: 0.5rem;
  font-size: 0.75rem;
  border: 1px solid;
  border-radius: calc(infinity * 1px);
}

.c-nothing {
  display: block;
  block-size: 0;
  padding-inline: 1rem;
  overflow-y: hidden;
  transition-duration: var(--base-transition-duration);
  transition-property: padding-block;
}
.c-nothing.is-active {
  padding-block: 1rem;
  border-block-start: 1px solid;
}

.c-time-container {
  flex-shrink: 0;
}

.c-time {
  display: block flex;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
  font-size: 0.75rem;
}

.c-site-title__link {
  font-weight: bold;
}

.c-section-title,
.c-page-title {
  margin-block-end: 1rem;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

.c-background-and-skills-title {
  margin-block-end: 0.5rem;
  font-size: 1.5rem;
  font-weight: bold;
}

.c-works-category-title {
  margin-block-end: 1rem;
  font-size: 1.5rem;
  font-weight: bold;
}

.c-works-title {
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.c-post-title {
  font-size: 1.5rem;
  font-weight: bold;
}

@media (width >= 768px) {
  .c-site-title__link {
    font-size: 1.5rem;
  }
}
.blog .p-blog-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.category .p-category-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.error404 .p-error404-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.home .p-hero,
.home .p-about,
.home .p-works,
.home .p-contact {
  padding-block: 2rem;
}
.home .p-hero__inner,
.home .p-about__inner,
.home .p-works__inner,
.home .p-contact__inner {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}
.home .p-works__category {
  display: block grid;
  row-gap: 1.5rem;
}

.search .p-search-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.single .p-single-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.single-works .p-single-works-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.tag .p-tag-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.tax-works-category .p-works-category-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.post-type-archive-works .p-works-outer {
  max-inline-size: 768px;
  padding-inline: 1rem;
  margin-inline: auto;
}

.u-mbs-md {
  margin-block-start: 1rem;
}

.u-mbe-sm {
  margin-block-end: 0.5rem;
}

.u-mbe-md {
  margin-block-end: 1rem;
}

.u-mbe-lg {
  margin-block-end: 1.5rem;
}

.u-pie-md {
  padding-inline-end: 1rem;
}/*# sourceMappingURL=style.css.map */