﻿.banAllDisp
{
    margin:0px auto;
    padding:10px 0px;
    max-width:1098px;
    width:100%;
}

.banAllDisp h4 {
    margin: 2px auto 10px;
    padding:0px;
    font-size: 1.3em;
    text-align:center;
    background:none;
    border:none;
}
.banAllDisp h4::after {
    border:none !important;
}

.banAllDisp .banWrap
{
    /*border: 1px solid #e5e5e5;*/
    margin: 10px auto 0px;

    width: 99% ;  /* IE8以下とAndroid4.3以下用フォールバック */
    width: -webkit-calc(100% - 2px) ;
    width: calc(100% - 2px) ;
}

.banAllDisp .banWrap .banItem
{
    margin:0px auto;
    padding: 20px 0px;
    width:100%;
    float:left;
}
.banAllDisp .banWrap .banItem .imgBan
{
    display: inline-block;
    vertical-align: middle;
    float:left;
}
.banAllDisp .banWrap .banItem .imgBan img
{
    display: block;
}
.banAllDisp .banWrap .banItem .textBan
{
    padding: 13px 0px;
    font-size: 0.9em;
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis; /* Opera9,10対応 */
    float:left;
}

@media screen and (min-width:1075px) {

    .banAllDisp .banWrap .banItem li
    {
        width: 18% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(20% - 30px) ;
        width: calc(20% - 30px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 5px 0px 5px 30px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 5px 0px 5px 28px;

        width: 18% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(20% - 28px) ;
        width: calc(20% - 28px) ;
    }
}
@media screen and (max-width:1074px) {
    /* タブレット用のスタイル記述 */
    .banAllDisp .banWrap .banItem li
    {
        width: 17% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(20% - 20px) ;
        width: calc(20% - 20px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 5px 0px 5px 20px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 5px 0px 5px 18px;

        width: 17% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(20% - 18px) ;
        width: calc(20% - 18px) ;
    }
}
@media screen and (max-width:999px) {
    /* タブレット用のスタイル記述 */
    .banAllDisp .banWrap .banItem li
    {
        width: 23% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(25% - 10px) ;
        width: calc(25% - 10px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 5px 0px 5px 10px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 5px 0px 5px 8px;

        width: 23% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(25% - 8px) ;
        width: calc(25% - 8px) ;
    }
}
@media screen and (max-width:767px) {
    /* スマートフォン用のスタイル記述 */
    .banAllDisp .banWrap .banItem li
    {
        width: 32% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(33% - 10px) ;
        width: calc(33% - 10px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 8px 0px 8px 10px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 8px 0px 8px 8px;

        width: 32% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(33% - 8px) ;
        width: calc(33% - 8px) ;
    }
}
@media screen and (max-width:639px) {
    /* スマートフォン用のスタイル記述 */
    .banAllDisp .banWrap .banItem li
    {
        width: 48% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(50% - 20px) ;
        width: calc(50% - 20px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 8px 0px 8px 20px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 8px 0px 8px 18px;

        width: 48% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(50% - 18px) ;
        width: calc(50% - 18px) ;
    }
}
@media screen and (max-width:479px) {
    /* スマートフォン用のスタイル記述 */
    .banAllDisp .banWrap .banItem li
    {
        width: 48% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(50% - 10px) ;
        width: calc(50% - 10px) ;
    }
    .banAllDisp .banWrap .banItem .imgBan {
        margin: 8px 0px 8px 10px;
    }
    .banAllDisp .banWrap .banItem .textBan {
        margin: 8px 0px 8px 8px;

        width: 48% ;  /* IE8以下とAndroid4.3以下用フォールバック */
        width: -webkit-calc(50% - 8px) ;
        width: calc(50% - 8px) ;
    }
}

.banAllDisp .banWrap .adinfoLink
{
    font-size: 0.9em;
    text-align: center;
    padding: 10px 0px;
}




