@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body.page .main {
  width: 860px;
  padding: 0px 0px;
  border: 0px solid transparent!important;
  border-radius: var(--cocoon-basic-border-radius);
  position: relative;
  background-color: transparent !important;
  z-index: 0;
}

main.main {
	padding: 10px 25px;
}

#content {
	margin-top: 0;
}

/*見出しデザイン*/
h1.en {
	font-family: "Paytone One", sans-serif!important;
	font-weight: 400;
	font-style: normal;
	color: black;
    font-size: clamp(40px, 8vw, 75px) !important;
}

h1.en_lime {
	font-family: "Paytone One", sans-serif!important;
	font-weight: 400;
	font-style: normal;
	color: black;
    font-size: clamp(40px, 8vw, 75px) !important;
}

.article h2 {
	border-radius: 60px;
	color: #e1f000;
	background-color: black;
	padding: 25px 40px !important;
}

.article h3 {
border-left: 0px solid;
border-right: 0px solid;
border-top: 0px solid;
border-bottom: 3px solid;
border-color: black!important;
font-size: clamp(16px, 3.8vw, 20px) !important;
padding: 12px 10px;
}

.area_lime .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}

.article h4 {
	border: solid 0px !important;
	margin-bottom: 0;
	margin-bottom: 0.8vw !important;
	padding: 0 !important;
}

/************************************
** トップページ
************************************/
.area_bk {
background-color: black;
padding: 60px;
}

.area_lime .button-wrapper a {
color: #e1f000!important;
}

.area_lime .button-wrapper a:hover {
color: white!important;
opacity: 1!important;
}

.area_bk .button-wrapper a {
color: #e1f000!important;
}

.area_bk .button-wrapper a:hover {
color: white!important;
opacity: 1!important;
}

/*トップページのみ見出しデザイン*/
body.home h1.en {
	font-family: "Paytone One", sans-serif!important;
	font-weight: 400;
	font-style: normal;
		color: #e1f000;
    font-size: clamp(40px, 8vw, 75px) !important;
}

body.home p.jp {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 500!important;
	font-size: clamp(16px, 4.5vw, 32px) !important;
	margin-bottom: 1em;
	color: #e1f000;
}

body.home p.jp_lime {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 500!important;
	font-size: clamp(16px, 4.5vw, 32px) !important;
	margin-bottom: 1em;
	color: black;
}

/*固定ページタイトル*/
body.page .date-tags {
	display: none;
}

body.page .entry-title {
	display: none;
}

.entry_title_en {
	font-family: "Paytone One", sans-serif!important;
    font-size: clamp(40px, 8vw, 65px) !important;
	color: black;
	padding-bottom: 0.4rem;
}

.entry_title_jp {
	font-family: "M PLUS 1p", sans-serif;
	font-weight: 500!important;
	font-size: clamp(16px, 4.5vw, 28px) !important;
	margin-bottom: 1em;
	color: black;
}

/************************************
** nav
************************************/
.navi-in > ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}

.btn_entry {
	background-color: #e53900;
	font-weight: bold;
}

/************************************
** /* トップページ エントリーリンク帯
************************************/
.entry_link {
	background-color: #e53900;
	padding: 0.6vw;
}

.entry_link:hover {
	background-color: #e53900;
	padding: 0.6vw;
	opacity: 0.8;
	transition: all 0.3s ease;
}

.entry_link a {
	font-size: clamp(12px, 3.8vw, 22px);
	font-weight: bold;
	color: white !important;
}

