@charset "utf-8";

/*----- ボタンの処理 -----*/
/*-- a over --*/
span.over {
	display: block;
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left :0px;
	text-align: left;
	xtext-indent:100%;
	xwhite-space: nowrap;
	xoverflow: hidden;
    opacity: 0;
    -webkit-transition: opacity .1s linear;
    -moz-transition: opacity .1s linear;
    -o-transition: opacity .1s linear;
    transition: opacity .1s linear;
    filter: alpha(opacity=0);
}
span.over:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}


/*---------------------------
g_navi
---------------------------*/
nav#g_navi {
	background-color:rgba(0,0,0,0.8);
	border-bottom: solid 2px #ffffff;
}
.dropmenu {
	*zoom: 1;
	list-style-type: none;
	width: 1010px;/*アップデートあり1200px*/
	margin: 0px auto 0px auto;

	position: relative;
}
.dropmenu:before,
.dropmenu:after {
	content: "";
	display: table;
}
.dropmenu:after {
	clear: both;
}
.dropmenu li {
	position: relative;
	float: left;
	margin: 0px;
	padding: 0px;
	text-align: center;

}

.dropmenu p {
  font-size: 12px;

}

/*.dropmenu li.menu01,
.dropmenu li.menu02,
.dropmenu li.menu03,
.dropmenu li.menu04,
.dropmenu li.menu05,*/
.dropmenu li.menu07 {
	width: 167px;
	height: 50px;
}
.dropmenu li.menu01,
.dropmenu li.menu02,
.dropmenu li.menu03,
.dropmenu li.menu04,
.dropmenu li.menu05,
.dropmenu li.menu06{
	widows: 168px!important;
	height: 50px;
}
.dropmenu li.menu01 {
	margin-left: -40px;
}
.dropmenu li.menu01 a,
.dropmenu li.menu02 a,
.dropmenu li.menu03 a,
.dropmenu li.menu04 a,
.dropmenu li.menu05 a,
.dropmenu li.menu06 a,
.dropmenu li.menu07 a{
	display: block;
	margin: 0px;
	color: #ffffff!important;
	font-size: 90%;
	line-height: 1;
	text-decoration: none;
	display: inline-table;
	vertical-align: middle;
	background: url(../img/gnav_div_hover.png) right center no-repeat;
}





.dropmenu li.menu06 a {
	background-image: none!important;
}
.dropmenu li.menu01 a > p,
.dropmenu li.menu02 a > p,
.dropmenu li.menu03 a > p,
.dropmenu li.menu04 a > p,
.dropmenu li.menu05 a > p,
.dropmenu li.menu06 a > p,
.dropmenu li.menu07 a > p{
	padding-top: 3px;
	display: table-cell;
	vertical-align: middle;
}
/*.dropmenu li a.menu01,
.dropmenu li a.menu02,
.dropmenu li a.menu03,
.dropmenu li a.menu04,
.dropmenu li a.menu05,*/
.dropmenu li a.menu07 {
	width: 167px;
	height: 50px;
	position: relative;

	z-index: 2;
}
.dropmenu li a.menu01,
.dropmenu li a.menu02,
.dropmenu li a.menu03,
.dropmenu li a.menu04,
.dropmenu li a.menu05,
.dropmenu li a.menu06{
	width: 168px;
	height: 50px;
	position: relative;

	z-index: 2;
}
.dropmenu li a.menu01:hover,
.dropmenu li a.menu02:hover,
.dropmenu li a.menu03:hover,
.dropmenu li a.menu04:hover,
.dropmenu li a.menu05:hover,
.dropmenu li a.menu06:hover,
.dropmenu li a.menu07:hover{
	color: #000000!important;
	background:url(../img/gnav_div_img.png) right top no-repeat!important;
}



#about .dropmenu li a.menu01{

	background:url(../img/gnav_div_img.png) right top no-repeat!important;
	color: #000000!important;
}

#sec .dropmenu li a.menu04{
	background:url(../img/gnav_div_img.png) right top no-repeat!important;
	color: #000000!important;
}

#ranking .dropmenu li a.menu05{
	background:url(../img/gnav_div_img.png) right top no-repeat!important;
	color: #000000!important;
}


.dropmenu li ul {
	width: 200px;
	list-style: none;
	position: absolute;
	top: 100%;
	left: 0px;
	margin: 1px 0px 0px 0px!important;
	padding: 10px 0px 10px 0px;
	z-index: 1;
	-webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
	box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
.dropmenu li ul.menu01 {
	background: url(../img/gnav_bg.png) top right no-repeat, linear-gradient(to bottom right, #7030a0, #e9305a);
}
.dropmenu li ul.menu02 {
	background: url(../img/gnav_bg.png) top right no-repeat, linear-gradient(to bottom right, #7030a0, #e9d130);
}
.dropmenu li ul.menu03 {
	background: url(../img/gnav_bg_t.png) bottom right no-repeat,url(../img/gnav_bg.png) top right no-repeat, linear-gradient(to bottom right, #7030a0, #30c0e9);
}
.dropmenu li ul.menu04 {
	background: url(../img/gnav_bg_t.png) bottom right no-repeat,url(../img/gnav_bg.png) top right no-repeat, linear-gradient(to bottom right, #7030a0, #ff850e);
}
.dropmenu li ul li {
	xwidth: 167px;
	width: 200px;
}
.dropmenu li ul li a {
	display: block;
	padding: 0px 10px 0px 10px;
	 box-sizing: border-box;
	width: 100%;
	height: 40px!important;
	text-align: left;
	background-image: none!important;
}
.dropmenu li:hover > a.menu01,
.dropmenu li:hover > a.menu03,
.dropmenu li:hover > a.menu04  {
	background:url(../img/gnav_div_img.png) right top no-repeat!important;
	color: #000000!important;
}
.dropmenu li a:hover {
	background-color: rgba(255,255,255,0.25);
}
#fade-in {
	position: relative;
	z-index: 5;
}
#fade-in li ul {
	opacity: 0;
	top: 50%;
	visibility: hidden;
	transition: .5s;
}
#fade-in li:hover ul {
	top: 100%;
	visibility: visible;
	opacity: 1;
}