@charset "utf-8";
/* CSS Document */
.align-left{
	text-align: left;
}
.align-center{
	text-align: center;
}
.align-right{
	text-align: right;
}
.font09rem{	font-size: 0.9rem;	line-height: 1.6;}
.font095rem{	font-size: 0.95rem;	line-height: 1.6;}
.kyocho{
	font-weight: 600;
	font-size: 1.2rem;
	line-height: 1.6;
}
/* ロゴまわり ここから
/*
#logo {
  position: static;
  margin: 1rem auto 0rem;
  padding: 0 1rem;
  text-align: center;
}
*/

#logo{
	padding: 0 1rem;
}
#logo a {text-decoration: none;}
#logo img {
	display: block;
	width: 800px;	/*ロゴの幅*/
	margin: 3rem auto 0 auto;
}
/* ロゴまわり ここまで */
#mainimg image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	opacity: 0;
	transition: opacity 0.5s ease;	/*0.5sがフェードにかける時間*/
	will-change: opacity;
	z-index: 0;
}
#mainimg image.active {
	opacity: 1;
	z-index: 1;
}

.footer2{
	/*padding-top: 30px!important;*/
}
.m{
	margin-top: 30px;
	color:  var(--primary-color);
}
.space50{
	height: 50px;
}
.space80{
	height: 80px;
}
.frame{
	border: solid 1px var(--primary-color);
	border-radius: 25px;
}
/*PCの時*/
@media(min-width:751px){
    .spOnly{
        display: none !important;
    }
.mainInfoPc {
	position: absolute;
	top: 5vh;	/*上から5%の場所に配置*/
	z-index: 1;
	width: 100vw;	/*幅は100%*/
	/*margin-left: 10vw;	左に10%空ける*/
	display: flex;
	align-items: center;
	padding: 1rem;	/*ボックス内の余白。1文字分。*/
}
.frame{
	padding: 1.5rem 2rem 2.5rem 2rem;
}
}

/*SPの時*/
@media(max-width:750px){
    .pcOnly{
        display: none !important;
    }
.mainInfoSp {
	position: absolute;
	top: 20vh;	/*上から20%の場所に配置*/
	z-index: 1;
	width: 100vw;	/*幅は100%*/
	/*margin-left: 10vw;	左に10%空ける*/
	display: flex;
	align-items: center;
	padding: 1rem;	/*ボックス内の余白。1文字分。*/
}
.footer1,.footer2{
	text-align: center!important;
}
.br::before {
	content: "\A" ;
	white-space: pre ;
}

.frame{
	padding: 1rem;
}
}

.m01 {
	text-align: center;
	padding: 0.5em; /*上下左右の余白*/
	background-color: #616161; /*背景色*/
	color: #FFFFFF;
	border-radius: 25px;
}
.m02 a,.ichiran h3 a {
	display: flex;
	align-items: center;     /* 縦方向の中央揃え */
	justify-content: center; /* 横方向の中央揃え */
	text-align: center;
	padding: 0 0.5em;          /* 横方向の余白だけ残す */
	background-color: var(--primary-color);
	color: #FFFFFF;
	border-radius: 25px;
	box-shadow: 0px 0px;
	font-size: 1rem;
	height: 4.8rem;          /* 高さを固定 */
	line-height: 1.3;        /* 通常の行間 */
	text-decoration: none;
}
.m02 a:hover,.ichiran h3 a:hover{
	background: var(--secondary-color);
}
.m03 {
	border-bottom: 2px solid var(--primary-color);
	color: var(--primary-color);
	font-size: 1.4rem;
	font-weight: 500;
	padding: 0.2rem 1rem;
	text-align: center;
	margin-top: 3rem;
}
.m04 {
	text-align: center;
	padding: 0.5em!important; /*上下左右の余白*/
	background-color: var(--primary-color); /*背景色*/
	color: #FFFFFF;
	border-radius: 25px;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
	line-height: 1.3;
	font-size: 1.5rem;
}
/* 768px以上
@media only screen and (min-width: 1100px) {
	.m02 {
		font-size: 0.9rem;
	}
}*/
.step span{
	color: var(--primary-color);		/*背景色。css冒頭のprimary-colorを読み込みます。*/
	font-weight: 700;
	border-top-left-radius: 0px;
}
.lineTop{
	border-top: 1px solid #D3D3D3;
}
.list-style-none li{
 list-style: none;
	margin-left: -1.5rem;
}
.fontWhite{
	color: #fff;
}
dl.definition_list{
    /*display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    text-align: left;*/
	padding: 10px 0;

}
dl.definition_list div{
    width: 100%;
    margin: 0;
    padding: 0;
	border-bottom: solid 1px #A5A5A5;
	clear: both;
}

