h2,h3 {
	font-family: serif;
}

/*  header */
header .nav_tel {
  background: #523227;
	 border-radius: 10px;
}

header .nav_tel a {
  color : #fff;
}

.concept_img1 {
	position: relative;
	top: 100px;
	left: 50px;
	z-index: 2;
}

.concept_img2 {
 position: relative;
	top: 0;
	left: -50px;
}

.concept_txt {
 max-width: 650px;
	margin: 0 auto;
}

/*スマホ画面*/
@media(max-width: 768px) {
	.concept_img1 {
  top: 30px;
		left: 50px;
	}
	
	.concept_img2 {
   top: -30px;
		left: -50px;
	}
}

.about_txt {
	max-width: 650px;
	margin: 0 auto;
}

/* 3カラムレイアウト */
.vk_posts-mainSection {
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-start;
}

/* archive */
.archive .vk_posts-mainSection .vk_post {
 width: 22%; /* 4カラムにするために幅を22%に設定 */
 margin-bottom: 30px; /* 各カラム間の間隔を調整 */
 display: flex;
 flex-direction: column; /* 子要素を上下に並べる */
 transition: transform 0.3s ease, box-shadow 0.3s ease;
 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 border: 1px solid #ddd;
 border-radius: 8px;
 overflow: hidden;
}

