.hamburger{display:none}

.header .top-btn .btn icon{margin-right:5px}
.header .top-btn .btn icon img{width:0.834vw}
.header-outer{width:100%; z-index: 9; /*position: absolute; top:0px;*/}
.header{display:flex; justify-content: space-between; padding:0.859vw 1.563vw}

/*
.home .header{background-color:rgba(239,234,223,.08)}
.home .headerchange .header{background-color:#282828}*/

.header .logo{display: flex; align-items: center; width:12.97vw;}


.header .logo .logo-dark{display: none}


.header-banner-text{position: absolute; width:100%; height:100%; z-index:2; display: flex; align-items: center;}
.header .top-navigation{font-weight: 500; width:calc(100% - 12.97vw); display: flex; justify-content: right; font-size: 14px}



.header .top-menu ul{display:flex; height: 100%; justify-content: right; align-items: center;}
.header .top-menu ul li{padding:0px .9vw}
.header .top-menu ul li a{display: block; z-index: 1; color:#3e3a39; white-space: nowrap;}

.header .top-menu ul.submenu{display: block; font-family: "Noto Sans JP", sans-serif; height: auto; padding:1.042vw 1.563vw; background-color: rgba(255,255,255,.9); border-radius:0.781vw;}
.home .header .top-menu ul.submenu li a,
.header .top-menu ul.submenu a{color:#333; white-space: nowrap;}
.header .top-menu ul.submenu li{margin: 0px 0px 0.521vw 0px; padding:0px;}
.header .top-menu ul.submenu li:last-child{margin-bottom:0px;}


@media(min-width:781px)
{
	.sticky{
      position: fixed;      
      left: 0;
      right: 0;
      z-index: 9999;
	  background-color:rgba(255,255,255,.95);
	  animation: slideDown 0.5s ease;
    }
	
	@keyframes slideDown {
  0% {transform: translateY(-100px);}
  100%{transform: translateY(0);}
}
	
	.header .top-btn .btn{width: 8.13vw; height: 2.71vw; white-space: nowrap; padding: 0px;}
	
	.header .top-btn .btn:after{display: none}	
	.header .top-menu{padding-right:1vw}
	
}

@media(min-width:781px) and (max-width:1300px)
{
	.header .top-menu{padding-right:.5vw}
	.header .top-menu ul li{padding: 0px .5vw;}
	.header .top-navigation{font-size:10px;}
	
	.header .top-btn .btn{width:auto; padding:0px 5px;}
	
}

@media(max-width:780px)
{
	

	.header{padding:0px; position: fixed; background-color:#faf7ef;}
	.header .logo{width:34.5vw; padding: 4.8vw 0px; margin-left:4vw}
	
	.header .top-btn .btn icon{margin-right:4.5vw}
	.header .top-btn .btn icon img{width:6.026vw}

	.hamburger{position: fixed;}
	
	.hamburger{display:block}
	.header .top-navigation{font-weight: normal; font-size: 3.59vw;}
	
	.header .top-navigation,
	.header .top-menu ul,
	.header .top-menu,	
	.header{display: block; width:100%;}
	
	.header .top-navigation{display: none; background-color: #faf7ef; padding: 0px 8vw; height: calc(100vh - 12vw); overflow: scroll; z-index: 9; }	
	
	.header .top-menu ul li{margin:0px; padding: 0px;}	 
	.header .top-menu ul li a{color:#3e3a39; padding:4vw 3vw; border-bottom:1px #aaaaaa solid}	
	.header .top-menu ul li a:after{width: 1.54vw; height: 2.566vw; position: absolute; content:''; top: calc(50% - 2.566vw/2); right:4vw; background-size:100% 100%; background-image:url('../images/icon9.png')}
	
	.header .top-menu ul li:last-child a{}
	.header .top-menu ul.submenu li:last-child a{border-bottom: 1px #aaaaaa solid;}
	/*
	.header .top-menu .submenu-outer{display: none;}
	.header .top-menu .submenu-list.submenuopen .submenu-outer{display: block;}*/
	.header .top-menu .submenu-outer{display: none;}
	
	.header .top-btn{width:100%; margin:6vw auto;}
	.header .top-btn .btn{width: 100%;  height:13.08vw; padding:0px; font-size: 4.1vw; border-radius: 10vw; font-weight:500;}
	
	.btn:after{width: 3.334vw; height: 2.693vw; right: 5.5vw;}
	.header .top-btn a:first-child:after{background-image:url('../images/icon2.png')}
	
	.header .top-btn a:first-child{margin-bottom:3vw;}
	.header .top-btn .btn2{margin-left: 0px;}
	.hamburger{border-radius: 50%; background-color:#a72126; position: absolute; right:4vw; top:2.5vw; width:9.24vw; height:9.24vw; display: flex; flex-wrap: wrap; justify-content: center; align-content: space-evenly; padding:2.5vw 0; cursor: pointer; z-index:99}
	
	.hamburger span{transition: ease all .5s; width: 4.75vw; height: 2px; background-color:#fff; border-radius:1vw; display: block; margin-bottom:1vw}
	.hamburger span:last-child{margin-bottom:0px;}
	
	

	.header-outer.showmenu .header{}
	.header-outer.showmenu .top-navigation{display:block; opacity:0; animation: animatelink 1s forwards}
	
	
	
	@-webkit-keyframes animatelink
	{
		0%{opacity:0}
		100%{opacity:1}		
	}
	
	@keyframes animatelink
	{
		0%{opacity:0}
		100%{opacity:1}		
	}
	
	.header-outer.showmenu .header .logo .logo-dark{display: block}
	.header-outer.showmenu .header .logo .logo-white{display: none}
	
	.header .top-menu ul.submenu{padding:0px;}
	
	.header .top-menu ul.submenu li a{padding-left:7vw; padding-right:7vw}
	
	.header .top-menu ul.submenu li a:before{position: absolute; content: ''; width: 1vw; height: .3vw; background-color: #333; left: 5vw; top: calc(50% - 0px)}
	
	.header .top-menu ul.submenu li{margin-bottom:0px;}
	
	.header .top-btn .btn.btn-orange icon,
	.header .top-btn .btn.btn-gray icon{position: absolute; left:9vw; width: 6vw;}
	
		
	.hamburger{position: fixed;}
	.hamburger.menuopen{background-image:none;}
	.hamburger.menuopen span{}
	.hamburger.menuopen span:first-child{transform:rotate(45deg); margin-top:1.5vw }
	.hamburger.menuopen span:nth-child(2){display:none; }
	.hamburger.menuopen span:last-child{transform:rotate(-45deg); margin-top:-1.8vw }
}

@media (min-width: 781px) {
    .header .top-menu .submenu-outer {
        height: 0px;
        overflow: hidden;
        opacity: 0;
        transition: 
ease all .5s;
        position: absolute;
        top: 0vw;
        left: -0.1vw;
        padding-top: 3vw;
    }
}

.header .top-menu ul.submenu {
    display: block;
    padding: 1vw .8vw;
    background-color: rgba(255, 255, 255, .9);
    border-radius: 0.781vw;
}

.header .top-menu ul.submenu li {
    margin: 0px 0px 0.521vw 0px;
    padding: 0px;
}

.home .header .top-menu ul.submenu li a, .header .top-menu ul.submenu a {
/*     white-space: nowrap; */
}

.header .top-menu ul li.submenu-list:hover .submenu-outer{height:auto; opacity: 1}

@media(max-width:780px){
	.header .top-menu ul.submenu{
		background-color:#faf7ef;
	}
}

/* ▼モバイルだけ適用 */
@media (max-width:780px){

  /* 1) まず“全アイテム”の矢印は既存のまま（この行は既存があれば触らない） */
  /* .header .top-menu ul li a:after { background-image:url('../images/icon9.png'); } */

  /* 2) LINEUP（submenu-list）のときだけ、閉じてる時はプラス */
  .header .top-menu .submenu-list > a:after{
    background-image: url('../images/icon14.png') !important; /* プラス */
	  		        width: 20px;
        height: 20px;
        top: calc(50% - 4.566vw / 2);
        right: 3vw;
  }

  /* 3) LINEUP が開いたらマイナス（icon15） */
  .header .top-menu .submenu-list.submenuopen > a:after{
    background-image: url('../images/icon15.png') !important; /* マイナス */
  }

  /* 4) 中身は初期で閉じる */
  .header .top-menu .submenu-outer{ display:none; }
}




