/*===========header===========*/
.header{
	width:1200px;
	margin: 30px auto;
}

.logo{
	width: 300px;
	display:block;
	margin:0 auto;
}

/*===========toggle_content===========*/
.toggle{
	border: 1px solid black;
	padding:12px 8px;
	font-size: 18px;
	color:black;
	position: absolute;
	top: 38px;
	right: 200px;
	text-decoration:underline;
}

.toggle:hover{
	cursor:pointer;
	color: white;
	background-color: black;
	transition:0.3s;
}

.toggle_content{
	display:none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.9);
	color: white;
}

.close{
	width: 60px;
	height: 60px;
	font-size: 25px;
	line-height:60px;
	text-align:center;
	position:absolute;
	top: 38px;
	right: 70px;
}

.close:hover{
	cursor: pointer;
	color: #A90005;
}

.toggle_content ul{
	margin-top:120px;
}

.toggle_content ul li{
	margin:50px auto;
	width:200px;
	text-align:center;
	line-height:30px;
	color:white;
	border-bottom:1px dashed white;
}

.toggle_content ul li:hover{
	color: #A90005;
	border-bottom:1px dashed #A90005;
}


/*===========contents===========*/
.frame{
	width: 1200px;
	margin: 10px auto;
}

.banner{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	margin: 30px auto 10px;
	width: 768px;
}

h1{
	font-size: 30px;
	text-align:center;
	margin:50px 0 20px;
	font-weight:bold;
}

h2{
	font-weight:bold;
	color:red;
	margin:0 auto;
	text-align:center;
	margin-bottom:10px;
	font-size:30px;
}

#insert{
	display: -webkit-flex;
	display: flex;
	flex-direction: -webkit-row;
	flex-direction: row;
	flex-wrap: -webkit-wrap;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.items{
	width:23%;
	margin:10px 1%;
	border:1px solid gainsboro;
	box-sizing:border-box;
}

.items:hover{
	opacity:0.5;
}

.items img{
	display:block;
	width:100%;
}

.name{
	font-size:14px;
	margin:10px 5px;
}


.percentage{
	color:red;
	text-align:center;
	font-size:14px;
	display:inline-block;
	margin-left:8px;
}

.price{
	text-decoration:line-through;
	font-size:14px;
	margin:5px;
}

.discount{
	color:red;
	font-size:16px;
	margin:8px;
	font-weight:bold;
}

/*===========footer===========*/
.go_top{
	margin: 30px auto;
	width:30%;
	height:40px;
	line-height:40px;
	text-align:center;
	border:1px solid black;
	color:black;
	font-size:13px;
}

.go_top:hover{
	cursor:pointer;
	background-color:black;
	color:white;
	transition:0.3s;
}