@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------
--------------------------------------------------*/


@media all and (min-width: 736px) {
 .nav-wrap {display:none;}
}

@media screen and (min-width: 736px) {
  .nav-wrap {
    display: none;}
  }


@media screen and (max-width: 1200px) {
  .nav-button {
    display: block;
    cursor: pointer;
  }
  .nav-wrap {
    position: fixed;
    left: 0;
    top: 0;
    display: none;
    z-index: 10;
    background-color: #00C0D8;
    width: 100%;
    height: 100%;}
    .nav {
      height: 100%;
      position: relative;
      overflow-x: hidden;
      overflow-y: auto;
			padding:60px 0 0 0;
    }
    .nav li {
      display: block;
      color: #fff;
        font-size: 18px;
				padding:10px;
				font-size:108%;
				box-sizing:border-box;
	}
	
.nav li{border-top:1px solid #7CE0ED;}
.nav li.boderBottom{border-bottom:1px solid #7CE0ED;}
.nav a{color:#FFF;}

.nav li a{
	display: block;
	background:url(../../images/common/sp_arrow.png) no-repeat right center ;
	background-size:0.8rem;
}
.nav li.type2{width:50%;}
.nav li.type2:nth-child(odd){border-right:1px solid #7CE0ED;}
/*.nav li.type2:nth-child(4){border-bottom:1px solid #7CE0ED;}*/


.navSecond {display:flex; justify-content: space-between;}
.navSecond li{
	border-top:1px solid #7CE0ED;
	border-bottom:1px solid #7CE0ED;
	width:16.66666%;
	text-align:center;
	box-sizing:border-box;
	padding:8px 0;}
.navSecond li:not(:last-child){border-right:1px solid #7CE0ED;}

.sp_header .navSecond li img{width:40%;}
	
	
  /*メニューボタン*/
  .nav-button,
  .nav-button span {
    display: inline-block;
    transition: all 0.4s;
    box-sizing: border-box;
  }
  .nav-button {
    z-index: 20;
		width:40px;
    position: relative;
  }

 .nav-button.active {
    height: 36px;
  }


  .nav-button span {
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #fff;
    border-radius: 3px;
  }
	
 .nav-button span{display:none;}
 .nav-button.active span{display:block;}

  .nav-button.active span:nth-of-type(1) {
    -webkit-transform: translateY(16px) rotate(-45deg);
    transform: translateY(15px) rotate(-45deg);
  }

  .nav-button.active span:nth-of-type(2) {
    -webkit-transform: translateY(-40px) rotate(45deg);
    transform: translateY(12px) rotate(45deg);
  }
	 .nav-button.active img{display:none;}

.nav-wrap .wrap{width:100%; margin:10px auto;}
.nav-wrap .sp_header{background:none; padding:0 10px;}
.nav-wrap .sp_header .sp_logo{padding:8px 0 10px;}
.sp_header .sp_menu .is-active
}



@media screen and (max-width: 735px) {
.nav li.type2{width:48.2%;}
}




/*@media screen and (max-width: 735px) {
.sp_dropDown{display:none !important;}
}*/

@media screen and (max-width: 735px) {
.nav li.type2{width:50%;}
.nav-button {
		width:22px;
  }
.sp_dropDown .drop_01{display:none !important;}
.sp_visitor{display:none;}
.drop_close.modMiddle{display:none;}

.sp_dropDown .drop_02.open {
        display:block;
    }
		
		.sp_header .sp_serch_menu{
		float:right;
		width:22px;
		padding:5px 17vw 0 0;
	}
	

}

@media screen and (max-width: 640px) {

	.nav-wrap .sp_header .sp_serch{
		float:right;
		width:26px;
		padding:5px 15vw 2vw 0;
	}
.sp_header .navSecond li img{width:90%;}

}

@media screen and (min-width: 736px) {
.nav {padding:80px 0 0 0;	}
.sp_menu .nav-wrap{display:none;}
.sp_header .sp_serch_menu{
		float:right;
		width:36px;
		padding:20px 13vw 0 0;
	}

}


.nav-wrap.open {
  display: block;
}
.nav-wrap.close {
  display: none;
}





/*スマホ版 ドロップダウン--------------------------------------*/
.sp_dropDown2{
	display:none;
}

@media all and (max-width: 1200px) {
.sp_dropDown2{
	display:none;
	position:fixed;
	z-index:202;
	top:80px;
	left:0;
	margin-left:0;
	width:100%
}
	.sp_dropDown2 a:link, .sp_dropDown a:visited{
		color:#FFF;
		text-decoration:none;
	}
	.sp_dropDown2 a:hover{
		text-decoration:underline;
	}
	.sp_dropDown2 .drop_close{
		position:absolute;
		top:0;
		right:0;
	}
	

/*スマホ版 検索メニュー*/
.sp_dropDown2 .drop_02{
	display:none;
	width:100%;
	background-color:#282F3A;
}
	.sp_dropDown2 .drop_02 .drop_inner{
		margin:0 auto;
	}
	.sp_dropDown2 .drop_02:before {
		content: "";
		position: absolute;
		top: -20px;
		right: 100px;
		border: 10px solid transparent;
		border-bottom: 10px solid #282F3A;
	}
}
@media all and (max-width: 780px) {
.sp_dropDown2 .drop_02 .drop_inner{
		width:90%;
}
}
@media all and (max-width: 700px) {
.sp_dropDown2{
	top:50px;
}
	.sp_dropDown2 .drop_02:before {
		top: -17px;
		right:calc(2% + 12vw);
	}
}

.flex{display:flex; justify-content:space-between; flex-wrap: wrap;}


