/*-------------背景イメージ----------------*/


/*top*/
.trans_bg
{
	width			: 100%;
	height			: 100%;
	background-color:rgba(0,0,0,0.3);
}



.top_image01,.top_image01-2,.top_image01-3{
  height: 100%; /*htmlやbodyの高さ100％にしているので、常に全画面化することが可能*/

}
/*
.top_image01{
  background-image: url(../images/top/img01.jpg);
}
.top_image01-2{
  background-image: url(../images/top/img01-2.jpg);
}
.top_image01-3{
  background-image: url(../images/top/img01-3.jpg);
}
*/

.top_image02 {

  background		: #1a1247 url(../images/top/img02.jpg);
  background-size	: 100% auto;
  background-repeat	: no-repeat;
  background-position: 50% 0;
}

.top_image03
{
  background-image	: url(../images/top/img03.jpg);
}


.image_base {
  width:100%;
  background-position: center 50%;
  background-size: cover;
}





/*768以下の指定（タブレット）*/

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


.top_image01,.top_image01-2,.top_image01-3{
  height: 60%; /*htmlやbodyの高さ100％にしているので、常に全画面化することが可能*/
}
.top_image_offset
{

  	background-size: auto 60%;
}

}


@media screen and (min-width:480px) and ( max-width:748px) {
.top_image01,.top_image01-2,.top_image01-3{
  height: 100%; /*htmlやbodyの高さ100％にしているので、常に全画面化することが可能*/
}
	
}



/*480以下の指定（スマホ横)*/
@media screen and (max-width: 480px) {

.top_image01,.top_image01-2,.top_image01-3{
  height: 65%; /*htmlやbodyの高さ100％にしているので、常に全画面化することが可能*/
}
.top_image_offset
{

  	background-size: auto 65%;
}


}