@charset "shift_jis";
/* CSS Document */

/*==================== pc ====================*/
@media screen and (min-width: 641px){
/* Keyvisual
-----------------------------------*/
#keyvisual {
	width:100%;
    height:650px;
	overflow:hidden;
	position:relative;
	/*background: url(../images/zeppin_cm_topimg_bg1.jpg);*/
    background-color: #442c16;
}

#keyvisual #top1_base{
	width:100%;
	height:650px;
	position:absolute;
	top:0px;
	left:0px;
	background: url(../images/ZEPPIN_TOP1_bg2.jpg) repeat top center;
	z-index: 30;
}
#keyvisual #top1_img01{
	width:100%;
	height:650px;
	position:absolute;
	top:0px;
	left:0px;
	background: url(../images/ZEPPIN_TOP1_bg1.jpg) no-repeat top center;
	z-index: 40;
	/*display: none;*/
}

#keyvisual .top1{
	width:980px;
    height:650px;
	margin: 0px auto;
	position:relative;
}
#keyvisual #top1_img02{ width:655px; position:absolute; top:0px; right:-200px; z-index: 70; display: none;/**/}
#keyvisual #top1_img03{ width:565px; height: 67px; position:absolute; top:200px; z-index: 70; display: none;/**/}
#keyvisual #top1_img04{ width:602px; height: 166px; position:absolute; top:270px; left: -20px; z-index: 70; display: none;/**/}


#keyvisual #top2_img01{
	width:100%;
	height:649px;
	position:absolute;
	top:0px;
	left:0px;
	/*border-top: 1px #000000 solid;
	border-bottom: 1px #ccc solid;*/
	background: url(../images/ZEPPIN_TOP2_bg2.jpg) no-repeat top center;
	z-index: 100;
	display: none;/**/
}

#keyvisual .top2{
	width:980px;
    height:650px;
	margin: 0px auto;
	overflow:hidden;
	position:relative;
}
#keyvisual #top2_img02{ width:544px; position:absolute; top:35px; z-index: 200; display: none;/**/}
#keyvisual #top2_img03{ width:544px; position:absolute; top:50px; left: 550px;  z-index: 200; display: none;/**/}


/**/
#keyvisual .noscript_top{width:100%;height:650px;background: url(../images/ZEPPIN_TOP1_bg2.jpg) repeat top center;}
#keyvisual .noscript_top .top_img{text-align: center;}
.print{display: none;}

}

/*==================== smp ====================*/
@media screen and (max-width: 640px){

/* Keyvisual
-----------------------------------*/
#keyvisual {
	width:100%;
    height:720px;
	overflow:hidden;
	position:relative;
	/*background: url(../images/zeppin_cm_topimg_bg1.jpg);*/
    background-color: #442c16;
}

#keyvisual #top1_base{
	width:100%;
	height:720px;
	position:absolute;
	top:0px;
	left:0px;
	background: url(../images/smp_ZEPPIN_TOP1_img1.jpg) repeat top center;
	z-index: 30;
}
#keyvisual #top1_img01{
	width:100%;
	height:720px;
	position:absolute;
	top:0px;
	left:0px;
	/*background:#000000;*/
	z-index: 40;
	/*display: none;*/
}

#keyvisual .top1{
	width:640px;
    height:720px;
	margin: 0px auto;
	position:relative;
}
#keyvisual #top1_img02{ width:72%; position:absolute; bottom:30px; left:10px; z-index: 70; display: none;/**/}
#keyvisual #top1_img03{ width:76%; position:absolute; top:50px; left:12%; z-index: 70; display: none;/**/}
#keyvisual #top1_img04{ width:80%; position:absolute; top:130px; left:10%; z-index: 70; display: none;/**/}
#keyvisual #top1_img02 img,#keyvisual #top1_img03 img,#keyvisual #top1_img04 img{width: 100%;}

#keyvisual #top2_img01{
	width:100%;
	height:720px;
	position:absolute;
	top:0px;
	left:0px;
	/*border-top: 1px #000000 solid;*/
	border-bottom: #ccc 1px solid;
	background: url(../images/smp_ZEPPIN_TOP2_img1.jpg) no-repeat top left;
	z-index: 100;
	display: none;/**/
}

#keyvisual .top2{
	width:640px;
    height:720px;
	margin: 0px auto;
	overflow:hidden;
	position:relative;
}
#keyvisual #top2_img02{ width:50%; position:absolute; top:40px; left: 5%; z-index: 200; display: none;/**/}
#keyvisual #top2_img03{ width:80%; position:absolute; bottom:30px; left: 10%; z-index: 200; display: none;/**/}
#keyvisual #top2_img02 img,#keyvisual #top2_img03 img{width: 100%;}

.print{display: none;}

}