@charset "UTF-8";
/* ===================================================================
CSS information

 file name  : components.css
 author     : Ability Consultant
 style info : 共通パーツ
=================================================================== */
/*Animate */
/* -----------------------------------------------------------
	見出し
----------------------------------------------------------- */
.tl_basic {
  text-align: center;
  font-weight: normal;
  color: #b29626;
}
.tl_basic .en {
  font-family: "EB Garamond", serif;
  font-size: 286%;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.tl_basic .jp {
  font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
  font-size: 100%;
  letter-spacing: .15em;
  display: block;
}
.tl_basic.gray {
  text-align: left;
}
.tl_basic.gray .en {
  font-size: 286%;
  color: #676666;
}
.tl_basic.gray .jp {
  font-size: 100%;
  display: inline-block;
  color: #292929;
}

.st_basic {
  text-align: center;
  font-weight: normal;
  color: #b29626;
}
.st_basic .en {
  font-family: "EB Garamond", serif;
  font-size: 243%;
  letter-spacing: .4em;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px) {
  .st_basic .en {
    letter-spacing: .2em;
  }
}
.st_basic .jp {
  font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
  font-size: 100%;
  letter-spacing: .2em;
  display: block;
}
@media only screen and (max-width: 767px) {
  .st_basic .jp {
    letter-spacing: .1em;
  }
}
.st_basic.left {
  text-align: left;
}

/* -----------------------------------------------------------
	ボタン
----------------------------------------------------------- */
.btn_basic a, .btn_basic > span {
  text-align: center;
  display: block;
  border: 1px solid #887156;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  padding: 1em .2em;
}
@media only screen and (min-width: 1025px) {
  .btn_basic a:hover, .btn_basic > span:hover {
    background: #887156;
    color: #fff !important;
  }
  .btn_basic a:hover span:after, .btn_basic > span:hover span:after {
    border-top-color: #fff;
    border-right-color: #fff;
    right: -1.3em;
  }
}
@media print {
  .btn_basic a:hover, .btn_basic > span:hover {
    background: #887156;
    color: #fff !important;
  }
  .btn_basic a:hover span:after, .btn_basic > span:hover span:after {
    border-top-color: #fff;
    border-right-color: #fff;
    right: -1.3em;
  }
}
.ie8 .btn_basic a:hover, .ie8 .btn_basic > span:hover {
  background: #887156;
  color: #fff !important;
}
.ie8 .btn_basic a:hover span:after, .ie8 .btn_basic > span:hover span:after {
  border-top-color: #fff;
  border-right-color: #fff;
  right: -1.3em;
}
.btn_basic a span, .btn_basic > span span {
  display: inline-block;
  position: relative;
}
.btn_basic a span:after, .btn_basic > span span:after {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  right: -1em;
  width: 8px;
  height: 8px;
  border-top: 1px solid #887156;
  border-right: 1px solid #887156;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.btn_basic.gold a, .btn_basic.gold > span {
  background: #b29626;
  border: 1px solid #b29626;
  color: #fff;
}
@media only screen and (min-width: 1025px) {
  .btn_basic.gold a:hover, .btn_basic.gold > span:hover {
    background: none;
    color: #b29626 !important;
  }
  .btn_basic.gold a:hover span:after, .btn_basic.gold > span:hover span:after {
    border-top-color: #b29626;
    border-right-color: #b29626;
  }
}
@media print {
  .btn_basic.gold a:hover, .btn_basic.gold > span:hover {
    background: none;
    color: #b29626 !important;
  }
  .btn_basic.gold a:hover span:after, .btn_basic.gold > span:hover span:after {
    border-top-color: #b29626;
    border-right-color: #b29626;
  }
}
.ie8 .btn_basic.gold a:hover, .ie8 .btn_basic.gold > span:hover {
  background: none;
  color: #b29626 !important;
}
.ie8 .btn_basic.gold a:hover span:after, .ie8 .btn_basic.gold > span:hover span:after {
  border-top-color: #b29626;
  border-right-color: #b29626;
}
.btn_basic.gold a span:after, .btn_basic.gold > span span:after {
  border-top-color: #fff;
  border-right-color: #fff;
}
.btn_basic.wh a, .btn_basic.wh > span {
  background: #fff;
}
@media only screen and (min-width: 1025px) {
  .btn_basic.wh a:hover, .btn_basic.wh > span:hover {
    background: #887156;
  }
}
@media print {
  .btn_basic.wh a:hover, .btn_basic.wh > span:hover {
    background: #887156;
  }
}
.ie8 .btn_basic.wh a:hover, .ie8 .btn_basic.wh > span:hover {
  background: #887156;
}
.btn_basic.small a, .btn_basic.small > span {
  text-align: left;
  padding: .5em;
}
@media only screen and (min-width: 1025px) {
  .btn_basic.small a:hover span:after, .btn_basic.small > span:hover span:after {
    right: 0;
  }
}
@media print {
  .btn_basic.small a:hover span:after, .btn_basic.small > span:hover span:after {
    right: 0;
  }
}
.ie8 .btn_basic.small a:hover span:after, .ie8 .btn_basic.small > span:hover span:after {
  right: 0;
}
.btn_basic.small a span, .btn_basic.small > span span {
  display: block;
  text-align: center;
  padding-right: 5px;
}
.btn_basic.small a span:after, .btn_basic.small > span span:after {
  right: .5em;
}

.btn_fair a, .btn_fair > span {
  text-align: center;
  display: block;
  background: #9e0930;
  color: #fff;
  border: 3px solid #d11848;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  padding: 1em .2em;
}
@media only screen and (min-width: 1025px) {
  .btn_fair a:hover, .btn_fair > span:hover {
    background: #d11848;
    color: #fff !important;
  }
  .btn_fair a:hover span:after, .btn_fair > span:hover span:after {
    border-top-color: #fff;
    border-right-color: #fff;
    right: -1em;
  }
}
@media print {
  .btn_fair a:hover, .btn_fair > span:hover {
    background: #d11848;
    color: #fff !important;
  }
  .btn_fair a:hover span:after, .btn_fair > span:hover span:after {
    border-top-color: #fff;
    border-right-color: #fff;
    right: -1em;
  }
}
.ie8 .btn_fair a:hover, .ie8 .btn_fair > span:hover {
  background: #d11848;
  color: #fff !important;
}
.ie8 .btn_fair a:hover span:after, .ie8 .btn_fair > span:hover span:after {
  border-top-color: #fff;
  border-right-color: #fff;
  right: -1em;
}
.btn_fair a span, .btn_fair > span span {
  display: inline-block;
  position: relative;
}
.btn_fair a span:after, .btn_fair > span span:after {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  right: -.7em;
  width: 8px;
  height: 8px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.btn_fair.yellow a, .btn_fair.yellow > span {
  border: 3px solid #d2ac13;
  background: #c19d0e;
}
@media only screen and (min-width: 1025px) {
  .btn_fair.yellow a:hover, .btn_fair.yellow > span:hover {
    background: #d2ac13;
  }
}
@media print {
  .btn_fair.yellow a:hover, .btn_fair.yellow > span:hover {
    background: #d2ac13;
  }
}
.ie8 .btn_fair.yellow a:hover, .ie8 .btn_fair.yellow > span:hover {
  background: #d2ac13;
}