@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&family=Playfair+Display:wght@400;500;600;700&display=swap");
* {
  min-inline-size: 0; }

/*==================================================
ふわっ
===================================*/
/* fadeIn */
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeInAnime {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/* fadeUp */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* fadeDown */
.fadeDown {
  animation-name: fadeDownAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeDownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* fadeLeft */
.fadeLeft {
  animation-name: fadeLeftAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }
/* fadeRight */
.fadeRight {
  animation-name: fadeRightAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeRightAnime {
  from {
    opacity: 0;
    transform: translateX(100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger {
  opacity: 0; }

/*==================================================
ぱたっ
===================================*/
/* flipDown */
.flipDown {
  animation-name: flipDownAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipDownAnime {
  from {
    transform: perspective(2500px) rotateX(100deg);
    opacity: 0; }
  to {
    transform: perspective(2500px) rotateX(0);
    opacity: 1; } }
/* flipLeft */
.flipLeft {
  animation-name: flipLeftAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  perspective-origin: left center;
  opacity: 0; }

@keyframes flipLeftAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(30deg);
    opacity: 0; }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1; } }
/* flipLeftTop */
.flipLeftTop {
  animation-name: flipLeftTopAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipLeftTopAnime {
  from {
    transform: translate(-20px, 80px) rotate(-15deg);
    opacity: 0; }
  to {
    transform: translate(0, 0) rotate(0deg);
    opacity: 1; } }
/* flipRight */
.flipRight {
  animation-name: flipRightAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  perspective-origin: right center;
  opacity: 0; }

@keyframes flipRightAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg);
    opacity: 0; }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1; } }
/* flipRightTop */
.flipRightTop {
  animation-name: flipRightTopAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipRightTopAnime {
  from {
    transform: translate(-20px, 80px) rotate(25deg);
    opacity: 0; }
  to {
    transform: translate(0, 1) rotate(0deg);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.flipDownTrigger,
.flipLeftTrigger,
.flipLeftTopTrigger,
.flipRightTrigger,
.flipRightTopTrigger {
  opacity: 0; }

/*==================================================
くるっ
===================================*/
/* rotateX */
.rotateX {
  animation-name: rotateXAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateXAnime {
  from {
    transform: rotateX(0);
    opacity: 0; }
  to {
    transform: rotateX(-360deg);
    opacity: 1; } }
/* rotateY */
.rotateY {
  animation-name: rotateYAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateYAnime {
  from {
    transform: rotateY(0);
    opacity: 0; }
  to {
    transform: rotateY(-360deg);
    opacity: 1; } }
/* rotateLeftZ */
.rotateLeftZ {
  animation-name: rotateLeftZAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateLeftZAnime {
  from {
    transform: rotateZ(0);
    opacity: 0; }
  to {
    transform: rotateZ(-360deg);
    opacity: 1; } }
/* rotateRightZ */
.rotateRightZ {
  animation-name: rotateRightZAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateRightZAnime {
  from {
    transform: rotateZ(0);
    opacity: 0; }
  to {
    transform: rotateZ(360deg);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.rotateXTrigger,
.rotateYTrigger,
.rotateLeftZTrigger,
.rotateRightZTrigger {
  opacity: 0; }

/*==================================================
ぶわっ、ぽんっ、どどんっ
===================================*/
/* zoomIn */
.zoomIn {
  animation-name: zoomInAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards; }

@keyframes zoomInAnime {
  from {
    transform: scale(0.6);
    opacity: 0; }
  to {
    transform: scale(1);
    opacity: 1; } }
/* zoomOut */
.zoomOut {
  animation-name: zoomOutAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards; }

@keyframes zoomOutAnime {
  from {
    transform: scale(1.2);
    opacity: 0; }
  to {
    transform: scale(1);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.zoomInTrigger,
.zoomOutTrigger {
  opacity: 0; }

/*==================================================
じわっ
===================================*/
/* blur */
.blur {
  animation-name: blurAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes blurAnime {
  from {
    filter: blur(10px);
    transform: scale(1.02);
    opacity: 0; }
  to {
    filter: blur(0);
    transform: scale(1);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.blurTrigger {
  opacity: 0; }

/*==================================================
にょろっ
===================================*/
/* smooth */
.smooth {
  animation-name: smoothAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  　transform-origin: left;
  opacity: 0; }

@keyframes smoothAnime {
  from {
    transform: translate3d(0, 100%, 0) skewY(12deg);
    opacity: 0; }
  to {
    transform: translate3d(0, 0, 0) skewY(0);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.smoothTrigger {
  opacity: 0; }

/*==================================================
背景色が伸びて出現
===================================*/
.bgextend {
  animation-name: bgextendAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  /*　はみ出た色要素を隠す　*/
  opacity: 0; }

@keyframes bgextendAnimeBase {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*中の要素*/
.bgappear {
  animation-name: bgextendAnimeSecond;
  animation-duration: 1s;
  animation-delay: 0.6s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*左から右*/
.bgLRextend::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0); }
  50% {
    transform-origin: left;
    transform: scaleX(1); }
  50.001% {
    transform-origin: right; }
  100% {
    transform-origin: right;
    transform: scaleX(0); } }
/*右から左*/
.bgRLextend::before {
  animation-name: bgRLextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgRLextendAnime {
  0% {
    transform-origin: right;
    transform: scaleX(0); }
  50% {
    transform-origin: right;
    transform: scaleX(1); }
  50.001% {
    transform-origin: left; }
  100% {
    transform-origin: left;
    transform: scaleX(0); } }
/*下から上*/
.bgDUextend::before {
  animation-name: bgDUextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgDUextendAnime {
  0% {
    transform-origin: bottom;
    transform: scaleY(0); }
  50% {
    transform-origin: bottom;
    transform: scaleY(1); }
  50.001% {
    transform-origin: top; }
  100% {
    transform-origin: top;
    transform: scaleY(0); } }
/*上から下*/
.bgUDextend::before {
  animation-name: bgUDextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #FFFF00;
  /*伸びる背景色の設定*/ }

@keyframes bgUDextendAnime {
  0% {
    transform-origin: top;
    transform: scaleY(0); }
  50% {
    transform-origin: top;
    transform: scaleY(1); }
  50.001% {
    transform-origin: bottom; }
  100% {
    transform-origin: bottom;
    transform: scaleY(0); } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.bgappearTrigger,
.bgUDextendTrigger,
.bgDUextendTrigger,
.bgRLextendTrigger,
.bgLRextendTrigger {
  opacity: 0; }

/*==================================================
枠線が伸びて出現
===================================*/
/*枠線が伸びて出現*/
.lineTrigger {
  position: relative;
  /* 枠線が書かれる基点*/
  opacity: 0; }

.lineTrigger.lineanime {
  animation-name: lineAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes lineAnimeBase {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*上下線*/
.lineTrigger::before,
.lineTrigger::after {
  position: absolute;
  content: '';
  width: 0;
  height: 1px;
  background: #333;
  /* 枠線の色*/ }

/*左右線*/
.line2::before,
.line2::after {
  position: absolute;
  content: '';
  width: 1px;
  height: 0;
  background: #333;
  /* 枠線の色*/ }

/*上線*/
.lineTrigger::before {
  top: 0;
  left: 0; }

.lineTrigger.lineanime::before {
  animation: lineAnime .5s linear 0s forwards;
  /*表示されて0秒後に上線が0.5秒かけて表示*/ }

/*右線*/
.line2::before {
  top: 0;
  right: 0; }

.lineTrigger.lineanime .line2::before {
  animation: lineAnime2 .5s linear .5s forwards;
  /*表示されて0.5秒後に右線が0.5秒かけて表示*/ }

/*下線*/
.lineTrigger::after {
  bottom: 0;
  right: 0; }

.lineTrigger.lineanime::after {
  animation: lineAnime .5s linear 1s forwards;
  /*表示されて1秒後に下線が0.5秒かけて表示*/ }

/*左線*/
.line2::after {
  bottom: 0;
  left: 0; }

.lineTrigger.lineanime .line2::after {
  animation: lineAnime2 .5s linear 1.5s forwards;
  /*表示されて1.5秒後に左線が0.5秒かけて表示*/ }

@keyframes lineAnime {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }
@keyframes lineAnime2 {
  0% {
    height: 0%; }
  100% {
    height: 100%; } }
/*枠線内側の要素*/
.lineTrigger.lineanime .lineinappear {
  animation: lineInnerAnime .5s linear 1.5s forwards;
  /*1.5秒後に中央のエリアが0.5秒かけて表示*/
  opacity: 0;
  /*初期値を透過0にする*/ }

@keyframes lineInnerAnime {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*==================================================
アニメーション設定
===================================*/
/* アニメーションの回数を決めるCSS*/
.count2 {
  animation-iteration-count: 2;
  /*この数字を必要回数分に変更*/ }

.countinfinite {
  animation-iteration-count: infinite;
  /*無限ループ*/ }

/* アニメーションスタートの遅延時間を決めるCSS*/
.delay-time05 {
  animation-delay: 0.5s; }

.delay-time08 {
  animation-delay: 0.8s; }

.delay-time1 {
  animation-delay: 1s; }

.delay-time15 {
  animation-delay: 1.5s; }

.delay-time2 {
  animation-delay: 2s; }

.delay-time25 {
  animation-delay: 2.5s; }

/* アニメーション自体が変化する時間を決めるCSS*/
.change-time05 {
  animation-duration: 0.5s; }

.change-time1 {
  animation-duration: 1s; }

.change-time15 {
  animation-duration: 1.5s; }

.change-time2 {
  animation-duration: 2s; }

.change-time25 {
  animation-duration: 2.5s; }

#menuCol {
  font-family: 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  position: fixed;
  width: 180px;
  height: 100%;
  overflow: hidden;
  z-index: 1000;
  top: 0;
  left: 0; }

@media screen and (max-width: 991px) {
  #menuCol {
    width: 50px; } }
@media screen and (max-width: 767px) {
  #menuCol {
    width: 40px; } }
#headerCol {
  font-family: 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  position: relative;
  height: 100%;
  height: 100vh;
  height: 100dvh; }
  #headerCol #headerColInner {
    transition: .5s ease;
    color: #FFFFFF;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: 100%;
    height: 100dvh;
    padding: 40px 20px; }
    #headerCol #headerColInner .title {
      writing-mode: vertical-rl;
      text-orientation: upright;
      margin: 40px auto;
      font-size: clamp(0.625rem, calc(0.4464rem + 0.5714vw), 0.875rem);
      font-weight: 500;
      letter-spacing: 0.1em; }
    #headerCol #headerColInner .menuSet {
      margin-top: auto; }
      #headerCol #headerColInner .menuSet .item a {
        position: relative;
        font-size: clamp(0.625rem, calc(0.4464rem + 0.5714vw), 0.875rem);
        font-size: 0.875rem;
        line-height: 2.5em;
        width: 100%;
        display: block; }
        #headerCol #headerColInner .menuSet .item a:after {
          content: "";
          position: absolute;
          top: 50%;
          right: 0;
          font-size: 0.875rem;
          width: 0.5em;
          height: 0.5em;
          border-right: 1px solid #FFFFFF;
          border-bottom: 1px solid #FFFFFF;
          transform: translateY(-65%) rotate(-45deg);
          transition: .4s ease;
          z-index: -1; }
        #headerCol #headerColInner .menuSet .item a:hover:after {
          transform: translateY(-45%) rotate(0deg); }
      #headerCol #headerColInner .menuSet .openbtn {
        display: none; }

@media screen and (max-width: 991px) {
  #headerCol #headerColInner {
    padding: 20px 10px; }
    #headerCol #headerColInner .menuSet {
      display: none; }
    #headerCol #headerColInner .openbtn {
      position: relative;
      display: block;
      z-index: 9999;
      cursor: pointer;
      width: 100%;
      height: 50px;
      margin: 0 auto;
      transition: all .3s; }
      #headerCol #headerColInner .openbtn span {
        display: inline-block;
        transition: all .3s;
        position: absolute;
        left: 0;
        height: 1px;
        background-color: #FFFFFF;
        width: 100%; }
        #headerCol #headerColInner .openbtn span:nth-of-type(1) {
          top: 15px; }
        #headerCol #headerColInner .openbtn span:nth-of-type(2) {
          top: 23px; }
        #headerCol #headerColInner .openbtn span:nth-of-type(3) {
          top: 31px; }
      #headerCol #headerColInner .openbtn:hover {
        width: 80%; } }
#g-nav {
  font-family: 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  position: fixed;
  z-index: 99999999;
  top: 0;
  right: -120%;
  width: 100%;
  height: 100vh;
  transition: all 0.3s;
  color: #FFFFFF; }
  #g-nav::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../images/common/bg-gnavi.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover; }
  #g-nav.panelactive {
    right: 0; }
    #g-nav.panelactive #g-nav-list {
      position: fixed;
      z-index: 999;
      width: 100%;
      height: 100vh;
      overflow: auto;
      -webkit-overflow-scrolling: touch; }
  #g-nav .navInner {
    position: absolute;
    z-index: 999;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(80%, 600px); }
    #g-nav .navInner .logo {
      width: clamp(130px, 20vw, 300px);
      margin-inline: auto;
      margin-bottom: 50px; }
    #g-nav .navInner .navCol .item a {
      position: relative;
      font-size: 0.875rem;
      line-height: 2.5em;
      width: 100%;
      display: block; }
      #g-nav .navInner .navCol .item a:after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        font-size: 0.875rem;
        width: 0.5em;
        height: 0.5em;
        border-right: 1px solid #FFFFFF;
        border-bottom: 1px solid #FFFFFF;
        transform: translateY(-65%) rotate(-45deg);
        transition: .4s ease;
        z-index: -1; }
      #g-nav .navInner .navCol .item a:hover:after {
        transform: translateY(-45%) rotate(0deg); }
    #g-nav .navInner .navCol .closeBtn {
      cursor: pointer;
      position: relative;
      width: clamp(200px, 20vw, 300px);
      position: relative;
      display: block;
      border: 1px solid #FFFFFF;
      text-align: center;
      font-size: 0.875rem;
      padding: 0.8em;
      margin-top: 50px;
      margin-inline: auto; }
      #g-nav .navInner .navCol .closeBtn .close {
        font-size: 0.875rem;
        position: absolute;
        z-index: 9999;
        top: 50%;
        right: 20px;
        cursor: pointer;
        width: 30px;
        height: 30px;
        transform: translateY(-50%); }
        #g-nav .navInner .navCol .closeBtn .close span {
          display: inline-block;
          transition: all .3s;
          position: absolute;
          right: 0;
          height: 1px;
          background-color: #FFFFFF;
          width: 100%; }
          #g-nav .navInner .navCol .closeBtn .close span:nth-of-type(1) {
            top: 50%;
            right: 0;
            transform: translateY(-50%) rotate(-45deg);
            width: 100%; }
          #g-nav .navInner .navCol .closeBtn .close span:nth-of-type(2) {
            opacity: 0; }
          #g-nav .navInner .navCol .closeBtn .close span:nth-of-type(3) {
            top: 50%;
            right: 0;
            transform: translateY(-50%) rotate(45deg);
            width: 100%; }

