@charset "UTF-8";



/*========= ナビゲーションドロップダウンのためのCSS ===============*/

@media screen and (min-width:769px){

	/*==ナビゲーション全体の設定*/
	.gnavi{
	}
	/*ナビゲーションを横並びに*/
	.gnavi ul{
		display: flex;
	}
	/*2階層目以降は横並びにしない*/
	.gnavi ul ul{
		display: block;
	}

	/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
	.gnavi ul li{
		position: relative;
	}

	/*ナビゲーションのリンク設定*/
	.gnavi ul li a{
		display: block;
		text-decoration: none;
		font-size:18px;
		color: #000;
		padding:25px 2em;
		transition:all .3s;
	}
	.gnavi ul li a:hover{
		background:#e2c676;
	}
	.gnavi ul li.current a {
		background: url(../img/gnavi_current.png) repeat-x bottom center;

	}
	.gnavi ul li li {
		padding:0 10px;
	}
	.gnavi ul li li a{
		padding:20px 2em 20px 0.5em;
		background:url(../img/gnavi_sub_ic.png) no-repeat right 10px center ;
		background-size:7px auto;
		font-size:16px;
		color:#333;
		width:8em;
		border-bottom:1px solid #333;
	}
	.gnavi ul li li a:hover{
		background:#f7e4ac url(../img/gnavi_sub_ic.png) no-repeat right 10px center ;
		background-size:7px auto;
	}

	/*==矢印の設定*/

	/*2階層目を持つliの矢印の設定*/
	.gnavi ul li.has-child::before{
		content:'';
		position: absolute;
		left:15px;
		top:35px;
		width:6px;
		height:6px;
		border-top: 2px solid #edd48e;
	    border-right:2px solid #edd48e;
	    transform: rotate(135deg);
	}

	/*3階層目を持つliの矢印の設定*/
	.gnavi ul ul li.has-child::before{
		content:'';
		position: absolute;
		left:6px;
		top:17px;
		width:6px;
		height:6px;
	    border-top: 2px solid #fff;
	    border-right:2px solid #fff;
	    transform: rotate(45deg);
	}

	/*== 2・3階層目の共通設定 */

	/*下の階層を持っているulの指定*/
	.gnavi li.has-child ul{
	    /*絶対配置で位置を指定*/
		position: absolute;
		left:0;
		top:76px;
		z-index: 4;
	    /*形状を指定*/
		background:#ecd592;
		width:auto;
	    /*はじめは非表示*/
		visibility: hidden;
		opacity: 0;
	    /*アニメーション設定*/
		transition: all .3s;
		text-align:left;
	}

	/*hoverしたら表示*/
	.gnavi li.has-child:hover > ul,
	.gnavi li.has-child ul li:hover > ul,
	.gnavi li.has-child:active > ul,
	.gnavi li.has-child ul li:active > ul{
	  visibility: visible;
	  opacity: 1;
	}


	/*==3階層目*/

	/*3階層目の位置*/
	.gnavi li.has-child ul ul{
		top:0;
		left:182px;
		background:#66ADF5;
	}

	.gnavi li.has-child ul ul li a:hover,
	.gnavi li.has-child ul ul li a:active{
		background:#448ED3;
	}

}