@charset "utf-8";

/* **************************************************

  display style
  
************************************************** */
.visible-md, .visible-sm, .visible-xs { display: none !important; }

@media screen and (max-width:1023px) {
.hidden-md { display: none !important; }
.visible-md { display: block !important; }
br.visible-md, img.visible-md, span.visible-md { display: inline !important; }
}

@media screen and (max-width:767px) {
.hidden-sm, br.hidden-sm, img.hidden-sm, span.hidden-sm { display: none !important; }
.visible-sm { display: block !important; }
br.visible-sm, img.visible-sm, span.visible-sm { display: inline !important; }
}

@media screen and (max-width:480px) {
.hidden-xs, br.hidden-xs, img.hidden-xs, span.hidden-xs { display: none !important; }
.visible-xs { display: block !important; }
br.visible-xs, img.visible-xs, span.visible-xs { display: inline !important; }
}



/* **************************************************

  image
  
************************************************** */
img.w100 { width: 100%; }



/* **************************************************

  text-align
  
************************************************** */
.left { text-align: left !important; }
.center { text-align: center !important; }
.right { text-align: right !important; }



/* **************************************************

  text-indent
  
************************************************** */
.indent-1em { padding-left: 1em !important; }
.indent-2em { padding-left: 2em !important; }



/* **************************************************

  inner
  
************************************************** */
.inner-900,
.inner-1080,
.inner-1400,
.inner-1600 { margin: 0 auto !important; }
.inner-900 { max-width: 900px !important; }
.inner-1080 { max-width: 1080px !important; }
.inner-1400 { max-width: 1400px !important; }
.inner-1600 { max-width: 1600px !important; }
.inner-wrap-30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

@media screen and (max-width:767px) {
.inner-wrap-30 {
  padding-left: inherit !important;
  padding-right: inherit !important;
}
.inner-sm-15 { margin: 0 15px !important; }
.inner-sm-30 { margin: 0 30px !important; }
}



/* **************************************************

  btn
  
************************************************** */
.btn {
  font-size: 15px;
  font-weight: 700;
  color: #333 !important;
  line-height: 60px;
  text-decoration: none !important;
  background: #ebbc3a;
  display: inline-block;
  letter-spacing: 0.08em;
  vertical-align: top;
  text-align: center;
  box-sizing: border-box;
  min-width: 280px;
  border-radius: 5px;
  -webkit-appearance: none;
  appearance: none;
  -webkit-transition: background 0.2s ease-in-out;
  -moz-transition: background 0.2s ease-in-out;
  -ms-transition: background 0.2s ease-in-out;
  transition: background 0.2s ease-in-out;
}
.btn .arr {
  box-sizing: border-box;
  display: block;
  position: relative;
  padding: 0 45px;
}
.btn .arr:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
}

@media screen and (min-width:768px) {
.btn:hover { background: #f5de9d !important; }
}



/* ==================================================
  btnA
================================================== */
.btn.btnA .arr:after {
  background: url(../images/btn_arr_01.png) no-repeat center center;
  background-size: 100% 100%;
  width: 8px;
  height: 14px;
  margin-top: -7px;
}


/* ==================================================
  btnB
================================================== */
.btn.btnB .arr:after {
  background: url(../images/btn_arr_02.png) no-repeat center center;
  background-size: 100% 100%;
  width: 14px;
  height: 8px;
  margin-top: -4px;
}




















