/* ベース
=========================================================*/
body
{
	/* Font */
	font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN","Hiragino Sans",  Meiryo, sans-serif;
	font-size: 11pt;
	/* Text color */
	color: #333;
	/* Remove the background color to make it transparent. */
	background-color: #f0fff;
	margin: 0px;
	padding：max(5dvi, 20px);
}
div {
    overflow-wrap: normal; 
}

/* レイアウト
========================================================*/
.ly_cont {
	text-align: center;
	max-width: 900px;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
.ly_600 {
	text-align: center;
	max-width: 600px;
	margin-right: auto;
	margin-left: auto;

}
.ly_660 {
	text-align: center;
	max-width: 660px;
	margin-right: auto;
	margin-left: auto;
	line-height: 1.4em;
	margin-bottom:3px;
}

.ly_660_left{
	text-align: left;
	max-width: 660px;
	margin-right: auto;
	margin-left: auto;
	line-height: 1.4em;
	margin-bottom:3px;	
}
.ly_760 {
	text-align: center;
	max-width: 760px;
	margin-right: auto;
	margin-left: auto;
}
.ly_date {
	text-align: right;
	padding: 10px;
}

.haikei-white {
	background: #FFFFFF;
	color: #404040;
	line-height: 1.2em;
	max-width: 760px;
	padding: 10px;
	margin-left: auto;
	margin-right: auto;

}

.haikei-blue {
	background: #66ccff;
	max-width: 620px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
	padding: 10.5px;
	font-size:10pt;
	line-height:1.2em;
}

	p.parag-left {
		text-align: left;
		line-height: 1.3em;
		padding: 1em;
}
	p.parag-center {
	text-align: center;
 	line-height: 1.3em;
	padding: 1em;
}

.my_title {
	padding: 0.5em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #fffaf4;/*背景色*/
	border-left: solid 5px #ffaf58;/*左線（実線 太さ 色）*/
}

.wrapper-800 {
	max-width: 800px;
	height: 800px;
	border: 1px solid #E0E0E0;
	margin-left: auto;
	margin-right: auto;
	padding: 3em 5em;

}


.container0a {
            margin: 30px auto;
            height: auto;
            width: 600px;
            background-color: #FFFFFF;
            overflow-wrap: break-word;
			padding: 1em;
}
.container2a {
            margin: 30px auto;
            height: auto;
            width: 600px;
            overflow-wrap: break-word;
			background-color: #F0F0FF;
			padding: 1em;
}
	

.background-image-container {
	background-image: url("../kcfinder/upload/images/background.png");
	margin: 0px;
	padding: 2em;
  /* 必要に応じて padding や margin を設定 */
}

/* モジュール
========================================================*/


/* 画像の横に文章(flex)  ひぽぽたあむ　マリンバ*/

	.box-cont {
		display: flex;
		flex-direction: row;
	  	justify-content: center;
		margin-left: auto;
		margin-right: auto;
	}
	.box-cont_white {
		background: #FFFFFF;
			display: flex;
			flex-direction: row;
		  	justify-content: center;
		margin-left: auto;
		margin-right: auto;

	}
	.box {
	   	text-align: center;
		margin-bottom: 3px;
	}
.box-photo {

		text-align: center;
		paddinr-right:5px;

}

.box-text {

		padding-left: 5px;
		width: 400px;
	background: #FFFFFF;
}

.box-text > p{
	text-align: left;
	padding-left:10px;
}

/* 画像の横に文章互い違い(flex)  秋の遠足*/
.box-cont_rev {
  	display: flex;
	width: 768px;
	padding: 0px;
	margin-left: auto;
	margin-right: auto;
}
.box-cont_rev .box-photo_rev {
  background: #FFCC99;
	margin: 0;

}
.box-cont_rev:nth-child(even) {
  flex-direction: row-reverse;
}
.box-cont_rev:nth-child(even) .img {
  margin: 0px;
}

.box-text_rev {
  width: 384px;
  height: auto;
  background: #FFCC99;
	text-align: center;
	color: #CC6600;
}

.box-text_rev p {
	text-align: left;
	line-height: 1.3em;
	font-size: 0.9rem;
	padding: 1.5em;

}

.box-photo_rev p{
	margin:0px;
	padding:0px;
}
/* unrelated css */

.box-photo_rev {
  width: 384px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;

}

/*キャプション付き画像を並べる(inline-block)*/

.inline-block1
	text-align: center;
	max-width: 460px;
	margin-left: auto;
	margin-right: auto;
}
.inline-block2 {
	text-align: center;
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	background: #FFFFFF;
}

