/*========================
　フローティング
　========================*/
@media(min-width: 768px){
#fix-box {
    background: url(https://cottage-do.com/images/banner_10off.png) 0 0 no-repeat;
    top: 200px;
}

.fix-bn {
    width: 70px;
    height: 190px;
    position: fixed !important;
    position: absolute;
    right: 0;
    -webkit-transition: width ease-in-out 0.5s;
    -moz-transition: width ease-in-out 0.5s;
    -ms-transition: width ease-in-out 0.5s;
    -o-transition: width ease-in-out 0.5s;
    transition: width ease-in-out 0.5s;
}

.fix-bn:hover {
    width: 170px;
}

.fix-bn a {
    display: block;
    width: 100%;
    height: 100%;
}
}

/*スマホの時だけ*/
@media(max-width: 767px){
#fix-box {
    display: none !important;
}
}
















/*========================
　smartphone　bottom menu
　========================*/


.mini-text{font-size:10px;}/*文字大きさ*/

ul.bottom-menu {
position: fixed;
left:0;
bottom:0;
width: 100%;
height:60px;/*高さ*/
margin:0;
padding:0;


/*背景色*/
background:linear-gradient(135deg, #0FF0B3 0%,#036ED9 100%);
    
border-top:2px solid #0FF0B3;/*バーの上の線の色*/
border-bottom:2px solid #0FF0B3;/*バーの下の線の色*/
z-index:30;
}

ul.bottom-menu li {
float:left;
width:25%;
/*background:linear-gradient(135deg, #0FF0B3 0%,#036ED9 100%);*/

list-style-type:none;
text-align:center;
font-size:20px;/*アイコンのサイズ*/}

.bottom-menu li a {
display: block;
color:#FFF;/*アイコン＆文字の色*/
padding-top:5px;
padding-bottom:5px;
line-height:10px;
text-decoration:none;
text-align:center;
}

.bottom-menu li a:hover {
color:#a9a9a9;/*マウスオーバー時の色*/
color:#FFF;/*アイコン＆文字の色*/}
/* === 展開メニュー === */

ul.menu-second-level {
visibility: hidden;
opacity: 0;
z-index:1;
background:linear-gradient(135deg, #0FF0B3 0%,#036ED9 100%);
}

ul.menu-second-level li a{
border-top:1px dashed #a9a9a9;/*展開の枠点線色*/

border-top:1px dashed #FFF;/*展開の枠点線色*/

font-size:15px;/*展開メニューの文字サイズ*/
line-height:45px;/*文字の縦幅*/}

.menu-second-level li a:hover {
height:100%;
/*background: lightgrey;*//*マウスオーバーの色*/
background:linear-gradient(135deg, #0FF0B3 0%,#036ED9 100%);

}

li.menu-width-max ul.menu-second-level {
position: absolute;
bottom: 61px;/*高さ*/

left: 0;
box-sizing: border-box;
width: 100%;
padding:0;}

li.menu-width-max:hover ul.menu-second-level {
bottom: 62px;/*高さ*/
visibility: visible;
opacity: 1;}

li.menu-width-max ul.menu-second-level li {
float: left;
width: 100%;
border: none;}

/*PC表示の際はボトムメニューは表示しない*/
@media(min-width: 768px){
.bottom-menu{display:none; }
}

/*スマホの時だけ*/
@media(max-width: 767px){

/*ボトムメニュー付けたのでフッタを底上げする*/
#footer{margin-bottom:61px;

padding-bottom: env(safe-area-inset-bottom);
}
}





/*---------------------------------
タイトルつき囲み枠
--------------------------------*/
.point-box {
  position: relative;
  border: 2px solid #8BC34A; /* 枠の太さ・種類・色 */
  border-radius: 4px; /* 枠の丸み */
  margin: 1.8em 1em; /* 枠外の余白 */
  padding: 5px 15px;
}

.point-title {
  position: absolute;
  padding: 0 0.5em;
  left: 20px;
  top: -13px; /* タイトルの位置を調整 */
  color: #555555; /* タイトルの文字色 */
  font-weight: bold;
  font-size:0.9em; /* タイトルの文字サイズ */
  background-color: #ffffff;
}