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

html {
    overflow-y: hidden;
}
html{
-webkit-font-smoothing: antialiased;
}
html,
body {
    width: 100%;
    height: 100%;
}
body {
    font-size:1.6rem;
    line-height: 1.5em;
	font-family: "Helvetica Neue", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", Arial, "メイリオ", sans-serif;
	animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
	-webkit-font-smoothing: subpixel-antialiased;
}
a{
    text-decoration: none;
	color: #000;
}
a:hover{
    color: #20529D;
}
ul li {
    -webkit-transition: all .5s;
    transition: all .5s;
}
ul.float li:hover {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
	font-weight: bold;
}
img {
	width:100%;
	max-width: 100%;
	height: auto;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
.flex {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}
.w599{
	display: none;
}
a img.opc06:hover{
	opacity: 0.6;
	-webkit-transition: all .5s;
    transition: all .5s;
}
.fadein{
	transform: translate(0,70px); 
	-webkit-transform: translate(0,70px); 
}
.fadeinMv{
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	transition : all 900ms;
}
.innerBox{
	position: relative;
	margin: 0 auto;
	background-size: cover;
}
.chengeBg{
 	width: 100%;
	position: absolute;
	top: 0;
	z-index: -1;
	background-image: url("../img/top/top_menu_bg_00.jpg");
	background-size: cover;
}
.chengeBg img{
	width: 100%;
	height: auto;
	-webkit-transition: all .5s;
    transition: all .5s;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
.bgFadein{
	opacity: 1;
	-webkit-transition: all .5s;
    transition: all .5s;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	-webkit-transform-style: preserve-3d;
}
.bgFadeout{
	opacity: 0;
	-webkit-transition: all .5s;
    transition: all .5s;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	-webkit-transform-style: preserve-3d;
}
.chenge_image img{
 	width: 100%;
 	height: auto;
}
.menuBox{
	float: left;
	position: relative;
}
.menuBox img{
	position: absolute;
}
.menuBox a{
	display: block;
	text-align: center;
	vertical-align: middle;
	position: relative;
}
.menuBox:hover {
	background: #FFF;
	-webkit-transition: all .5s;
    transition: all .5s;
	opacity: 0.9;
	-webkit-transform-style: preserve-3d;
}
.menuBox h3{
	font-weight: normal;
	letter-spacing: 0.1em;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
}
.menuBox h3 span{
	letter-spacing: 0;
}
.change_btn01,
.change_btn02,
.change_btn03{
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	text-shadow: 0 1px 1px #CCC;
}
.change_btn04{
	border-bottom: 1px solid #FFF;
	text-shadow: 0 1px 1px #CCC;
}
.change_btn05,
.change_btn06,
.change_btn07{
	border-right: 1px solid #FFF;
	text-shadow: 0 1px 1px #CCC;
}
.change_btn04{
	top: 0;
}
.chengeBg,.menuBox,.menuBox a,.change_btn01,.change_btn02,.change_btn03,.change_btn04,.change_btn05,.change_btn06,.change_btn07,.change_btn08{
	-webkit-transition: all .5s;
    transition: all .5s;
}
.innerBox{
	position: relative;
	width: 1000px;
	height: 500px;
}
.mainAreaBtn02{
  width: 250px;
  height: 250px;
}
.chengeBg{
 	width: 1000px;
	height: 500px;
	position: absolute;
	top: 0;
	z-index: -1;
}
.chengeBg img{
  width: 100%;
  height: auto;
}
.chenge_image img{
	width: 1000px;
	height: 500px;
	/*background-image: url("../img/top/top_menu_bg_00.jpg")*/
}
.chenge_image img{
 	width: 100%;
 	height: auto;
}
.menuBox{
	width: 250px;
	height: 250px;
	float: left;
}
.menuBox a{
	width: 250px;
	height: 250px;
	display: block;
	text-align: center;
	vertical-align: middle;
	position: relative;
}
.menuBox:hover {
	background: #FFF;
	-webkit-transition: all .5s;
    transition: all .5s;
	opacity: 0.9;
}
.menuBox h3{
	font-weight: normal;
	font-size: 2.4rem;
	letter-spacing: 0.1em;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
}
.menuBox h3 span{
	font-size: 1.4rem;
	letter-spacing: 0;
}