#latestArticle .list {
  container: list / inline-size; }
  #latestArticle .list .listContainer {
    transition: .4s ease;
    --_column: 2;
    display: block grid;
    grid-template-columns: repeat(var(--_column), 1fr);
    gap: clamp(20px, 3cqi, 40px); }
    #latestArticle .list .listContainer .listItem {
      position: relative;
      display: block grid;
      grid-template-rows: subgrid;
      grid-row: span 4;
      gap: 10px; }
      #latestArticle .list .listContainer .listItem .pic {
        overflow: hidden;
        border-radius: 0 20px 0 20px; }
        #latestArticle .list .listContainer .listItem .pic a {
          display: block; }
          #latestArticle .list .listContainer .listItem .pic a img {
            transition: .4s ease;
            object-fit: cover;
            aspect-ratio: 16 / 9;
            vertical-align: bottom; }
      #latestArticle .list .listContainer .listItem .data {
        margin-top: 8px; }
        #latestArticle .list .listContainer .listItem .data .category {
          display: inline-block;
          color: #FFF;
          font-size: 0.75rem;
          font-feature-settings: "palt";
          letter-spacing: 0.1em;
          line-height: 1.8em;
          font-weight: 600;
          background-color: #d7b575;
          padding: .3em .8em;
          margin-right: .5em; }
        #latestArticle .list .listContainer .listItem .data .time {
          display: inline-block;
          font-size: clamp(0.75rem, calc(0.6943rem + 0.241vw), 0.875rem);
          font-feature-settings: "palt";
          letter-spacing: 0.1em;
          line-height: 2em;
          color: #d7b575; }
      #latestArticle .list .listContainer .listItem .tit {
        transition: .4s ease;
        font-size: clamp(0.875rem, calc(0.8193rem + 0.241vw), 1rem); }
      #latestArticle .list .listContainer .listItem::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 1px;
        color: antiquewhite;
        left: 0;
        bottom: 0;
        border-bottom: 1px solid #d7b575; }
      #latestArticle .list .listContainer .listItem:hover .pic a img {
        transform: scale(1.1); }
      #latestArticle .list .listContainer .listItem:hover .tit {
        color: #42B975; }
