@charset "UTF-8";

/* ヘッダ整形区間開始 */
.facility-page-header {
	height: 75vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
	background-color: #f4f0eb;
}

.facility-page-logo {
	margin-right: 1em;
	height: 4em;
}

.facility-page-header-texts p {
	color: white;
	line-height: 1.0;
}

.facility-page-english {
	font-size: 4em;
}

.facility-page-Japanese {
	font-size: 2em;
}

.facility-page-subtext {
	font-size: 1em;
}

.fixed-header-wave {
	height: 24px;
	margin-top: -24px;
	position: relative;z-index: 1;
}

@media (max-width: 768px) {
	.facility-page-header {
		flex-direction: column;
	}
	
	.facility-page-logo {
		margin-right: 0;
		margin-bottom: 1em;
		width: 30em;
		height: auto;
	}
	
	.facility-page-header-texts p {
		text-align: center;
		line-height: 1.0 !important;
		margin-bottom: 0 !important;
	}
	
	.facility-page-english {
		font-size: 2.75em !important;
	}

	.facility-page-Japanese {
		font-size: 2em !important;
	}

	.facility-page-subtext {
		font-size: 1em !important;
	}
}

/* ヘッダ整形区間終了 */

.workshop-container {
    /* ページごとの記述内容の全体を格納 */
    width: 60%;
	display: flex;
    gap: 50px;
    margin: 7.5em 0 5em 0;;
    justify-self: center;
}

.workshop-media img {
    /*アイキャッチ*/
    width: 500px;
    grid-column-start: 1;
    grid-row-start: 1;
    grid-row-end: -1;
    border-radius: 50px;
}

.workshop-title {
    /*h2*/
    text-align: left;
    grid-column-start: 2;
    grid-row-start: 1;
    color: #2f4e3d
}

.workshop-explain {
    /*ワークショップ説明文*/
    grid-column-start: 2;
    grid-row-start: 2;
    margin: 30px 0;
    overflow-wrap: anywhere;
    font-size: 18px;
}

.workshop-schedule {
    /* 開催情報 */
    grid-column-start: 2;
    grid-row-start: 3;
    margin: 30px 0;
}

table {
  border-collapse: separate;
  border-spacing: 5px; 
}

th, td {
  min-width: 130px;
  padding: 8px 10px;
  vertical-align: middle;
  border-radius: 5px;
  font-size: 18px;
}

th { /* 表 - ヘッダ (日時等) */
  background-color: #8B5844;
  color: #fff;
  text-align: center;
}

td { /* 表 - 本文 */
  background-color: #fff;
  color: #000;
  text-align: left;
}

.fixed-return {
	margin-bottom: 5em;
	text-align: center;
    color: #749562;
}

.return {
	padding: 1em;
	border-radius: 1em;
    color: #fff;
	background-color: #2f4e3d;
}

@media(max-width: 768px) {
    .fixed-page-header-title {
        font-size: 4rem;
    }

    .workshop-container {
		display: block;
    	width: 90%;
	}
	
    .workshop-title {
        text-align: center;
        font-size: 2rem;
    }

    .workshop-media img {
        width: 100%;
        height: auto;
        border-radius: 24px;
    }

    .workshop-media,
    .workshop-title,
    .workshop-explain,
    .workshop-schedule {
        order: 0;
    }

    tbody tr th,
    tbody tr td {
        font-size: 18px;
    }
}