dl.definition_list dt{
    /*width: 120px;*/
    padding: 6px 15px;
    font-weight: bold;
	line-height: 1.5;
	clear: both;
	font-size: 14px;
}
dl.definition_list dd{
    /*width: calc(100% - 120px);*/
    padding: 0 20px;
	line-height: 1.5!important;
	font-size: 0.9rem;
	margin-bottom: 10px
}
/* 1100px以下 */
@media only screen and (max-width: 1100px) {
dl.definition_list{

}
dl.definition_list div{
    width: 100%;
}
	dl.definition_list dt{

}
}
/* floatがあるのでclear */
.clearfix::after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  content: "";
}
.areaBlock{
	margin-bottom: 5rem
}
.areaBlock .text{font-size: 0.95rem;line-height: 1.7rem;}
/*-----------カラム------------*/
.columnContainer {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 10px;
}
/*2カラム　左右で大きさが違う　ここから*/
.column--l,
.column--r {
  width: 100%;
  padding: 1rem;
}
.column--r h4 {
	text-align: left!important;
	font-size: 1.2rem!important;
	padding-left: 1rem;
	font-weight: 700;
	line-height: 1.5;
	margin: 0.5rem 0 0;
}
.column--r .text{font-size: 0.9rem;line-height: 1.6}

@media (min-width: 750px) {
  .column--l {
    width: 25%;
  }
  .column--r {
    width: 75%;
  }
}
/*2カラム　左右で大きさが違う　ここまで*/

/*2カラム　左右同じ　ここから*/
  .column2 {
  width: 100%;
  padding: 1rem;
}
  .column2 figure {
  padding: 1rem;
}

@media (min-width: 1024px) {
  .column2,.column2 {
  width: 50%;
  }
}
/*2カラム　左右同じ　ここまで*/

/*3カラム　ここから*/
.column3 {
  width: 100%;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* 上下に分ける */
}
  .column3 figure {
  padding: 1rem;
}
@media (min-width: 1024px) {
  .column3 {
  width: 33.33%;
  }

}
.column3 .clearfix {
  margin-top: auto; /* 自動で下に押し下げる */
}
/*3カラム　ここまで*/

/*カラムここまで--------------*/

.areaBlock .btn a,.text .btn a,.syosai a{
	border-radius: 25px;
	width: 220px;
	margin: 0 auto;
}
/*詳細ページここから--------------*/

.syosai .mainimg{
	padding: 0 10% 3rem 10%;
	margin: 0 auto;text-align: center;
	max-width: 1000px;
}
.syosai .category {
	width: 300px;
	margin: 50px auto 50px auto;
}
.pho {
  list-style: none;     /* 点（リストマーカー）を消す */
  display: flex;        /* 横並びにする */
  justify-content: center; /* 中央寄せ（左寄せならflex-start） */
  gap: 0.8rem;          /* アイコンの間隔 */
  padding: 0;           /* 余白をリセット */
  margin: 3rem 0 4rem;   /* 上だけ少し余白 */
}

