#magazine_bnr { max-width: 768px; margin: 0 auto 20%; padding: 0;}
#magazine_bnr h2 {margin: 0; padding: 3%; font-size: 18px;font-weight: bold; text-align: center; background:linear-gradient(180deg, #e9d69c, #c2a04e); }
#magazine_bnr .bo_bnr { margin: 0 5.5%; }
div#bannerSlider { margin: 8% 0;}
/*==================================================
スライダーのためのcss
===================================*/
.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
    width:94%;
     margin:0 auto;
 }
 
 .slider img {
     width:100%;/*スライダー内の画像を横幅100%に*/
     height:auto;
     border-radius: 10px;
 }
 
 /*slickのJSで書かれるタグ内、スライド左右の余白調整*/
 
 .slider .slick-slide {
     margin:0 10px;
 }
 
 /*矢印の設定*/
 
 /*戻る、次へ矢印の位置*/
 .slick-prev_magazine, 
 .slick-next_magazine {
     position: absolute;/*絶対配置にする*/
     top: 39%;
     cursor: pointer;/*マウスカーソルを指マークに*/
     outline: none;/*クリックをしたら出てくる枠線を消す*/
     border-top: 3px solid #666;/*矢印の色*/
     border-right: 3px solid #666;/*矢印の色*/
     height: 14px;
     width: 14px;
     z-index: 10;
 }
 
 .slick-prev_magazine {/*戻る矢印の位置と形状*/
     left: -1.5%;
     transform: rotate(-135deg);
 }
 
 .slick-next_magazine {/*次へ矢印の位置と形状*/
     right: -1.5%;
     transform: rotate(45deg);
 }
 
 /*ドットナビゲーションの設定*/
 
 .slick-dots {
     text-align:center;
     margin:20px 0 0 0;
 }
 
 .slick-dots li {
     display:inline-block;
     margin:0 5px;
 }
 
 .slick-dots button {
     color: transparent;
     outline: none;
     width:8px;/*ドットボタンのサイズ*/
     height:8px;/*ドットボタンのサイズ*/
     display:block;
     border-radius:50%;
     background:#ccc;/*ドットボタンの色*/
 }
 
 .slick-dots .slick-active button{
     background:#333;/*ドットボタンの現在地表示の色*/
 }

 .banner-title {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    margin-top: 5%;
    font-weight: bold;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    }
 /* ==========================================================================
 5. PCレイアウトの調整（画面幅768px以上）
 ========================================================================== */
@media (min-width: 768px) {
    #magazine_bnr h2 { font-size: 24px;}
    .banner-title { font-size: 17px;}
    #magazine_bnr .bo_bnr { margin: 0 4%;}
}