body
{
  font-family: "Noto Sans Japanese", YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
  background-color: #ffffff;
  width: 99vw;
  box-sizing: border-box;
}
.wrap
{
   width: 100%;
   margin: 0 auto;
}
.main
{
}
.flex
{
  display: flex;
}
.space-between
{
  justify-content: space-between;
}
.space-around
{
  justify-content: space-around;
}
.fixed_banner
{
  position: fixed; /* 追従させる為にfixedの値を記述します */
  z-index: 99999; /* 他の要素の下に隠れないように全面配置させます */
  bottom: 10px; /* 上から150pxのところにバナーを配置します */
  right: calc(50% - 510px);
  background-color:transparent;
  border: 0px;
}
.fixed_banner_pc 
{
  width: 90px; /* バナーの横幅を指定してあげます */
}
.fixed_banner :hover
{
    transform: scale(1.05);
}
.pc_l
{
    width: 1100px;
    max-width: 99vw;
    margin: 0 auto;
}
.pc_img
{
    width: 100%;
}
.btn_l
{
  width: 890px;
  max-width: 70%;
  margin: 0 auto;
  margin-top: 50px;
  margin-bottom: 100px;
}
.line_btn_l,.mail_btn_l
{
  width: 400px;
  max-width: 48%;
}
.line_btn,.mail_btn
{
  width: 100%;
}
.line_btn_l:hover,.mail_btn_l:hover
{
    transform: scale(1.05);
}

/* 1030px以下に適用されるCSS */
@media screen and (max-width: 1030px)
{
  .fixed_banner
  {
    right: calc(50% - 470px);
  }
}
/* 930px以下に適用されるCSS */
@media screen and (max-width: 930px)
{
  .fixed_banner
  {
    right: calc(50% - 420px);
  }
}
/* 830px以下に適用されるCSS */
@media screen and (max-width: 830px)
{
  .fixed_banner
  {
    right: calc(50% - 370px);
  }
}
/* 770px以下に適用されるCSS */
@media screen and (max-width: 770px)
{
  .fixed_banner
  {
    right: calc(50% - 330px);
  }
  .fixed_banner_pc 
  {
    width: 70px; /* バナーの横幅を指定してあげます */
  }
}
/* 670px以下に適用されるCSS */
@media screen and (max-width: 670px)
{
  .fixed_banner
  {
    right: calc(50% - 290px);
  }
  .fixed_banner_pc 
  {
    width: 70px; /* バナーの横幅を指定してあげます */
  }
}
/* 570px以下に適用されるCSS */
@media screen and (max-width: 570px)
{
  .fixed_banner
  {
    right: calc(50% - 250px);
  }
  .fixed_banner_pc 
  {
    width: 70px; /* バナーの横幅を指定してあげます */
  }
}
/* 480px以下に適用されるCSS（スマホ用） */
@media screen and (max-width: 480px)
{
  .btn_l
  {
    margin-top: 20px;
  }
  .fixed_banner
  {
    right: calc(50% - 210px);
  }
  .fixed_banner_pc 
  {
    width: 50px; /* バナーの横幅を指定してあげます */
  }
}
/* 430px以下に適用されるCSS */
@media screen and (max-width: 430px)
{
  .fixed_banner
  {
    top:35px;
    right: calc(50% - 190px);
  }
}