@container list (inline-size >= 991px) {
  #latestArticle .list .listContainer {
    --_column: 3; } }
@media screen and (max-width: 767px) {
  #latestArticle .list .listContainer {
    --_column: 1;
    grid-template-columns: repeat(var(--_column), 1fr); } }
.l_post {
  margin-bottom: clamp(50px, 10vw, 200px); }
  .l_post .postTitleCol {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.5em;
    border-bottom: 1px solid #000000; }
  .l_post .l_post__header {
    margin: clamp(30px, 9vw, 90px) auto; }
    .l_post .l_post__header .container {
      max-width: 1040px; }
    .l_post .l_post__header .txtCol {
      display: flex;
      flex-direction: column-reverse; }
      .l_post .l_post__header .txtCol .tit {
        margin: 0.5em 0; }
      .l_post .l_post__header .txtCol .time {
        font-size: 1rem;
        font-weight: 500; }
        @media screen and (max-width: 767px) {
          .l_post .l_post__header .txtCol .time {
            font-size: 0.75rem; } }
    .l_post .l_post__header .tagTit {
      font-size: 0.75rem;
      font-feature-settings: "palt";
      letter-spacing: 0.1em;
      line-height: 1.8em;
      background-color: #CEAAFF;
      color: #FFFFFF;
      padding: .2em 1em .3em;
      line-height: normal;
      display: inline-block;
      margin-top: 1em;
      margin-bottom: 1.5em; }
      @media screen and (max-width: 767px) {
        .l_post .l_post__header .tagTit {
          font-size: 0.625rem; } }
    .l_post .l_post__header .tagCol {
      display: flex;
      gap: 1em; }
      .l_post .l_post__header .tagCol .tag {
        font-size: 0.875rem;
        font-weight: 500; }
        @media screen and (max-width: 767px) {
          .l_post .l_post__header .tagCol .tag {
            font-size: 0.75rem; } }
        .l_post .l_post__header .tagCol .tag a {
          transition: all .5s ease; }
          .l_post .l_post__header .tagCol .tag a:hover {
            color: #CEAAFF; }
    .l_post .l_post__header .picCol {
      margin: clamp(30px, 9vw, 90px) auto 0; }
      .l_post .l_post__header .picCol .pic img {
        aspect-ratio: 16 / 9;
        width: 100%;
        height: 100%;
        vertical-align: bottom; }
  .l_post .l_post__section .picCol .pic {
    margin-top: clamp(20px, 5vw, 50px); }
    .l_post .l_post__section .picCol .pic img {
      aspect-ratio: 3 / 2;
      width: 100%;
      height: 100%;
      vertical-align: bottom; }
  .l_post .l_post__section .picCol .notesText {
    margin-top: 1em; }
  .l_post .l_post__section .videoCol {
    margin-top: clamp(20px, 5vw, 50px); }
  .l_post .l_post__section .youtubeCol {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: 100%;
    margin-top: clamp(20px, 5vw, 50px); }
  .l_post .l_post__section:not(:last-child) {
    margin-bottom: clamp(80px, 10vw, 150px); }
  .l_post .l_post__section .mSet {
    margin: 50px 0; }
  .l_post .l_post__section .mB {
    margin-bottom: 50px; }
  .l_post .l_post__section .mT {
    margin-top: 50px; }
  .l_post .l_post__section .tit {
    padding-bottom: 1em;
    margin-bottom: clamp(0.5em, 2vw, 1em);
    border-bottom: 1px solid #e9e4f2;
    position: relative; }
  .l_post .l_post__section .txt {
    padding-top: 20px;
    padding-bottom: 20px; }
  .l_post .l_post__section .container {
    max-width: 1040px; }
  .l_post .l_post__section .listCol {
    padding-top: 10px;
    padding-bottom: 10px; }
    .l_post .l_post__section .listCol .listItem:not(:last-child) {
      margin-bottom: .5em; }
    .l_post .l_post__section .listCol.dot {
      padding-left: clamp(1.35em, 2vw, 1.25em); }
      .l_post .l_post__section .listCol.dot .listItem {
        list-style-type: disc; }
  .l_post .l_post__section .linkText {
    transition: all .5s ease;
    color: #42B975;
    text-decoration: underline; }
    .l_post .l_post__section .linkText:hover {
      color: #CEAAFF; }

#contact .gC01 {
  grid-template-columns: 0.9fr 1.1fr;
  grid-template-areas: "logo tit" "logo txt";
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-items: stretch;
  align-items: center; }
  #contact .gC01 .logoCol {
    margin-inline: auto;
    width: clamp(200px, 20vw, 300px);
    grid-area: logo; }
  #contact .gC01 .tit {
    margin-bottom: 1em;
    grid-area: tit; }
    #contact .gC01 .tit .brTag {
      display: none; }
  #contact .gC01 .btmCol {
    grid-area: txt; }
  #contact .gC01 .btmCol .btnCol {
    margin-top: 2em; }
    #contact .gC01 .btmCol .btnCol .btn-l {
      width: clamp(200px, 20vw, 300px);
      position: relative;
      display: block;
      border: 1px solid #000000;
      text-align: center;
      font-size: clamp(0.75rem, calc(0.6386rem + 0.4819vw), 1rem);
      font-feature-settings: "palt";
      letter-spacing: 0.1em;
      line-height: 2em;
      padding: 0.8em; }
      #contact .gC01 .btmCol .btnCol .btn-l:after {
        content: "";
        position: absolute;
        top: 50%;
        right: 20px;
        font-size: clamp(0.75rem, calc(0.6386rem + 0.4819vw), 1rem);
        font-feature-settings: "palt";
        letter-spacing: 0.1em;
        line-height: 2em;
        width: 1em;
        height: 1em;
        border-right: 1px solid #000000;
        border-bottom: 1px solid #000000;
        transform: translateY(-65%) rotate(45deg);
        transition: .4s ease; }
      #contact .gC01 .btmCol .btnCol .btn-l:hover:after {
        transform: translateY(-45%) rotate(45deg); }

