* {
  margin: 0;
  padding: 0;
}

ul, li {
  list-style: none;
}

a {
  text-decoration: none;
}

#floating-wrwp {
  background-color: #a9d63c;
  position: fixed;
  bottom: 0px;
  right: 0px;
  z-index: 8;
  width: 100%;
}

#floating-wrwp > .floating-area {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0 auto;
}

#floating-wrwp .floating-area .floating-box {
  margin: 0 auto;
  padding: 0;
  height: 65px;
  width: 100%;
}

#floating-wrwp .floating-area .floating-box .floating-lists {
  display: flex;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list {
  position: relative;
  display: block;
  text-align: center;
  width: calc(100% / 3);
  position: relative; /* 相対位置指定 */
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list a {
  color: #fff;
  font-size: 14px;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 65px;
  margin: 0 auto;
  padding: 0;
  border: none;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box a.btn-menu-01 {
  a {
    position:relative;
    }
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box a.btn-menu-04::before,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box a.btn-menu-03::before,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box a.btn-menu-02::before,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .flex-f-box a.btn-menu-01::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
}

img.floating-btn-img {
  width: 30px;
  height: 30px;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list div.floating-btn-02,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list div.floating-btn-01 {
  position: absolute;
  bottom: 62px;
  left: 0;
  right: 0;
  margin: auto;
  background-color: aqua;
  width: fit-content;
  display: none;
  border-radius: 6px;
  box-sizing: border-box;
  z-index: 10;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list div.open-menu  {
  position: absolute;
  bottom: 62px;
  left: 0;
  right: 0;
  margin: auto;
  background-color: aqua;
  width: fit-content;
  display: inline-block;
  border-radius: 6px;
  box-sizing: border-box;
  z-index: 10;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists {
  border-radius: 6px;
  border: solid 2px #a9d63c;
  box-sizing: border-box;
  display: inline-block;
  background-color: #fff;
  text-align: left;
  font-size: 14px;
  position: absolute;
  top: -122px; /* 三角形の高さとマージンを調整 */
  left: 50%;
  transform: translateX(-50%);
  margin: 0 0 0 40px;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-02 .dropdown-lists {
  border-radius: 6px;
  border: solid 2px #a9d63c;
  box-sizing: border-box;
  display: inline-block;
  background-color: #fff;
  text-align: left;
  font-size: 14px;
  position: absolute;
  top: -122px; /* 三角形の高さとマージンを調整 */
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .dropdown-list {
  text-align: left;
  white-space: nowrap;
  margin: 0 auto;
  padding: 2 2 2 2;
  position: relative;
  padding-left: 10px;
  border-bottom: solid 1px #a9d63c;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .dropdown-list:before {
  content: "";
  position: absolute;
  top: .80em;
  left: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 5px;
  height: 5px;
  border-top: 2px solid #a9d63c;
  border-right: 2px solid #a9d63c;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists:before {
  content: "";
  position: absolute;
  top: 98%;
  left: 90px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #fff;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-02 .dropdown-lists:before {
  content: "";
  position: absolute;
  top: 98%;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #fff;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-02 .dropdown-list,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-list {
  margin: 11px 10px 9px 10px;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-02 .dropdown-list a,
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-list a {
  color: #a9d63c;
  padding: 0 0 0 10px;
}




/*------------------------------------------
	768-480     - タブレット縦長
--------------------------------------------*/

@media all and (min-width: 480px) and (max-width: 768px) {

  /***************************
  style.css
  ***************************/
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists {
  border-radius: 6px;
  border: solid 2px #a9d63c;
  box-sizing: border-box;
  display: inline-block;
  background-color: #fff;
  text-align: left;
  font-size: 14px;
  position: absolute;
  top: -122px; /* 三角形の高さとマージンを調整 */
  left: 50%;
  transform: translateX(-50%);
  margin: 0 0 0 75px;
}

#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists:before {
  content: "";
  position: absolute;
  top: 98%;
  left: 55px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #fff;
}
}  

/*------------------------------------------
	480-less    - スマホ
--------------------------------------------*/

@media screen and (max-width: 480px) {

  /***************************
  style.css
  ***************************/
#floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists {
    border-radius: 6px;
    border: solid 2px #a9d63c;
    /*border: solid 2px blueviolet;*/
    box-sizing: border-box;
    display: inline-block;
    background-color: #fff;
    text-align: left;
    font-size: 14px;
    position: absolute;
    top: -122px; /* 三角形の高さとマージンを調整 */
    left: 50%;
    transform: translateX(-50%);
    margin: 0 0 0 100px;
  }
  
  #floating-wrwp .floating-area .floating-box .floating-lists .floating-list .floating-btn-01 .dropdown-lists:before {
    content: "";
    position: absolute;
    top: 98%;
    left: 28px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 7px solid #fff;
  }

}