/*------見出し------*/
.head1 {
background-color: #5e68ac;
border-bottom: 3px solid #d7d7d7;
color: #fff;
display: block;
font-size: 18px;
font-weight: bold;
margin: 0;
padding:0.7em 20px;
}

.head2 {
background-color: #efefef;
margin: 0px;
padding: 8px 20px 6px;
display: block;
font-size: 16px;
font-weight: bold;
}

.head3 {
border-left: 6px solid #5e68ac;
border-bottom: 1px solid #ccc;
color:#5e68ac;
margin: 0;
padding:0.5em 0.25em;
font-weight: bold;
line-height: normal;
}

.head3 span {
padding: 0 0.5em;
display: block;
font-size: 15px;
}

.head4 {
margin: 0px;
padding:1em 20px 0;
font-weight: bold;
line-height: normal;
font-size: 14px;
}


/*------商品一覧------*/
.SpItemList {
text-align:left;
display: block;
margin-bottom:0;
}

.SpItemList ul {
list-style: none;
display: block;
margin: 0;
padding: 0;
}

.border-btm-none {
border-bottom: none !important;
}

.border-btm{
border-bottom:1px solid #cccccc;
}

.border-tp{
border-top:1px solid #cccccc;
}

.SpItemList li {
border-bottom: solid 1px #ccc;
display: block;
position:relative;
}

.SpItemList li a,
.SpItemList li .inbox {
padding:1.25em 3em 1.25em 1.4em;
font-size:.8em;
display:block;
text-decoration: none;
color: #000000;
}

div.inbox {
padding:0.5em 0 0.5em 1.4em;
font-size:.8em;
display:block;
text-decoration: none;
color: #000000;
border-bottom:1px solid #cccccc;
}

.SpItemList li a:after{
background-image: url("../top/images/common/icons.png");
background-position: -21px -117px;
background-repeat: no-repeat;
display: inline-block;
font-size: 100%;
height: 16px;
line-height: normal;
margin-top: -8px;
overflow: hidden;
position: absolute;
right: 15px;
text-indent: 100%;
top: 50%;
width: 8px;
font-weight: bold;
content: "";
}

.SpItemList li > span,
.SpItemList li > a {
display: block;
position: relative;
text-decoration: none;
}

/*------商品リンクあり（タイトル・著者・紹介文・ジャンル）------*/
.title {
font-size: 14px;
font-weight: bold;
}
.day {
font-size: 13px;
}
.aside {
font-size: 11px;
line-height: 1.4;
}
.sp-t{
margin-top: 3em;
}

.sp-t1{
margin-top: 1em;
}

.genre {
background-color: #75c3f2;
font-size: 11px;
color: #fff;
display: inline-block !important;
margin-bottom: 4px;
padding: 2px 10px 1px;
}
.price {
color: #db2a2a;
font-size: 11px;
padding-top: 2px;
display: table-cell;
}

/*------著者一覧などのボタン------*/

.SpNaviBtn{
text-align:  center;
}

.NBtn,.NBSpace,.NBNone{
margin-bottom: 4%;
display: inline-block;
width: 16%;
border-radius: 5px;
line-height: 230%;
}

.NBtn a{
display: block;
text-decoration: none;
}

.NBtn a span{
color: #FFF;
}

.NBtn span{
font-size:1.1em;
}

.NBSpace{
color: #ffffff;
}

.NBNone{
background-color:#F5F5F5;
color: #ccc;
}

/*------ご利用ガイド用------*/
.txt{
padding:0.4em 20px 0.1em;
display:block;
font-size: 14px;
}

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

.txt div, .txt strong, .txt b{
font-size: 14px;
}

.txt a{
padding:0.3em;
font-size: 14px;
}

.subtxt{
background-color: #ffffff;
margin-top:1em;
padding:0.8em 1em;
font-size: 14px;
}

.subtxt .subtitle{
font-weight: bold;
line-height: 1.4;
/*border-bottom: 1px solid #ccc;
padding-bottom: 0.3em;
margin-bottom: 0.8em;*/
}

.text-indent {
padding-left: 0.5em;
}

.text-indent2 {
padding-left: 1.8em;
}

