@charset "utf-8";
/*====================================================

A8.net selfback---special.css

since-2014.12.26 s_uemura
update-0000.00.00

====================================================*/

/*-------------------------------------
specialList
---------------------------------------*/
/* specialList */
#mainArea #specialList ul li {
    padding: 15px 0;
    border-bottom: 1px dotted #ccc;
}

#mainArea #specialList ul li:first-child {
    padding: 0 0 15px 0;
    border-bottom: 1px dotted #ccc;
}

#mainArea #specialList ul li h3 {
    font-weight: normal;
    margin-top: 10px;
    background: url(../images/icon_arrow01.png) left 2px no-repeat;
    padding-left: 15px;
}

#mainArea #specialList ul li p {
    line-height: 1.3;
    margin-top: 5px;
    color: #333333;
}

#mainArea #specialList ul li a:hover img {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
}

#mainArea #specialList ul li div.spBannerL {
    width: 280px;
    float: left;
}

#mainArea #specialList ul li div.spDescR {
    width: 300px;
    float: right;
}

#mainArea #specialList ul li div.spDescR h3 {
    margin: 0;
}

#mainArea #specialList ul li div.spDescR p {
    font-size: 12px;
    font-size: 1.2rem;
}




/*-------------------------------------
sbSpecial
---------------------------------------*/
/* common */
.txtSS {
    font-size: 10px;
    font-size: 1.0rem;
}

.fontB {
    font-size: 14px !important;
}

.colorRed {
    color: #c00;
    font-weight: bold;
}

/* toIndex */
#sbSpecial .toIndex {
    margin: 0 0 15px 0;
    text-align: right;
}

#sbSpecial .toIndex a {
    display: inline-block;
    background: #68d4c9;
    color: #fff;
    padding: 7px 15px;
    border-radius: 5px;
}

#sbSpecial .toIndex a:hover {
    opacity: 0.7;
}

#sbSpecial .lastlink {
    margin: 0 63px 0 0;
}


/* programArea */
#sbSpecial {
    margin-bottom: 40px;
    font-size: 14px;
    font-size: 1.4rem;
}

#sbSpecial img {
    vertical-align: bottom;
}

#sbSpecial #programArea {
    margin-top: 20px;
}

#sbSpecial #programArea .pgCaution {
    font-size: 12px;
    font-size: 1.2rem;
    text-align: right;
    margin-bottom: 10px;
}

#sbSpecial #programArea h2.pgTitle {
    -moz-border-radius: 5px;
    /*for Firefox*/
    -webkit-border-radius: 5px;
    /*for Safari and chrome*/
    border-radius: 5px;
    /*CSS3*/
    padding: 10px;
    font-size: 24px;
    /* customOK */
}

#sbSpecial #programArea ul.ancNavi02 {
    list-style: none;
    margin: 20px 63px;
    padding: 0;
}

#sbSpecial #programArea ul.ancNavi02 li {
    display: inline;
    margin: 0 0 0 20px;
    padding: 0;
}

#sbSpecial #programArea ul.ancNavi02 li:first-child {
    margin: 0;
}

#sbSpecial #programArea ul.ancNavi02 a {
    background: url(../images/icon_arrow02.png) left center no-repeat;
    padding-left: 15px;
}

/* programArea -- specialPg */
#sbSpecial #programArea #specialPg {
    width: 864px;
    margin-left: 63px;
}

#sbSpecial #programArea #specialPg .sppgBox {
    width: 392px;
    float: left;
    margin: 0 40px 30px 0;
}

#sbSpecial #programArea #specialPg .sppgBox h3,
#sbSpecial #programArea #specialPg .sppgBox02 h3 {
    font-size: 20px;
    font-size: 2.0rem;
    line-height: 1.3;
    font-weight: bold;
    background: #000;
    padding: 12px 20px;
    color: #ffffff;
}

