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

body{
	max-width:950px;
	width: 100%;
	margin: 0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-size:84%;
	line-height: 1.6;
}

img {
	max-width: 100%;
}

a{
	border:none;
	outline: none;
}

a:hover{
	opacity: 0.7;
}

header{
	margin: 3% auto;
	text-align: center;
}

header img{
	width:30%;
	height: auto;
}

#contents {
	width: 100%;
}

/*.btn {
	margin: 5% 0;
	text-align: center;
}*/

.box {
	margin: 5% 0 4%;
}

.box .btn:hover {
	opacity: 0.7;
}

.btn {
	display: inline-block;
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 2% 0;
  border-bottom: 7px solid #bd8c38;
  background-color: #e1ca6e;
	font-size: 230%;
	font-weight: bold;
  cursor: pointer;
  border-radius: 10px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
}
.btn:hover {
  border-bottom: 0px solid #bd8c38;
  margin-top: 7px;
}

.btn a {
	color: #fff;
}

/*.attention{
	background-color: #313131;
  margin: 7% 0 0;
	padding:3% 4%;
	line-height: 2.0;
	font-size: 110%;
	color: #fff;
}*/

.attention>ul>li:first-child {
    font-size: 115%;
  font-weight: bold;
    color: #E8191C;
  }


li{
	padding-left:1em;
	text-indent:-1em;
}

footer{
	text-align: center;
	margin: 5% 2% 2%;
}


@media screen and (max-width: 540px){
	
	header{
		margin: 3% auto;
	}
	header img{
		width: 50%;
		height: auto;
	}
	
	.box {
		margin: 3% 2% 5%;
	}
	
	.btn {
		padding: 4% 0;
		font-size: 135%;
	}
	
	.attention{
		margin: 5% 0;
		font-size: 100%;
		line-height: 1.5;
	}
  footer {
    font-size: 80%;
  }
  
}

@media screen and (max-width: 540px) {
	.btn {
		font-size: 110%;
	}
	
}