@charset "UTF-8";

/************************************************************
*
*　魔法使いと黒猫のウィズ 超絶怒涛の4周年！ 
*　全ページ共通部分スタイルシート
*
************************************************************/

/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　COMMON
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

body {
	height: 100%;
    margin: 0;
	min-width:1200px;
	background-color:#fff;
	}

a:focus{
  outline: none !important;
	}


/* loafing ---------- */

html {
    height: 100%;
}
img{
	-webkit-backface-visibility: hidden;
	}

a{
	color:#353535;
	}

.fade a:hover img {
opacity: .6;
-webkit-opacity: .6;
-moz-opacity: .6;
filter: alpha(opacity=60);	/* IE lt 8 */
-ms-filter: "alpha(opacity=60)"; /* IE 8 */
}
 
.fade a img {
-webkit-transition: opacity 0.1s ease-out;
-moz-transition: opacity 0.1s ease-out;
-ms-transition: opacity 0.1s ease-out;
transition: opacity 0.1s ease-out;
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
}
.center{
	text-align:center;
	}
	
.pa_ex01{
	padding:35px 0 0 0;
	}
	
.pa_ex02{
	padding:40px 0 40px 0;
	}

.pa_ex03{
	padding:0 0 30px 0;
	}


/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　MODULE
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#wrap {
	width:100%;
	min-width:1200px;
	background-image: url(/magicianwiz/lp/voicealarm/img/bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	}
	
#wrap .al_mainbg {
	position:relative;
	width:1200px;
	margin:0 auto;
	background-image: url(/magicianwiz/lp/voicealarm/img/character.png);
	background-repeat: no-repeat;
	background-position: center top;
	}
#wrap .al_mainbg .al_headbg{
	position:relative;
	width:1200px;
	height:864px;
	}
#wrap .al_mainbg .al_headbg .logo01{
	position:absolute;
	right:140px;
	bottom:30px;
	}
#wrap .al_mainbg .al_headbg .logo02{
	position:absolute;
	right:130px;
	top:10px;
	}
	
#wrap .al_mainbg .al_headbg .movie{
	position:absolute;
	left:105px;
	top:50px;
	width:371px;
	height:793px;
	background-image: url(/magicianwiz/lp/voicealarm/img/smart.png);
	background-repeat: no-repeat;
	background-position: center top;
	}
#wrap .al_mainbg .al_headbg .movie .pv_area_frame{
	width:357px;
	margin:0 auto;
	padding:75px 0 0 0;
	}

#wrap .al_mainbg .al_headbg .movie .pv_area_frame .pv_area{
	width:100%;
	z-index:1;
	}
#wrap .al_mainbg .al_contbg{
	width:1000px;
	margin:0 auto;
	padding:25px 0 0 0;
	background-image: url(/magicianwiz/lp/voicealarm/img/frame.png);
	background-repeat: no-repeat;
	background-position: center top;
	}
	
#wrap .al_mainbg .al_contbg .al_dlbg{
	width:725px;
	margin:0 auto;
	padding:104px 0 0 215px;
	background-image: url(/magicianwiz/lp/voicealarm/img/app_20191001ver.png);
	background-repeat: no-repeat;
	background-position: center top;
	}
	
#wrap .al_mainbg .al_contbg .al_dlbg ul li{
	display: inline-block;
	vertical-align:middle;
	}
#wrap .al_mainbg .al_contbg .al_dlbg ul li:first-child{
	padding-right:20px;
	}
	
#wrap .al_mainbg .al_contbg .line{
	padding:45px 0 45px 0;
	}


#wrap .al_mainbg .al_contbg .al_samplevoice{
	text-align:center;
	
	}
	
#wrap .al_mainbg .al_contbg .al_samplevoice > li{
	display:inline-block;
	vertical-align:top;
	padding:0 25px 40px 25px;
	width:425px;	
	}

#wrap .al_mainbg .al_contbg .voice ul {
	height: 30px;
	text-align:center;
	padding:10px 0 0 0;
}

#wrap .al_mainbg .al_contbg .voice ul li {
	text-align: center;
	display:inline-block;
	vertical-align:middle;
	padding:0 2px 0 2px;
	background-color: #bc113b;
    border-bottom: solid 2px #2e020d;
    height: 30px;
    width: 70px;
   	/* radius */
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

#wrap .al_mainbg .al_contbg .voice ul li:hover {
	background-color: #e31749;
    border-bottom: solid 2px #a60d33;
}

#wrap .al_mainbg .al_contbg .voice ul li a {
    height: 30px;
    line-height: 30px;
    width: 100%;
    text-align: center;
    color: #fff;
    display: block;
}

#wrap .al_mainbg .al_contbg .voice ul li a:hover {
    color: #fff;
}


#sns{
	text-align:center;
	padding:0 0 35px 0;
	}
	
#sns li{
	vertical-align:middle;
	display:inline-block;
	padding:0 10px 0 10px;
	}
	
footer .al_footcont li{
	text-align:center;
	text-decoration:underline;
	line-height:36px;
	font-size:24px;
	}
	
footer .al_footcont li a{
	color:#2c314d;
	font-weight:bold;
	}

footer .al_link{
	text-align: center;
	}
	
footer .al_link a{
	color:#2c314d;
	font-weight:bold;
	font-size:14px;
	}
	
footer .al_copy {
	padding:20px 0 60px 0;
	text-align:center;
	color:#2c314d;
	font-size:12px;
	font-weight:bold;
	}


	
	
	
	