.inline-block1 li {
	display: inline-block;
	vertical-align: top;
	margin: 0px 5px;
}

.inline-block2 li {
	display: inline-block;
	vertical-align: top;
	margin-left:5px;

}

.inline-block2 li h3 {
	
	background: #00C000;
	color: #FFFFFF;
	font-weight: bold;
	padding: 5px;
	margin-bottom: 0px;

}


.block-space{
	margin-left:5px;
}
.block-topspace{
	margin-top: 2px;
	margin-bottom: 10px;
}

.inline-block1 > p {
	margin-top: 2px;
	margin-bottom: 10px;

}
.inline-block1 li > p {
	margin-top: 2px;
	margin-bottom: 10px;

}


.inline-block2 > p {
	margin-top: 2px;
	margin-bottom: 10px;

}


/*アイテム三つ並び　タイトルの両側に画像(flex)　バザー報告*/

	/* 親要素(コンテナ) */
	.flex-container {
		display: flex;
		flex-direction: row;
	  justify-content: center;
		margin-left: auto;
		margin-right: auto;
		width: 400px;
	}
	/* 子要素(アイテム) */
		.flex-item {
		margin: 10px auto;
		padding: 5px 10px;
		box-sizing: border-box;
	}
	h2.bazar {
	font-size: 1.3rem;
	background: pink;
	/*box-shadow: 0px 0px 0px 5px #dfefff;*/
	box-shadow: 0px 0px 0px 5px pink;
	/*border: dashed 1px #96c2fe;*/
	border: dashed 1px #fff;
	width: 10em;
	color: #666;
	letter-spacing: 0.2em;
	text-align: center;
	padding: 0.2em 0.5em 0.2em 0.5em;
	margin: 0 auto 2em auto;
}
.fxcard-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
	max-width: 900px;
	padding: 10px;
	margin-left: auto;
	margin-right: auto;

}

.fxcard-item {
  /* （全体の幅 - gapでつけた余白の合計）をカラム数で割る */
  width: calc((100% - 24px) / 3);
	border: 1px solid #E0E0E0;
	text-align: center;
	padding-top: 1em;

}

.fxcard-item >p {
	max-width: 300px;
	text-align: left;
	padding-left: 1em;
	padding-right: 1em;
	margin-left: auto;
	margin-right: auto;

}
.fxcard-item > img {
	min-width: 0;
	max-width: 240px;
}
/*PCの場合*/
.pc_only { display: inline!important; }
.mb_only { display: none!important; }
@media screen and (max-width: 768px) {
/*タブレット、スマホの場合*/

.pc_only { display: none!important; }
.mb_only { display: inline!important; }

	    .box-cont {
	        flex-direction: column; /* モバイル時は縦並び */
	    }
	 
	    .box-photo, .box-text {
		width: 100%;
		max-width: 100%;
	    }
.box-text > p {
	text-align: center;
	width:90%;
}

	.bl_media {
		display: block;
	}

	.bl_media_imgWrapper {
		margin-right: 0;
		margin-bottom 20px;
	}
img{
	width: 100%;
	max-width: 100%;
	height: auto;
}

    .box-cont_rev {
        flex-direction: column; /* モバイル時は縦並び */
    }
.box-cont_rev:nth-child(even) {
  flex-direction: column;
}
.box-photo_rev, .box-cont_rev, .box-text_rev {
width: 100%;
height:auto;
}
.flex-container {
			flex-direction: column; /* モバイル時は縦並び */
	    }
img, h2 {
	width:100%;
	max-width:100%;
	height:auto;
}
.flex-item img{
	width:100%;
	max-width:100%;
	height:auto;
}

.box-cont {
 	flex-direction: column;
 	justify-content: center;
}


.fxcard-item {
    width: 100%;
	margin-left: auto;
	margin-right: auto;

}
.fxcard-item > img{
	max-width:100%;
}
}