/*
Theme Name: Astra Child
Template: astra
*/


:root {
  --spacing-r: .25rem;
  --spacing-e: .25em;

  --tw-duration: initial;
  --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);

}

/************************************
** RESET
************************************/
a:where(:not(.wp-element-button)) {
  text-decoration: none !important;
}
.ast-container {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.site-content .ast-container {
  display: block;
}
.ast-plain-container.ast-no-sidebar #primary {
    margin-top: 0;
    margin-bottom: 0;
}
.entry-content .wp-audio-shortcode, .entry-content .wp-embedded-audio, .entry-content .wp-embedded-video, .entry-content .wp-video, .entry-content p {
    margin-bottom: 0;
}
.ast-single-post .entry-content a, .ast-comment-content a:not(.ast-comment-edit-reply-wrap a) {
  text-decoration: none !important;
}
.entry-content :where(h1,h2,h3,h4,h5,h6) {
  margin-bottom: 0;
  line-height: 1.4;
}
.entry-content ul, .entry-content ol {
  padding-left: 0;
  margin-block-start: 0;
  margin-block-end: 0;
}
address, cite {
  font-style: normal;
}
.ast-article-single {
  padding: 0 !important;
}
.ast-article-single img {
  box-shadow: none;
}
table, td, th {
  border: none;
}
ul {
  margin: 0;
}
li {
  list-style: none;
}
img {
	width: 100%;
  height: auto;
  vertical-align: bottom;
}

/************************************
************************************/

/************************************
** COMMON STYLE
************************************/
/* base-layout */
.site-main {
  padding-top: calc(var(--spacing-r) * 8) !important;
  padding-bottom: calc(var(--spacing-r) * 24) !important;
}
section {
  padding-top: calc(var(--spacing-r) * 12);
}
.l-header--inner,
.l-footer--inner,
.content-inner {
  position: relative;
  max-width: 1140px;
  margin-inline: auto;
  padding-inline: calc(var(--spacing-r) * 7.5);
	z-index: 10;
}
@media (max-width: 768px) {
}

/* custom-layout */
.gap-2 {
  gap: calc(var(--spacing-r) * 2);
}
.gap-3 {
  gap: calc(var(--spacing-r) * 3);
}
.gap-4 {
  gap: calc(var(--spacing-r) * 4);
}
.gap-6 {
  gap: calc(var(--spacing-r) * 6);
}
.gap-8 {
  gap: calc(var(--spacing-r) * 8);
}
.gap-12 {
  gap: calc(var(--spacing-r) * 12);
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}
.l-full {
  width: calc(100vw - var(--scrollbar-width, 0px));
  margin-left: calc(50% - 50vw + var(--scrollbar-width, 0px) / 2);
}
.l-flex {
  display: flex;
}
.l-i-flex {
  display: inline-flex;
}
.l-grid {
  display: grid;
}
.jc-C {
  justify-content: center;
}
.ai-C {
  align-items: center;
}
.taL {
  text-align: left;
}
.taR {
  text-align: right;
}
.taC {
  text-align: center;
}
.mA {
  margin: 0 auto;
}
@media (min-width: 769px){
  .sp {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .l-flex {
    flex-direction: column;
  }
  .grid-cols-3 {
    grid-template-columns: 1fr;
  }
  .pc {
    display: none !important;
  }
}

p {
  line-height: 1.8;
  margin-bottom: 1.75em !important;
}
p:last-of-type {
  margin-bottom: 0 !important;
}
@media (hover: hover) and (pointer: fine) {
  a:hover {
    opacity: .7;
  }
}

/* btn */
.btn-color--g {
  display: flex;
  margin-top: calc(var(--spacing-e) * 12);
}
.btn-color--g a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 320px;
  padding-inline: calc(var(--spacing-e) * 8);
  padding-block: calc(var(--spacing-e) * 4);
  border-radius: .5em;
  color: var(--color-bg);
  gap: calc(var(--spacing-e) * 2);
  font-weight: 500;
  border-radius: 100px;
}
.btn-color--g a svg {
  width: calc(var(--spacing-r) * 5);
  height: calc(var(--spacing-r) * 5);
}
.btn-color--g a .link-icon {
  position: absolute;
  right: 1em;
  top: 50%;
  transform: translateY(-50%);
}
@media (hover: hover) and (pointer: fine) {
  .btn-color--g a:hover {
    background-color: #1A3235;
    opacity: 1;
  }
}
.btn-color--g a {
  color: white;
  background-color: #2C4F54;
}
@media (max-width: 768px){
  .btn-color--g {
    justify-content: center;
  }
  .btn-color--g a {
    width: 85%;
    justify-content: center;
  }
}
.link-icon {
  transition-property: transform;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, ease));
  transition-duration: var(--tw-duration, var(--default-transition-duration, 0.3s));
}
@media (hover: hover) and (pointer: fine) {
  a:hover .link-icon {
    transform: translateY(-50%) translateX(calc(var(--spacing-r, 0.25rem) * 1));
  }
}

