@charset "UTF-8";
header {
	position:relative;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0;
	background: url("../img/top/mv_bk.jpg") center/cover no-repeat;
}
header:before{
	position:absolute;
	content:"";
	left:12%;
	bottom:-10%;
	width:320px;
	height:280px;
	background:url("../img/top/illust01.png") left bottom/320px no-repeat;
	z-index:8888;
	transition:0.3s;
}
header:after{
	position:absolute;
	content:"";
	right:12%;
	bottom:-10%;
	width:320px;
	height:280px;
	background:url("../img/top/illust02.png") left bottom/320px no-repeat;
	z-index:8888;
	transition:0.3s;
}
#header {
	position:relative;
	width: 100%;
	height: 592px;	
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	transition:0.3s;
}

#header #logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	margin: auto;
}
#header #logo img{
	display:block;
	width:100%;
}

section.sec.top_ptb{
	padding:40px 0;
	overflow:hidden;
}

section.sec .gara.top {
	width: 100%;
	margin: 0 auto;
	padding:0 0 60px;
	background: url("../img/top/contents_bk01.png") top left no-repeat, url("../img/top/contents_bk02.png") top right no-repeat;
}

.gara:before{
	position:absolute;
	content:"";
	left:6%;
	bottom:6%;
	width:352px;
	height:216px;
	background:url("../img/top/illust_left02.png") left bottom no-repeat;
	z-index:1;
	transition:0.3s;
}

.gara:after{
	position:absolute;
	content:"";
	right:6%;
	bottom:8%;
	width:234px;
	height:420px;
	background:url("../img/top/illust_right02.png") left bottom no-repeat;
	z-index:1;
	transition:0.3s;
}

@media screen and (max-width: 1440px) {
.gara:before{
	width:280px;
	height:172px;
	background:url("../img/top/illust_left02.png") left bottom/280px no-repeat;
}
.gara:after{
	bottom:4%;
	width:150px;
	height:269px;
	background:url("../img/top/illust_right02.png") left bottom/150px no-repeat;
}	
}

@media screen and (max-width: 1280px) {
header:before{
	left:4%;
	width:240px;
	height:208px;
	background:url("../img/top/illust01.png") left bottom/240px no-repeat;
}
header:after{
	right:4%;
	width:240px;
	height:212px;
	background:url("../img/top/illust02.png") left bottom/240px no-repeat;
}
.gara:before{
	width:240px;
	height:147px;
	background:url("../img/top/illust_left02.png") left bottom/240px no-repeat;
}
.gara:after{
	bottom:2%;
	width:167px;
	height:300px;
	background:url("../img/top/illust_right02.png") left bottom/167px no-repeat;
}	
}


/* TB & SP */
@media screen and (max-width: 1024px) {
header {
	position:relative;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0;
	background: url("../img/top/tab/mv_bk.jpg") center/cover no-repeat;
}
#header {height: 316px;}
#header #logo {width:32vw;}
header:before,
header:after{bottom:-10vw;}

}

@media screen and (max-width: 768px) {
header {background: url("../img/top/sp/mv_bk.jpg") center/cover no-repeat;}
#header {height: 590px;}
#header #logo {width:66vw;}
section.sec .gara.top {
	padding:0 0 60px;
	background: url("../img/top/sp/contents_bk01.png") top center/100% no-repeat, url("../img/top/sp/contents_bk02.png") bottom center/100% no-repeat;
}
.gara:before{
	bottom:2%;
	width:180px;
	height:110px;
	background:url("../img/top/illust_left02.png") left bottom/180px no-repeat;
}
.gara:after{
	width:120px;
	height:215px;
	background:url("../img/top/illust_right02.png") left bottom/120px no-repeat;
}

}

@media screen and (max-width: 480px) {
header {background: url("../img/top/sp/mv_bk480.jpg") center/cover no-repeat;}
#header {height: 378px;}	
#header #logo {width:75vw;}	
header:before{
	width:150px;
	height:130px;
	background:url("../img/top/illust01.png") left bottom/150px no-repeat;
}
header:after{
	right:4%;
	width:150px;
	height:132px;
	background:url("../img/top/illust02.png") left bottom/150px no-repeat;
}
section.sec.top_ptb{padding:20px 0;}
section.sec .gara.top {padding:40px 0;}	
	
.gara:before{
	width:120px;
	height:74px;
	background:url("../img/top/illust_left02.png") left bottom/120px no-repeat;
}
.gara:after{
	width:80px;
	height:144px;
	background:url("../img/top/illust_right02.png") left bottom/80px no-repeat;
}	
	
}



/*****2020.07.22 追加　審J番号追記*****/
p.j_num.top{
	position:absolute;
	right:90px;
	top:calc(100% - 395px);
	font-size:14px;
	line-height:1;
	margin:0;
	padding:0;
	color:#fff;
}
@media screen and (max-width: 1440px) {
p.j_num.top{	
	right:60px;
	top:calc(100% - 375px);
	}
}

@media screen and (max-width: 1280px) {
p.j_num.top{top:calc(100% - 30vw);}
}
@media screen and (max-width: 1024px) {
p.j_num.top{right:45px;}	
}
@media screen and (max-width: 768px) {
p.j_num.top{right:30px;}
}
@media screen and (max-width: 640px) {
p.j_num.top{top:calc(100% - 33vw);}
}
@media screen and (max-width: 380px) {
p.j_num.top{
	right:20px;
	top:calc(100% - 35vw);
	}	
}