@charset "UTF-8";
@import "reset5.css";

/* ページ全体 */

html, body {
	background-color: #354774;
	height: 100vh;
	margin: 0 auto;
	text-align: center;
}

/* テキスト関連 （bk：font-family: monospace, serif;）*/

.txt-normal {
	font-size: 12pt;
	color: #ffffff;
	font-family: monospace, serif;
	text-align: center;
	letter-spacing: 0.2em;
}

.txt-pre {
	font-size: 12pt;
	color: #e1b422;
	font-family: monospace, serif;
	text-align: center;
	letter-spacing: 0.2em;
}

.txt-footer {
	font-size: 10pt;
	color: #ffffff;
	font-family: monospace, serif;
	letter-spacing: 0.2em;
}

/* ボックス関連 */

.content-h1 {
	width: 30%;
}

.content-main {
	width: 40%;
	display: inline-block;
	word-break: break-all;
	line-height: 2em
}
	
.content-cntct {
	position:fixed;
	right:50px;
	bottom:100px;
}

.content-box {
	width: 40%;
	background-color: #000000;
	padding: 0px;
	opacity: 30%;
}

.content-footer {
	width: 100%;
	background-color: #000000;
	padding: 0px;
	position: fixed;
    bottom: 0;
	opacity: 50%;
}

/* 全画面表示 */

.background {
	height: 100vh;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: center center;
	background-image: url(../img/bgimg.jpg);
}

	
/* 要素固定 */

nav {
  position: sticky;
  top: 0;
	}
	
/* 要素固定 */

a:hover { 
	opacity:0.5;
	transition:0.3s;
}

/* sp 768px以下 */

@media screen and (max-width: 768px) {
	.background {
		min-height: 100vh;
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
		background-position: center center;
		background-image: url(../img/bgimg_sp.jpg);
	}
	.txt-normal {
		font-size: 10pt;
		color: #fff;
		font-family: monospace;
		text-align: center;
		letter-spacing: 0.2em;
		}
	.txt-pre {
		font-size: 10pt;
		color: #e1b422;
		font-family: monospace;
		text-align: center;
		letter-spacing: 0.2em;
	}
	.txt-footer {
		font-size: 6pt;
		color: #ffffff;
		font-family: monospace;
		letter-spacing: 0.2em;
	}
	.content-h1 {
		width: 65%;
	}
	.content-main {
		width: 100%;
		display: inline-block;
		word-break: break-all;
		line-height: 1.5em
	}
	.content-cntct {
		position:fixed;
		right:50px;
		bottom:100px;
	}
	.content-box {
		width: 85%;
		background-color: #000000;
		padding: 0px;
		opacity: 30%;
	}
}

/* コンテンツ配置 */

.flexbox {
	display:flex;
	flex-wrap: wrap;
	flex-flow: column;
	align-items: center;
	justify-content: center;
}

/* ロゴの処理（シャドウ・透過） */

.logo {
	filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.3));
	/* opacity: 75%; */
}

/* テキストの処理（シャドウ） */

.txt-shadow {
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.flex-center {
	align-items: center;
	display: flex;
	justify-content: center;
}

.position-ref {
	position: relative;
}

/* JS */

.load-fade {
	opacity: 0;
	visibility: hidden;
	transition: all 2s;
}

.load-fade.is-show {
	opacity: 70%;
	visibility: visible;
}

/* フジglobalからの持ち込み */

.mt-05 { margin-top: 0.5em !important }
.mt-1 { margin-top: 1em !important }
.mt-2 { margin-top: 2em !important }
.mt-3 { margin-top: 3em !important }
.mt-4 { margin-top: 4em !important }
.mt-5 { margin-top: 5em !important }
.mt-6 { margin-top: 6em !important }
.mt-8 { margin-top: 8em !important }
.mt-10 { margin-top: 10em !important }
.mt-12 { margin-top: 12em !important }
.mb-05 { margin-bottom: 0.5em !important }
.mb-1 { margin-bottom: 1em !important }
.mb-2 { margin-bottom: 2em !important }
.mb-3 { margin-bottom: 3em !important }
.mb-4 { margin-bottom: 4em !important }
.mb-5 { margin-bottom: 5em !important }
.mb-6 { margin-bottom: 6em !important }
.mb-8 { margin-bottom: 8em !important }
.mb-10 { margin-bottom: 10em !important }
.mb-12 { margin-bottom: 12em !important }
.strong { font-weight: bold !important }
.pc-none { display: block !important }
.sp-none { display: none !important }
