/**********************************************
	ヘッダー
**********************************************/
#heroBlock {
	position:relative;
	overflow:hidden;
	width:100%;
	height:40vh;
}

#headerImage {
	position:fixed;
	z-index:1;
	width:100%;
	height:40vh;
	top:0;
	background:url("../images/header/011.jpg") no-repeat center bottom;
	background-size:cover;
	transform-origin:center;
}

#pageTitle, #wrapper, #mapArea, #footerContact, #footer {
	position:relative;
	z-index:2;
}

/**********************************************
	潮汐
**********************************************/
.tideTitle {
	margin:2rem 0 1rem 0;
	text-align:center;
	font-size:1.5rem;
	font-weight:bold;
}

.tideText {
	margin-bottom:1rem;
	text-align:center;
	font-size:1.2rem;
}

/**********************************************
	潮汐テーブル
**********************************************/
.scroll{
	overflow:auto;
}

.scroll::-webkit-scrollbar {
	height:5px;
}
.scroll::-webkit-scrollbar-track {
	background:#f1f1f1;
}

.scroll::-webkit-scrollbar-thumb {
	background:#bcbcbc;
}


.tideTable {
	margin:0 auto;
	max-width:900px;
	border:2px solid #666;
}

.tideTable th {
	padding:5px;
	text-align:center;
	white-space:nowrap;
	font-size:0.9rem;
	font-weight:bold;
	border:1px solid #ccc;
	border-bottom:1px solid #ccc;
}

.tideTable td {
	padding:5px;
	text-align:center;
	white-space:nowrap;
	border:1px solid #ccc;
}

.tideTable td.timeWidth {
	width:60px;
}

.tideTable td.levelWidth {
	width:30px;
}

/**********************************************
	潮汐テーブル内の文字修飾
**********************************************/
.bold {
	font-size:1.2rem;
	font-weight:bold;
}

.bigLine {
	border-right:2px solid #666 !important;
}

.right {
	text-align:right !important;
}

.headLine {
	border-bottom:2px solid #666;
}

.just {
	border-top:2px solid #666;
}

.unjust {
	border-top:1px solid #666;
}

.weekday {
	color:#000;
}

.holiday {
	color:#e74c3c;
}
.saturday {
	color:#2980b9;
}