.archive .vk_posts-mainSection .vk_post:hover {
 transform: translateY(-5px);
 box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.vk_posts-mainSection .vk_post_imgOuter {
 width: 100%;
 position: relative;
 overflow: hidden;
 margin-bottom: 10px;
}

.archive .vk_posts-mainSection .vk_post_imgOuter img {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 object-fit: cover;
}

.vk_posts-mainSection .vk_post_body {
 flex: 1;
 padding: 10px;
}

.vk_posts-mainSection .vk_post .vk_post_title {
 margin: 0 0 10px;
 font-size: 1.25em;
}

.vk_posts-mainSection .vk_post .vk_post_excerpt {
 font-size: 1em;
}

.vk_posts-mainSection .vk_post .vk_post_btnOuter {
 margin-top: 30px;
 /* text-align: right; */
}

.vk_post .media-body {
 width: 100%;
}

h5:where(:not(.wp-block-post-title)) {
 padding-bottom: 1em;
}

.has-text-align-left {
 max-width: 650px;
 margin: 0 auto;
}

.vk_post-btn-display.media .vk_post_btnOuter {
 width: 160px;
}

.media-body {
 flex: 1;
 padding-left: 2px;
}

@media (min-width: 992px) {
 .main-section>.vk_posts>.vk_post-col-lg-12 .vk_post_title {
     font-size: 16px;
 }
}

@media (min-width: 992px) {
 .main-section>.vk_posts>.media {
     padding: 0;
 }
}

@media (min-width: 576px) {
 .main-section>.vk_posts>.media {
     padding-bottom: 20px;
 }
}

@media (min-width: 768px) {
 .vk_posts .vk_post-col-md-6 {
     width: calc(35% - 30px);
     margin: 0 auto;
 }
}

.custom-group {
 max-width: 650px;
 margin: 0 auto;
}

/* 見出しブロック */
.wp-block-heading {
 max-width: 650px;
 margin: 0 auto;
}


.blog .vk_posts-mainSection {
  width: 100%;
  display: flex;
  flex-direction: column; /* 子要素を上下に並べる */
}

.blog .vk_post-btn-display.media .vk_post_btnOuter {
 width: 0;
}

.blog .vk_posts-mainSection .vk_post {
   width: 100%;
   margin-bottom: 30px;
   flex-direction: row;
}

.blog .vk_posts-mainSection .vk_post_imgOuter {
   width: 30%;
   position: relative;
   overflow: hidden;
}

.blog .vk_posts-mainSection .vk_post:hover {
   transform: translateY(-1px);
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.blog .media-img {
   border: 0px solid var(--vk-color-border-image);
   padding: 0px;
   margin-right: 0rem;
}

.blog .main-section>.vk_posts>.media {
   padding-top: 25px;
}

.blog .vk_post-btn-display.media .vk_post_body {
   padding-bottom: 50px;
}

.category .media-body {
 flex: 1;
 padding-left: 3px;
}

.media{
 display: flex;
 align-items: normal;
}

@media (min-width: 576px) {
 .blog .main-section>.vk_posts>.media {
  border-top: 2px solid var(--vk-color-border-hr, #e5e5e5);
}
}

/* category */

 .category .main-section>.vk_posts>.media {
  border-top: 2px solid var(--vk-color-border-hr, #e5e5e5);
  border-bottom: 2px solid var(--vk-color-border-hr, #e5e5e5);
 }

.category .vk_posts-mainSection {
 width: 100%;
 display: flex;
 flex-direction: column; /* 子要素を上下に並べる */
}

.category .vk_post-btn-display.media .vk_post_btnOuter {
width: 0;
}

.category .vk_posts-mainSection .vk_post {
  width: 100%;
  margin-bottom: 30px;
  flex-direction: row;
  box-shadow: none;
  border: none;
  border-radius: 0;
}

.category .vk_posts-mainSection .vk_post_imgOuter {
  width: 30%;
  position: relative;
  overflow: hidden;
}

.category .vk_posts-mainSection .vk_post:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.category .media-img {
  border: 0px solid var(--vk-color-border-image);
  padding: 0px;
  margin-right: 0rem;
}

.category .main-section>.vk_posts>.media {
  padding-top: 25px;
}

.category .vk_post-btn-display.media .vk_post_body {
  padding-bottom: 50px;
}

/* date */

.date .vk_posts-mainSection {
 width: 100%;
 display: flex;
 flex-direction: column; /* 子要素を上下に並べる */
}

.date .vk_post-btn-display.media .vk_post_btnOuter {
width: 0;
}

.date .vk_posts-mainSection .vk_post {
 width: 100%;
 margin-bottom: 30px;
 flex-direction: row;
 box-shadow: none;
 border: none;
 border-radius: 0;
}

.date .main-section>.vk_posts>.media {
 border-top: 2px solid var(--vk-color-border-hr, #e5e5e5);
 border-bottom: 2px solid var(--vk-color-border-hr, #e5e5e5);
}

.main-section>.vk_posts>.media.vk_post:first-child {
 border-top: 2px solid var(--vk-color-border-hr, #e5e5e5);
}

.date .vk_posts-mainSection .vk_post_imgOuter {
  width: 30%;
  position: relative;
  overflow: hidden;
}

.date .vk_posts-mainSection .vk_post:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.date .media-img {
  border: 0px solid var(--vk-color-border-image);
  padding: 0px;
  margin-right: 0rem;
}

.date .main-section>.vk_posts>.media {
  padding-top: 25px;
}

.date .vk_post-btn-display.media .vk_post_body {
  padding-bottom: 50px;
}

.site-footer {
 background-image: url('http://localhost:10018/wp-content/uploads/2024/08/footer-1.jpg');
 background-size: cover; 
 background-position: center;
 background-repeat: no-repeat;
}

/* フッターの内容のスタイル */
.site-footer-content {
 text-align: center;
 
}

.row {
 height: 100%;
 width: 100%; /* 親要素の幅いっぱいに広げる */
 max-width: 1400px; /* 必要に応じて最大幅を指定 */
 margin: 0 auto; /* 親要素の中央に配置 */
 display: flex; /* 必要に応じてフレックスボックスを使用 */
 justify-content: center; /* フレックスボックスを使う場合、子要素を中央揃え */
 background: rgba(255,255,255,0.5);
 padding: 30px 0;
}

.site-footer-copyright p:nth-child(2) {
 display: none;
}

.site-footer-copyright p {
 font-size: 12px;
 color: #e5e5e5;
}

/* @media (min-width: 992px) {
 .col-lg-4 {
     flex:100%;
     max-width: 100%;
 }
} */

.veu_profile .profile {
 display: flex;
 justify-content: center;
 margin-top: 75px;
 margin-bottom: 0;
 margin-left: auto;
 margin-right: auto;

 width: max-content;
 /* 子要素の幅に合わせる */
}

@media (min-width: 992px) {
 .col-lg-4 {
     flex: 0 0 33%;
     max-width: 33%;
 }
}

.widget_nav_menu>div>ul, .widget_nav_menu>ul {
 padding: 0;
 margin: 0;
 
}

.site-footer {
 position: relative; 
 /* relative を追加 */
 --vk-size-text-sm: 18px;
 font-size: var(--vk-size-text-sm);
}

/* リンクのアンダーラインを中央からフェードインさせる */
footer .menu-item a {
 position: relative;
 display: inline-block;
 color: #000; /* リンクの色 */
 text-decoration: none; /* デフォルトの下線を消す */
 overflow: hidden; /* 要素のオーバーフローを隠す */
}

footer .menu-item a::before {
 content: '';
 position: absolute;
 width: 60%;
 height: 3px;
 bottom: -1px;
 left: 25%;
 background-color: #523227; /* アンダーラインの色 */
 transform: scaleX(0); /* 最初はアンダーラインが見えない */
 transform-origin: center; /* 中央からアニメーションを開始 */
 transition: transform 0.5s ease; /* アニメーションの時間とイージング */
}

footer .menu-item a:hover::before {
 transform: scaleX(1); /* ホバー時にアンダーラインを表示 */
}

footer .nav_tel a {
 background: #523227;
 border-radius: 10px;
 margin-top: 80px;
 color: #e5e5e5;
}

/* 最後のリスト項目（telリンク）のアンダーラインを無効化 */
footer .nav_tel a {
 text-decoration: none; /* 既存の下線を削除 */
}

footer .nav_tel a:hover::before {
transform: scaleX(0); /* アンダーラインを非表示 */
 transition: none; /* アニメーションを無効化 */
}



/* .col-lg-4,.col-md-6 {
 padding-left: 0;
} */
/* 投稿リストのアニメーション */
.post-list {
/* 下から */
 animation-name:fadeUpAnime;
 animation-duration: 3s;
 animation-fill-mode: forwards;
 opacity:0;
 }
 
 @keyframes fadeUpAnime{
   from {
     opacity: 0;
   transform: translateY(100px);
   }
 
   to {
     opacity: 2;
   transform: translateY(0);
   }
 }

 

 /* その場で */
.entry-body {
 animation-name:fadeInAnime;
 animation-duration: 3s;
 animation-fill-mode:forwards;
 opacity:0;
 }
 
 @keyframes fadeInAnime{
   from {
     opacity: 0;
   }
 
   to {
     opacity: 1;
   }
 }
 
 .sub-section {
 animation-name:fadeInAnime;
 animation-duration: 3s;
 animation-fill-mode:forwards;
 opacity:0;
 }
 
 @keyframes fadeInAnime{
   from {
     opacity: 0;
   }
 
   to {
     opacity: 1;
   }
 }
 
 /* カレンダー */

/* カレンダーウィジェットの公開日リンクに下線を引く */
.widget_calendar td a {
 text-decoration: underline; /* 下線を引く */
 color: #523227; /* リンクの色を設定 */
}