:root {
  --black: #33302b;
  --goald: #c4a06c;
  --bg: #dfdfdf;
  --bg--box: #f4f3ee;
  --border: #c1c1c1;
}

* {
  box-sizing: border-box;
}

.columnBreadcrumb {
  height: 2em;
  margin-top: 65px;
}

.columnTop .columnBreadcrumb {
  max-height: 0;
  overflow: hidden;

}

[id^="columnId"] {
  font-family: "Khand", sans-serif, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic";
  font-size: 18px;
  line-height: 1.8;
  background-color: var(--bg);

  &.single {
    background-color: #ffffff;
  }

  .container-1280 {
    padding: 80px 20px;

    @media screen and (max-width: 950px) {
      padding: 10vw 4vw;
    }
  }

  @media screen and (max-width: 768px) {
    font-size: 4.5vw;
  }

  @media screen and (max-width: 640px) {}

  .columnMain {
    padding: 0 0 100px 0;
  }

  .columnTitle {
    margin: 2em 0 1em 0;
    font-size: 1.8em;
    font-weight: bold;
  }

  .tagList {
    display: flex;
    gap: 0.5em;
    flex-wrap: wrap;
    margin: 50px 0;
    padding: 0;

    li {
      a {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40px;
        margin: 0;
        padding: 0 1em;
        color: var(--black);
        background-color: #ffffff;
        border: 1px solid var(--black);
        border-radius: 50px;
        white-space: nowrap;

        &:hover {
          color: #ffffff;
          background-color: var(--black);
        }
      }
    }
  }


  /* archive START */
  .navigation {
    padding: 10px;

    .nav-links {
      display: flex;
      justify-content: center;
      align-items: center;
      align-items: center;
      margin: 0 auto;
      gap: 20px;
    }

    span,
    a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: fit-content;
      min-width: 20px;
      height: 42px;
      padding: 0 5px;
      font-family: "Barlow Condensed", sans-serif;
      font-size: 14px;
      font-weight: bold;
      color: var(--black);
      border-radius: 4px;
      border: 1px solid #cccccc;

      &.next,
      &.prev {
        &::before {
          content: "";
          display: block;
          width: 5px;
          height: 5px;
          border-top: 2px solid var(--black);
          border-right: 2px solid var(--black);
          transform: rotate(45deg);
        }
      }

      &.prev::before {
        transform: rotate(-135deg);
      }
    }

    a:hover {
      color: #ffffff;
      background-color: var(--black);
      border: 1px solid var(--black);

      &::before {
        border-color: #ffffff;
      }
    }

    span {
      color: #ffffff;
      background-color: var(--black);
      border: 1px solid var(--black);
    }
  }

  .columnList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;

    li {
      width: calc((100% - (20px * 3)) / 4);
      line-height: 1.2;
      background-color: #ffffff;
      border: 1px solid #eeeeee;
      border-radius: 10px;
      overflow: hidden;

      .eyecatch {
        height: 160px;
        overflow: hidden;

        img {
          display: block;
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }

      a {
        display: block;
        height: 100%;
        color: var(--black);
      }

      .day {
        display: block;
        margin: 1rem 1rem 0.5rem 1rem;
        font-size: 0.8em;
      }

      .title {
        margin: 0 1rem 1rem 1rem;
        font-size: 0.9em;
        font-weight: bold;
      }
    }

    @media screen and (max-width: 950px) {
      li {
        width: calc((100% - (20px * 2)) / 3);
      }
    }

    @media screen and (max-width: 768px) {
      li {
        width: calc((100% - 20px) / 2);
      }
    }

    @media screen and (max-width: 640px) {
      flex-direction: column;
      justify-content: center;
      align-items: center;

      li {
        width: 100%;
        max-width: 475px;
      }
    }
  }

  /* archive END */

  /* single START */
  &.single {
    .columnMain {
      word-break: break-all;

      h2 {
        margin: 2em 0 1em 0;
        font-size: 1.8em;
        font-weight: bold;
      }

      h3 {
        margin: 2em 0 1em 0;
        padding-top: 0.1em;
        padding-left: 0.5em;
        font-size: 1.6em;
        font-weight: bold;
        line-height: 1.4;
        border-left: 5px solid var(--goald);
      }

      h4 {
        margin: 2em 0 1em 0;
        padding-top: 0.1em;
        padding-left: 0.5em;
        font-size: 1.4em;
        font-weight: bold;
        line-height: 1.4;
        border-left: 3px solid var(--black);
      }

      h5 {
        margin: 2em 0 1em 0;
        font-size: 1.2em;
        font-weight: bold;
        &::after {
          content: "";
          display: block;
          width: 3em;
          height: 2px;
          background-color: var(--goald);
        }
      }

      h6 {
        margin: 2em 0 1em 0;
        font-size: 1.1em;
        font-weight: bold;
      }

      textarea {
        display: block;
        width: 100%;
        margin: 3em 0;
        padding: 20px;
        background-color: #ffffff;
        border: 1px solid var(--black);
        border-radius: 2px;
      }

      pre {
        display: block;
        width: 100%;
        margin: 3em 0;
        padding: 20px;
        background-color: #ffffff;
        border: 1px solid var(--border);
        border-radius: 10px;
      }

      strong {
        font-weight: bold;
        background: linear-gradient(rgba(255, 255, 255, 0) 48%, rgba(255, 220, 0, 0.8) 50%);
      }

      b {
        font-weight: bold;
      }

      em {
        font-weight: bold;
      }

      i {
        font-style: italic;
      }

      sup {
        font-size: 0.5em;
        vertical-align: top;
      }

      sub {
        font-size: 0.5em;
        vertical-align: bottom;
      }

      ul {
        margin: 0 0 0 1em;
        padding: 0;
        list-style: disc;

        li {
          margin: 0;
          padding: 0 0 0 0.5em;
        }
      }

      ol {
        margin: 0 0 0 1em;
        padding: 0;
        list-style: decimal;

        li {
          margin: 0;
          padding: 0 0 0 0.5em;

          &::marker {
            font-weight: bold;
          }
        }
      }

      dl {
        margin: 0;
        padding: 0;

        dt {
          margin: 0;
          padding: 0;
          font-weight: bold;
        }

        dd {
          margin: 0 0 0 1em;
        }

        &.faq {
          dt {
            display: flex;
            gap: 0.5em;
            align-items: start;

            &::before {
              content: "Q";
              display: flex;
              justify-content: center;
              align-items: center;
              width: 1.2em;
              min-width: 1.2em;
              height: 1.2em;
              margin-top: 0.2em;
              line-height: 1;
              color: var(--goald);
              background-color: #ffffff;
              border: 1px solid var(--goald);
              border-radius: 2px;
            }
          }

          dd {
            display: flex;
            gap: 0.5em;
            align-items: start;

            &::before {
              content: "A";
              display: flex;
              justify-content: center;
              align-items: center;
              width: 1.2em;
              min-width: 1.2em;
              height: 1.2em;
              margin-top: 0.2em;
              line-height: 1;
              color: #ffffff;
              background-color: var(--goald);
              border: 1px solid var(--goald);
              border-radius: 2px;
            }
          }
        }
      }
    }
    table {
      display: block;
      max-width: 100%;
      margin: 3em auto;
      border-collapse: collapse;
      caption {
        display: block;
        text-align: center;
        font-weight: bold;
      }
      tbody {
        display: table;
        width: 100%;
        tr {
          th {
            padding: 0.5em 1em;
            font-weight: bold;
            color: #ffffff;
            background-color: var(--goald);
            border: 1px solid var(--border);
          }
          td {
            padding: 0.5em 1em;
            border: 1px solid var(--border);
            background-color: #ffffff;
          }
        }
      }
      @media screen and (max-width: 768px) {
        overflow: auto;
        padding-bottom: 10px;
        caption {
          position: sticky;
          left: 0;
          width: 92vw;
        }
        tbody {
          width: 100%;
          min-width: 705px;
        }
      }
    }
    blockquote {
      position: relative;
      display: block;
      margin: 3em 0;
      padding: 20px 50px;
      justify-content: space-between;
      background-color: #ffffff;
      border: 1px solid var(--border);
      &::before {
        content: "\201c";
        position: absolute;
        top: 5px;
        left: 5px;
        display: block;
        height: 0;
        font-size: 70px;
        font-weight: bold;
        font-family: "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro";
        line-height: 1;
        color: var(--border);
      }
      &::after {
        content: "\201d";
        position: absolute;
        bottom: calc(0.5em - 5px);
        right: 5px;
        display: block;
        height: 0;
        font-size: 70px;
        font-weight: bold;
        font-family: "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro";
        line-height: 1;
        color: var(--border);
      }
    }
    aside {
      margin: 3em 0;
      padding: 20px;
      font-size: 0.9em;
      color: #616161;
      background-color: #ffffff;
      background-color: var(--bg--box);
      border-radius: 2px;
    }
    hr {
      margin: 3rem 0;
      border-color: var(--border);
    }
    .day {
      display: block;
      max-width: 1em 0;
      text-align: right;
    }

    .bgBox {
      margin: 3em 0;
      padding: 20px;
      background-color: var(--bg--box);
      border-radius: 10px;

      *:first-child {
        margin-top: 0;
      }

      *:last-child {
        margin-bottom: 0;
      }
    }
  }

  .pageNav {
    display: flex;
    justify-content: space-between;

    li {
      width: calc((100% - 20px) / 2);
      padding: 10px;
      border: 1px solid #d8d8d8;

      &:hover {
        background-color: #f8f8f8;
      }

      &.noArticle {
        border: none;

        &:hover {
          background: none;
        }
      }

      a {
        display: block;
        height: 100%;
        color: var(--black);

        img {
          display: block;
          width: 90px;
          height: 90px;
          object-fit: cover;
          float: left;
        }

        .title {
          padding-left: 110px;
        }

        .link {
          bottom: 10px;
          clear: both;
          padding: 10px 0 0 0;
          font-size: 0.9em;
          line-height: 1;
        }

        @media screen and (max-width: 640px) {
          .title {
            padding-left: 0;
            float: none;
          }
          img {
            display: none;
          }
        }
      }
      &.nextColumn .link {
        text-align: left;
      }

      &.prevColumn .link {
        text-align: right;
      }
    }
  }
  div#toc_container {
    border-radius: 10px;
  }
}
/* single END */