.pho li {
  display: inline-block; /* 念のため横並び補強 */
}
.pho li img {
	border-radius: 20px;
}
/* スマホ（750px以下）のとき */
@media (max-width: 750px) {
  .pho {
    display: block; /* flexを解除して縦並びに */
    text-align: center; /* 真ん中寄せしたい場合 */
  }
  .pho li {
    display: block;
    margin-bottom: 10px;
  }
}
/*詳細ページここまで--------------*/
/*マーケット出展者情報ここから*/
#market section,.syosai section{
	padding-top: 1rem!important;
}
.ichiran{clear: both}
#market .btn_sns {
	margin-top: 1rem
}

.btn_sns {
  list-style: none;     /* 点（リストマーカー）を消す */
  display: flex;        /* 横並びにする */
  justify-content: center; /* 中央寄せ（左寄せならflex-start） */
  gap: 0.8rem;          /* アイコンの間隔 */
  padding: 2rem 2rem 5rem 2rem;           /* 余白をリセット */
  margin: 0.5rem 0 0;   /* 上だけ少し余白 */
}

.btn_sns li {
  display: inline-block; /* 念のため横並び補強 */
}

.btn_sns i {
  font-size: 1.4rem;
  color: #555;
  transition: color 0.3s;
}
/*詳細はこちらボタンここから*/
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;          /* テキストと矢印の間隔 */
  color: var(--primary-color);          /* 好きな色に変更OK */
  text-decoration: none;
  font-size: 0.8rem;
  transition: color 0.3s;
}

.link-arrow i {
  font-size: 0.9em;
  transition: transform 0.2s;
}

.link-arrow:hover {
  color: var(--primary-color); /* 例：テーマカラーで変化 */
}

.link-arrow:hover i {
  transform: translateX(4px);  /* ホバー時に矢印が少し動く */
}
/*詳細はこちらボタンここまで*/
.ichiran .list .text{
	margin-bottom:0.5rem;
	line-height: 1.6!important;
	margin: 0.5rem;
	font-size: 0.9rem;
}
.ichiran .category {
	margin-top: 0.5rem
}
.ichiran .list {
  display: flex;
  flex-direction: column; /* 縦並びにする */
  height: 95%; /* 高さをそろえる（必要なら） */
}
.ichiran .linkblock {
	margin-top: auto; /* 下寄せにするポイント！ */
	margin-bottom: 0.8rem;
	border-top: 1px solid #CCCCCC;
}
.sublink .category{
	margin-top: -1rem;
}
.syosai .category a{
	font-size: 0.8rem!important;
}

.ichiran .list img{
	border-radius: 20px;
  width: 100%;              /* 親要素いっぱいに */
  aspect-ratio: 1 / 1;      /* 正方形にする */
  object-fit: cover;        /* はみ出す部分をトリミング */
  display: block;

}
.ichiran .syosai a {
  background: var(--primary-color);
  color: var(--accent-inverse-color);
  text-decoration: none;
  text-align: center;
  display: block;
  padding: 0.2rem;
  font-size: 0.7rem;
}
.ichiran .syosai a:hover{ background: var(--secondary-color); }
.category a{
	text-decoration: none;
	font-size: 0.6rem;
	color:#555555;
	font-weight: 500;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 0.1rem 0.5rem!important;
}
.category a:hover{
	text-decoration: none;
	background:#ccc;
}
/*マーケット出展者情報ここまで*/

/*画像を正方形にするここから*/
.square img {
  width: 100%;              /* 親要素いっぱいに */
  aspect-ratio: 1 / 1;      /* 正方形にする */
  object-fit: cover;        /* はみ出す部分をトリミング */
  display: block;
}
/*画像を正方形にするここまで*/

#category h3{
	background: #197245;
	color: #FFFFFF;
	text-align: center;
}
.btn_bottom{
	margin-top: 50px;
	text-align: center;
	clear: both
}
.btn_bottom a{
	color: var(--primary-color);
	text-decoration: none;
}

