/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Roboto&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;700&display=swap");
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		vertical-align: baseline;
}

body {
		line-height: 1;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
}

ul {
		list-style: none;
}

blockquote, q {
		quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
		content: '';
		content: none;
}

a {
		margin: 0;
		padding: 0;
		vertical-align: baseline;
		background: transparent;
}

ins {
		background-color: #ff9;
		color: #000;
		text-decoration: none;
}

mark {
		background-color: #ff9;
		color: #000;
		font-style: italic;
		font-weight: bold;
}

del {
		text-decoration: line-through;
}

abbr[title], dfn[title] {
		border-bottom: 1px dotted;
		cursor: help;
}

table {
		border-collapse: collapse;
		border-spacing: 0;
}

hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #cccccc;
		margin: 1em 0;
		padding: 0;
}

input, select {
		vertical-align: middle;
}

html {
		width: 100%;
		height: 100%;
}

* {
		box-sizing: border-box;
		outline: none;
}

body {
		width: 100%;
		height: 100%;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 100%;
		color: #2b2b2b;
}

a {
		color: #1A0DAB;
}

.serif {
		font-family: 'Noto Serif JP', serif;
}

.indent {
		padding-left: 1em;
		text-indent: -1em;
}

b {
		font-weight: bold;
}

.pc {
		display: block;
}

.sp {
		display: none;
}

.br-pc {
		display: block;
}

.br-sp {
		display: none;
}

input[type="button"] {
		background: none;
		border: none;
		outline: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
}

.wrapper {
		max-width: 1920px;
		width: 100%;
		margin: 0 auto;
		overflow-x: hidden;
}

.wrapper .kv {
		height: 100vh;
		width: 90vw;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 0 auto;
}

.wrapper .kv .logo {
		mix-blend-mode: overlay;
}

.wrapper .video {
		width: 100%;
		height: 100vh;
		background: url(../img/001.jpg) no-repeat center/cover;
		position: absolute;
		top: 0;
		left: 0;
		overflow: hidden;
		z-index: -1;
}

.wrapper .video::after {
		content: '';
		width: 100%;
		height: 100%;
		background-color: #10394b;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		opacity: .3;
}

.wrapper .video video {
		min-width: 100%;
		min-height: 100%;
		width: auto;
		height: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
}

@media (max-width: 780px) {
		body {
				width: 100%;
				height: 100vh;
		}
		img {
				max-width: 100%;
		}
		.pc {
				display: none;
		}
		.sp {
				display: block;
		}
		.br-sp {
				display: block;
		}
		.br-pc {
				display: none;
		}
		.wrapper {
				max-width: 100%;
				width: 100%;
				margin: 0 auto;
				overflow-x: hidden;
		}
		.wrapper .kv {
				height: 100vh;
				display: flex;
				justify-content: center;
				align-items: center;
		}
		.wrapper .kv .logo {
				mix-blend-mode: overlay;
				max-width: 60vw;
		}
		.wrapper .video {
				width: 100%;
				height: 100vh;
				background: url(../img/001.jpg) no-repeat center/cover;
				position: absolute;
				top: 0;
				left: 0;
				overflow: hidden;
				z-index: -1;
		}
		.wrapper .video::after {
				content: '';
				width: 100%;
				height: 100%;
				background-color: #10394b;
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				opacity: .3;
		}
		.wrapper .video video {
				min-width: 100%;
				min-height: 100%;
				width: auto;
				height: auto;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translateX(-50%) translateY(-50%);
		}
}