@media screen and (max-width: 1199px) {
  #contact .gC01 {
    grid-template-columns: auto 1fr;
    grid-template-areas: "logo tit" "txt txt";
    grid-column-gap: 50px;
    grid-row-gap: 50px; }
    #contact .gC01 .logoCol {
      margin: 0 auto;
      width: clamp(200px, 20vw, 300px);
      grid-area: logo; }
    #contact .gC01 .tit .brTag {
      display: block; } }
@media screen and (max-width: 767px) {
  #contact .gC01 {
    grid-template-columns: 1fr;
    grid-template-areas: "logo" "tit" "txt";
    grid-column-gap: 20px;
    grid-row-gap: 20px; }
    #contact .gC01 .logoCol {
      width: clamp(100px, 15vw, 200px); }
    #contact .gC01 .tit {
      margin-bottom: 0.25em; } }
#mainFooter {
  font-family: 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; }
  #mainFooter .container {
    color: #000000;
    background-color: #FFFF00;
    position: relative;
    width: calc(100%  - 180px);
    padding: calc( var(--padding-set) + 4vw ) var(--padding-set) var(--padding-set);
    margin-left: auto;
    overflow: hidden; }
  #mainFooter .grCol {
    grid-template-columns: auto 1fr;
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    margin-bottom: 1em; }
  #mainFooter .textCol {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    grid-row-gap: 40px; }
    #mainFooter .textCol .tit01 .brTag {
      display: none; }
    #mainFooter .textCol .footerNavCol {
      margin: auto 0; }
      #mainFooter .textCol .footerNavCol .footerNav {
        font-size: 0.75rem;
        font-feature-settings: "palt";
        letter-spacing: 0.1em;
        line-height: 1.8em;
        font-weight: 700;
        display: flex;
        flex-wrap: wrap;
        line-height: 1em;
        gap: 20px; }
    #mainFooter .textCol .snsCol {
      margin-top: auto; }
      #mainFooter .textCol .snsCol .tit02 {
        font-size: 0.75rem;
        font-feature-settings: "palt";
        letter-spacing: 0.1em;
        line-height: 1.8em;
        background-color: #000000;
        color: #FFFFFF;
        padding: .3em 2em;
        line-height: normal;
        display: inline-block;
        margin-bottom: 1.5em; }
      #mainFooter .textCol .snsCol .list {
        display: flex;
        align-items: center;
        gap: 20px; }
        #mainFooter .textCol .snsCol .list .item a {
          width: 30px;
          height: auto;
          display: block; }
  #mainFooter .logoCol {
    width: clamp(100px, 15vw, 200px);
    margin: auto 0 0 auto;
    position: relative;
    aspect-ratio: 1 / 1; }
    #mainFooter .logoCol .logo01 {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 1 / 1;
      animation: rotate-z 30s linear infinite; }