/*btn-animation1 アニメーションボタン（枠線をぐるっとなぞるアニメーション）
---------------------------------------------------------------------------*/
@keyframes w {0% {width: 0px;} 100% {width: 100%;}}
@keyframes h {0% {height: 0px;} 100% {height: 100%;}}

/*ボタンの一番の外側のボックス*/
.btn-animation1-parts {
	position: relative;		/*枠線をアニメーションさせる為に必要な指定*/
	/*display: inline-block;*/
	display: block;
	box-shadow: 0px 0px 0px 1px #cccccc inset;	/*デフォルトで見えている枠線の設定*/
	font-size: 0.9em;
	color: var(--primary-color);
	font-weight: 500;
}

/*上のbtn-animation1の内側にあるボックス*/
.btn-animation1-inner-parts {
	display: block;text-decoration: none;
	padding: 0.5em 3em;		/*ボタン内の余白。上下、左右へ。emは文字の単位。1emが1文字分という事です。*/
	letter-spacing: 0.1em;	/*文字間隔を少しだけ広くとる*/
	text-indent: 0.1em;		/*letter-spacingを設定するとその分全体のテキスト位置がずれるので、戻す設定。同じ数字にしておけばOKです。*/
}

/*ボタン内でiタグを使う場合の設定*/
.btn-animation1-inner-parts i {
	display: inline-block;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/
	padding-left: 1em;		/*テキストと、iタグの間の余白*/
}
.btn-animation1-inner-parts:hover i {
	transform: translateX(5px);	/*マウスオン時にiタグを5pxだけ右に移動する*/
}

/*枠線共通*/
.btn-animation1-parts::before,
.btn-animation1-parts::after,
.btn-animation1-inner-parts::before,
.btn-animation1-inner-parts::after {
	content: "";
	position: absolute;
	background-color: var(--primary-color);		/*background(背景)スタイルですが、hover時の枠線の色になります。*/
	animation-duration: 0.2s;	/*アニメーションにかける時間。１辺あたり0.2秒。*/
	animation-fill-mode: forwards;	/*アニメーション完了時に最後のフレームを維持。この１行を外してみると別の動作になって面白い動きになります。*/
	animation-timing-function: linear;	/*アニメーションの速度のタイプ。同じ速度にする。*/
}

/*ラインアニメーション１（左上→右上）*/
.btn-animation1-parts:hover::before {
	left: 0px;				/*開始地点の指示*/
	top: 0px;				/*開始地点の指示*/
	height: 1px;			/*線の幅の代わりになります*/
	animation-name: w;		/*上の「@keyframes」で使うアニメーション名の指定。*/
}

/*ラインアニメーション２（右上→右下）*/
.btn-animation1-parts:hover::after {
	right: 0px;				/*開始地点の指示*/
	top: 0px;				/*開始地点の指示*/
	width: 1px;				/*線の幅の代わりになります*/
	animation-name: h;		/*上の「@keyframes」で使うアニメーション名の指定。*/
	animation-delay: 0.2s;	/*アニメーションを0.2秒遅れてスタートさせる。*/
}

/*ラインアニメーション３（右下→左下）*/
.btn-animation1-inner-parts:hover::before {
	right: 0px;				/*開始地点の指示*/
	bottom: 0px;			/*開始地点の指示*/
	height: 1px;			/*線の幅の代わりになります*/
	animation-name: w;		/*上の「@keyframes」で使うアニメーション名の指定。*/
	animation-delay: 0.4s;	/*アニメーションを0.4秒遅れてスタートさせる。*/
}

/*ラインアニメーション４（左下→左上）*/
.btn-animation1-inner-parts:hover::after {
	left: 0px;				/*開始地点の指示*/
	bottom: 0px;			/*開始地点の指示*/
	width: 1px;				/*線の幅の代わりになります*/
	animation-name: h;		/*上の「@keyframes」で使うアニメーション名の指定。*/
	animation-delay: 0.6s;	/*アニメーションを0.6秒遅れてスタートさせる。*/
}

