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

@font-face {
  font-family: 'Jost', sans-serif;
}

a{
	text-decoration: none;
}
a:link { color: #000000; }
a:hover{
  color : #E76E98;
}
a:active{
	color : #000000;
}/*選択中のリンク*/
a:visited { 
	color: #000000; 
}/*訪問済みのリンク*/

body{
	max-width: 1100px;
	margin: auto;
	padding: 20px;
	
}

header{
	width: 100%;
	margin-top: 10px;
}

header img{
	width: 100px;
}

#container{
	width: 1100px;
	margin-top: 20px;
	overflow: hidden; 

}

nav{
	width: 200px;
	float: left;
	font-size: 16px;
	font-family: "jost";
	letter-spacing: 1.5px;
	line-height: 34px;
	margin-right: 30px;
}
nav,ul{
	flex-direction: column;
	text-align: left;
}

main{
	width: 79%;/*870pxでもOK*/
	float: left;
}

main img{
	width: 79%;
}

/*ハンバーガーメニューcssここから*/
menu{
	width: 100%;
	height: 100vw;
	display: block;
	position: fixed;
	background-color: #ffffff;
	top:15px;
	left:-100%;
	bottom: 0;
	transition: all 0.5s;
	z-index: 3;
	opacity: 0;	
	font-size: 14px;
	font-family: "Jost";
	padding-top: 30px;
	padding-right: 30px;
	padding-bottom: 50px;
	line-height: 30px;
}
.open menu{
	left:0%;
	top: 0;
	opacity: 1;
}
menu.inner{
	padding: 50px;
}
menu.inner ul li{
	border-bottom: 1px solid #333333;
}
menu.inner ul li a{
	display: block;
	padding: 1rem;
	transition-duration: 0.2s;
}

svg{
	float: left;
	}

.toggle-btn{
	display: block;
	position: fixed;
	top:5px;
	left: 20px;
	width: 30px;
	height: 30px;
	z-index: 3;
	cursor: pointer;
}

.toggle-btn span{
	position: absolute;
	display: block;
	left: 0;
	width: 30px;
	height: 1px;
	background-color: #333333;
	transition: all 0.5s;
	border-radius: 4px;
}

.toggle-btn span:nth-child(1){
	top:10px;
}
.toggle-btn span:nth-child(2){
	top:20px;
}
.toggle-btn span:nth-child(3){
	bottom:-2px;
}

.open .toggle-btn span:nth-child(1){
	transform: translateY(10px)rotate(-315deg);
}
.open .toggle-btn span:nth-child(2){
	opacity: 0;
}
.open .toggle-btn span:nth-child(3){
	transform: translateY(-10px)rotate(315deg);
}
/*ハンバーガーメニューcssここまで*/


footer{
	display: block;
	width: 100%;
	height: 100%;
	padding-top: 20px;
	text-align: left;
	font-family: "Jost";
	font-size: 12px;
	clear: both;

}