*{
  margin: 0;
  padding: 0;
}

body{
  font-family:"游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}

.font-serif{
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","ヒラギノ明朝 Pro",'Times New Roman', Times, serif;
}

.text-center{
  text-align: center;
}

.sp-only{
  display: none;
}

.column-center{
  max-width: 664px;
  margin: auto;
}

.column-center-big{
  max-width: 1004px;
  margin: auto;
}

.arrow-right{
  height: 16px;
  line-height: 16px;
  background-image: url("../images/arrow-right@2x.png");
  background-size: 8px 16px;
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 20px;
  text-decoration: none;
  color: #2F2F2F;
}

.arrow-right:hover{
  text-decoration: underline;
}

.header-image{
  width: 100%;
  height: 240px;
  position: relative;
  margin-bottom: 80px;
}

.header-image img{
  width: 100%;
  height: 240px;
  object-fit: cover;
}

.header-image h1{
  line-height: 1;
  position: absolute;
  bottom: 84px;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 32px;
}

.nav-links{
  max-width: 330px;
  margin: auto;
  display: flex;
  justify-content: center;
}

.nav-first,
.nav-last,
.nav-left,
.nav-right{
  display: block;
  background-color: #502411;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 3px;
  width: 40px;
  height: 40px;
}

.nav-first a,
.nav-last a,
.nav-left a,
.nav-right a{
  display: block;
  width: 100%;
  height: 100%;
}

.nav-first.off,
.nav-last.off,
.nav-left.off,
.nav-right.off{
  background-color: #CCCCCC;
}

.nav-first{
  background-image: url("../images/nav-link-first@2x.png");
  background-size: 16px 17px;
  margin-right: 10px;
}

.nav-last{
  background-image: url("../images/nav-link-last@2x.png");
  background-size: 16px 17px;
  margin-left: 10px;
}

.nav-left{
  background-image: url("../images/nav-link-prev@2x.png");
  background-size: 10px 17px;
}

.nav-right{
  background-image: url("../images/nav-link-next@2x.png");
  background-size: 10px 17px;
}

.nav-page{
  max-width: 150px;
  flex: 1;
  text-align: center;
  line-height: 40px;
}


em {
	font-style: normal;
	font-weight: bold;
}
.b {
	font-weight: bold;
}
.s {
	text-decoration: line-through;
}
.u {
	text-decoration: underline;
}
.f11 {
	font-size: 11px;
	line-height:130%;
}
.f12 {
	font-size: 12px;
	line-height:140%;
}
.f14 {
	font-size: 14px;
	line-height:140%;
}
.f16 {
	font-size: 16px;
	line-height:140%;
}
.f18 {
	font-size: 18px;
	line-height:140%;
}
.f24 {
	font-size: 24px;
	line-height:140%;
}
.f30 {
	font-size: 30px;
	line-height:140%;
}
.txt-r {
	text-align: right;
}
.center {
	text-align: center;
}
.ma20 {
	margin: 20px;
}
.mt10 {
	margin-top: 10px;
}
.mt20 {
	margin-top: 20px;
}
.mt40 {
	margin-top: 40px;
}
.mt80 {
	margin-top: 80px;
}
.ml20 {
	margin-left: 20px;
}

.red {
	color: #CC0000;
}
.blue {
	color: #0066CC;
}
.grn {
	color: #008000;
}
.ora {
	color: #FF9900;
}
.gry {
	color: #999999;
}
.wht {
	color: #FFFFFF;
}