@charset "UTF-8";

/*
	お知らせ詳細
-----------------------------------------------------------------------------------------------*/
.newsDetail{
	&.cmnCtsArea{
		width: 860px;
	}
	
	.listPhoto{
		display: flex;
		flex-direction: column;
		gap: 20px;

		> li{
			width: 500px;
			margin: 0 auto;
			border-radius: 20px;
			overflow: hidden;

			&.radiusNone{
				border-radius: 0;
			}
		}
	}

	.btnBase{
		margin-top: 30px;
	}

	/* WordPress用 */
	.cmnCtsFirst{
		h1,h2,h3,h4,h5,h6{
			display: flex;
			align-items: center;
			margin-bottom: 15px;
			padding: 10px 15px;
			font-size: 1.8rem;
			font-weight: var(--fw-bold);
			background-color: var(--c-lightGrey);
			border-radius: 5px;
			position: relative;
			&::before{
				content: "";
				display: inline-block;
				width: 3px;
				height: 2.2rem;
				margin-right: 10px;
				background-color: var(--c-orange);
			}
		}
		> div,
		> p{
			margin-bottom: 15px;
		}
		/* img{
			width: 100%;
			height: auto;
		} */
		.wp-caption-text{
			margin-top: 5px;
			font-size: 1.2rem;
		}
		a{
			display: inline-block;
			margin: 0 5px;
			padding-right: 20px;
			color: var(--c-orange);
			font-weight: var(--fw-bold);
			text-decoration: underline;
			text-decoration-color: currentColor;
			transition: text-decoration-color 0.3s ease-out;
			position: relative;
			&::after{
				content: "";
				width: 16px;
				height: 16px;
				border-radius: 50%;
				background: url("/images/btn_arrow_white.svg") var(--c-orange) no-repeat center center / 40%;
				position: absolute;
				right: 0;
				bottom: 50%;
				transform: translateY(50%);
			}
			&:has(img) {
				margin: 0;
				padding-right: 0;
				transition: opacity 0.3s;
				&::after{
					display: none;
				}
			}
			@media (hover: hover){
				&:hover{
					text-decoration-color: transparent;
					&:has(img) {
						opacity: 0.7;
					}
				}
			}
		}
	}
}

/* リリース日
============================== */
.releaseDate{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;

	.date{
		font-family: var(--ff-en-lato);
		font-size: 2.2rem;
		font-weight: var(--fw-black);
		color: var(--c-orange);
	}
}


/*
	iPhone13ランドスケープ セーフエリア
	（SafeLandLeft：47　/　SafeLandRight：47）
	844 - 94 = 750　※750px以上でPC表示
-----------------------------------------------------------------------------------------------*/
@media screen and (width < 750px){
	/*
		お知らせ詳細
	-----------------------------------------------------------------------------------------------*/
	.newsDetail{
		&.cmnCtsArea{
			width: 100%;
			max-width: 500px;
		}
		
		.listPhoto{
			gap: 15px;

			> li{
				width: calc(100% - 40px);
			}
		}

		.btnBase{
			margin-top: 20px;
		}

		/* WordPress用 */
		.cmnCtsFirst{
			h1,h2,h3,h4,h5,h6{
				font-size: 1.6rem;
			}
			> div,
			> p{
				width: 100% !important;
			}
			img{
				width: auto;
				max-width: 100%;
				height: auto;
			}
		}
	}

	/* リリース日
	============================== */
	.releaseDate{
		margin-bottom: 15px;

		.date{
			font-size: 1.8rem;
		}
	}
}