dl.sanka_list{
	margin: 0 1rem;
	width: 100%;
}
.sanka_list dt{
  float: left;
  font-weight: 600;
}
.sanka_list dd{
  margin-left: 6rem;
}
.frame2{
border: #066736 solid 1px;
border-radius: 25px;
margin: 0.5rem;
	padding: 2rem;
	box-shadow: 0 0 0 10px #fff;
	border-style: solid solid;
	border-width: 5px;
	border-color: #bae281 #bae281 #75ce8e #75ce8e;
}
@media (min-width: 1250px) {
	.frame2{
		padding: 2rem 4rem 4rem;
		}
}

	.schedule{
/*		max-width: 900px;*/
		margin: 4rem 2rem;
	}
.schedule .schedule_list:first-child {
  border-top: 1px dotted #ccc;
}
/* 画面サイズ767px以下に適用するスタイル */
.schedule .schedule_list {
  border-bottom: 1px dotted #ccc;
	padding: 1rem 3rem;
}
	.schedule_list .date{
	background: #555555;
	color: #fff;
	padding: 0.3rem 1rem;
	font-size: 0.9rem;
	text-align: center;
	border-radius: 10px;
	}
/* 画面サイズ768px以上に適用するスタイル */
@media (min-width: 768px) {
.schedule .schedule_list {
  display: flex;
}
.schedule .schedule_list dt {
    width: 130px;
    padding: 5px;
}
.schedule .schedule_list dd {
    flex: 1;
    padding: 5px;
}
}
@media (max-width: 1250px) {
.br2::before {
	content: "\A" ;
	white-space: pre ;
}
	.schedule .schedule_list dt {
		padding-bottom: 0.5rem;
	}
	.schedule .schedule_list dd {
		padding-left: 1rem;
	}
}
.narrow_block{
	max-width: 1200px;
	margin: 0 auto;
}
.syosai .text{
	max-width: 800px;
	margin: 0 auto;
}
/* ===========================================
   WordPress サブディレクトリ完全修正
   =========================================== */

/* site-containerの幅を100%に修正 */
#site-container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 0 !important;
    right: 0 !important;
    overflow-x: hidden !important;
}

/* containerも念のため */
#container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* bodyとhtmlの完全リセット */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
}

/* ===========================================
   スマホ時の改行を完全に防ぐ修正（修正版）
   =========================================== */

/* すべてのh2, h3タイトルの改行を防ぐ */
body h2,
body h3,
body.home h2,
body.blog h2,
body.small-screen h2,
section h2,
section h3,
.area h2,
#areaMARC h2,
#areaEASE h2,
#areaStation h2 {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
    line-height: 1.4 !important;
}

/* 開催日時の改行を完全に防ぐ */
.flow-box .text,
.step li,
ul.step li,
body ul.step li,
body.small-screen ul.step li {
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
}

/* 横スクロールを許可 */
ul.step,
.flow-box {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

/* ただし、説明文（p要素）は通常の折り返しを許可 */
.flow-box .text p,
.step li p,
ul.step li p {
    white-space: normal !important;
}

/* スマホ専用の追加設定 */
@media(max-width:750px){
    /* タイトルを絶対に改行させない */
    body.small-screen h2,
    body.small-screen h3,
    section h2 {
        word-break: keep-all !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
    }

    /* 開催日時も絶対に改行させない */
    body.small-screen ul.step li,
    ul.step li {
        white-space: nowrap !important;
        word-break: keep-all !important;
    }
}
/* 超強力版 - 開催日時の改行を絶対に防ぐ */
body.home ul.step li,
body.blog ul.step li,
body.small-screen ul.step li,
body.wp-theme-meguro-snow-christmas ul.step li,
#information ul.step li,
.flow-box ul.step li,
section ul.step li {
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    text-overflow: ellipsis !important;
}