/*SP → タブレット　→ PC*/
/* iPhone 縦 */

.dot_info{ background-color:#8D93C8; }

/*============ #recTitle ===============*/

#recTitle{ background-color:#8D93C8; }



/*============ #infoList ===============*/

#infoList{ padding: 100px 7vw; text-align: center; }
#infoList .title_area{ padding: 0 0 50px; }

#infoList h2{ width: auto; height: 25px; }
#infoList img{ width: auto; height: 100%; }

#infoList .info_list .item{
    width: 100%;
    margin: 0 auto 40px auto;
    font-weight: bold;
    border: 3px solid #8D93C8;
 }
#infoList .info_list .item .item_txt{
    line-height: 2em;
    padding: 10px;
    display: block;
    text-align: left;
}
#infoList .info_list .item .item_link{
    line-height: 3em;
    display: block;
    position: relative;
    background-color:#8D93C8;
    color: #FFF;
}

#infoList .info_list .item .item_link .triangle {
    position: absolute;
    background-image: url(../../images/common/icon_tips.png);
    background-repeat: no-repeat;
    background-size: 90%;
    height: 20px;
    width: 20px;
    right: 0;
    bottom: 0px;
}



#infoDetail{
    padding: 50px 4vw;
    text-align: left;
    font-size: 0.9em;
}
#infoDetail h3{ width: auto; height: 25px; padding: 0 0 20px;}
#infoDetail img{ width: auto; height: 100%; }
#infoDetail .title_area{ padding: 0 0 40px; }
#infoDetail .sub_title{
    font-size: 1.15em;
}
#infoDetail .info_title{
    font-size: 1.35em;
    font-weight: bold;
    border-bottom: dotted;
}

#infoDetail .detail_wrap{
    background-color: #E8E9F4;
    padding: 20px;
}
#infoDetail p{
    padding: 0 0 50px;
}
#infoDetail .offer_list{
    background-color: #FFF;
    padding: 20px;
}
#infoDetail table{
    width: 100%;
    margin: 0 0 50px;
    font-size: 0.9em;
}

#infoDetail table th{
    width: 35%;
    background-color: #000;
    color: #fff;
    padding: 20px 10px 20px 10px;
    vertical-align: middle;
    border-bottom: solid #FFF;
    border-top: solid #000;
}
#infoDetail table td{
    width: 65%;
    vertical-align: middle;
    padding: 20px 0 20px 10px;
    border-top: solid #000;
}
#infoDetail table tr:last-child th,
#infoDetail table tr:last-child td{
    border-bottom: solid #000;
}
#infoDetail button.entry_btn{
    background-color: #000;
    border: none;
    border-radius: 10px;
    color: #FFF;
    line-height: 4em;
    width: 80%;
    text-align: center;
    display: block;
    margin: 0 auto;
}

#infoDetail p.return{
    text-align: center;
    padding: 70px 0 0;
    font-weight: bold;
}
#infoDetail p.return a{ color: #000; letter-spacing: 0.2em;}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
#infoList .info_list .item .item_link .triangle {
    background-image: url(../../images/common/icon_tips@2x.png);
}

}


@media screen and (min-width:768px){
/***************************
　for iPad 　
****************************/


#recTitle{ padding: 50px 50px 50px 50px; }

#infoList{ padding: 10vw 7vw; }
#infoList .info_list .item{
    width: 100%;
    height: 100px;
    display: table;
    margin: 0 auto 40px auto;
    font-weight: bold;
    border: 3px solid #8D93C8;
 }
#infoList .info_list .item .item_txt{
    width: 80%;
    display: table-cell;
    line-height: 2em;
    text-align: left;
    vertical-align: middle;
    padding: 0 0 0 20px;
}
#infoList .info_list .item .item_link{
    width: 20%;
    display: table-cell;
    vertical-align: middle;
    line-height: 2em;
    position: relative;
    background-color:#8D93C8;
    color: #FFF;
}

#infoDetail{ padding: 6vw 7vw; }
#infoDetail .detail_wrap{ padding: 50px; }
#infoDetail .offer_list{ padding: 50px; }

#infoDetail table th,
#infoDetail table td{
    padding: 20px 0px 20px 20px;
}

}
@media screen and (min-width:1024px) {
/***************************
　for PC 　
****************************/

#infoList{
    padding: 3vw 0vw;
    max-width: 1240px;
    margin: 0 auto;
}
#infoList .info_list{
    width: 90%;
    margin: 0 auto;
}

#infoDetail{
    max-width: 1240px;
    width: 80%;
    margin: 0 auto;
    font-size: 1em;
}
#infoDetail .title_area{ padding: 0 0 50px; }
#infoDetail .detail_wrap{ padding: 70px; }
#infoDetail p{ padding: 0 0 70px; }
#infoDetail .offer_list{ padding: 70px; }


}

@media screen and (min-width:1300px) {
/***************************
　for PC 2
****************************/
#infoList .info_list .item .item_txt{
    padding: 0 0 0 50px;
}
}