@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/* study-laboratory-side-ad-16183: PC向け左右スクロール連動アフィリエイト広告 */
.sl-side-ad {
  display: none;
}

/* 120pxの左右余白を確保できる大画面だけに表示し、本文と重ねない */
@media screen and (min-width: 1500px) and (min-height: 780px) {
  .sl-side-ad {
    display: block;
    position: absolute;
    top: 132px;
    width: 120px;
    text-align: center;
    z-index: 5;
  }

  .sl-side-ad--left {
    left: max(10px, calc((100vw - 1200px) / 2 - 130px));
  }

  .sl-side-ad--right {
    right: max(10px, calc((100vw - 1200px) / 2 - 130px));
  }

  .sl-side-ad__label {
    display: block;
    margin: 0 0 5px;
    color: #666;
    font-size: 11px;
    line-height: 1;
    letter-spacing: .05em;
  }

  .sl-side-ad a,
  .sl-side-ad img {
    display: block;
    width: 120px;
    height: 600px;
  }

  .sl-side-ad a:focus-visible {
    outline: 3px solid #1e73be;
    outline-offset: 3px;
  }
}