@charset "utf-8";
/* ■■■reset■■■ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

ul {
  list-style: none;
}

.clearfix:after {
	content: "" ;
	display: block ;
	clear: both ;
}

html { 
	scroll-behavior: smooth;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.clearfix	{
	display: block ;
}

*,*:before,*:after {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
}

* html .clearfix { 
	height: 1% ; 
}

html	{
	background: none ;
	position: relative ;
	width: 100% ;
	height: 100% ;
}

body	{
	width				: 100% ;
	max-height			: 100vh ;
	padding				: 0 ;
	margin				: 0 ;
	font-family			: 'Noto Sans JP', sans-serif;
	font-size			: 14px ;
	font-weight			: 500 ;
	line-height			: 1.5;
	-webkit-text-size-adjust: 100%;
	position			: relative ;
	background: #fff;
}

a img	{
	border				: none ;
}

a	{
	text-decoration		: none ;s
	color 				: #222 ;
}

a:hover{
	color				: #222 ;
	text-decoration		: none ;
}

form{
	margin				: 0 ;
	padding				: 0 ;
}

.visi_text{
	visibility			: hidden ;
}


/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.video-wrap {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* ビューポートの高さを100%に設定 */
    background-color: #f0f0f0; /* 背景色はお好みで設定 */
	z-index: 1;
}

.wrap{
	width: 350px;
	margin: 0 auto;
	position: relative;
	z-index: 3;
	color: #fff;
}


.wrap2{
	width: 350px;
	margin: 0 auto;
	position: relative;
	z-index: 3;
	color: #222;
}

.logo{
	width: 160px;
	height: 160px;
	margin: 20px auto 0;
}

.title{
	text-align: center;
	
}

.type{
	width: 350px;
	margin: 30px auto;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: start;
	justify-content: start;
}

.type div{
	display: block;
	padding: 0 10px;
	font-weight: 700;
}

.contact{
	margin: 0 auto 10px;
	font-size: 22px;
	text-align: center;
	color: #fff;
}

.form{
	width: 350px;
	height: 40px;
	padding: 0 10px;
	margin: 0 0 20px;
	outline: none;
	border: none;
	box-shadow: 0 0 20px rgba(0,0,0, .3);
	border-radius: 5px;
}

textarea{
	width: 350px;
	height: 100px;
	padding: 10px;
	margin: 0 0 20px;
	outline: none;
	border: none;
	border-radius: 5px;
}

.btn_send{
	width: 200px;
	height: 50px;
	margin: 0 auto;
	transition-duration: 0.3s;
	text-align: center;
	font-size: 20px;
	border-radius: 10px;
	background: #000;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	box-sizing: border-box;
	text-decoration: none;
	outline: none;
	border: none;
	box-shadow: 0 0 30px rgba(255,255,255, .3);
}

.btn_send:hover{
	background: #fff;
	color: #000 !important;
	font-weight: 700;
	box-shadow: 0 0 20px rgba(0,0,0, .1);
}

.adbox{
	text-align: right;
	position: absolute;
	bottom: 10px;
	right: -400px;
}

.adbox2{
	position: static;
	text-align: center;
	margin: 50px auto;
	padding: 0 0 20px;
}

.copy{
	font-size: 12px;
}


#targetImage {
	transition: opacity 1s ease;
}


@media screen and (max-width: 768px) {
/*　画面サイズが768pxまではここを読み込む　*/
.adbox{
	position: static;
	text-align: center;
	margin: 50px auto;
	padding: 0 0 20px;
}

video {
    max-height: 100%;
}


}

@media screen and (min-width: 769px) {
/*　画面サイズが769pxからはここを読み込む　*/
video {

}


}