@keyframes rotate-z {
  from {
    transform: rotateZ(0deg); }
  to {
    transform: rotateZ(360deg); } }
    #mainFooter .logoCol .logo02 {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 1 / 1; }
  #mainFooter small {
    font-size: 0.625rem;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
    line-height: 1.8em; }

@media screen and (max-width: 991px) {
  #mainFooter .container {
    width: calc(100%  - 50px); }
  #mainFooter .grCol {
    grid-column-gap: 20px; }
  #mainFooter .textCol .tit01 .brTag {
    display: block; } }
@media screen and (max-width: 767px) {
  #mainFooter .container {
    width: calc(100%  - 40px);
    padding: calc( var(--padding-set) + 8vw ) var(--padding-set) var(--padding-set); }
  #mainFooter .grCol {
    grid-template-columns: 1fr;
    grid-row-gap: 20px; }
  #mainFooter .textCol {
    grid-row-gap: 20px; }
  #mainFooter .logoCol {
    margin: 0 auto; } }
html {
  scroll-behavior: smooth;
  scroll-padding-top: 0px;
  height: -webkit-fill-available; }

body {
  background-color: #000000;
  margin: 0;
  font-size: 16px;
  box-sizing: border-box;
  font-feature-settings: "palt";
  min-height: 100vh;
  min-height: -webkit-fill-available;
  position: relative; }

