@charset "UTF-8";

.header01.fixed .sitelogo01 {
       margin: 36px 0 36px 5%
   }
@media only screen and (max-width: 1817px) {
    .header01.fixed .sitelogo01 {
        /*margin: 14px 0 8px 5%;*/
        margin: 36px 0 36px 5%
    }
}
@media screen and (max-width: 990px){
	.header01.fixed .sitelogo01 {
		margin: inherit;
	}
}
@media screen and (max-width: 767px){
	.header01.fixed .sitelogo01{
		margin: 0;
	}
}
.menu_child{
 position: absolute;
}
ul li{
 margin:0;
}
ul li:before{
 content: none;
}
nav.atrnav{
  color:#fff;
  text-align: center;
}
/*ナビゲーションを横並びに*/
nav.atrnav ul{
  list-style: none;
  display: flex;
  justify-content: center;
  padding-top: 0;
  position: absolute;
}
nav.atrnav ul.topnav{
	right: 0;
}
/*2階層目以降は横並びにしない*/
nav.atrnav ul ul{
  display: block;
  padding-top: 0;
}

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

/*ナビゲーションのリンク設定*/
nav.atrnav ul li a{
  display: block;
  text-decoration: none!important;
  padding: 18px 2vw 16px 30px;
  transition:all .3s;
  text-decoration: none;
	font-size: 1.5rem;
}
nav.atrnav ul li a.nav-parent{
	border-left: 1px solid #ccc;
}
nav.atrnav ul li a.nav-parent::after{
	position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    border: 1px solid;
    border-color: transparent transparent rgb(3 42 119) rgb(3 42 119);
    transform: rotate(-45deg);
    display: block;
    right: 20px;
    top: 45%;
}
nav.atrnav ul li a:visited{
    text-decoration: none;
}

nav.atrnav ul li li a{
  padding:12px;
  line-height: 1.2;
}

nav.atrnav ul li a:hover{
  color:#ad8f34;
}

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

/*下の階層を持っているulの指定*/
nav.atrnav li.has-child > ul{
  z-index: 4;
    /*形状を指定*/
background:rgba(3, 42, 119, 1);
  width:270px;
    /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
    /*アニメーション設定*/
  transition: all .3s;
}

nav.atrnav li.has-child:last-child > ul{
	margin-left: -105px;
}

nav.atrnav li.has-child ul li ul{
  position: relative;
}

/*hoverしたら表示*/
nav.atrnav li.has-child:hover > ul,
nav.atrnav li.has-child:hover ul li ul{
  visibility: visible;
  opacity: 1;
  padding-top: 0;
}


/*ナビゲーションaタグの形状*/
nav.atrnav li.has-child ul li a{
  color: #fff;
  border-bottom:solid 1px rgba(255,255,255,0.6);
  text-align:left;
}

nav.atrnav ul li.has-child:last-child a{

}

nav.atrnav ul.topnav li a{
    border-bottom: solid 1px rgba(255,255,255,0.6);
}

nav.atrnav li.has-child ul li a:hover,
nav.atrnav li.has-child ul li a:active{
  background:#3577CA;
}


/*==3階層目*/

/*3階層目の位置*/
nav.atrnav li.has-child ul ul li{
  background-color: #3553A4;;
}

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

/*==4階層目*/

/*4階層目の位置*/
nav.atrnav li.has-child ul ul ul li{
  background:#acbddf;
}
nav.atrnav li.has-child ul ul ul li a{
  color:rgba(3, 42, 119, 1);
}

nav.atrnav li.has-child ul ul ul li a:hover,
nav.atrnav li.has-child ul ul ul li a:active{
  background:#7DB3E5;
}


nav.atrnav li.has-secondchild ul span{
    margin-left: 10px;
	display: block;
}
nav.atrnav li.has-thirdchild ul span{
    margin-left: 20px;
	display: block;
}
/*==768px以下の形状*/

@media screen and (max-width:768px){
  nav.atrnav{
    padding: 0;
  }

  nav.atrnav ul{
    display: block;
  }

  nav.atrnav li.has-child ul,
  nav.atrnav li.has-child ul ul{
    position: relative;
  left:0;
  top:0;
  width:100%;
  visibility:visible;/*JSで制御するため一旦表示*/
  opacity:1;/*JSで制御するため一旦表示*/
  display: none;/*JSのslidetoggleで表示させるため非表示に*/
  transition:none;/*JSで制御するためCSSのアニメーションを切る*/
}

nav.atrnav ul li a{
  border-bottom:1px solid #ccc;
}

/*矢印の位置と向き*/

nav.atrnav ul li.has-child::before{
  left:20px;
}

nav.atrnav ul ul li.has-child::before{
    transform: rotate(135deg);
  left:20px;
}

nav.atrnav ul li.has-child.active::before{
    transform: rotate(-45deg);
}

}
	@media only screen and (max-width: 1438px){
		nav.atrnav li.has-child:last-child > ul{
			margin-left: -145px;
		}
		nav.atrnav ul li a {
			padding: 12px 1vw 22px;
		}
		nav.atrnav ul li a.nav-parent::after {
			top: inherit;
			bottom: 10px;
			left: 45%;
		}
	}