.entry_link a:hover {
	font-size: clamp(14px, 4vw, 24px);
	font-weight: bold;
	color: white !important;
	transition: all 0.3s ease;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1024px以上*/
@media screen and (min-width: 1024px){
  /*必要ならばここにコードを書く*/

	.sp-only {
		display: none !important;
	}
	
	/*トップページのみ黒エリア内ボタン*/
	.area_bk .wp-block-button {
	  display: flex;
	  justify-content: center;  /* 横方向中央寄せ */
	  align-items: center;      /* 縦方向中央寄せ（必要なら） */
	  margin: 1.5rem 0;           /* 上下に余白 */
	}

	.area_bk .wp-block-button a {
	  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	  font-weight: bold; /* 太字 */
	  display: inline-block;
	  padding: 1.5rem 3.5rem;       
	  background-color: white;  
	  color: white;
	  text-decoration: none;
	  border-radius: 60px;
	  font-size: 20px;          
	  text-align: center;
	  transition: all 0.3s ease;
	}

	.area_bk .wp-block-button a:hover {
	  background-color: #e1f000;   
	  color: #000;              
	  padding-left: 8.5rem;       
	  padding-right: 8.5rem;
	}
	
	
	/*トップページのみライム色エリア内ボタン*/
	.area_lime .button-wrapper {
	  display: flex;
	  justify-content: center;  /* 横方向中央寄せ */
	  align-items: center;      /* 縦方向中央寄せ（必要なら） */
	  margin: 1.5rem 0;           /* 上下に余白 */
	}

	.area_lime .button-wrapper a {
	  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	  font-weight: bold; /* 太字 */
	  display: inline-block;
	  padding: 1.5rem 3.5rem;       
	  background-color: black;  
	  color: #e1f000;
	  text-decoration: none;
	  border-radius: 60px;
	  font-size: 20px;          
	  text-align: center;
	  transition: all 0.3s ease;
	}

	.area_lime .button-wrapper a:hover {
	  background-color: white;   
	  color: black !important;              
	  padding-left: 8.5rem;       
	  padding-right: 8.5rem;
	}
}

/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	/*トップページのみ黒エリア*/
	.area_bk {
		background-color: black;
		padding: 2em !important;
	}

	.area_lime {
		background-color: transparent;
		padding: 2em !important;
	}
	
	.sp-only {
		display: none !important;
	}
	
	/*トップページのみ黒エリア内ボタン*/
	.area_bk .wp-block-button {
	  display: flex;
	  justify-content: center;  /* 横方向中央寄せ */
	  align-items: center;      /* 縦方向中央寄せ（必要なら） */
	  margin: 1.5rem 0;           /* 上下に余白 */
	}

	.area_bk .wp-block-button a {
	  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	  font-weight: bold; /* 太字 */
	  display: inline-block;
	  padding: 1.5rem 3.5rem;       
	  background-color: white;  
	  color: white;
	  text-decoration: none;
	  border-radius: 60px;
	  font-size: 20px;          
	  text-align: center;
	  transition: all 0.3s ease;
	}

	.area_bk .wp-block-button a:hover {
	  background-color: #e1f000;   
	  color: #000;              
	  padding-left: 6.5rem;       
	  padding-right: 6.5rem;
	}
	
/************************************
** 各コースページ 下部リンクコースカード
************************************/
.link_course_card .course_card_inner {
	padding: 10px 8px 15px 8px !important;
	
}
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	/*トップページのみ黒エリア*/
	.area_bk {
		background-color: black;
		padding: 2em !important;
	}

	.area_lime {
		background-color: transparent;
		padding: 2em !important;
	}
	
	.page_wrapper {
		padding: 20px;
	}
	
	footer {
		padding: 0 60px;
	}
	
	.area_bk ul {
		padding-left: 0;
	}
	
  main.main,
  div.sidebar {
        padding: 0;
        margin: 0;
        border-width: 0;
    }
	
	/*コースの表示位切り替え--吉田*/
	.pc-only {
		/*display: none !important;*/
		display: block !important;
	}

	.sp-only {
	/*display: block !important;*/
		display: none !important;
	}
	body .wp-container-core-columns-is-layout-a5331a9e.is-layout-flex {
		flex-direction: column;
	}
	body .wp-container-core-columns-is-layout-a5331a9e.is-layout-flex .course_card_inner {
		display: flex;
		gap: 1rem;
		padding: 20px;
		align-items: center;
	}
	body .wp-container-core-columns-is-layout-a5331a9e.is-layout-flex .course_card_inner figure {
		width: 45% !important;
		margin: 0;
	}
	body .wp-container-core-columns-is-layout-a5331a9e.is-layout-flex .course_card_inner .has-text-align-center {
		text-align: left;
		width: calc(100% - (45% + 1rem));
	}
	/*ここまで*/

	/*トップページのみ黒エリア内ボタン*/
	.area_bk .wp-block-button {
	  display: flex;
	  justify-content: center;  /* 横方向中央寄せ */
	  align-items: center;      /* 縦方向中央寄せ（必要なら） */
	  margin: 1.5rem 0;           /* 上下に余白 */
	}

	.area_bk .wp-block-button a {
	  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	  font-weight: bold; /* 太字 */
	  display: inline-block;
	  padding: 1.5rem 3.5rem;       
	  background-color: white;  
	  color: white;
	  text-decoration: none;
	  border-radius: 60px;
	  font-size: 20px;          
	  text-align: center;
	  transition: all 0.3s ease;
	}
	
	main.main {
		padding: 10px 25px;
		margin: 15px
	}
}

