/**********************
reset
**********************/

header ul,
header li{
 list-style: none;
}

header a{
 text-decoration: none;
}

/**********************
title area
**********************/

#title h1{
	float: left;
padding: 10px 0 0 0;
}

#title h1 img{
width: 330px;
}

#title p{
 float: right;
 margin: 10px 0 0 0;
}

#title p a{
 border: 1px solid #5B4294;
 padding: 5px 10px;
}

#title p a:hover{
 background: #5B4294;
 color: #fff;
}

#title_nav ul{
 float: right; 
 display: table;
 margin: -30px -20px 0 0;
 border-collapse: separate;
 border-spacing: 20px 0;
}

#title_nav ul li{
 display: table-cell;
 background:  url("../images/ico_arw_right.png") no-repeat left center;
 padding: 0 0 0 25px;
 
}

#title_nav ul li a:hover{
 text-decoration: underline;
}

#G_Menu_btn{
	display: none;
}

/**********************
navi
**********************/

.menu_area{
 background: #5B4294;
 margin: 10px 0 0 0;
 color: #fff;
}

.menu {
    position: relative;
    height: 50px;
    margin: 0 auto;
}

.menu > li {
 float: left;
 width: calc(14.285% - 1px); /* グローバルナビ7つの場合 */
 height: 50px;
 line-height: 50px;
 background: #5b4294;
 text-align: center;
 border-left: 1px solid #E5E0EE;
}
.menu > li:first-child{
 border: none;
}

.menu > li a {
    display: block;
    color: #fff;
}


ul.menu__second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
}

.menu > li:hover {
    background: #7159A7;
    -webkit-transition: all .5s;
    transition: all .5s;
}

.menu__second-level li a{
 padding: 0 20px;
}

.menu__second-level li a:hover {
    background: #472F7F;
}


/* 下矢印 */

.init-bottom{
 display: block;
 cursor: pointer;
}
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 3px 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* floatクリア */
.menu:before,
.menu:after {
    content: " ";
    display: table;
}

.menu:after {
    clear: both;
}

.menu {
    *zoom: 1;
}


/* プルダウン */

li.menu__mega ul.menu__second-level {
 position: absolute;
 top: 40px;    
 box-sizing: border-box;
 width: 28.57%;/* グローバルナビ7つの場合 */
 width: 33.33%;/* グローバルナビ6つの場合 */
 background: #7159A7;
 -webkit-transition: all .2s ease;
 transition: all .2s ease;
 text-align: left;
}

li.menu__mega ul.menu__second-level_1{
 left: 0;
}

li.menu__mega ul.menu__second-level_2{
 left: 14.285%;/* グローバルナビ7つの場合 */
}

li.menu__mega ul.menu__second-level_3{
 left: 28.57%;/* グローバルナビ7つの場合 */
}

li.menu__mega:hover ul.menu__second-level {
    top: 50px;
    visibility: visible;
    opacity: 1;
}

li.menu__mega ul.menu__second-level > li {
    border: none;
}


/* ==========================================
	mediaQuery
========================================== */

@media only screen and (max-width: 999px){
 
/**********************
title area
**********************/

#title h1{
float: left;
padding: 10px 0 0 0;
}

#title h1 img{
	margin: 0; 
}

#title p{
 float: right;
 margin: 40px 0 0 0;
}

#title p a{
 border: 1px solid #5B4294;
 padding: 5px 10px;
}

#title p a:hover{
 background: #5B4294;
 color: #fff;
}
 
#title_nav{
 width: 100%;
 background: #5B4294;
 height: 50px;
 margin: 10px 0 0 0;
}

#title_nav ul{
 float: left; 
 margin: 0 0 0 -10px;
 border-spacing: 10px 0;
 width: auto;
}

#title_nav ul li{
 background:  url("../images/ico_arw_right_white.png") no-repeat left center;
 line-height: 50px;
}
 
 #title_nav ul li a{
  color: #fff;
 }

 #G_Menu_btn{
 float: right;
	display: block;
	background: url(../images/btn_G_Menu.png) no-repeat;
	background-size: contain;
	height: 50px;
	width:50px;
  cursor: pointer;
}

#G_Menu_btn.MenuActive{
	background: url(../images/btn_G_Menu_close.png) no-repeat;
	background-size: contain;
}
 
/**********************
navi
**********************/
  
.menu_area{
 margin: 5px 0 0 0; 
}
 
.menu {
 max-width:auto;
 height: auto;
 display: none;
 padding: 10px 0 20px 0;
}

.menu > li {
 float: none;
 width: auto;
 height: auto;
 text-align: left;
 border-left: none;
 border-bottom: 2px solid #E5E0EE;
}
 
 .menu > li:last-child{
  border-bottom: none;
 }
 
 .menu > li:first-child{
 border-bottom: 2px solid #E5E0EE;
}

.menu > li a {
 display: block;
 padding: 0 10px;
}

ul.menu__second-level {
    visibility: visible;
    opacity: 1;
 margin-left: 30px;
}

.menu > li:hover {
 background: none;
 -webkit-transition: none;
 transition: none;
}

.menu__second-level li a{
 border-top: 1px dotted #E5E0EE;
 padding: 0 10px;
}
 
.menu > li a:hover{
  background: #472F7F;
 }
 
 /* 下矢印 */
 
.init-bottom{
 padding: 0 10px;
 background: url("../images/link_dwn.png") no-repeat right 10px center;
}

.init-bottom:after {
    content: none;
    border-right: none;
    border-bottom: none;
}
 
 .init-bottomActive{
 background: url("../images/link_close.png") no-repeat right 10px center;
 }


/* プルダウン */

li.menu__mega ul.menu__second-level {
  position: relative ;
  top: 0;    
  box-sizing: inherit;
  width: auto;
  -webkit-transition: none;
  transition: none;
 background: none;
 display: none;
}

li.menu__mega ul.menu__second-level_1{
 left: 0;
}

li.menu__mega ul.menu__second-level_2{
 left: 0;
}

li.menu__mega ul.menu__second-level_3{
 left: 0;
}

li.menu__mega:hover ul.menu__second-level {
    top: 0;
    visibility: visible;
    opacity: 1;
}

li.menu__mega ul.menu__second-level > li {
    border: none;
}

li.menu__mega ul.menu__second-level > li:nth-child(3n+2) {
    margin: 0 1%;
}
}

/* ==========================================
	mediaQuery
========================================== */

@media only screen and (max-width: 640px){
 
/**********************
title area
**********************/

#title h1{
float: none;
padding: 10px 0 0 0;
 text-align: center;
}

#title h1 img{
	margin: 0;
 width: auto;
 max-width: 250px;
}

#title p{
 float: none;
 margin: 10px 0 0 0;
 text-align: center;
}
 
/**********************
navi
**********************/
  
.menu {
 padding: 0;
}


}

