@charset "utf-8";

/* 共通 */
#container button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }
#container a { text-decoration: none; }
#container a:hover { text-decoration: underline; color: #000; }
#container a img:hover { opacity: 0.5 ; }
#container img{ vertical-align: middle; max-width: 100%; border-style: none; }
#container html { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; line-height: 1.3; }

/*===============================================
●SP 画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:667px){
.pc { display: none !important; }
.sp { display: block !important; }
#container { margin:0px 8px; }
.campaign_header { padding: 18px 8px; background: #c90027; margin-bottom: 18px; line-height: 2; }
#container .campaign_Title{ margin: 0px; padding: 0px; font-size:24px; color:#fff; font-weight:bold; text-align:center; line-height:1.5; }
.campaign_header .text_a { margin:0px; padding:0px; text-align:center; color: #fff; }
/* アイテムごとに見る */
#topic_item_pickup { margin: 0px 8px 20px; padding: 0px; overflow: hidden; }
#container .topics_a { width: 25%; margin: 0px 5px 0px 0px; padding: 4% 0%; font-size: 12px; font-weight: bold; color: #333; float: left; display: inline; border: 1px solid #ea5c7d; background: #ffffff; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; line-height:1.2; }
#container .topics_aa { width: 20%; margin: 0px; padding: 4% 0%; font-size: 12px; font-weight: bold; color: #333; float: left; display: inline; border: 1px solid #ea5c7d; background: #ffffff; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; line-height:1.2;}
#a01 { padding-top: 60px; margin-top: -60px; }
#b02 { padding-top: 60px; margin-top: -60px; }
#c03 { padding-top: 60px; margin-top: -60px; }
#d04 { padding-top: 60px; margin-top: -60px; }
#e05 { padding-top: 60px; margin-top: -60px; }
#f06 { padding-top: 60px; margin-top: -60px; }
#g07 { padding-top: 60px; margin-top: -60px; }
#h08 { padding-top: 60px; margin-top: -60px; }
#i09 { padding-top: 60px; margin-top: -60px; }
#j10 { padding-top: 60px; margin-top: -60px; }

/* アイテムカテゴリーコンテンツ */
#container .topics_box { margin-left:8px; margin-right:8px; overflow: hidden; }
#container .topics_title { margin: 0px 0px 8px 0px; padding: 8px 0px 8px 8px; font-size: 18px; font-weight: bold; color: #333; border-left: 15px solid #999; }
#container .topics_item_group_a { overflow: hidden; margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid #ccc; }
#container .topics_item_group_a_x { overflow: hidden; margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid #ccc; }
#container .topics_item_group_b { overflow: hidden; margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid #ccc; }
#container .topics_item_group_b_x { overflow: hidden; margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid #ccc; }
#container .topics_item_group_left { width: 47%; float: left; margin: 0px 8px 0px 0px; position: relative; }
#container .hizuke { font-size: 12px; margin: 0px; color: #333; }
#container .new { border: solid #c90027 1px; border-radius: 12px; color: #c90027; width:50%; font-size:12px; text-align: center; margin-right: 4px; }
#container .gentei { border: solid #c90027 1px; border-radius: 12px; color: #c90027; width:40%; font-size:12px; text-align: center; }
#container .topics_item_group_right { width: 48%; float: left; margin: 0px 0px 0px 8px; }
#container .name { color: #333; font-size: 12px; text-decoration: none; font-style: normal; font-weight: normal; line-height: 1.5; margin-bottom: 8px; }
#container .name_a { font-size: 14px; font-weight: bold; }
#container .offf {}
#container .off { background: #c90027; color: #ffffff; width: 50%; font-size: 14px; text-align: center; margin-bottom: 4px; }
#container .poff { color: #ffffff; font-size: 12px; }
#container .kikanContainer { font-size: 0; margin-top: 4px; }
#container .kikanbox { display: inline-block; }
#container .kakakuContainer { margin-bottom: 16px; text-align: right; }
#container .kakaku_a { color: #A0A0A0; font-size: 12px; }
#container .kakaku_b { color: #c90027; font-size: 26px; line-height: 1.2; font-weight: bold; }
#container .kakaku_c { color: #333; font-size: 26px; line-height: 1.2; font-weight: bold; }
#container .kakaku_b .pkakaku { color: #c90027; font-size: 12px; }
#container .kakaku_c .pkakaku { color: #333; font-size: 12px; }
/* カート */
#container .topics_button { margin: auto; padding: 8px 18px; font-size: 14px; line-height: 1.5; text-align: center; border: 1px solid #ccc; background-color: #fff; width: 100%; border-radius: 8px; }
#container .topics_button a { display: block; }

}

