/* --------------------------------------------- */
/* ▼モバイルファースト (全環境に共通のデザイン) */
/* --------------------------------------------- */
/*========= ページトップのためのCSS ===============*/
/*リンクの形状*/
#page-top a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s;
  line-height: 1.4;
  background: #DE3B00;
}
#page-top a:hover {
  background: #006F89;
  color: #fff;
}
/*リンクを右下に固定*/
#page-top {
  position: fixed;
  right: 30px;
  z-index: 2;
  /*はじめは非表示*/
  opacity: 0;
  transform: translateY(100px);
}
/*　上に上がる動き　*/
#page-top.UpMove {
  animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*　下に下がる動き　*/
#page-top.DownMove {
  animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 1;
    transform: translateY(100px);
  }
}
.pro_f-bg {
  border-top: 2px solid #DE3B00;
  padding: 2em 0em 0em;
  position: relative;
  background: #F2F2F2;
}
.pro_footer_txt {}
.pro_footer_txt img {
  width: 40%;
  margin: 0 auto 0.5em;
}
.pro_footer_txt p {
  font-size: 1.2rem;
}
.pro_footer_nav {
  display: none;
}
.pro_footer_contact {
  margin: 1em auto 0;
}
.pro_footer_contact div {
  font-size: 1.1rem;
  margin: 0 auto 1em;
}
.pro_footer_contact div p {
  width: 60%;
  padding: 0 15px 0 0;
  margin: 0 auto 0.5em;
}
.pro_cr {
  border-top: 1px solid #DE3B00;
  margin: 1.5em auto 0;
  font-size: 1.0rem;
  line-height: 4;
  background: #fff;
  color: #DE3B00;
}
/*========= sp_footer ===============*/
#footer_contact {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #006F89;
  padding: 10px 0;
  font-size: 1rem;
  line-height: 1.4;
}
#footer_contact p {
  width: 70px;
  margin: 0;
  box-sizing: border-box;
}
#footer_contact p:first-child {
  border-right: 1px solid #fff;
}
#footer_contact a {
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.3s;
}
#footer_contact p:first-child a {
  color: #FFF73B;
}
#footer_contact i {
  display: block !important;
  font-size: 2.0rem !important;
  margin: 0 auto 0.2em;
}
/*リンクを右下に固定*/
#footer_contact {
  position: fixed;
  right: 0px;
  z-index: 2;
  /*はじめは非表示*/
  opacity: 0;
  transform: translateY(100px);
}
/*　上に上がる動き　*/
#footer_contact.UpMove {
  animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*　下に下がる動き　*/
#footer_contact.DownMove {
  animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 1;
    transform: translateY(100px);
  }
}
/* ------------------------------------ */
/* ▼PC用デザインとして付け足すデザイン */
/* ------------------------------------ */
@media all and (min-width: 768px) {
  .pro_f-bg {
    padding: 3em 0 0em;
    position: relative;
  }
  .pro_footer {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0em auto 0em;
    justify-content: space-between;
    padding: 0 10% 0 10%;
    min-width: calc(1010px - 20%);
  }
  .pro_footer_txt {
    width: 320px;
    margin: 0 0 0 0;
    text-align: left;
  }
  .pro_footer_txt p {
    font-size: 1.4rem;
  }
  .pro_footer_txt img {
    width: 65%;
  }
  .pro_footerr {
    width: calc(100% - 620px);
    position: relative;
  }
  .pro_footer_nav {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0em auto 0em;
    justify-content: flex-start;
  }
  .pro_footer_nav li {
    width: 46%;
    line-height: 2.5;
    font-size: 1.4rem;
    text-align: left;
    position: relative;
  }
  .pro_footer_nav li:nth-of-type(odd) {
    width: 35%;
  }
  .pro_footer_nav li::before {
    position: absolute;
    top: 0;
    left: -15px;
    content: '\f054';
    font-family: FontAwesome;
    font-weight: 400;
    color: #DE3B00;
  }
  .pro_footer_nav li a {
    color: #DE3B00;
  }
  .pro_footer_nav li a:hover {
    text-decoration: underline;
  }
  .pro_footer_contact {
    margin: 0;
    width: 300px;
    text-align: left;
  }
  .pro_footer_contact div {
    padding: 0 0 0 27px;
  }
  .pro_footer_contact div p {
    width: 100%;
    margin: 0 0 0.2em -35px;
  }
  .pro_cr {
    font-size: 1.1rem;
    margin: 3em auto 0;
  }
  #footer_contact {
    display: none;
  }
}