.date_wp{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 2em;
}

/* ショートコード追加 */
/* CTA 2025.3.29 CHUKAIO */
.custom_cta {
	display: flex;
	align-items: flex-start;
	box-sizing: border-box;
	width: 100%;
	max-width: 840px;
	border: 2px solid #ddd;
	border-color: #c4a06c;
	border-radius: 10px;
	padding: 2em 2em 1em;
	margin: 2em auto;

	ul {
		flex-basis: 66%;
		list-style-type: none !important;
        margin: 0 !important;

		li {
			padding: 0 !important;
		}
	}

	p {
		margin: 0;
	}

	.custom_cta_comment p {
		font-size: 14pt;
		margin: 0 !important;
		font-weight: bold;
	}

	.custom_cta_btn {
		margin: 1em 0 !important;

		a {
			display: inline-block;
			text-align: center;
			font-weight: bold;
			color: #fff;
			border-radius: 5px;
			padding: 20px 15px 16px;
			box-sizing: border-box;
			font-size: 12.5pt;
		}

		a:hover {
			opacity: 0.8;
		}

		a.custom_cta_btn01 {
			background: #808080;
			border-bottom: 4px solid #5b5b5b;
			margin-right: 1em;
		}

		a.custom_cta_btn02 {
			background: #cc3737;
			border-bottom: 4px solid #8e2424;
		}
	}

	.custom_cta_tel {
		margin: 1.5em 0;

		a.custom_cta_tel01 {
			font-weight: bold;
			font-size: 2.8em;
			background: url(https://www.the-g.co.jp/group/juhan/cms/wp-content/uploads/tel.png) no-repeat;
			background-position: center left;
			padding: 3px 0 0 45px;
			cursor: pointer;
			display: inline-block;
			color: #33302b;
			background-size: 40px;
			line-height: 1;
			cursor: pointer;
		}
	}
	.custom_cta_time {
		.custom_cta_time01 span {
			display: block;
		}
	}
	.custom_cta_image {
		flex: 1;
		text-align: center;

		img {
			width: 90%;
		}
	}
}
@media (max-width: 880px) {
	.custom_cta {
		padding: 2em 2em 1em;
		ul {
			flex-basis: 58%;
		}
	}

	.custom_cta_btn {
		a {
			display: block;
			width: 100%;
		}
		a.custom_cta_btn01 {
			margin-right: 0;
		}
		a.custom_cta_btn02 {
			margin-top: 1em;
		}
	}
}

@media (max-width: 768px) {
	.custom_cta {
		padding: 1em;
		
		ul {
			flex-basis: 56%;
		}
		.custom_cta_btn {
			margin: 0.5em 0 !important;
		}
		.custom_cta_tel {
			a.custom_cta_tel01 {
				font-size: 1.6em;
			}
		}
		.custom_cta_time p.custom_cta_time01 {
			font-size: 14pt;
		}
	}
}

@media (max-width: 600px) {
	.custom_cta {
		ul {
			flex-basis: 100%;
		}

		.custom_cta_tel {
			a.custom_cta_tel01 {
				font-size: 2em;
				background-size: 28px;
				padding-left: 35px;
			}
		}
		.custom_cta_image {
			display: none;
		}
	}
}

@media (max-width: 414px) {
}