#specialPg .spBoxTxt {
    width: 350px;
    padding: 20px;
    background: #fff;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.4;
    -moz-box-shadow: #ccc 0 0 5px inset;
    /*for Firefox*/
    -webkit-box-shadow: #ccc 0 0 5px inset;
    /*for Safari and chrome*/
    box-shadow: #ccc 0 0 5px inset;
    /*CSS3*/
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt div.spRec {
    margin-top: 15px;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt div.spRec div.commLeft {
    width: 240px;
    float: left;
    margin-right: 10px;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt div.spRec div.banRight {
    width: 100px;
    float: right;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt div.spRec div.commLeft h4,
#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 div.speLeft03 .spefLeft h4 {
    font-weight: bold;
    color: #552f14;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt p.splead {
    margin-top: 10px;
}

#sbSpecial #programArea #specialPg .sppgBox .spBoxTxt dl.remuBox {
    margin-top: 15px;
}

/* programArea -- specialPg -- sppgBox02 */
#sbSpecial #programArea #specialPg .sppgBox02 {
    width: 824px;
    margin: 0 40px 30px 0;
}

#specialPg .spBoxTxt2 {
    width: 782px;
    padding: 20px;
    background: #fff;
    font-size: 12px;
    font-size: 1.2rem;
    -moz-box-shadow: #ccc 0 0 5px inset;
    /*for Firefox*/
    -webkit-box-shadow: #ccc 0 0 5px inset;
    /*for Safari and chrome*/
    box-shadow: #ccc 0 0 5px inset;
    /*CSS3*/
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 ul.serviceTxt02 {
    display: table;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 ul.serviceTxt02 li {
    display: table-cell;
    vertical-align: top;
    line-height: 1.3;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 ul.serviceTxt02 li.banner {
    width: 468px;
    padding-right: 10px;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 div.speLeft03 {
    width: 352px;
    float: left;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 div.speRight03 {
    width: 400px;
    float: right;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 div.speLeft03 .spefLeft {
    width: 242px;
    float: left;
    margin-right: 10px;
    line-height: 1.3;
}


/* programArea -- normalPg */
#sbSpecial #programArea #normalPg {
    width: 864px;
    margin: 15px 0 0 63px;
}

#sbSpecial #programArea #normalPg h2 {
    width: 794px;
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1.3;
    font-weight: bold;
    border-radius: 0;
    padding: 7px 15px;
    margin: 15px 0 15px 0;
}

#sbSpecial #programArea #normalPg .nmpgBox {
    width: 392px;
    float: left;
    margin: 0 40px 30px 0;
}

#sbSpecial #programArea #normalPg .nmpgBox h3 {
    font-size: 20px;
    font-size: 2.0rem;
    line-height: 1.3;
    font-weight: bold;
    padding: 12px 20px;
}

#sbSpecial #programArea #normalPg .nmpgBox .nmBoxTxt {
    width: 350px;
    padding: 20px;
    background: #fff;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.4;
    border-right: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;
}

#sbSpecial #programArea #normalPg .nmpgBox .nmBoxTxt ul.serviceTxt01 {
    display: table;
}

#sbSpecial #programArea #normalPg .nmpgBox .nmBoxTxt ul.serviceTxt01 li {
    display: table-cell;
    vertical-align: middle;
}

#sbSpecial #programArea #normalPg .nmpgBox .nmBoxTxt ul.serviceTxt01 li.banner {
    width: 125px;
    padding-right: 10px;
}

#sbSpecial #programArea #normalPg .nmpgBox .nmBoxTxt dl.remuBox {
    margin-top: 15px;
}

/* programArea -- common -- remuBox */
#sbSpecial #programArea dl.remuBox {
    border: 1px solid #cc0000;
    background: url(../images/special/remu_bg.gif) left top repeat-y #fff;
    display: table;
}

#sbSpecial #programArea dl.remuBox dt {
    display: table-cell;
    width: 60px;
    padding: 5px;
    color: #FFFFFF;
    font-weight: bold;
    white-space: nowrap;
    vertical-align: top;
    background: #cc0000;
    text-align: center;
}

