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


#top{
}
@media screen and (max-width: 680px) {
#top{
	width:100%;
}

}
#top img{
	width:100%;
	display: block;
}


/* ++++++++++++++++++++++++++++++++++　*/
/* フォントサイズ　*/
/* ++++++++++++++++++++++++++++++++++　*/

h2.h2_1{font-size:45px;}
h2.h2_2{font-size:28px;}
h2.h2_3{font-size:21px;}
h3{font-size:18px; line-height: 24px; }

p.p_1{font-size:14px;}
p.p_2{font-size:12px;}
p.p_3{font-size:10px;}
li{	font-size:14px;	line-height:21px;}

@media screen and (max-width: 414px) {
}
@media screen and (max-width: 375px) {
h2.h2_2{font-size:24px;}
li{	font-size:12px;	line-height:18px!important;}
}
@media screen and (max-width: 320px) {
h2.h2_1{font-size:30px;}
h2.h2_2{font-size:22px;}
h2.h2_3{font-size:18px; letter-spacing:0!important;}
h3{font-size:14px; line-height: 21px; }
p.p_1{font-size:12px; line-height:14px!important;}
p.p_2{font-size:10px; line-height:12px!important;}
p.p_3{font-size:10px; line-height:12px!important;}
li{	font-size:12px;	line-height:14px!important;}
}



/* ++++++++++++++++++++++++++++++++++　*/
/* スライド　*/
/* ++++++++++++++++++++++++++++++++++　*/


@media screen and (max-width: 414px) {
}
@media screen and (max-width: 375px) {
}
@media screen and (max-width: 320px) {
}

#top table{
	width:100%;
	margin:15px auto;
}


#header{
	width:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
}
#header a{
	width:50%;
	display:block;
	margin:0 auto;
}
#header a img{
	width:100%;
}


/* ++++++++++++++++++++++++++++++++++　*/
/* area_01　*/
/* ++++++++++++++++++++++++++++++++++　*/

#top .area_01{
	position:relative;
	width:100%;
}


#top .area_01 .div_01{
	width:100%;
	position:absolute;
	top:36%;
	left:0;
}
#top .area_01 p{
	color:#fff;
	text-align:center;
	letter-spacing:10px;
	margin:0 0 20px 0;
}
#top .area_01 h3{
	text-shadow:2px 2px 3px #333;
	color:#fff;
	line-height:28px;
	text-align:center;
	letter-spacing:1px;
}


/* ++++++++++++++++++++++++++++++++++　*/
/* area_02　*/
/* ++++++++++++++++++++++++++++++++++　*/
h2.brand{
	font-weight:normal;
	text-align:center;
	letter-spacing:5px;
	padding:20px 0;
	background:#fff;
}


#top .area_02{
	color:#fff;
	position:relative;
	width:100%;
}

#top .area_02 h2{
	text-align:center;
	margin:0 0 15px 0;
}
#top .area_02 h3{
	letter-spacing:1px;
	margin:0 0 10px 0;
}
#top .area_02 p{
	line-height:20px;
	width:95%;
}

#top .area_02 .div_01{
	width:100%;
	position:absolute;
	top:6%;
	left:0;
}

#top .area_02 .div_01 p{
	text-align:center;
}

#top .area_02 .div_02{
	position:absolute;
	top:35%;
	left:5%;
}

#top .area_02 .div_03{
	position:absolute;
	top:53%;
	left:5%;
}

#top .area_02 .div_04{
	position:absolute;
	top:68%;
	left:5%;
}


/* ++++++++++++++++++++++++++++++++++　*/
/* area_03　*/
/* ++++++++++++++++++++++++++++++++++　*/
/*
#top .area_03{
	position:relative;
	width:100%;
	background:url(../01_img/top/sp/bg/03.jpg) 50% 50%;
	background-size: cover;     
	background-attachment: fixed;

}

#top .area_03 .inner_01{

}

@media screen and (min-resolution: 2dppx){
#top .area_03{
	width:100%;
	background:url(../01_img/top/sp/bg/03@2x.jpg) 50% 0;
	background-size: cover;     
	background-attachment: fixed;
}
}
*/
#top .area_03{
	position:relative;
	width:100%;

}

#top .area_03:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(../01_img/top/sp/bg/03.jpg) center no-repeat;
  background-size:cover;
}

@media screen and (min-resolution: 2dppx){
#top .area_03:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-2;
  width:100%;
  height:100vh;
  background:url(../01_img/top/sp/bg/03@2x.jpg) center no-repeat;
  background-size:cover;
}
}


#top .area_03 .title{
	width:100%;
	position:absolute;
	top:10%;
	left:0%;
}
#top .area_03 .l_img{
	width:50%;
	position:absolute;
	top:30%;
	left:0%;
}
#top .area_03 .r_img{
	width:50%;
	position:absolute;
	top:30%;
	right:0%;
}




/* ++++++++++++++++++++++++++++++++++　*/
/* area_04　*/
/* ++++++++++++++++++++++++++++++++++　*/