.inpagetxt ol {
margin: 0 20px 0 5px;
}

.inpagetxt ul {
margin: 0 20px 0 5px;
}

.inpagetxt li {
margin:0.4em 0 1em;
font-size: 14px;
}

.inpagetxt li span {
color:#000000;
font-size: 14px;
}

.inpagetxt li > span a {
display: inline-block;
padding:0.1em 0.3em;
}

.inpagetxt .txt {
padding: 10px 10px 10px 0 !important;
display:block;
font-size: 14px;
}

.txtH4 {
color:#FF8410;
font-size: 16px !important;
font-weight: bold;
line-height: normal;
}

.link-top{position:relative;border-bottom:none !important;}

.link-top a {
padding:0.75em 3em 0.75em 1.4em;
font-size:.8em;
display:block;
text-align: right;
text-decoration: none;
color: #293270;
}

.link-top a:after{
background-image: url("../top/images/common/icons.png");
background-position: -314px -117px;
background-repeat: no-repeat;
display: inline-block;
font-size: 100%;
height: 16px;
line-height: normal;
margin-top: -8px;
overflow: hidden;
position: absolute;
right: 18px;
text-indent: 100%;
top: 50%;
width: 18px;
content: "";
}

.link-down{position:relative;border-bottom: 1px solid #ccc;}

.link-down a {
padding:0.75em 3em 0.75em 1.4em;
font-size:.8em;
display:block;
text-align: right;
text-decoration: none;
color: #293270;
}

.link-down a:after{
background-image: url("../top/images/common/icons.png");
background-position: -267px -121px;
background-repeat: no-repeat;
display: inline-block;
font-size: 100%;
height: 8px;
line-height: normal;
margin-top: -4px;
overflow: hidden;
position: absolute;
right: 16px;
text-indent: 100%;
top: 50%;
width: 16px;
content: "";
}

.link-more{
background-color: #f2f2f2;
display: block;
position:relative;
}

.link-more a {
padding:0.75em 0;
font-size:.8em;
display:block;
text-align: center;
text-decoration: none;
color: #8f8f8f;
}

.link-more a:after {
background-image: url("../top/images/common/icons.png");
background-position: -21px -117px;
background-repeat: no-repeat;
display: inline-block;
font-size: 100%;
height: 16px;
line-height: normal;
margin-top: -8px;
overflow: hidden;
position: absolute;
right: 15px;
text-indent: 100%;
top: 50%;
width: 8px;
font-weight: bold;
content: "";
}

div.Qico{
margin: 0 1em;
padding: 0.5em 1.5em 0.5em 32px;
display:block;
background: url("../images/sp_icon_q.png") no-repeat 0 0.3em;
font-size: 14px;
}

div.Aico{
margin: 0 1em 1em;
padding: 0.5em 1.5em 0.5em 32px;
display:block;
background: url("../images/sp_icon_a.png") no-repeat 0 0.3em;
font-size: 14px;
}

.Qico span,.Aico span,.Qico a,.Aico a {
font-size: 14px;
}


.SpItemList li .Qico,.navi-list li .Qico{
/*margin: 0 0 0 -0.25em;*/
padding: 0.5em 0 0.5em 32px;
display:block;
background: url("../images/sp_icon_q.png") no-repeat 0 center;
line-height: 1;
}

.SpItemList li .Aico,.navi-list li .Aico{
/*margin: 0 0 0 -0.25em;*/
padding: 0.5em 0 0.5em 32px;
display:block;
background: url("../images/sp_icon_a.png") no-repeat 0 center;
line-height: 1;
}

.bg2Grey li a, .bg2Grey li .inbox {
padding: 0.6em 3em 0.6em 1.4em !important;
}

.bg2Grey li a span, .bg2Grey li .inbox span {
color: #000000 !important;
font-weight: bold;
}


/*------画像サイズ 80px------*/
.siz80 {
padding-right: 10px;
display: table-cell;
vertical-align:top;
width: 80px;
}
.siz80 img {
border: solid 1px #ccc;
width: 80px;
height: auto;
}

/*------画像サイズ 60px------*/
.siz60 {
padding-right: 10px;
display: table-cell;
vertical-align:top;
width: 60px;
}
.siz60 img {
border: solid 1px #ccc;
width: 60px;
height: auto;
}

.pic-group + .text-group {
display: table-cell;
vertical-align:top;
padding: 0;
width: 100%;
}
.text-group {
color: #333333;
display: block;
vertical-align: middle;
padding: 0;
}
.text-group > span {
white-space: normal;
word-wrap: break-word;
word-break: break-all;
display: block;
}

/*------ランキング------*/
.ranking-group {
  margin-top: 20px;
  text-align: left;
  display: block;
}
.ranking-group li.cell-group {
  line-height: normal;
  display: block;
}
.ranking-group li.cell-group + li.cell-group {
  border-bottom: solid 1px #d4d4d4;
}
.ranking-group li.cell-group > a {
  padding: 10px 33px 10px 0;
  font-size: 0;
  display: block;
  position: relative;
}
.ranking-group li.cell-group > a:after {
  content: "";
  background-image: url(../top/images/common/icons.png);
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  font-size: 100%;
  line-height: normal;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  color: transparent;
  background-position: -21px -117px;
  width: 8px;
  height: 16px;
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -8px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
  .ranking-group li.cell-group > a:after {
    background-image: url(../top/images/common/icons_2x.png);
    background-size: 400px auto;
    -webkit-background-size: 400px auto;
  }
}
.ranking-group li.cell-group > a .num-group,
.ranking-group li.cell-group > a .text-group {
  font-size: 14px;
  vertical-align: middle;
}
.ranking-group li.cell-group > a .text-group {
  color: #333333;
  display: block;
}
.ranking-group li.cell-group > a .num-group {
  margin-right: 5px;
  width: 50px;
  height: 50px;
  display: inline-block;
  font-size: 30px;
  font-weight: bold;
  line-height: 50px;
  text-align: center;
  color: #a9a8a8;
}
.ranking-group li.cell-group > a .num-group + .text-group {
  width: 75%;
  width: -webkit-calc(100% - 60px);
  width: calc(100% - 60px);
  display: inline-block;
}
.ranking-group li.cell-group > a .text-group .comment {
	margin-top: 0.5em;
  font-size: 11px;
	line-height:140%;
}

/*------テキストエリア------*/
textarea {
width: 100%;
height: 7em;
line-height: 1.5em;
}

/*------ナビボタンサンプル------*/
.navi-list {
	display: block;
	border-top: 1px solid #ccc;
	overflow: hidden;
	margin: 0 0 1em !important;
	padding: 0;
	list-style: none;
}

.navi-list li {
	float: left;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: -moz-linear-gradient(top,#FFF 0%,#F7F7F7);
	background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#F7F7F7));
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	display: block;
}

.navi-list li a {
	display: block;
	text-decoration: none;
	outline: none;
	padding: 12px 1.5em 12px 0.9em;
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	color: #333;
	line-height: 1;
}

.navi-list li.arrowS a { background: url("../images/sp_icon_s.png") no-repeat 90% center; }

.navi-list li.arrowM:after{
	background: url("../top/images/common/icons.png") no-repeat -21px -117px;
	display: inline-block;
	font-size: 100%;
	height: 16px;
	line-height: normal;
	margin-top: -8px;
	overflow: hidden;
	position: absolute;
	right: 10px;
	text-indent: 100%;
	top: 50%;
	width: 8px;
	content: "";
}

.navi-list li a span {
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	color: #333;
}

.navi-list .cell1 {
	width: 100%;
	border-right: none;
}

.navi-list .cell2 {
	width: 50%;
}

.navi-list .cell2:nth-child(2n) {
	border-right: none;
}

.navi-list .cell3 {
	width: 33%;
}

.navi-list .cell3:nth-child(3n) {
	border-right: none;
}

.navi-list li:nth-child(3n).cell3 {
	width: 34%;
}

.navi-list .cell4 {
	width: 25%;
	border-left: none;
}

.navi-list .cell4:nth-child(4n) {
	border-right: none;
}

.navi-list .cell5 {
	width: 20%;
	border-left: none;
}

.navi-list .cell5:nth-child(5n) {
	border-right: none;
}

.navi-list .cell5 a {
	padding: 12px 1.5em 12px 0.7em;
}
.navi-list .cell6 {
	width: 33.33333%;
	border-left: none;
}

.pagetop {
position: fixed;
bottom: 40px;
right: 10px;
z-index: 10;
background-color: #fff;
border: solid 1px #dcdcdc;
padding-top: 12px;
width: 48px;
height: 26px;
text-align: center;
display: block;
-webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
}
.pagetop span {
margin: 0 auto;
display: block;
}

.pagetop-arrow {
background-image: url("../top/images/common/page_arrow.png");
background-position: 0 0;
background-repeat: no-repeat;
width: 25px;
height: 15px;
vertical-align: middle;
display: inline-block;
*display: inline;
*zoom: 1;
font-size: 100%;
line-height: normal;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
color: transparent;
}


/*------検索フォーム------*/

.SpSch {
    background-color: #ffffff;
    overflow: hidden;
    padding: 0;
    position: static;
    width: 100%;
}

.SpSchFld {
    background-color: #1c2284;
    float: left;
    margin: 0;
    padding: 0.6em 0 0.2em;
    text-align: center;
    width: 100%;
}

.SpSchFld::after {
	clear: both;
	content: ".";
	display: block;
	font-size: 0;
	height: 0;
	visibility: hidden;
}

.SpSchFld a{
	border-radius: 4%;
	color: #fff;
	display: block;
	margin: 0 0 0 14%;
	padding: 3% 0 4%;
	text-decoration: none;
}
 
.SpSchFld a:hover{
	color:#ff0000;
}

.SpSchBtnBk:hover, .SpSchBtnWh:hover {cursor:pointer;}

.SpSchFix {
    margin: 0 auto;
    position: fixed;
    top: 0;
    z-index: 99;
}


#SpSchTxt {
    border: 0 none;
    border-radius: 4px;
    color: #565656;
    float: left;
    height: 30px;
    margin: 0 0 0 1.1em;
    padding: 0 0.4em;
    width: 80%;
}

.SpSchFix #SpSchTxt {
    width: 83%;
}