a:link, a:visited, a:hover, a:active {
  text-decoration: none; }

.flCol {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between; }

.grCol {
  display: grid; }

.spBr {
  display: none; }

.tabBr {
  display: none; }

.pcBr {
  display: block; }

@media screen and (max-width: 991px) {
  .tabBr {
    display: block; } }
@media screen and (max-width: 767px) {
  .spBr {
    display: block; }

  .pcBr {
    display: none; } }
.text-xxs {
  font-size: 0.625rem;
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.8em;
  font-weight: 400; }

.text-xs {
  font-size: 0.75rem;
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.8em;
  font-weight: 400; }

.text-sm {
  font-size: clamp(0.75rem, calc(0.6943rem + 0.241vw), 0.875rem);
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 2em;
  font-weight: 400; }
  .text-sm.bold {
    font-weight: 700; }

.text-md {
  font-size: clamp(0.75rem, calc(0.6386rem + 0.4819vw), 1rem);
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 2em;
  font-weight: 400; }
  .text-md.bold {
    font-weight: 700; }

.text-lg {
  font-size: clamp(1rem, calc(0.8886rem + 0.4819vw), 1.25rem);
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.5em;
  font-weight: 700; }

.text-xl {
  font-size: clamp(1rem, calc(0.7214rem + 1.2048vw), 1.625rem);
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.5em;
  font-weight: 700; }

