@charset "utf-8";
/* CSS Document */

.contents {position: absolute;width:80%; height:250px; top:42%;left: 50%;transform: translateY(-80%) translateX(-50%);}
.clImg {position:relative; top:0; height:100%;}
.clImg img{position:absolute; width:100%;}
.single-item {text-align: center;color: #FFF;background: rgba(12,59,75,0.0);padding:0 0 30px 0;}



/*menu*/
.cross01,.cross02,.cross03,.cross04,.cross05,.cross06,.cross07{background:#fff;display:none;height:4px;position:absolute;z-index:100001;transition:transform .3s;width:30px;}
.cross01_bottom,.cross02_bottom,.cross03_bottom,.cross04_bottom,.cross05_bottom,.cross06_bottom,.cross07_bottom{bottom:0;}
.cross01_top.action01,.cross02_top.action02,.cross03_top.action03,.cross04_top.action04,.cross05_top.action05,.cross06_top.action06,.cross07_top.action07{display:block;position:fixed;top:45px;right:30px;transform:rotate(45deg);}
.cross01_bottom.action01,.cross02_bottom.action02,.cross03_bottom.action03,.cross04_bottom.action04,.cross05_bottom.action05,.cross06_bottom.action06,.cross07_bottom.action07{display:block;position:fixed;top:45px;right:30px;transform:rotate(135deg);}

/*gnav*/
.menuopen01,.menuopen02,.menuopen03,.menuopen04,.menuopen05,.menuopen06,.menuopen07{background:rgba(0,0,0,0.85);display:none;height:100%;position:fixed;width:100%;z-index:100000;}
.menuopenfield01,.menuopenfield02,.menuopenfield03,.menuopenfield04,.menuopenfield05,.menuopenfield06,.menuopenfield07{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;width:100%;}

.oshirase {
color:#FFF;
font-size:100%!important;
line-height:1.4em;
margin:0 0 10px 0;
}
.oshirase span{
display:block;
}
.oshirase a {
color:#FFF!important;
font-size:100%!important;
font-weight:bold!important;
line-height:1.8em!important;
}

nav ul.news{background:url(../svgicon/news.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.output-analysis{background:url(../svgicon/output-analysis.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.questions{background:url(../svgicon/questions.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.words{background:url(../svgicon/words.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.itpassport{background:url(../svgicon/words.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.faq{background:url(../svgicon/faq.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}
nav ul.information{background:url(../svgicon/information.svg)center top no-repeat; background-size:40px; padding:60px 0 0 0}

nav ul li a {
color:#FFF;
font-size:100%;
font-weight:bold;
line-height:2.75em;
}

#fadein_area ul li{
	cursor:pointer;
}

@media screen and (min-width:781px){


#fadein_area ul li{
	width:47%;
	float:left;
	margin:0 2% 10px 1%;
	color:#FFF;
	text-align:center;
	font-weight:bold;
	font-size:115%;
	line-height:3em;
	border-radius: 5px / 5px;
	
}
#fadein_area ul li.news{background:url(../svgicon/news.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.output-analysis{background:url(../svgicon/output-analysis.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.questions{background:url(../svgicon/questions.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.words{background:url(../svgicon/words.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.itpassport{background:url(../svgicon/words.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.faq{background:url(../svgicon/faq.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.information{background:url(../svgicon/information.svg)20px center no-repeat; background-size:25px; background-color: rgba(12,59,75,0.85);}

.single-item p{
	font-size:250%;
	font-weight:bold;
	text-align:center;
	text-shadow:0px 0px 8px #111;
}
.single-item p span{font-size:80%;}

}


@media screen and (max-width:780px){

#fadein_area ul li{
	width:100%;
	margin:0 0 10px 0;
	border-radius: 5px / 5px;
	color:#FFF;
	text-align:center;
	line-height:3em;
}
#fadein_area ul li.news{background:url(../svgicon/news.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.output-analysis{background:url(../svgicon/output-analysis.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.questions{background:url(../svgicon/questions.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.words{background:url(../svgicon/words.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.itpassport{background:url(../svgicon/words.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.faq{background:url(../svgicon/faq.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}
#fadein_area ul li.information{background:url(../svgicon/information.svg)20px center no-repeat; background-size:18px; background-color: rgba(12,59,75,0.85);}

.single-item p{
	font-size:150%;
	font-weight:bold;
	text-align:center;
	text-shadow:0px 0px 6px #111;
}
.single-item p span{font-size:80%;}


}