@charset "UTF-8";
.text-brown {
  color: #8b4513; }

.text-green {
  color: #7cc4bc; }

.text-lightbrown {
  color: #30231A; }

.navbar .container .row .navbar-brand {
  font-size: 40px;
  font-family: "serif"; }

.poem_bg {
  background-image: url("../images/lp_sales/flame1-263ba4c8.jpg");
  height: 900px;
  background-size: cover; }

.bg1 {
  background-image: url("../images/lp_sales/bg1-0b30accc.jpg");
  height: auto;
  background-size: cover; }

.bg2 {
  background-image: url("../images/lp_sales/bg2-4238f42f.jpg");
  height: auto;
  background-size: cover; }

.border-box {
  border: 10px double #746c6c;
  padding: 16px;
  margin: 16px auto;
  text-align: center;
  display: block;
  width: 80%;
  background-color: #fff; }

.border-box .text {
  text-align: left;
  display: inline-block; }

.border-lightbrown {
  border-color: #746c6c; }

.border-green {
  border-color: #7cc4bc;
  border-width: 5px; }

.border-lightbrown {
  border: solid;
  border-color: #746c6c;
  border-width: 5px; }

.attention {
  position: relative;
  display: inline-block;
  padding: 0 30px;
  margin-bottom: 36px; }

.attention:before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  width: 1px;
  height: 100%;
  background: #000;
  border-radius: 3px;
  -webkit-transform: rotate(-25deg);
          transform: rotate(-25deg); }

.attention:after {
  position: absolute;
  content: "";
  right: 0;
  top: 0;
  width: 1px;
  height: 100%;
  background: #000;
  border-radius: 3px;
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg); }

.head-border {
  display: inline-block;
  position: relative; }

.head-border:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px;
  /*下線の上下位置調整*/
  display: inline-block;
  width: 50px;
  /*下線の幅*/
  height: 2px;
  /*下線の太さ*/
  -webkit-transform: translateX(-50%);
  transform: translate(-50%);
  /*位置調整*/
  background-color: #000000;
  /*下線の色*/ }

.w-head-border {
  display: inline-block;
  position: relative; }

.w-head-border:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px;
  /*下線の上下位置調整*/
  display: inline-block;
  width: 50px;
  /*下線の幅*/
  height: 2px;
  /*下線の太さ*/
  -webkit-transform: translateX(-50%);
  transform: translate(-50%);
  /*位置調整*/
  background-color: #fff;
  /*下線の色*/ }

.background-brown {
  background-color: #30231A; }

.background-lightbrown {
  background-color: #746c6c; }

.background-beige {
  background-color: #FDEEE5; }

.background-gray {
  background-color: #F8F8F8; }

.background-white {
  background-color: #fff; }

.dotted {
  padding: 1rem 2rem;
  border-top: 3px dashed #746c6c;
  border-bottom: 3px dashed #746c6c; }

.shiny-btn1 {
  display: block;
  position: relative;
  width: 80%;
  /*ボタンの幅*/
  padding: 30px 0;
  margin: 30px auto;
  background-color: #7cc4bc;
  /*ボタンの色*/
  -webkit-box-shadow: 0 3px 0 0 #013a24;
          box-shadow: 0 3px 0 0 #013a24;
  /*影の色(rgbaの値を変更)*/
  border-radius: 30px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  overflow: hidden; }

.shiny-btn1:hover {
  text-decoration: none;
  color: #fff; }

.shiny-btn1::before {
  position: absolute;
  content: '';
  display: inline-block;
  top: -180px;
  left: 0;
  width: 30px;
  height: 100%;
  background-color: #fff;
  -webkit-animation: shiny-btn1 3s ease-in-out infinite;
          animation: shiny-btn1 3s ease-in-out infinite; }

@-webkit-keyframes shiny-btn1 {
  0% {
    -webkit-transform: scale(0) rotate(45deg);
    opacity: 0; }
  80% {
    -webkit-transform: scale(0) rotate(45deg);
    opacity: 0.5; }
  81% {
    -webkit-transform: scale(4) rotate(45deg);
    opacity: 1; }
  100% {
    -webkit-transform: scale(50) rotate(45deg);
    opacity: 0; } }

.shiny-btn2 {
  display: block;
  position: relative;
  width: 80%;
  /*ボタンの幅*/
  padding: 30px 0;
  margin: 30px auto;
  background-color: #746c6c;
  /*ボタンの色*/
  border-radius: 30px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  overflow: hidden; }

.shiny-btn2:hover {
  text-decoration: none;
  color: #fff; }

.shiny-btn2::before {
  position: absolute;
  content: '';
  display: inline-block;
  top: -180px;
  left: 0;
  width: 30px;
  height: 100%;
  background-color: #fff;
  -webkit-animation: shiny-btn2 3s ease-in-out infinite;
          animation: shiny-btn2 3s ease-in-out infinite; }

@-webkit-keyframes shiny-btn2 {
  0% {
    -webkit-transform: scale(0) rotate(45deg);
    opacity: 0; }
  80% {
    -webkit-transform: scale(0) rotate(45deg);
    opacity: 0.5; }
  81% {
    -webkit-transform: scale(4) rotate(45deg);
    opacity: 1; }
  100% {
    -webkit-transform: scale(50) rotate(45deg);
    opacity: 0; } }

.btn3 {
  display: block;
  position: relative;
  width: 100%;
  /*ボタンの幅*/
  padding: 10px 0;
  margin: 10px auto;
  background-color: #30231A;
  /*ボタンの色*/
  border-radius: 10px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  overflow: hidden; }

.before-triangle {
  border: solid;
  border-color: #746c6c; }

.triangle {
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 30px solid #746c6c; }

.bd-gr {
  border: solid;
  border-color: #7cc4bc;
  margin-bottom: 20px;
  width: 95%;
  border-width: 1px;
  margin-left: auto;
  margin-right: auto; }

body {
  font-family: "serif"; }

.material-icons {
  display: inline-flex;
  vertical-align: middle; }