#sbSpecial #programArea dl.remuBox dd {
    display: table-cell;
    padding: 5px;
    font-weight: bold;
    vertical-align: top;
    background: #ffffff;
    width: 268px;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.4;
}

#sbSpecial #programArea dl.remuBox dd.spe03 {
    display: table-cell;
    padding: 5px;
    font-weight: bold;
    vertical-align: top;
    background: #ffffff;
    width: 318px;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.4;
}

#sbSpecial #programArea ul.conditions {
    font-size: 10px;
    font-size: 1.0rem;
    line-height: 1.3;
    font-weight: normal;
    margin-top: 5px;
}

#sbSpecial #programArea ul.conditions li {
    text-indent: -10px;
    padding-left: 10px;
    padding-bottom: 3px;
}

#sbSpecial #programArea p.text {
    margin-top: 5px;
    line-height: 1.4;
}



/* programArea -- common -- btnWrap */
#sbSpecial #programArea ul.btnWrap {
    text-align: center;
    margin-top: 15px;
}

#sbSpecial #programArea ul.btnWrap li {
    width: 220px;
    line-height: 1;
    vertical-align: middle;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin: 0 10px 0 0;
    padding: 0;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
}

#sbSpecial #programArea ul.btnWrap li.right {
    width: 120px;
    line-height: 1;
    vertical-align: middle;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
}

#sbSpecial #programArea ul.btnWrap li a,
#programArea02 ul.btnWrap03 li a,
#programArea02 ul.btnWrap04 li a {
    display: block;
    line-height: 1;
    vertical-align: middle;
    color: #ffffff;
    padding: 12px 0;
    -moz-border-radius: 3px;
    /*for Firefox*/
    -webkit-border-radius: 3px;
    /*for Safari and chrome*/
    border-radius: 3px;
    /*CSS3*/
}

#sbSpecial #programArea ul.btnWrap li a:not(:target),
#programArea02 ul.btnWrap03 li a:not(:target),
#programArea02 ul.btnWrap04 li a:not(:target) {
    padding: 12px 0 8px 0\9;
    /* IE10以下 */
}


#sbSpecial #programArea ul.btnWrap li a:hover,
#programArea02 ul.btnWrap03 li a:hover,
#programArea02 ul.btnWrap04 li a:hover {
    text-decoration: none;
    -moz-border-radius: 3px;
    /*for Firefox*/
    -webkit-border-radius: 3px;
    /*for Safari and chrome*/
    border-radius: 3px;
    /*CSS3*/
}

#sbSpecial #programArea ul.btnWrap li span,
#programArea02 ul.btnWrap03 li .btnArrow,
#programArea02 ul.btnWrap04 li .btnArrow {
    background: url(../images/icon_whitearrow01.png) left center no-repeat;
    padding-left: 20px;
}

#sbSpecial #programArea ul.btnWrap li span:not(:target),
#programArea02 ul.btnWrap03 li .btnArrow:not(:target),
#programArea02 ul.btnWrap04 li .btnArrow:not(:target) {
    background: url(../images/icon_whitearrow01.png) no-repeat\9;
    background-position: left 4px\9;
}

#sbSpecial #programArea ul.btnWrap li a {
    background: #2d8e2d;
}

#sbSpecial #programArea ul.btnWrap li a:hover {
    background: #47ac47;
}

#sbSpecial #programArea ul.btnWrap li.right a {
    background: #e09c14;
}

#sbSpecial #programArea ul.btnWrap li.right a:hover {
    background: #f4be51;
}

/* programArea -- sppgBox02 -- btnWrap */
#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 ul.btnWrap li {
    width: 240px;
}

#sbSpecial #programArea #specialPg .sppgBox02 .spBoxTxt2 ul.btnWrap li.right {
    width: 150px;
}