/*===============================================
●PC 画面の横幅が755px
===============================================*/
@media screen and (min-width:755px){
.pc { display: block !important; }
.sp { display: none !important; }
.campaign_header { padding: 18px; width: 1024px; margin: 0 auto; background: #c90027; margin-bottom: 18px; line-height: 2;}
#container .campaign_Title{ margin: 0px; padding: 0px; font-size:24px; color:#fff; font-weight:bold; width:320px; float:left; text-align:left; line-height:1.5; }
.campaign_header .text_a { margin:0px; padding:6px 0px 0px; color: #fff; }
/* アイテムごとに見る */
#topic_item_pickup { margin: 0px 0px 30px; padding: 0px; overflow: hidden; }
#container .topics_a { width: 253px; margin: 0px 4px 0px 0px; padding: 10px; font-size: 14px; font-weight: bold; color: #333; float: left;
display: inline; border: 1px solid #ccc; background: #ffffff; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; }
#container .topics_aa { width: 253px; margin: 0px; padding: 10px; font-size: 14px; font-weight: bold; color: #333; float: left; display: inline; border: 1px solid #ccc; background: #ffffff; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; }
#container .topics_a:hover { color: #FFF; text-decoration:none; border: 1px solid #ea5c7d; background: #ea5c7d; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; }
#container .topics_aa:hover { color: #FFF; text-decoration:none; border: 1px solid #ea5c7d; background: #ea5c7d; /* Old browsers */ text-align: center; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; }
#a01 { padding-top: 40px; margin-top: -40px; }
#b02 { padding-top: 40px; margin-top: -40px; }
#c03 { padding-top: 40px; margin-top: -40px; }
#d04 { padding-top: 40px; margin-top: -40px; }
#e05 { padding-top: 40px; margin-top: -40px; }
#f06 { padding-top: 40px; margin-top: -40px; }
#g07 { padding-top: 40px; margin-top: -40px; }
#h08 { padding-top: 40px; margin-top: -40px; }
#i09 { padding-top: 40px; margin-top: -40px; }
#j10 { padding-top: 40px; margin-top: -40px; }

/* アイテムカテゴリーコンテンツ */
#container .topics_box { overflow: hidden; }
#container .topics_title { margin: 0px 0px 16px 0px; padding: 8px 0px 8px 8px; font-size: 18px; font-weight: bold; color: #333; border-left: 15px solid #999; }
#container .topics_item_group_a { padding: 0px; margin: 0px 37px 80px 0px; float: left; width:228px; }
#container .topics_item_group_a_x { padding: 0px; margin: 0px 37px 119px 0px; float: left; width:228px; }
#container .topics_item_group_b { padding: 0px; margin: 0px 0px 40px 0px; float: left; width:228px; }
#container .topics_item_group_b_x { padding: 0px; margin: 0px 0px 118px 0px; float: left; width:228px; }
#container .topics_item_group_left { position: relative; }
#container .hizuke { font-size: 12px; margin: 0px; color: #333; }
#container .new { border: solid #c90027 1px; border-radius: 12px; color: #c90027; width:40%; font-size:12px; text-align: center; margin-right: 4px; }
#container .gentei { border: solid #c90027 1px; border-radius: 12px; color: #c90027; width:30%; font-size:12px; text-align: center; }
#container .topics_item_group_right {}
#container .name { color: #333; font-size: 12px; text-decoration: none; font-style: normal; font-weight: normal; line-height: 1.5; height:85px; }
#container .name_a { font-size: 14px; font-weight: bold; }
#container .offf { background: #ffffff; height: 24.39px; }
#container .off { background: #c90027; color: #ffffff; width: 30%; font-size:16px; text-align: center; height: 24.39px; }
#container .poff { color: #ffffff; font-size: 12px; }
#container .kikanContainer { font-size: 0; height: 24px; line-height: 1.8; }
#container .kikanbox { display: inline-block; }
#container .kakakuContainer { height: 42px;  text-align: right; }
#container .kakakubox { display: inline-block; }
#container .kakaku_a { color: #A0A0A0; font-size: 12px; padding-right: 10px; }
#container .kakaku_b { color: #c90027; font-size: 26px; line-height: 1.5; font-weight: bold; }
#container .kakaku_c { color: #333; font-size: 26px; line-height: 1.5; font-weight: bold; }
#container .kakaku_b .pkakaku { color: #c90027; font-size: 12px; }
#container .kakaku_c .pkakaku { color: #333; font-size: 12px; }
/* カート */
#container .topics_button { margin: auto; padding: 8px 18px; font-size: 14px; line-height: 1.5; text-align: center; border: 1px solid #ccc; background-color: #fff; width: 100%; border-radius: 8px; }
#container .topics_button a { display: block; }
#container .topics_button a:hover { text-decoration:none; color: #333; }
#container .topics_button:hover { background: #eee; text-decoration:none; }

}