﻿/* .topBtn */
.topBtn {
  position:fixed;
  bottom:20px;
  right:0;
  display:block;
  background-color: #84ABC7; /* #6ABFFF , #84ABC7(水色系) , #F4BB15(オレンジ系) */
/*  background-color:rgba(0,0,0,0.5);*/
  color:#fff;
  text-decoration:none;
  font-size:11px;
  width:40px;
  height:40px;
  text-align:center;
  line-height:40px;  /* 行間 24.5px=(60px - 11px)/2*/
  box-sizing:border-box;
  cursor: pointer;
  z-index: 9999; /* 他の要素の下に隠れないように全面配置させます */
  border-radius: 6px;
}

/* ._page-top-g */
._page-top-g{
  position: fixed;
  right: 0;
  bottom: 0;
  font-size: 16px;
  color: #fff;
  background: #666;
  padding: 10px;
  cursor: pointer;
  transition: .3s;
  z-index: 9999; /* 他の要素の下に隠れないように全面配置させます */
  border-radius: 6px;
  
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;

    border-style: none;
/*    background-color: #d0000d;
    background-image: url(../img/base/icon_001.png);
    background-repeat: no-repeat;
    background-position: center center;*/
}

/* ._page-top */
._page-top{
  position: fixed;
  text-decoration:none;
  right: 0;
  bottom: 0;
  display:block;
  font-size: 14px;
  color: #fff;
  background: #84ABC7; /* #6ABFFF , #84ABC7(水色系) , #F4BB15(オレンジ系) */
  padding: 10px;
  cursor: pointer;
  transition: .3s;
  z-index: 9999; /* 他の要素の下に隠れないように全面配置させます */
  border-radius: 6px;
  
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
}

/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}

/*このクラスが付与されると表示する*/
.absolute{
  position: absolute;
  top: -70px;
  bottom: auto;
}

/* float-button__wrap */
.float-button__wrap {
    display: none;/*最初は隠す*/
    width: 35px;
    height: 35px;
    position: fixed;
    bottom: 5px;
    right: 5px;
    font-size: 14px;
    color: #000;
    background: #F4BB15; /* #6ABFFF , #84ABC7(水色系) , #F4BB15(オレンジ系) */
    text-align:center;
    line-height:35px;  /* 行間 24.5px=(60px - 11px)/2*/
    border-top : 2px solid green;
    border-left: 3px double green;
    border-right: 3px double green;
    border-bottom : 2px solid green;

/*    border-radius: 5px;*/
/*    cursor: pointer;*/

    z-index: 9999;
}
.body-in {
    position: relative;
}

/* tage-top */
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
    z-index: 9999; /* 他の要素の下に隠れないように全面配置させます */
    border-radius: 5px;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 45px;
    padding: 10px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}