.text-xxl {
  font-size: clamp(1.125rem, calc(0.7349rem + 1.6867vw), 2rem);
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.5em;
  font-weight: 700; }

.text-3l {
  font-size: clamp(1.375rem, calc(-0.3214rem + 5.4286vw), 3.75rem);
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  line-height: 1.35em;
  font-weight: 900; }

.text-4l {
  font-size: clamp(1.625rem, calc(0.1071rem + 4.8571vw), 3.75rem);
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  line-height: 1.35em;
  font-weight: 900; }

.notesText {
  font-size: 0.625rem;
  font-feature-settings: "palt";
  letter-spacing: 0.1em;
  line-height: 1.8em;
  font-weight: 400; }

:root {
  --padding-set: 5vw; }
  @media screen and (max-width: 991px) {
    :root {
      --padding-set: 5vw; } }
  @media screen and (max-width: 767px) {
    :root {
      --padding-set: 10vw; } }

main {
  font-family: 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; }
  main #wrap {
    width: calc(100% - 180px);
    margin-left: auto;
    overflow: hidden;
    background-color: #FFFFFF; }
  @media screen and (max-width: 991px) {
    main #wrap {
      width: calc(100%  - 50px); } }
  @media screen and (max-width: 767px) {
    main #wrap {
      width: calc(100%  - 40px); } }
  main .secCol {
    padding: calc( var(--padding-set) + 4vw ) 0; }
  main .container {
    padding: 0 var(--padding-set);
    max-width: 1400px;
    margin-inline: auto; }
  main .titleCol {
    margin-bottom: 1em;
    /* 上下のアニメーション*/ }
    main .titleCol span {
      display: block; }
    main .titleCol .slide-in {
      overflow: hidden;
      display: inline-block; }
      main .titleCol .slide-in .slide-in_inner {
        display: inline-block; }
    main .titleCol .downAnime {
      opacity: 0;
      /* 事前に透過0 にして消しておく*/ }
    main .titleCol .slideAnimeDownUp {
      animation-name: slideTextY100;
      animation-duration: 0.8s;
      animation-fill-mode: forwards;
      opacity: 0; }
@keyframes slideTextY100 {
  from {
    transform: translateY(100%);
    /* 要素を上の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateY(0);
    /* 要素を元の位置に移動*/
    opacity: 1; } }
    main .titleCol .slideAnimeUpDown {
      animation-name: slideTextY-100;
      animation-duration: 0.8s;
      animation-fill-mode: forwards;
      opacity: 0; }
@keyframes slideTextY-100 {
  from {
    transform: translateY(-100%);
    /* 要素を下の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateY(0);
    /* 要素を元の位置に移動*/
    opacity: 1; } }
  @media screen and (max-width: 767px) {
    main .secCol {
      padding: calc( var(--padding-set) + 8vw ) 0; } }

/*# sourceMappingURL=style.css.map */