@charset "utf-8";
/* ==================================================================
CSS information
style info :RBPページ用
================================================================== */


/* --------------------------------------------------------
#contents
-------------------------------------------------------- */
#contents { }


#headerBox #title { width:102px; background:url(../_img/title.png) no-repeat; background-size:contain; }

@media screen and (min-width: 769px) { /* PC用の記述 */
/*#footer_wrap { position:absolute;}*/
}



/* --------------------------------------------------------
#container
-------------------------------------------------------- */
#contents { background:url(../_img/bg.jpg) no-repeat top right; }
@media screen and (max-width: 768px) { /* 768px以下の記述 */
#contents { background:none; }
}

.sp { display:none; }
@media screen and (max-width: 768px) { /* 768px以下の記述 */
.sp { display: block; }
.pc { display: none; }
}


/* --------------------------------------------------------
#rbpBox
-------------------------------------------------------- */
#rbpBox { width:714px; position:relative; padding:30px 15px 40px; }

#rbpBox .text { font-size:100%; line-height:1.81; color:#dcdcdc; }

/* .rbpBtn
-------------------------------------------------------- */
#rbpBox .rbpBtn { width:466px; height:45px; text-align:center; margin:0 auto 20px; }
#rbpBox .rbpBtn img { width:70%; height:auto;}
#rbpBox .rbpBtn a { display:block; padding:12px 0 13px ; background:#267ad2;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
}

@media screen and (max-width: 768px) { /* 768px以下の記述 */
#rbpBox { width:100%; padding:15px 15px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* .rbpBtn
-------------------------------------------------------- */
#rbpBox .rbpBtn { width:100%; height:auto; }
#rbpBox .rbpBtn img { width:80%; height:auto;}
#rbpBox .rbpBtn a { display:block; padding:12px 0 13px ; background:#267ad2;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
}
}

/* --------------------------------------------------------
#readBox
-------------------------------------------------------- */
#readBox { margin-bottom: 30px; }
#readBox .ti { margin-bottom: 20px; }

@media screen and (max-width: 768px) { /* 768px以下の記述 */
#readBox { margin-bottom: 15px; }
#readBox .ti { margin-bottom: 25px; }
#readBox .ti img { width: 100% ; height:auto; }
}


/* --------------------------------------------------------
#sackboyBox
-------------------------------------------------------- */
#sackboyBox { margin-bottom: 48px; }
#sackboyBox ul.single { margin-bottom: 40px; }
#sackboyBox ul.single li { width: 169px; float:left; margin-right: 1.773%; }
#sackboyBox ul.single li:last-child { margin-right: 0; }

#sackboyBox .pack { clear:both; margin-bottom: 10px; }

@media screen and (max-width: 768px) { /* 768px以下の記述 */
#sackboyBox { margin-bottom: 24px; }
#sackboyBox ul.single { margin-bottom: 10px; }
#sackboyBox ul.single li { width: 50%; margin-right: 0; }
#sackboyBox ul.single li img { width: 100%; }

#sackboyBox .pack { margin-bottom: 10px; }
#sackboyBox .pack img { width:100%; height:auto; }

}