@charset "utf-8";
/* カスタム投稿用のCSS */

/* 画像がダミー画像の際の高さ調整(jsでページ内リンクをスクロールする際にずらさないように指定) */
.post_custom_img img[src$="dummy.png"] {
  box-sizing: content-box;
  height: 0 !important;
}
.post_custom_img img.lazyloaded {
    padding-top: 0 !important;
}
.post_box  {
	margin-bottom: 60px;
}
.post_custom_img_setting_type02 .post_custom_img {
	text-align: center;
}
.post_custom_img_inner {
    display: inline-block;
}
/*============================================================

 テキスト画像の縦並び

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media (min-width: 960px){
	.post_custom_type01,
	.post_custom_type02 {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		width: 100%;
	}
	.post_custom_type01 h3,
	.post_custom_type02 h3 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
	}
	.post_custom_type01 .post_custom_img,
	.post_custom_type02 .post_custom_content {
		-ms-flex-order:1;
		order:1;
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		width: 100%;
		margin-bottom: 20px;
	}
	.post_custom_type01 .post_custom_content,
	.post_custom_type02 .post_custom_img {
		-ms-flex-order:2;
		order:2;
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		width: 100%;
	}
	.post_custom_type01 .post_custom_content p,
    .post_custom_type02 .post_custom_content p {
/*        padding: 0 10px; */
    }
}
/*============================================================

 テキスト画像の横並び

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

@media (min-width: 960px){
	.post_custom_colume_type01 .post_custom_content { width: 60%;}
	.post_custom_colume_type01 .post_custom_img { width: 35%;}
	.post_custom_colume_type02 .post_custom_content { width:  50%;}
	.post_custom_colume_type02 .post_custom_img { width: 45%;}
	.post_custom_colume_type03 .post_custom_content { width: 50%;}
	.post_custom_colume_type03 .post_custom_img { width: 30%;}
	.post_custom_colume_type04 .post_custom_content { width: 70%;}
	.post_custom_colume_type04 .post_custom_img { width: 25%;}
	.post_custom_colume_type05 .post_custom_content { width: 47.5%;}
	.post_custom_colume_type05 .post_custom_img { width: 47.5%;}
	
	.post_custom_type03 .post_custom_img,
	.post_custom_type04 .post_custom_content {
		float: left;
	}
	.post_custom_type04 .post_custom_img,
	.post_custom_type03 .post_custom_content {
		float: right;
	}
	.post_custom_colume_type03.post_custom_type03 .post_custom_img {
		margin-left: 10%;
	}
	.post_custom_colume_type03.post_custom_type04 .post_custom_content {
		margin-left: 10%;
	}
  
.page.column1  .post_box_item:not([class*="width"]):not(:has(.post_custom_img)){
    width: 75%;
    margin-left: auto;
    margin-right: auto;
  }
	
	.post_custom_box.post_custom_type03::after,
	.post_custom_box.post_custom_type04::after {
		content: "";
		clear: both;
		display: block;
	}
}
@media (max-width: 959px){
	.post_custom_box > div + div{
		margin-top: 20px;
	}
	.post_custom_img {
		text-align: center;
	}
	.post_box  {
		margin-bottom: 40px;
	}
}

/*============================================================

 テキスト画像の表示幅

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media (min-width: 960px){
	.post_custom_width_type02,
	.post_custom_width_type03,
	.post_custom_width_type04 {
		margin-left: auto;
		margin-right: auto;
	}
	.post_custom_width_type02 {
		width: 90%;
	}
	.post_custom_width_type03 {
		width: 75%;
	}
	.post_custom_width_type04 {
		width: 50%;
	}
}

/* 短文表示の調整 */

.post_custom_width_type_short {
    display: flex;
    justify-content: center;
    gap: 2%;
    text-align: center;
	flex-wrap: wrap;
}

.post_custom_width_type_short .post_custom_content {
    text-align: left;
}
.post_custom_width_type_short.post_custom_type01 .post_custom_content,
.post_custom_width_type_short.post_custom_type02 .post_custom_content {
    text-align: left;
    display: inline-block;
    width: auto;
    flex-basis: auto;
}


/*

.post_custom_width_type_short .post_custom_type03,
.post_custom_width_type_short .post_custom_type04 {
    display: grid;
    justify-content: center;
    gap: 3%;
}
.post_custom_width_type_short .post_custom_colume_type01 {
    grid-template-columns: 35% auto;
}
.post_custom_width_type_short .post_custom_colume_type02 {
    grid-template-columns: 45% auto;
}
.post_custom_width_type_short .post_custom_colume_type03 {
    grid-template-columns: 30% auto;
}
.post_custom_width_type_short .post_custom_colume_type03 {
    grid-template-columns: 25% auto;
}
.post_custom_width_type_short .post_custom_colume_type03 {
    grid-template-columns: 47.5% 47.5%;
}
*/


@media (min-width: 960px){
	.post_custom_width_type_short.post_custom_type04 .post_custom_content {
	    order: 1;
	}
	.post_custom_width_type_short.post_custom_type04 .post_custom_img {
	    order: 2;
	}
    .post_custom_width_type_short.post_custom_type03::after,
    .post_custom_width_type_short.post_custom_type04::after {
        content: none;
    }
}
@media (max-width: 959px){
    .post_custom_width_type_short.post_custom_type01 .post_custom_img,
    .post_custom_width_type_short.post_custom_type02 .post_custom_img,
    .post_custom_width_type_short.post_custom_type03 .post_custom_img,
    .post_custom_width_type_short.post_custom_type04 .post_custom_img {
		flex-basis: 100%;
		width: 100%;
	}
    .post_custom_width_type_short.post_custom_img_width_sp_type02 .post_custom_img img {
        max-width: 50%;
    }
}



/*============================================================

 スマホでの画像の表示幅

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media (max-width: 959px){
	.post_custom_img_width_sp_type02 .post_custom_img {
		width: 50%;
		margin-left: auto;
		margin-right: auto;
	}
}

@media (min-width: 960px){
.flex-contents {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	width: 100%;
}
.flex-top-pc {
	-ms-flex-order:1;
	order:1;
	width: 100%;
}
.flex-bottom-pc {
	-ms-flex-order:2;
	order:2;
	width: 100%;
}
}

/*==========================================
fade 調整
==========================================*/

.fadein {
  opacity: 0.01;
  visibility: hidden;
  transition: opacity 1s, visibility 0s, transform 1s;
  transform:translateZ(0);
}
.is-fadein {
  opacity: 1;
  visibility: visible;
  transform: translate(0,0);
}
.fadeinTop {
  transform: translateY(-50px);
}
.fadeinBottom {
  transform: translateY(50px);
}
.fadeinLeft {
  transform: translatex(-50px);
}
.fadeinRight {
  transform: translatex(50px);
}
.fadeinLeftTop {
  transform: translate(-50px,-50px);
}
.fadeinTop.is-fadein,
.fadeinBottom.is-fadein,
.fadeinLeft.is-fadein,
.fadeinRight.is-fadein,
.fadeinLeftTop.is-fadein {
  transform: translate(0,0);
}

.post_box_bg[style*="background"] {
    padding-top: 40px;
    padding-bottom: 40px;
}