/************************************
** リンクボタン
************************************/
.button-wrapper {
  display: flex;
  justify-content: center;  /* 横方向中央寄せ */
  align-items: center;      /* 縦方向中央寄せ（必要なら） */
  margin: 20px 0;           /* 上下に余白 */
}

.button-custom {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-weight: bold; /* 太字 */
  display: inline-block;
  padding: 1.5rem 3.5rem;        
  background-color: black;   
  color: #fff;              
  text-decoration: none;
  border-radius: 60px;
  font-size: 20px;          
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 2px 13px rgba(0,0,0,0.2); /* 軽い影 */
}

.button-custom:hover {
  background-color: #fff;   
  color: #000;              
  padding-left: 6.5rem;       
  padding-right: 6.5rem;
}

/************************************
** <p>タグ内リンクボタン
************************************/
p a {
	color: #e53900;
}

/************************************
** トップページ新着情報表示
************************************/
body.home .wp-block-query .wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}
body.home .wp-block-query .wp-block-post { max-width: none; } /* Grid と競合しないように */

/* カードの基本 */
body.home .wp-block-query .wp-block-post {
  display: flex;
  flex-direction: column; /* 縦に並べる */
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: transform 0.2s ease;
}

.wp-block-query .wp-block-post:hover {
  transform: translateY(-4px);
}

/* 画像を大きめに表示 */
body.home .wp-block-query .wp-block-post-featured-image img {
  width: 100%;
  height: 240px;       /* ←ここで大きさを調整 */
  object-fit: cover;   /* 横長や縦長でもトリミングして綺麗に */
  display: block;
}

/* Query Loop の投稿を縦並びに */
body.home .wp-block-post .wp-block-columns {
  display: block !important; /* 横並びをやめて縦積みにする */
}

/* 画像部分 */
body.home .wp-block-post .wp-block-post-featured-image img {
  width: 100%;
  height: auto;      /* 画像の高さを調整 */
  object-fit: cover;
  display: block;
  border-radius: 6px;
}

/* タイトル部分 */
body.home .wp-block-query .wp-block-post-title {
  font-size: 1.1rem;
  font-weight: bold;
  margin: 4px !important;
  text-align: center;    /* センターにしたければ center に変更 */
}

body.home .wp-block-query .wp-block-post-title {
	padding: 25px 10px !important;
}

body.home .wp-block-post-title a {
	color: black !important;
}

body.home .wp-block-post-title a:hover {
	color: black !important;
	opacity: 0.6 !important;
}

body.home .area_bk a {
	color: black !important;
}

/************************************
** コースカード設定
************************************/
.course_card {
background-color: #e1f000;
border-radius: 30px;
transition: background-color 0.6s ease;
box-shadow: 0 2px 13px rgba(0,0,0,0.2); /* 軽い影 */
}

.course_card:hover {
background-color: white;
  transform: translateY(-4px);
}

.course_card_inner {
padding: 30px;
}

.course_card_inner .wp-block-image {
margin-bottom: 0.6em;
}

.course_card_inner p {
margin-bottom: 0.6em;
}

a {
  text-decoration: none;
}

.course_card_inner_icon {
display: block;
width: 2rem;
height: 1.4rem;
}

.fa-arrow-right {
  color: black;
  font-size: 20px;
text-align: right;
}

/* モバイル設定 */
.course_card_sp {
background-color: #e1f000;
border-radius: 30px;
transition: background-color 0.6s ease;
box-shadow: 0 2px 13px rgba(0,0,0,0.2); /* 軽い影 */
padding: 20px;
}

.course_card_sp:hover {
background-color: white;
  transform: translateY(-4px);
}

.course_card_inner_sp {
padding: 30px;
}

.course_card_inner_sp .wp-block-image {
margin-bottom: 0.6em;
}

.course_card_inner_sp p {
margin-bottom: 0.6em;
}

a {
  text-decoration: none;
}

.course_card_inner_icon_sp {
display: block;
width: 2rem;
height: 1.4rem;
}

.fa-arrow-right {
  color: black;
  font-size: 20px;
text-align: right;
}

/************************************
** エイドステーション詳細　提供サービスアイコン
************************************/
.group_aid_overview .svg-inline--fa {
display: inline-block;
height: 1.4em;
overflow: visible;
margin-bottom: 0;
padding-bottom: 0;
}

.group_aid_overview p {
font-size: clamp(8px, 2vw, 12px);	
}

/* === 横並び全体 === */
.group_aid_overview {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap; /* 折り返し許可（スマホ対応） */
  gap: 2em; /* アイテム間の横余白 */
}

/* === 各アイコン＋テキストセット === */
.group_aid_overview > .wp-block-group.is-vertical {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0; /* アイコンと文字の距離 */
}

