#main {
  width: 1200px;
  margin: 0 auto;
}

h3{
  max-width: 330px;
  text-align: center;
  font-family: Hiragino Sans;
  font-size: 20px;
  color: rgba(0,0,0,1);
  letter-spacing: 0.4px;
  border: 2px solid rgba(112,112,112,1);
  margin: 2em auto;
  border-radius: 5px;
  font-weight:normal;
}

#main span.required {
  color: red;
}

.button {
    display: block;
    font-size: 16px;
    line-height: 42px;
    width:144px;
    height:42px;
    border: 1px solid #000;
    border-radius: 10px;
    margin: 2em auto;
    text-decoration: none;
    color:white;
    background-color: #C8C8C8;
    text-align:center;
}

#links>.forSP{
		display:none;
	}
	
@media screen and (max-width:640px){
	#main_content.recipe_list{
		min-width:auto !important;
	}
  #header #links{
	min-width: 0;
 }
 
   img {
    max-width:100%;
    height:auto;
  }
  #container, #main{
	min-width:0;
  }
  
  #main{
	margin:1em;
	    width:calc(100% - 2em);
	
  }

  #header>div{
    margin:0 auto;
    max-width:100%;
  }
  

  #header{
    background-image:url(https://www.repro.jp/images/top/logo.png);
    background-repeat:no-repeat;
    background-position-x:20px;
    background-position-y:5px;
    background-size:200px 39px;
    height:50px;

  }
  
  #header #homeButton{
	position:absolute;
	left:10px;
	top:10px;
	width:200px;
	height:39px;
      cursor:pointer;
      display:block;
  }
  
  #header #links{
  position:fixed;
    display:none;
    background-color:#000000;
    left:0;
    top:0;
    bottom:0;
    right:0;
    height:100%;
    width:100%;
    padding-top:150px;
    cursor:pointer;
  }
  
  
  #header #links #mypage img {
    display: inline;
    float: none;
}
  
  #header	.toggle {
		position: absolute;
		top: 0;
		right: 5px;
		width: 50px !important;
		height: 150px;
		transition: all .7s ease;
		cursor: pointer;
		z-index: 2;
	}
  #header	.bar {
		position: relative;
		top: 10px;
		right:0;
		display: block;
		height: 3.5px;
		width: 35px;
		background: white;
		margin: 5px auto;
		z-index: 2;
	}
  #header		.smaller .bar{
		background: #e5007f;
	}
  #header	.middle {
		margin: 0 auto;
	}
  #header	.toggle.on .top {
		-webkit-transform: translateY(8px) rotateZ(45deg);
		transform: translateY(88px) rotateZ(45deg);
		height: 2px;
	}
  #header	.toggle.on .bottom {
		-webkit-transform: translateY(-5px) rotateZ(-45deg);
		transform: translateY(71px) rotateZ(-45deg);
		height: 2px;
	}
  #header	.toggle.on .middle {
		width: 0;
	}
	#header #links a, #header #links span {
    display: block;
    vertical-align: middle;
    height: 40px;
    padding: 0 30px;
    text-align: left !important;
    text-decoration: none;
    font-size: 16px;
    line-height: 27px;
    color: #fff;
}

#header  #links a span{
	padding: 0;
}

	#header #links span em {
		display:inline;
	border-bottom: 1px solid whitte;
	height: auto;
	padding-top: 0;
	}
	td,th,tr,table,tbody{
		display:block;
	}
	th{
	text-align:left;
	}
	input, textarea{
		max-width:calc(100% - 2em)
	}
	form{

		width:100%;
		overflow:hidden;
	}
}