#top .area_04{
	position:relative;
	width:100%;
}


#top .area_04 h2{
	width:100%;
	text-align:center;
	letter-spacing:12px;
	margin:0 0 15px 0;
}
#top .area_04 p{
	width:100%;
	text-align:center;
}

#top .area_04 .div_01{
	width:100%;
	position:absolute;
	top:6%;
	left:0%;
}
#top .area_04 .div_01 h2{

}
#top .area_04 .div_01 p{
	letter-spacing:10px;

}

#top .area_04 .div_02{
	width:100%;
	position:absolute;
	top:90%;
	left:0%;
}
#top .area_04 .div_02 h2{
	letter-spacing:0px;

}

#top .area_04 .l_img{
	width:50%;
	position:absolute;
	top:56%;
	left:0%;
}
#top .area_04 .r_img{
	width:50%;
	position:absolute;
	top:56%;
	right:0%;
}


/* ++++++++++++++++++++++++++++++++++　*/
/* area_05　*/
/* ++++++++++++++++++++++++++++++++++　*/

#top .area_05{
	position:relative;
	width:100%;
}

#top .area_05 h2{
	width:100%;
	text-align:center;
	letter-spacing:12px;
	font-weight:normal;
	color:#fff;
	margin:0 0 10px 0;
}
#top .area_05 p{
	width:100%;
	text-align:center;
	letter-spacing:10px;
	color:#fff;
}

#top .area_05 .div_01{
	width:100%;
	position:absolute;
	top:18%;
	left:0%;
}



/* ++++++++++++++++++++++++++++++++++　*/
/* area_06　*/
/* ++++++++++++++++++++++++++++++++++　*/

#top .area_06{
	position:relative;
	width:100%;
}


#top .area_06 .l_img a{
	width:49%;
	height:29%;
	display:block;
	position:absolute;
	top:10%;
	left:0%;
	background:#fff;
	filter:alpha(style=0, opacity=0);
	-moz-opacity:0;
	opacity:0;
}
#top .area_06 .r_img a{
	width:49%;
	height:29%;
	display:block;
	position:absolute;
	top:10%;
	right:0%;
	background:#fff;
	filter:alpha(style=0, opacity=0);
	-moz-opacity:0;
	opacity:0;
}



#top .area_06 a:hover{
	filter:alpha(style=0, opacity=10)!important;
	-moz-opacity:0.1!important;
	opacity:0.1!important;
}





#top .area_06 .div_01{
	width: 100%;
	position: absolute;
	top: 64.5%;
	left: 0%;
}
#top .area_06 .div_01 h2{
	width:100%;
	letter-spacing:10px;
	font-weight:normal;
	text-align:center;
	color:#fff;
	margin:0 0 5px 0;
}
#top .area_06 .div_01 p{
	width:100%;
	text-align:center;
	color:#fff;
}

#top .area_06 .div_02{
	width: 100%;
	position: absolute;
	top: 80%;
	left: 0%;
}
#top .area_06 .div_02 h2{
	width:100%;
	font-size:30px;
	text-align:center;
	color:#fff;
	margin:0 0 10px 0;
}
#top .area_06 .div_02 p{
	width:100%;
	text-align:center;
	line-height:24px;
	color:#fff;
}





/* ++++++++++++++++++++++++++++++++++　*/
/* area_07　*/
/* ++++++++++++++++++++++++++++++++++　*/

#top .area_07{
	position:relative;
	width:100%;
}

#top .area_07 .inner_01{
}



#top .area_07 .div_01{
	width:100%;
	position:absolute;
	top:21%;
	left:0%;
}
#top .area_07 .div_01 h2{
	width:100%;
	text-align:center;
	color:#2a2a2a;
	margin:0 0 30px 0;
}
#top .area_07 .div_01 h3{
	width:100%;
	font-weight:normal;
	letter-spacing:20px;
	text-align:center;
	color:#2a2a2a;
	margin:0 0 30px 0;
}
#top .area_07 .div_01 ul{
	padding:0 0 0 10px;
}
#top .area_07 .div_01 li{
	width:92%;
	color:#2a2a2a;
	padding:0 0 10px 15px;
	text-indent:-15px;
}

#top .area_07 .div_02{
	width:100%;
	position:absolute;
	top:58%;
	left:0%;
}
#top .area_07 .div_02 h2{
	width:100%;
	line-height:38px;
	text-align:center;
	color:#2a2a2a;
	margin:0 0 40px 0;
}
#top .area_07 .div_02 p{
	width:90%;
	line-height:24px;

	color:#2a2a2a;
	text-align:center;
	padding:0 0 20px 0;
}



#top .area_07 .div_03{
	width:100%;
	position:absolute;
	top:89.5%;
	left:0%;
}
#top .area_07 .div_03 p{
	width:100%;
	color:#87817e;
	text-align:center;
	padding:0 0 40px 0;
}