@charset "UTF-8";

/* チェックボックス非表示 */
#banner-close{
  display:none;
}

/* フローティングバナー */
.floating-banner{
  position:fixed;
  right:40px;
  bottom:80px;
  width:390px;
  z-index:99999;

  opacity:1;
  transition:opacity .5s ease;

  /* シャドウ */
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}

/* バナー画像 */
.banner-link img{
  width:100%;
  height:auto;
  display:block;
}

/* 閉じるボタン */
.close{
  position:absolute;
  top:-15px;
  right:-15px;
  cursor:pointer;

  /* シャドウ */
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.3));
}

.close img{
  width:28px;
  height:auto;
  display:block;
}

/* 消える */
#banner-close:checked ~ .floating-banner{
  opacity:0;
  pointer-events:none;
}

/* SP */
@media (max-width:768px){
  .floating-banner{
    width:250px;
    right:10px;
    bottom:20px;
  }

  .close{
    top: -35px;
    right: 0px;
  }
}