#SpSchSbm {
    border: 0 none;
    border-radius: 4px;
    float: left;
    font-size: 10px;
    height: 30px;
    margin: 0 0 1em 8px;
    width: 30px;
}

.SpSchBtnBk {background: url(../images/SpSearchIconBK.png) 30% 50% no-repeat;}
.SpSchBtnWh {background: url(../images/SpSearchIcon.png) 30% 50% no-repeat;}



/*------色見本------*/
.colorList {
	margin: 0 0 1em;
	padding: 0;
	list-style:none;
}

.colorList li {
	padding: 0.2em 1em;
}

.bgRed { background-color: #E53935; color:#fff; }
.bgPink { background-color: #D81B60; color:#fff; }
.bgPurple { background-color: #8E24AA; color:#fff; }
.bgDeepPurple { background-color: #5E35B1; color:#fff; }
.bgIndigo { background-color: #3949AB; color:#fff; }
.bgBlue { background-color: #1E88E5; color:#fff; }
.bgLightBlue { background-color: #03A9F4; color:#fff; }
.bgCyan { background-color: #00ACC1; color:#fff; }
.bgTeal { background-color: #00897B; color:#fff; }
.bgGreen { background-color: #43A047; color:#fff; }
.bgLightGreen { background-color: #7CB342; color:#fff; }
.bgLime { background-color: #C0CA33; color:#fff; }
.bgYellow { background-color: #FDD835; color:#fff; }
.bgAmber { background-color: #FFB300; color:#fff; }
.bgOrange { background-color: #FB8C00; color:#fff; }
.bgDeepOrange { background-color: #F4511E; color:#fff; }
.bgBrown { background-color: #6D4C41; color:#fff; }
.bgGrey { background-color: #757575; color:#fff; }
.bgBlueGrey { background-color: #546E7A; color:#fff; }
.bgBlack { background-color: #333; color:#fff; }

.bgRed span, .bgPink, .bgPurple, .bgDeepPurple, .bgIndigo, .bgBlue, .bgLightBlue, .bgCyan, .bgTeal, .bgGreen, .bgLightGreen, .bgLime, .bgYellow, .bgAmber, .bgOrange, .bgDeepOrange, .bgBrown, .bgGrey, .bgBlueGrey, .bgBlack { color:#fff; }

.bg2Red { background-color: #F9C6BE; color:#C62828; }
.bg2Pink { background-color: #F8C7D5; color:#AD1457; }
.bg2Purple { background-color: #E1BEE7; color:#6A1B9A; }
.bg2DeepPurple { background-color: #D1C4E9; color:#4527A0; }
.bg2Indigo { background-color: #C5CAE9; color:#283593; }
.bg2Blue { background-color: #BBDEFB; color:#1565C0; }
.bg2LightBlue { background-color: #B3E5FC; color:#0277BD; }
.bg2Cyan { background-color: #B2EBF2; color:#00838F; }
.bg2Teal { background-color: #B2DFDB; color:#00695C; }
.bg2Green { background-color: #C8E6C9; color:#2E7D32; }
.bg2LightGreen { background-color: #DCEDC8; color:#558B2F; }
.bg2Lime { background-color: #F0F4C3; color:#827717; }
.bg2Yellow { background-color: #FFF59D; color:#FA9A00; }
.bg2Amber { background-color: #FFE082; color:#FB8200; }
.bg2Orange { background-color: #FFE0B2; color:#EF6000; }
.bg2DeepOrange { background-color: #FFCCBC; color:#DA3704; }
.bg2Brown { background-color: #DED3CE; color:#4E342E; }
.bg2Grey { background-color: #efefef; color:#424242; }
.bg2BlueGrey { background-color: #CFD8DC; color:#37474F; }
.bg2Black { background-color: #DDD; color:#000; }

.bg2Red span { color:#C62828; }
.bg2Pink span { color:#AD1457; }
.bg2Purple span { color:#6A1B9A; }
.bg2DeepPurple span { color:#4527A0; }
.bg2Indigo span { color:#283593; }
.bg2Blue span { color:#1565C0; }
.bg2LightBlue span { color:#0277BD; }
.bg2Cyan span { color:#00838F; }
.bg2Teal span { color:#00695C; }
.bg2Green span { color:#2E7D32; }
.bg2LightGreen span { color:#558B2F; }
.bg2Lime span { color:#827717; }
.bg2Yellow span { color:#FA9A00; }
.bg2Amber span { color:#FB8200; }
.bg2Orange span { color:#EF6000; }
.bg2DeepOrange span { color:#DA3704; }
.bg2Brown span { color:#4E342E; }
.bg2Grey span { color:#424242; }
.bg2BlueGrey span { color:#37474F; }
.bg2Black span { color:#000; }

.txtRed { color:#E53935; }
.txtPink { color:#D81B60; }
.txtPurple { color:#8E24AA; }
.txtDeepPurple { color:#5E35B1; }
.txtIndigo { color:#3949AB; }
.txtBlue { color:#1E88E5; }
.txtLightBlue { color:#03A9F4; }
.txtCyan { color:#00ACC1; }
.txtTeal { color:#00897B; }
.txtGreen { color:#43A047; }
.txtLightGreen { color:#7CB342; }
.txtLime { color:#AFB42B; }
.txtYellow { color:#FDD835; }
.txtAmber { color:#FFA000; }
.txtOrange { color:#FB8C00; }
.txtDeepOrange { color:#F4511E; }
.txtBrown { color:#6D4C41; }
.txtGrey { color:#757575; }
.txtBlueGrey { color:#546E7A; }
.txtBlack { color:#000; }






/*------ボーダーカラー（カテゴリ別）------*/
.bdlAmber { border-left: 0.4em solid #FFB300; }
.bdlDeepOrange { border-left: 0.4em solid #F4511E; }
.bdlPink { border-left: 0.4em solid #D81B60; }
.bdlPurple { border-left: 0.4em solid #8E24AA; }
.bdlGreen { border-left: 0.4em solid #C8E6C9; }
.bdlCyan { border-left: 0.4em solid #00ACC1; }