/* programArea -- runtime */
#sbSpecial #programArea #runtime {
    width: 870px;
    margin: 0 0 60px 45px;
}

#sbSpecial #programArea #runtime h2 {
    border-left: 10px solid #0ab6a4;
    color: #666666;
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 15px;
    padding: 2px 0 2px 5px;
}

#sbSpecial #slick_container03 {
    width: 780px;
    margin: 0 auto;
}

#sbSpecial #programArea #runtime ul li {
    width: 130px;
    float: left;
}

#sbSpecial #programArea #runtime ul li .banner {
    width: 100px;
    margin: 0 auto;
    text-align: center;
}

#sbSpecial #programArea #runtime ul li .banner img {
    width: 100%;
}


/*-------------------------------------
sbSpecialEnd
---------------------------------------*/
/* sbSpecialEnd */
#sbSpecialEnd {
    text-align: center;
    margin: 100px 0 250px 0;
}

#sbSpecialEnd p.end {
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    color: #2f9bcd;
    margin: 40px 0;
}

#sbSpecialEnd p.change {
    font-weight: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

#sbSpecialEnd p.here {
    margin-top: 30px;
}

#sbSpecialEnd p.here span {
    font-weight: bold;
}




/*------------------------------
add-2016.8.5 s_uemura
------------------------------*/

#specialList2 ul.pickupList {
    display: table;
    border-spacing: 5px 0;
    min-height: 15px;
    margin-bottom: 20px;
}

#specialList2 ul.pickupList li {
    width: 125px;
    display: table-cell;
    border-right: 2px dotted #ccc;
    border-bottom: 2px dotted #ccc;
    padding: 0 31px 0 32px;
    font-size: 12px;
    font-size: 1.2rem;
    color: #888;
}

#specialList2 ul.iconArea {
    height: 10px;
    margin: 0;
}

#specialList2 ul.iconArea li {
    border-bottom: none;
}

#specialList2 ul.iconArea li .newIcon {
    display: inline-block;
    line-height: 1;
    color: #fff;
    background: #f24159;
    padding: 4px 8px 3px 8px;
    margin: 0 0 5px 0;
    vertical-align: bottom;
}

#specialList2 .leadTxt {
    margin: 5px 0 10px 0;
    line-height: 1.5;
}

#specialList2 a .leadTxt {
    color: #888;
}



#specialCategory {
    margin: 40px 0;
}

#specialCategory ul.anc {
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 15px;
}

#specialCategory ul.anc li {
    display: inline-block;
    margin: 0 10px 10px 0;
}

#specialCategory ul.anc li a {
    display: block;
    background: #3f99b6;
    border-radius: 4px;
    padding: 8px 20px;
    color: #fff;
}

#specialCategory ul.anc li a:hover {
    background: #006699;
    border-radius: 4px;
}

#specialCategory .gp01 {
    margin-bottom: 30px;
}

#specialCategory h3 {
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
    color: #666;
    border-bottom: 3px solid #3f99b6;
    padding: 0 10px 5px 10px;
    margin-bottom: 6px;
}

#specialCategory ul.cateList {
    display: table;
    border-spacing: 0;
    min-height: 10px;
}

#specialCategory ul.cateList li {
    width: 110px;
    display: table-cell;
    padding: 0 20px 0 20px;
    font-size: 12px;
    font-size: 1.2rem;
    color: #888;
}

#specialCategory ul.leadTxt2 {
    margin: 6px 0 10px 0;
}

#specialCategory ul.leadTxt2 li {
    line-height: 1.5;
}

#specialList2 ul.pickupList li:hover,
#specialList2 ul.cateList li:hover {
    opacity: 0.7;
}


#sbSpecial #runtime .runtimeTitle {
    display: table;
    width: 100%;
    margin-bottom: 15px;
}

#sbSpecial #runtime .runtimeTitle h2,
#sbSpecial #runtime .runtimeTitle .toIndex {
    display: table-cell;
    vertical-align: middle;
}