@charset "utf-8";

.toggleWrap {
	display: block;
	position: absolute;
	z-index: 9999;
	top: 0;
	right: 4px;
	cursor: pointer;
}

@media screen and (min-width:767px){
	.toggleWrap{
		right: 10px;
		width: 60px;
		height: 60px;
	}
}

@media screen and (min-width: 1201px){
.toggleWrap{
	display: none;
}
}

/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{
	position: relative;
	cursor: pointer;
	top:5px;
    width: 50px;
    height:50px;
	background: #ccb084;
}
.openbtn::after{
	content: "MENU";
  position: absolute;
	bottom:6px;
	left: 0;
	font-size: 10px;
	text-align: center;
    width: 100%;
	color:#fff;
	font-family: "Noto Serif JP", serif;
}

/*ボタン内側*/
.openbtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 12px;
    height: 1px;
  background: #fff!important;
    width: 26px;
  }

.openbtn span:nth-of-type(1) {top:14px;}
.openbtn span:nth-of-type(2) {top:20px;}
.openbtn span:nth-of-type(3) {top:26px;}

/*activeクラスが付与されると線が回転して×に*/

.openbtn.active span:nth-of-type(1) {
    top: 12px;
    left: 13px;
    transform: translateY(7px) rotate(-45deg);
    width: 24px;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn.active span:nth-of-type(3){
    top: 26px;
    left: 13px;
    transform: translateY(-7px) rotate(45deg);
    width: 24px;
}

.openbtn.active::after{
	content: "CLOSE";
}

@media screen and (min-width:576px){
.openbtn{
	top:5px;
    width: 60px;
    height:60px;
}
.openbtn::after{
	bottom:6px;
	left: 0;
	font-size: 12px;
}

/*ボタン内側*/
.openbtn span{
    left: 12px;
    height: 1px;
    width: 36px;
  }

.openbtn span:nth-of-type(1) {top:16px;}
.openbtn span:nth-of-type(2) {top:24px;}
.openbtn span:nth-of-type(3) {top:32px;}

/*activeクラスが付与されると線が回転して×に*/

.openbtn.active span:nth-of-type(1) {
    top: 12px;
    left: 16px;
    width: 28px;
}

.openbtn.active span:nth-of-type(3){
    top: 26px;
    left: 16px;
    width: 28px;
}
}

/*========= レイアウトのためのCSS ===============*/
a{
  color: #333;
  text-decoration: none;
}

.lead{
  margin:20px 0 0 0;
}

.btn-block{
  width:200px;  
  padding: 30px;
}