/* === アイコン === */
.group_aid_overview svg {
  display: block;
  width: 2.2em;
  height: auto;
  margin: 0 auto;
}

/* === テキスト === */
.group_aid_overview p {
  margin: 0;
  padding: 0;
  line-height: 1.2;
  font-size: 0.9rem;
}

.group_aid_overview {
	background-color: white;
	padding: 1.5vw 2vw 1vw 2vw;
	border-radius: 15px;
	margin-bottom: 1em !important;
}

.group_aid_overview p {
	color: #999
}

.group_aid_overview  .wp-block-group {
	margin-bottom: 0;
	font-weight: bold;
}

/************************************
** 各コースページ タイムスケジュール表
************************************/
.table_schedule {
  width: 100%;               /* 幅いっぱい */
  table-layout: fixed;       /* 列幅固定 */
  border-collapse: collapse; /* 枠線の重なりを消す */
}

.table_schedule td {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-weight: bold; /* 太字 */
}

/* 枠線 */
.table_schedule td {
  border: 2px solid black !important;
  padding: 8px;
}

/* 列幅指定 */
.table_schedule td:nth-child(1) {
	width: 50%;
	background-color: black;
	color: #e1f000;
}

.table_schedule td:nth-child(2) {
	width: 50%;
}

/************************************
** 各コースページ トグルボックス
************************************/
.toggle-button {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-weight: bold; /* 太字 */
	background-color: white;
	text-align: left;
	border: 0px;
	padding: 10px 30px;
}

.toggle-button::before {
	color: black;
	opacity: 1;
}

.toggle-content {
	border-width: 0px !important;
}

/************************************
** NEWS一覧ページ
************************************/
.news_list img {
	  box-shadow: 0 2px 13px rgba(0,0,0,0.2); /* 軽い影 */
}

.wp-block-latest-posts__post-title {
	font-weight: bold;
}

.news_list img:hover {
  transform: translateY(-4px);
}

.wp-block-latest-posts.is-grid li {
	margin-bottom: 8.3rem;
}

/************************************
** トップページYouTube埋め込み
************************************/
body.home .video-container {
	max-width: none;
}

/************************************
** フッターモバイルメニューの最後のメニューリンク--英語用追加（吉田）
************************************/
/* #menu-gnav_sp li:last-child.navi-menu-button,
#menu-gnav_sp_en li:last-child.navi-menu-button {
  background-color: #e53900; /* 好きな色 */
} */

/*#menu-gnav_sp li:last-child.navi-menu-button a,
#menu-gnav_sp_en li:last-child.navi-menu-button a {
	color: white !important;
}*/

/************************************
** /* ギャラリーを横スクロールにする 
************************************/
.wp-block-gallery {
  display: flex;
  flex-wrap: nowrap;   /* 折り返さない */
  overflow-x: auto;    /* 横スクロール許可 */
  gap: 10px;           /* 画像の間隔（任意で調整） */
}

/* スクロールバーを隠したい場合（オプション） */
.wp-block-gallery::-webkit-scrollbar {
  display: none;
}
.wp-block-gallery {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/************************************
** /* カテゴリーラベル・カテゴリーリンク
************************************/
.cat-label {
	background-color: black;
	color: #e1f000;
}

.cat-link:hover {
	background-color: black;
	color: #e1f000;
	opacity: 1;
}

/************************************
** /* cocoonタブ見出しボックス設定
************************************/
.tab-caption-box-label {
	background-color: black !important;
	color: white;
	font-weight: bold;
}

.tab-caption-box-content {
	border-color: black;
}

/************************************
** /* フォトギャラリー用
************************************/
.gallery .wp-element-caption {
	font-weight: bold;
	margin-top: 0.5vw
}

.photo_gallery_wrapper p {
	text-align: center;
	font-weight: bold;
}

.photo_gallery_wrapper .wp-block-image {
	margin-bottom: 0.4em !important;
}


/************************************
** /* フッター主催者表記用
************************************/
.footer-center{
	text-align: center;
}


/*吉田*/

/************************************
** /* 投稿者消す
************************************/
.author-info {
	display: none;
}

/************************************
** /* 言語スイッチャー
************************************/
.language {
	display: flex;
	list-style: none;
	padding: 0;
	justify-content: flex-end;
	max-width: 1480px;
	margin: 1rem auto 0 auto;
	padding: 0 2rem;
	font-size: 0.85rem;	
	gap: 1.5rem;
	
}
.language .current-lang a {
	color: #e53900;
	font-weight: bold;
}