/* header */
.l-header {
  background-color: white;
  padding-block: calc(var(--spacing-r) * 4);
}
.l-header .l-header--inner {
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}
.l-header .l-header--logo {
  max-width: 160px;
}
.l-header .l-header--logo a {
  display: block;
}
.l-header h1 {
  font-weight: 700;
  margin-top: calc(var(--spacing-r) * 4);
  font-size: 1.3rem;
}
@media (max-width: 768px){
/* .l-header .l-header--inner {
  flex-direction: row;
  gap: 12px;
} */
  .l-header .l-header--logo {
    margin: 0 auto;
  }
}


/* footer */
.l-footer .l-footer--inner .l-footer--bottom {
	padding-block: calc(var(--spacing-r) * 4);
}
.l-footer .l-footer--inner .l-footer--bottom .l-footer--bottom---copyright {
  color: #7EAAB0;
  margin-bottom: 0;
  text-align: center;
  line-height: 1.5rem;
}


/* animation */
.a {
  transition-property: all;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, ease));
  transition-duration: var(--tw-duration, var(--default-transition-duration, 0.3s));
}
/************************************
************************************/

/************************************
** TOP PAGE
************************************/
.entry-content .intro {
  font-size: 1.231rem;
  font-weight: 700;
}
.category-index-toc {
  margin-top: calc(var(--spacing-r) * 8);
}
.category-index-toc ul {
  display: flex;
  gap: 8px;
}
.category-index-toc ul li {
  font-weight: 700;
}
.category-index-toc ul a {
  position: relative;
  display: inline-block;
  padding: calc(var(--spacing-e) * 2) calc(var(--spacing-e) * 8) calc(var(--spacing-e) * 2) calc(var(--spacing-e) * 4);
  border: 2px solid #2C4F54;
  border-radius: 4px;
  color: #2C4F54;
}
.category-index-toc li a::after {
  content: "";
  position: absolute;
  right: calc(var(--spacing-r) * 2.5);
  top: 50%;
  width: 6px;
  height: 6px;
  transform: translateY(-50%) rotate(90deg);
  mask: url('./assets/img/common/arrow.svg') no-repeat center;
  mask-size: contain;
  background-color: #2C4F54;
}
.category-post-list {
  margin-top: calc(var(--spacing-r) * 8) !important;
}
.category-post-list .category-post-item {
  display: flex;
  position: relative;
}
.category-post-list .category-post-item a {
  flex-grow: 1;
  display: block;
  background-color: white;
  border-radius: 6px;
  padding: calc(var(--spacing-r) * 4);
}
.category-post-list .category-post-item a .category-post-thumb {
  position: relative;
  overflow: hidden;
}
.category-post-list .category-post-item a .category-post-thumb img {
  display: block;
  width: 100%;
  height: auto;
}
.category-post-list .category-post-item a .category-post-thumb .category-post-thumb-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 120px;
    background: linear-gradient(
        to top,
        var(--grad-color, rgba(0, 0, 0, 0.8)) 0%,
        transparent 100%
    );
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: calc(var(--spacing-r) * 4);
    box-sizing: border-box;
}
.category-post-list .category-post-item a .category-post-thumb .category-post-thumb-overlay .category-post-logo {
    max-height: auto;
    max-width: 160px;
    height: auto;
    width: auto;
}
.category-post-list .category-post-item a .category-post-body {
  margin-top: calc(var(--spacing-r) * 4);
}
.category-post-list .category-post-item a .category-post-body .category-post-title {
  color: #151515;
}
.category-post-list .category-post-item a .category-post-body .category-post-overview {
  position: relative;
  margin-top: calc(var(--spacing-r) * 2);
  padding-right: calc(var(--spacing-r) * 12);
}
.category-post-overview::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    background: url('./assets/img/common/loupe.svg') no-repeat center/contain;
}

@media (hover: hover) and (pointer: fine) {
  .category-post-list .category-post-item a:hover {
    transform: translateY(calc(var(--spacing-r, 0.25rem) * -2));
    box-shadow: 0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;
    opacity: 1;
  }
  .category-index-toc li a:hover {
    opacity: 1;
    color: white;
    background-color: #2C4F54;
  }
  .category-index-toc li a:hover::after {
    background-color: white;
  }
}
/************************************
************************************/

.error404 h2 {
  font-size: 4rem;
  margin-bottom: 0;
}
.error404 .sub {
  margin-top: .5em;
  font-size: 1rem;
}

.error404 p {
  margin-top: 1em;
  font-size: 1.231rem;
}