@charset "utf-8";
/* CSS Document */

/* Edgeのパスワード入力欄に表示される目玉の非表示 */
input::-ms-reveal {
	display: none;
}

::placeholder {
	color: #aaa;
}

body{
	font: 14px/1.6 Helvetica, YuGothic, "Hiragino Kaku Gothic Pro", メイリオ, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	margin:0;
	color:#000000;
	overflow: hidden;
}

/* @group common */

.onlySP {
	display: none;
}

img{
	outline:none;
	border-style:none;
}

a img:hover {
	opacity: 0.5;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

a{
  color:#333;
	text-decoration: none;
}
a:visited{
  color:#333;
}
a:hover {
  color:#999;
}

.alignleft {
	float: left;
}
.alignright   {
	float: right;
}
.aligncenter {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	display: table;
}

.clear {
	clear: both;
}

.hide {
	display: none;
}

p {
	margin-bottom: 20px;
}

h1 {
	margin: 0;
	padding: 0;
}

h2 {
	font-size: 22px;
	color: #000;
}

h3 {
	font-size: 18px;
	color: #000;
}

h4 {
	font-size: 16px;
	margin-top: 30px;
	margin-bottom: 20px;
	color: #000;
}

h5 {
	font-size: 14px;
	margin-bottom: 6px;
	margin-top: 20px;
	color: #000;
}

h6 {
	font-size: 14px;
	color: #000;
}

.breadcrumb {
	font-size: 12px;
	margin-bottom: 40px;
	color: #666;
}

.breadcrumb a{
	text-decoration: underline;
	margin-right: 12px;
}

.breadcrumb .divider:after {
	content:"/";
	margin-right: 12px;
}

a.pdf {
	padding-left: 20px;
	background: url(/img/pdf-35ab4b864e543b4c3bf5d4f3daef5a91.png) 0 center no-repeat;
	background-size: 12px 16px;
}

a.blank {
	padding-left: 20px;
	background: url(/img/blank-80b2bfa36491029251b214b1e1f44d42.png) 0 center no-repeat;
	background-size: 14px 11px;
}

article {
	padding-top: 180px;
}

@media screen and (max-width: 640px){
	article {
		padding-top: 160px;
	}
}

/* @end */

/* @group header */

header {
  width: 100%;
  padding: 25px 0 0;
  position: fixed;
  margin: 0;
  left: 0;
  top: 0;
  z-index: 10;
  background-color: #fff;
  height:auto;
}

@media screen and (min-width: 641px) {
  header {
    transition:all .3s;
  }

  .fixed header {
    padding: 5px 0 0;
    box-shadow:0 3px 8px -5px rgba(0, 0, 0, .4);
  }
}

header .headerInner {
	width: 94%;
	margin-right: auto;
	margin-left: auto;
	min-width: 960px;
}

@media screen and (min-width: 641px) {
    header #main-menu {
      transition:all .3s;
    }

    .fixed header #main-menu {
      margin-top:0;
    }
}

header .headerSub {
	margin-bottom: 2px;
	float: right;
	position: relative;
	z-index: 200;
}

header .headerSub #search {
	position: relative;
	width: 220px;
	height: 40px;
	float: left;
	margin-right: 20px;
}

header .headerSub input#searchBox {
	height: 40px;
	padding: 0 30px 0 10px;
	position:absolute;
	left:0;
	top:0;
	border-radius:20px;
	outline:0;
	border: 1px solid #d3d3d3;
	width: 220px;
	font-size: 12px;
}

header .headerSub button#searchButton {
	height:30px;
	border:none;
	font-size:13px;
	position: absolute;
	right: 5px;
	padding-left: 7px;
	line-height: 13px;
	top: 5px;
	padding-right: 7px;
	width: 20px;
    background-image: url(/img/search-icon-771cd86672130870c0ebabb924a9c5ec.svg);
    background-size: 60%;
    background-position: center;
}

.headerInner .searchSp {
	background-color: #ededed;
	padding: 10px 2%;
	border-top: 1px solid #d3d3d3;
}
header .searchSp form#searchSP {
	padding: 10px 40px 10px 10px; 
	position: relative;
	left:0;
	top:0; 
	border-radius:30px;
	outline:0;
	border: 1px solid #d3d3d3;
	width: 100%;
	-webkit-appearance: none;
	font-size: 16px;
	background-color: white;
}

header .searchSp button#searchButtonSP {
	height: 36px;
	border:none;
	font-size:16px;
	position: absolute;
	padding-left: 10px;
	top: 1px;
	right: 8px;
	padding-right: 10px;
	width: 30px;
    background-image: url(/img/search-icon-771cd86672130870c0ebabb924a9c5ec.svg);
    background-size: 60%;
    background-position: center;
}

header .headerSub #member {
	float: right;
	color: #fff;
	font-size: 12px;
	line-height: 12px;
	height: 50px;
}

header .headerMain {
	clear: both;
	display: inline-block;
	width: 100%;
	position: relative;
	z-index: 100;
}

header .logo {
	width: 300px;
	float: left;
}

@media screen and (min-width: 641px) {
    header .logo {
        transition:all .3s
    }

    .fixed header .logo {
        margin-top:-40px
    }
}

header .logo a {
	display: block;
	line-height: 0;
}

header .logo h1 img {
	width: 300px;
	height: auto;
}

header .headerText p {
	font-size: 12px;
	margin-bottom: 0;
	margin-top: 10px;
    line-height: 100%;
}

header .headerText img {
	height: 14px;
	position: relative;
	top: 2px;
	margin-right: 8px;
}

/* モーダル */
div.modal div.modal-content {
	padding: 0;
}
div.modal div.modal-header {
	padding: 1em 0 0.5em 2em;
}
div.modal div.modal-title {
	font-weight: bold;
	font-size: large;
	display: inline-block;
}
div.modal div.modal-body {
	padding: 0.5em 0 0 1em;
}
div.modal div.modal-footer {
	padding: 0.5em 2em 0.5em 0;
}
.modalBtn {
	padding-left: 1em !important;
	padding-right: 1em !important;
}

/* 会員メニュープルダウン */
#member ul.pulldown{
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-size: 14px;
}
#member ul.pulldown > li{
	float: left;
	position: relative;
	width: 50px;
	display: block;
	height: 50px;
	color: #000;
}

.headerMenu {
	width: 50px;
	height: 50px;
}

.headerMenu:hover {
	opacity: 0.5;
	transition: 200ms;
}

#member ul.child{
	list-style-type: none;
	display: none;
	position: absolute;
	margin-left: -70px;
	padding: 0;
	top: 50px;
	left: 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 3px 6px #999;
	width: 120px;
	overflow: hidden;
}

#member ul.child li {
	padding: 10px 12px;
}

#member ul.child li:first-child {
	padding: 20px 12px 10px;
}

#member ul.child li:last-child {
	padding: 10px 12px 20px;
}

#member ul.child li a{
	display: block;
	margin: 0;
}

#member ul.child li.headerMenuOld {
	background-color: #eee;
}

#member ul.child li .menuTitle {
	text-align: center;
	display: block;
	color: #666;
	margin-top: 4px;
}

/* @end */

/* @group footer */

footer {
	width: 100%;
	background-color: black;
	float: left;
	padding-top: 40px;
	padding-bottom: 12px;
	margin-top: 60px;
}

footer .footerInner {
	width: 94%;
	margin-right: 3%;
	margin-left: 3%;
	min-width: 960px;
}

footer a,
footer a:visited {
	color: white;
}

footer .footerMain {
	width: 100%;
	display: flex;
	margin-bottom: 0px;
	justify-content: space-between;
}

footer .footerSub {
	width: 100%;
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #666;
	padding-top: 20px;
	margin-top: 10px;
}

.footerMain .footerLeft ,
.footerSub .footerLeft {
	width: 100%;
}

.footerMain .footerRight, .footerSub .footerRight {
	width: 40%;
	color: white;
}

footer ul {
	float: left;
	width: 30%;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

footer li {
	list-style-type: none;
	margin-bottom: 18px;
	font-size: 12px;
	padding-left: 12px;
	position: relative;
	padding-top: 2px;
}

footer li::before{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
	left: 0px;
	width: 5px;
	height: 5px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

footer .footerTwitter, 
footer .footerInstagram,
footer .footerYouTube {
	font-size: 12px;
	margin-bottom: 20px;
	font-weight: bold;
	line-height: 1;
	float: left;
	clear: both;
	position: relative;
	padding-left: 20px;
}

footer .footerTwitter::before{
	content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    vertical-align: middle;
    background-color: white;
    -webkit-mask-image: url(/img/twitter-29f82eecc5182b6720bc92dedf015f43.svg);
    mask-image: url(/img/twitter-29f82eecc5182b6720bc92dedf015f43.svg);
	position: absolute;
	top: 4px;
	left: 0;
}

footer .footerInstagram::before{
	content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    vertical-align: middle;
    background-color: white;
    -webkit-mask-image: url(/img/instagram-8c8d6c11ca969aca1647b9d0dc816aa3.svg);
    mask-image: url(/img/instagram-8c8d6c11ca969aca1647b9d0dc816aa3.svg);
	position: absolute;
	top: 4px;
	left: 0;
}

footer .footerYouTube::before{
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	vertical-align: middle;
	background-color: white;
	-webkit-mask-image: url(/img/youtube-a9d878c5ebfd7bceb7de627a87288609.svg);
	mask-image: url(/img/youtube-a9d878c5ebfd7bceb7de627a87288609.svg);
	position: absolute;
	top: 4px;
	left: 0;
}

footer a:hover .footerTwitter,
footer a:hover .footerInstagram,
footer a:hover .footerYouTube {
	opacity: 0.5;
}

footer .snsAccount {
	color: #999;
	font-size: 10px;
}

footer .footerLogo img{
	width: 140px;
	filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(360deg) brightness(103%) contrast(101%);
}

footer address {
	font-size: 10px;
	font-weight: normal;
	font-style: normal;
}

/* @end */

/* @group index */

.indexContents section{
	padding-top: 60px;
}

section.newArrival,
section.Recently{
	background-color: #f7f7f7;
	padding-bottom: 60px;
	margin-top: 60px;
}

.ContentsWidth {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
}

h2.indexTitle {
	background: url(/img/indexTitle-b850ee2e2f69fc14b19911d0e878de21.svg) left 0px top 6px no-repeat;
	background-size: 20px;
	padding-left: 40px;
	font-size: 20px;
	margin-bottom: 40px;
	font-weight: bold;
	line-height: 1.5;
}

/* ホバーで本タイトル表示 */
.newArrival li.slick-slide a,
.ranking li.slick-slide a,
.Recently li.slick-slide a {
	position: relative;
	display: block;
}

a .item-info {
	top: 0;
	left: 0;
	width: 100%;
	background-color: rgba(0,0,0,0.7);
	z-index: 10;
	line-height: 1.4;
	color: #fff;
	height: 100%;
	font-size: 12px;
	opacity: 0;
	position: absolute;
}

a:hover .item-info {
	opacity: 1;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

.item-info p {
	margin: 5%;
	display: inline-block;
	height: 90%;
	overflow: hidden;
}

.item-info .title {
	font-weight: bold;
	display: block;
	margin-bottom: 10px;
}

.item-info .data {
	display: block;
}

.slick-track p {
	font-size: 12px;
	margin-bottom: 5px;
	margin-top: 5px;
}

/* ホバーで本タイトル表示ここまで*/
/* 深い知識と、美しい本への誘い*/
.indexCategory .indexCateOuter {
	display: flex;
    flex-wrap: wrap;
	margin-bottom: 40px;
}

.indexCategory .indexCate {
	display: flex;
	width: 192px;
	position:relative;
	margin-bottom: 24px;
}

.indexCate:hover {
	opacity: 0.5;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

.indexCate .CategoryThum {
	width: 60px;
	height: 60px;
}

.indexCate .CategoryThum img {
	border: 1px solid #efefef;
	width: 100%;
}

.indexCate .CategoryThum img:hover {
	opacity: 1;
}

.indexCate .indexCateName {
	font-weight: bold;
	display: grid;
    place-items: center left;
	padding-left: 10px;
	line-height: 19px;
}
/* 深い知識と、美しい本への誘いここまで*/
/* 雑誌のご案内*/
.MagazineOuter {
    display: flex;
}

.indexMagazine .MagazineBox {
	width: 450px;
	display: flex;
}

.indexMagazine .MagazineBox:first-child {
	margin-right: 40px;
}

.indexMagazine .MagazineBox img,
.pickUp .pickUpImg img{
	width: 240px;
	margin-right: 40px;
	border: 1px solid #efefef;
}

.indexMagazine .MagazineBox .MagaText p {
	font-size: 18px;
	font-weight: bold;
}

.indexMagazine .MagazineBox .MagaText p.MagaDetail
{
	font-size: 14px;
	line-height: 20px;
	font-weight: normal;
}

.btnRed {
	border: 1px solid #cc1919;
	color: #cc1919;
	font-weight: bold;
	width: 100%;
	padding: 11px;
	background: url(/img/arrowRed-f14b14e10f8cfa0c6b6afdaa104e2dfa.png)  no-repeat;
	background-size: 17px;
	background-position:right 15px center;
	}

.btnRed:hover {
	opacity: 0.5;
}
/* 雑誌のご案内ここまで*/
/* 話題の本*/
.pickUpBox {
    border: 1px solid #d6d6d6;
	display: flex;
	margin-bottom: 80px;
}

.pickUpInner  {
	width: 50%;
	position: relative;
	height: auto;
}

.pickUp .pickUpTitle {
    background-color: #d6d6d6;
    width: 50%;
	height: 100%;
	padding-top: 40px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -10;
}

.pickUp .pickUpTitle h2{
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    padding-left: 25%;
}

.pickUpImg {
	padding-top: 40px;
	padding-left: 145px;
	padding-bottom: 40px;
}

.pickUpText p {
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 0;
	margin-top: 40px;
	margin-right: 40px;
}

 p.pickUpStyle1 {
	font-weight: normal;
	font-style: normal;
 	padding-top: 0;
 	margin-top: 0;
 }

p.pickUpStyle2 {
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
	margin-bottom: 40px;
}

.pickUpCopy {
	background-image: url(/img/markL-72760bbb797744f66a0c290c11145e7d.png) ,
	url(/img/markR-6c54a7a6c83e28d56d23b4224cc02284.png);
	background-position:left top, right bottom;
	background-repeat: no-repeat,no-repeat;
	background-size: 22px;
	margin-right: 40px;
}

.pickUpCopy p {
	text-align:justify;
	margin-top: 40px;
	margin-bottom: 40px;
	padding: 25px;
	margin-right: 0;
}

.pickUpInner .btnRed {
	width: 180px;
	float: right;
	margin-right: 40px;
	margin-bottom: 40px;
}
/* 話題の本ここまで*/
/* ランキング*/
h2.rankingTitle {
	background: url(/img/rankingTitle-76ce9293bd8f633ad9946ccd73c67a94.svg) left 0px top 6px no-repeat;
	background-size: 21px;
	padding-left: 40px;
	font-size: 20px;
	margin-bottom: 40px;
	font-weight: bold;
	line-height: 1.5;
	 margin-right: calc(50% - 50vw);
	 border-bottom: 2px solid #d6d6d6;
	padding-bottom: 5px;
}

.rankingNo {
	width: 30px;
	height: 30px;
	font-weight: bold;
	color: white;
	background-color: black;
	text-align: center;
	line-height: 30px;
	font-size: 14px;
	margin-bottom: 5px;
}

.rankingNoRed {
	background-color: #cc1919;
}

section.ranking {
	margin-bottom: 20px;
}
/* ランキングここまで */
/* 最近見た商品 */
.Delete {
	margin-top: 5px;
	width: 21px;
	height: 21px;
	display: inline-block;
	border: 1px solid black;
	cursor: pointer;
	position: relative;
}

.Delete:hover {
	opacity: 0.5;
}

.Delete span::before,
.Delete span::after {
	display: block;
	content: "";
	position: absolute;
	width: 13px;
	height: 1px;
	background: black;
	top: 9px;
	left: 3px;
}

.Delete span::before {
	transform: rotate(-45deg);
}

.Delete span::after {
	transform: rotate(45deg);
}

.Recently .RecentlyTitle  {
	position: relative;
}

.allDelete {
	position: absolute;
	top: 0;
	right: 50px;
	display: inline-block;
	border: 1px solid black;
	cursor: pointer;
	padding: 7px 35px 7px 10px;
	font-size: 12px;
	line-height: 12px;
}

.allDelete:hover {
	opacity: 0.5;
}

.allDelete span::before,
.allDelete span::after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 8px;
	width: 13px;
	height: 1px;
	background: black;
}

.allDelete span::before {
	transform: rotate(-45deg);
}

.allDelete span::after {
	transform: rotate(45deg);
}
/* 最近見た商品ここまで */
/* バナー */
.bannerArea.ContentsWidth img {
	width: 470px;
	height: 140px;
	margin-bottom: 20px;
}

.bannerArea.ContentsWidth {
	display: flex;
	justify-content: space-between;
	flex-wrap:wrap;
}

/* @end */

/* @group list */

.detail ,
.searchList ,
.form  ,
.newsList,
.newsDetail,
.subscription,
.mypage,
.login{
	width: 960px;
	margin: auto;
}

/*左カラム*/
.searchList .sideBar {
	width: 240px;
	background-color: #f7f7f7;
	padding: 20px 20px 0;
	margin-right: 40px;
	float: left;
}

.listCate:hover {
	opacity: 0.5;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

.listCate {
	display: flex;
	position:relative;
	margin-bottom: 11px;
}

.listCate .CategoryThum {
	width: 40px;
	height: 40px;
}

.listCate .CategoryThum img {
	border: 1px solid white;
	width: 100%;
}

.listCate .CategoryThum img:hover {
	opacity: 1;
}

.listCateName {
	font-weight: bold;
	display: grid;
  place-items: center left;
	padding-left: 10px;
}

/*左カラムここまで*/
/*右カラム*/

.searchList .listWrapper {
	width: 680px;
	margin-bottom: 0px;
	float: left;
}

/*右カラムタイトルエリア*/

.searchList .listTitle {
	font-size: 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid #9e9e9e;
	display: flex;
	margin-bottom: 40px;
}

.searchList .listTitle h2 {
	font-size: 14px;
	width: 100%;
	padding-right: 20px;
  display: grid;
  place-items: center left;
}

.searchList .listBtnWrapper {
	width: 78px;
	bottom: 13px;
	display: flex;
	padding-top: 6px;
}

.searchList .listBtn {
	height: 19px;
	width: 19px;
	margin-left: 20px;
	opacity: 1;
}

.searchList a .listBtn {
	opacity: 0.2;
}

.searchList a:hover .listBtn {
	opacity: 1;
}

/* サブリスト */

.narrowing {
	position: relative;
}

.narrowing summary {
	white-space:nowrap;
	border: 1px solid #9e9e9e;
	padding: 5px 10px 5px 25px;
	cursor: pointer;
	display: block; /* 矢印を消す */
	position: relative;
}

.narrowing summary:hover {
	background-color: #efefef;
}

.narrowing summary::-webkit-details-marker {
  display: none; /* 矢印を消す */
}

.narrowing summary:after {
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.narrowing summary:after {
  content: '';
  width: 7px;
  height: 7px;
  border-top: solid 1px #333333;
  border-right: solid 1px #333333;
  position: absolute;
	transform: rotate(135deg);
	top: -4px;
	left: 10px;
}

.narrowing details[open] summary:after {
  transform: rotate(315deg);
	top: 5px;
}

.narrowingMenuWrapper  {
	position: absolute;
	right: 0px;
	top: 35px;
}

ul.narrowingMenu {
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	padding: 0;
	width: 360px;
	padding: 20px;
	display: flex;
	flex-wrap: wrap;
	border: 1px solid #bbbbbb;
	background: #fff;
	border-radius: 5px;
	margin-top: 14px;
	list-style: none;
}

ul.narrowingMenu li {
	width: 50%;
	min-width: 0;
}

ul.narrowingMenu li a,
.subList ul li a {
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 4px center no-repeat;
	background-size: 4px 7px;
	padding-left: 12px;
	padding-bottom: 8px;
	padding-top: 8px;
	font-size: 14px;
	display: block;
	line-height: 22px;
}
.subList p {
	font-weight: bold;
}
.subList {
	background: #f7f7f7;
	padding: 40px;
	margin-top: 60px;
}
.subList ul{
	display: flex;
	flex-wrap: wrap;

}

.subList ul li{
	list-style: none;
	width: 33%;
}
.searchList .indexCateOuter {
	display: none;
}




@media screen and (min-width: 641px){

ul.narrowingMenu::before,
ul.narrowingMenu::after {
	content: '';
	position: absolute;
	top: -4px;
	width: 0;
	height: 0;
	overflow: hidden;
	border-width: 9px;
	border-style: dashed dashed solid dashed;
	border-color: transparent transparent #bbbbbb transparent;
	right: 60px;
}

 ul.narrowingMenu::after {
	top: -1px;
	border-width: 8px;
	border-color: transparent transparent #fff transparent;
	right: 61px;
 }
}

/*ボックス表示*/

.searchList .listBox a:hover {
	opacity: 1;
}

.searchList .listBox {
	display: flex;
	flex-wrap:wrap;
	align-items:flex-end;
}

.searchList .listBox .item {
	margin-bottom: 30px;
	margin-right: 40px;
	margin-bottom: 11px;
	margin-right: 40px;
	font-size: 12px;
	line-height: 18px;
	width: 140px;
}

.searchList .listBox .item p {
	margin-bottom: 5px;
}

.searchList .listBox .item:nth-child(4n) {
     margin-right: 0px;
}

.itemImgWrapper {
	display:flex;
    flex-flow: column;
}

.searchList .listBox .itemImg {
    margin-bottom: 10px;
}

.searchList .listBox .item a:hover .itemImg {
	opacity: 0.5;
}

.searchList .listBox .itemImg img{
	border: 1px solid #efefef;
	width: 140px;
}

.format {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 4px;
	height: 19px;
}

/*ライン表示*/

.searchList .listLine a img:hover {
	opacity: 1;
}

.searchList .listLine .item {
	overflow: hidden;
	margin-bottom: 20px;
	border-bottom: 1px solid #efefef;
	padding-bottom: 20px;
	display: flex;
}

.searchList .listLine .item a {
	display: inline-block;
}

.searchList .listLine .item a:hover {
	opacity: 0.5;
}

.searchList .listLine img {
	width: 120px;
	float: left;
	margin-right: 20px;
}

.searchList .listLine .itemInner {
	overflow: hidden;
}

.searchList .listLine .itemTitle {
	font-size: 16px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #000;
}

.searchList .listLine .itemWriter {
	font-size: 14px;
	margin-bottom: 10px;
	line-height: 22px;
	color: #333;
}

.searchList .listLine .itemSummary {
	font-size: 14px;
	line-height: 22px;
	color: #333;
	margin-bottom: 10px;
}

.pager {
	margin-right: auto;
	margin-left: auto;
	display: table;
	text-align: center;
	clear: both;
	padding-top: 20px;
}

.pager ul {
	float: left;
	padding-left: 0;
}

.pager li {
	list-style: none;
	float: left;
	margin-right: 6px;
	margin-top: 3px;
	margin-left: 6px;
	text-align: center;
}

.pager li a {
	display: inline-block;
	width: 20px;
	padding-bottom: 2px;
}

.pager .arrowL ,
.pager .arrowR {
	float: left;
}
.pager .arrowL a {
	width: 30px;
	height: 30px;
	border: 1px solid #9e9e9e;
	background: url(/img/arrow_end-df64e4f4f63953310d28bbf701e3990e.svg) center center no-repeat;
	background-size: 7px 7px;
	transform: scale(-1, 1);
	margin-right: 10px;
	float: left;
}

.pager .arrowR a {
	width: 30px;
	height: 30px;
	border: 1px solid #9e9e9e;
	background: url(/img/arrow_end-df64e4f4f63953310d28bbf701e3990e.svg) center center no-repeat;
	background-size: 7px 7px;
	margin-left: 10px;
	float: left;
}

.pager .arrowL a:hover ,
.pager .arrowR a:hover {
	background-color: #efefef;
}

.pager .location {
	border-bottom: 1px solid #000;
	width: 20px;
	padding-bottom: 2px;
}

/* @end */

/* @group detail */

/*左カラム*/

.detail .detailLeftBox {
	float: left;
	font-size: 12px;
	width: 260px;
	margin-right: 40px;
}

.detail .detailLeftBox .detailPh img {
	border: 1px solid #efefef;
	width: 260px;
	margin-bottom: 20px;
}

.detailLeftBox .thumBox {
	margin-right: -10px;
	overflow: hidden;
	margin-bottom: 22px;
}

.detail .detailLeftBox .thumPh {
	width: 80px;
	border: 1px solid #efefef;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.detail  .detailLeftBox .detailTable {
	width: 260px;
	background-color: #efefef;
	text-align: left;
	padding: 10px 15px;
	line-height: 20px;
	margin-bottom: 30px;
	border-collapse: initial;
}

.detail  .detailLeftBox .detailTable th {
	white-space: nowrap;
	padding-right: 20px;
	padding-top: 4px;
	padding-bottom: 4px;
	width: 80px;
}

.detail .detailLeftBox a .sample {
	background-color: #333;
	height: 36px;
	float: left;
	color: white;
	width: 160px;
}

.detail .detailLeftBox a:hover .sample {
	opacity: 0.5;
}

.detail .detailLeftBox .sampleInner {
	background: url(/img/sample-967d1b8447ba2afe1ae25355ea9825a8.svg) left 30px top 9px no-repeat;
	background-size: 14px;
	padding-left: 40%;
	padding-top: 9px;
}

.detail .detailLeftBox .support {
	padding-top: 9px;
	height: 30px;
	float: right;
	width: 160px;
}

.detail .detailLeftBox .support a {
	height: 30px;
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) left center no-repeat;
	background-size: 4px;
	padding-left: 10px;
	white-space: nowrap;
}

/* @group 購入 */

.ecStore {
	width:100%;
}

.ecStore p {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 0px;
}

.ecStore .ecStoreFrame {
	width:100%;
	border: 2px solid #23ABDD;
	border-radius: 10px;
	margin-top: 10px;
	padding-top: 14px;
	padding-bottom: 14px;
	display: inline-block;
}

.ecStore .ecStoreFrame p {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 0px;
	text-align: center;
}

.ecStore .price {
	font-size: 24px;
	color: #EE0000;
	font-weight: bold;
	display: inline-block;
}

.ecStore .price .priceYen {
	font-size: 14px;
}

.ecStore .price .priceTax {
	font-size: 14px;
	color: #000;
}

.ecStore .ecStoreInner {
	margin: 10px 5%;
	width: 90%;
}

.ecStore .pointNum {
	color: #EE0000;
}

.ecStore .schedule {
	text-align: center;
	border-style: solid;
	border-width: 1px;
	padding: 2px;
	margin-top: 4px;
	font-size: 14px;
}
.ecStore .ecStoreTable th {
	text-align: left;
	padding-right: 5px;
	white-space: nowrap;
}

.ecStore .teiki {
	margin-bottom: 12px;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	margin-top: 15px;
	border-top: 1px solid #ccc;
	padding-top: 15px;
}

.cartBtn {
	font-size: 16px;
	height: 50px;
	background: url(/img/i_cart_w-752066a34d677468fb2ed0f2cfbee44e.png) 14px center no-repeat;
	background-size: 26px;
	background-color: #23ABDD;
	color: white;
	transition: 200ms;
	font-weight: bold;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
	border-radius: 6px;
	padding-left: 10%;
}
@media screen and (max-width: 640px){
	.cartBtn {
		padding-left: 3%;
		height: 60px;
		font-size: 18px;
	}
}
.cartBtn:hover {
	opacity: 0.5;
}

.yoyakuBtn {
	font-size: 16px;
	height: 50px;
	background: url(/img/i_cart_w-752066a34d677468fb2ed0f2cfbee44e.png) 14px center no-repeat #ff9900;
	background-size: 26px;
	color: white;
	transition: 200ms;
	font-weight: bold;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
	border-radius: 6px;
	padding-left: 10%;
}
@media screen and (max-width: 640px){
	.yoyakuBtn {
		padding-left: 3%;
		height: 60px;
		font-size: 18px;
	}
}
.yoyakuBtn:hover {
	opacity: 0.5;
}

.discontinuedBtn {
	font-size: 16px;
	height: 50px;
	background: url(../img/_cart_w.png) 14px center no-repeat #999;
	background-size: 26px;
	color: white;
	transition: 200ms;
	font-weight: bold;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
	border-radius: 6px;
	padding-left: 10%;
}
@media screen and (max-width: 640px){
	.discontinuedBtn {
		padding-left: 3%;
		height: 60px;
		font-size: 18px;
	}
}
.discontinuedBtn:hover {
	opacity: 0.5;
}

.teikiBtn {
	font-size: 16px;
	height: 50px;
	background: url(/img/i_book_w-4f8dbd7e81cfbf41306923fe99398c0a.svg) 15px center no-repeat;
	background-size: 22px;
	background-color: #23ABDD;
	color: white;
	transition: 200ms;
	font-weight: bold;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
	border-radius: 6px;
	padding-left: 10%;
}
@media screen and (max-width: 640px){
	.teikiBtn {
		padding-left: 3%;
		height: 60px;
		font-size: 18px;
	}
}
.teikiBtn:hover {
	opacity: 0.5;
}

.netStore {
	margin-top: 30px;
	display: inline-block;
}

.netStore p {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 0px;
}

.netStore a {
	margin-top: 10px;
	display: inline-block;
	float: left;
	width: 115px;
}

.netStore a:nth-child(odd) {
	float: right;
}

.netStore img {
	display: block;
	border: 1px solid #ccc;
	width: 115px;
	height: 50px;
}
@media screen and (max-width: 640px){
	.netStore a {
		margin-top: 10px;
		display: inline-block;
		float: left;
		width: 48%;
	}
	.netStore img {
		display: block;
		border: 1px solid #ccc;
		width: 100%;
		height: auto;
	}
}

/* @end */

/*右カラム*/

.detail .detailRightBox {
	overflow: hidden;
	width: 380px;
	float: left;
}

.detail .detailRightBox a img:hover {
	opacity: 1;
}

.detail  h2 {
	line-height: 32px;
	padding-bottom: 10px;
	color: #000;
	border-bottom: 1px solid black;
	margin-bottom: 30px;
}

.detail .detailLeftBox h2 {
	display: none;
}

.detail h3 {
	margin-bottom: 30px;
	color: #000;
	margin-top: 40px;
	border-top: 1px solid #efefef;
	padding-top: 20px;
}

.detail .detailText {
	color: #666;
	line-height: 22px;
}

.detail .detailText h3:first-of-type  {
	margin-top: 0px;
	border-top: 0px solid #efefef;
	padding-top: 0;
}

.detail .detailRightBox .item {
	font-size: 12px;
	line-height: 18px;
	margin-right: 33px;
	margin-bottom: 30px;
	width: 120px;
	float: left;
}

.detail .detailRightBox .item p {
	margin-bottom: 0;
}

.detail .detailRightBox .item a:hover .itemImgWrapper {
	opacity: 0.5;
}

.detail .detailRightBox .item:nth-child(4n) {
	margin-right: 0px;
}

.detail .detailRightBox .item:nth-child(4n+1) {
	clear: both;
}

.detail .detailRightBox .itemImgWrapper {
	margin-bottom: 10px;
	display: table;
	width: 100%;
}

.detail .detailRightBox .itemImg {
	display: table-cell;
	vertical-align: middle;
	background-color: #fff;
	width: 120px;
	height: 170px;
	text-align: center;
}

.detail .detailRightBox .itemImg img{
	display: block;
	max-width: 120px;
	max-height: 170px;
	border: 1px solid #efefef;
	margin-left: auto;
	margin-right: auto;
}

/* lightgallery */
#lg-download,
#lg-share,
#lg-actual-size,
#lg-zoom-out,
#lg-zoom-in,
#lg-fullscreen,
.lg-fullscreen,
.lg-autoplay-button {
	display: none;
}

.lg-outer .lg-thumb-item {
	border-radius: 0px;
}

.lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover {
	border-style: none;
}

/* @end */

/* @group form */

.form h2 ,
.newsList h2,
.newsDetail h2 ,
.subscription h2,
.login h2{
	line-height: 32px;
	padding-bottom: 10px;
	color: #000;
	border-bottom: 1px solid black;
	margin-bottom: 30px;
}

.form .formBox {
	border-top: 1px solid #d3d3d3;
	border-right: 1px solid #d3d3d3;
	border-left: 1px solid #d3d3d3;
}

.form .formLine {
	overflow: hidden;
	border-bottom: 1px solid #d3d3d3;
	display:flex;
}

.form .formItem {
	width: 284px;
	background-color: #efefef;
	padding-bottom: 40px;
	padding-left: 40px;
	padding-top: 40px;
	float: left;
}

.form .formItem p {
	margin-bottom: 0;
}

.form .formInput {
	padding-top: 35px;
	padding-bottom: 35px;
	padding-left: 40px;
	float: left;
	width: 676px;
}

.form .inputNo {
	width: 141px;
	height: 32px;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	height: 32px;
	text-indent: 10px;
}

.form .bookNoBox {
	padding-top: 40px;
	padding-left: 40px;
	float: left;
	width: 676px;
	margin-bottom: 30px;
}

.form .textHalf
{
	width: 287px;
	margin-right: 20px;
	float: left;
	border: 1px solid #ddd;
	height: 32px;
	text-indent: 10px;
}

.form .textLong
{
	width: 594px;
	float: left;
	border: 1px solid #ddd;
	height: 32px;
	text-indent: 10px;
}

.form .textArea {
	border: 1px solid #ddd;
	padding: 10px;
	width: 594px;
	line-height: 18px;
	display: block;
	border-radius: 0;
}

.form .inputName {
	margin-right: 40px;
}

.form .formCheck {
	margin-bottom: 10px;
	float: left;
}

.form label.checkbox {
	margin-right: 20px;
	margin-bottom: 3px;
	cursor: pointer;
	border: 1px solid #ddd;
	padding: 5px 10px;
	float: left;
}

.form label.checkbox:hover {
	background-color: #efefef;
}

.form label.checkbox input {
	margin-right: 10px;
	border-radius: 4px;
	background-color: #fff;
	border: 1px solid #333;
	color: #fff;
}

.form label.checkbox input:checked {
	background-color: #333;
}

.form label.radio {
	margin-right: 20px;
	cursor: pointer;
	border: 1px solid #ddd;
	padding: 5px 10px;
	float: left;
}

.form label.radio:hover {
	background-color: #efefef;
}

.form label.radio input {
	margin-right: 10px;
	border-radius: 20px;
	background-color: #fff;
	border: 1px solid #333;
	color: #fff;
}

.form label.radio input:checked {
	background-color: #333;
}

.form .zasshi {
	width: 594px;
	height: 32px;
	border: 1px solid #ddd;
	border-radius: 0px !important;
	text-indent: 10px;
	background: url(/img/select-1eaade42c7d65d3eea90fe5e4621d62c.svg) right 10px center no-repeat;
	background-size: 7px 14px;
}

.form .submit {
	width: 214px;
	height: 46px;
	margin: 40px auto auto;
}

.form .btn{
	background-color:black;
	text-align: center;
	color: white;
	width: 214px;
	height: 46px;
	font-size: 14px;
	line-height: 46px;
	padding-left: 12px;
	transition: 200ms;
}

.form .btn:hover {
	opacity: 0.5;
}

.form .btn::before{
	content: "";
	display: inline-block;
	position: absolute;
	width: 8px;
	height:8px;
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	background-size: contain;
	margin-left: -30px;
	margin-top: 19px;
}

.form .formText {
	font-size: 12px;
	color: #666666;
	margin-bottom: 10px;
	float: left;
	clear: both;
	width: 100%;
}

.form .required:after{
	content: '';
	background-image: url(/img/required-185e70ae21f5a7c3120ad5d142f1ec4c.jpg);
	display: inline-block;
	width: 24px;
	height: 15px;
	margin-left: 10px;
	background-size: contain;
	position: relative;
	top: 3px;
}

.miniBtn,
.miniBtn2 {
	text-align: center;
	min-width: 50px;
	height: 32px;
	font-size: 14px;
	padding: 0 5px;
	transition: 200ms;
}
.miniBtn {
	background-color:black;
	color: white;
}
.miniBtn2 {
	background-color:white;
	border: 1px solid black;
	color: black;
}

.miniBtn:hover,
.miniBtn2:hover {
	opacity: 0.5;
}

/* @end */

/* @group newsList */

.newsList .newslistBox {
	border: 1px solid #c3c3c3;
	margin-bottom: 40px;
}

.newsList .newsListLine:nth-child(odd) {
	background-color: #efefef;
}

.newsList .newsListLine {
	height: 54px;
	width: 958px;
	padding-left: 20px;
	vertical-align: middle;
	height: 54px;
	padding-right: 20px;
}

.newsList .newsListDay {
	line-height: 54px;
	float: left;
	margin-right: 25px;
	margin-bottom: 0;
}

.newsList .newsListTag {
	float: left;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 10px;
	margin-right: 25px;
	height: 54px;
	letter-spacing: -1px;
}

.newsList .tag {
	border: 1px solid #c3c3c3;
	height: 24px;
	width: 110px;
	line-height: 24px;
	text-align: center;
}

.newsList .newsTitle {
	line-height: 54px;
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) left 0px top 22px no-repeat;
	background-size: 4px 7px;
	padding-left: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* @end */

/* @group newsDetail */

.newsDetailBox {
	border: 1px solid #c3c3c3;
	width: 800px;
	margin: auto;
}

.newsDetailTitle {
	background-color: #efefef;
	padding: 20px 80px;
}

.newsDetailDay {
	margin-bottom: 5px;
}

.newsDetailText {
	padding: 20px 80px 40px;
	color: #666;
	line-height: 22px;
}

.newsDetailText p {
	margin-bottom: 20px;
}

.newsDetail a {
	text-decoration: underline;
}

/* @end */

/* @group subscription login */

.subscriptionBox {
	font-size: 14px;
}

.subscription h3 {
	font-size: 18px;
	margin-bottom: 2px;
}

.subscription .stylRed {
	color: #cc1919;
}

.subscription ul {
	position: relative;
}

.subscription li {
	list-style: none;
	padding-left: 16px;
	margin-bottom: 10px;
}

.subscription-memberpolicy li {
    list-style-type: decimal !important;
    padding-left: 0px !important;
}

.subscription-memberpolicy li:before {
    content: "" !important;
}

.subscription-memberpolicy ul {
    padding-left: 2rem;
}

.subscription-memberpolicy .list-style-type-clear {
  list-style-type: none !important;
}

.subscription li:before {
	content: "・";
	color: #000;
	position: absolute;
	left: 0;
}

.subscription .nonmember,
.subscription .member,
.loginBox,
.form .nonmember {
	background-color: #efefef;
	padding: 40px;
	margin-bottom: 40px;
}

.subscriptionBox {
	margin-bottom: 40px;
}

.subscription .member .btn,
.loginBox .member .btn {
	background-color: #000;
	text-align: center;
	color: white;
	width: 214px;
	height: 46px;
	font-size: 14px;
	line-height: 46px;
	padding-left: 12px;
	transition: 200ms;
}

.subscription .member .btn:hover,
.loginBox .member .btn:hover {
	opacity: 0.5;
}

.subscription .member .btn::before,
.loginBox .member .btn::before {
	content: "";
	background-image: url(/img/i_login-8acf8e894c81a98c6eac40cb1bf2e4a3.png);
	display: inline-block;
	position: absolute;
	width: 24px;
	height: 24px;
	background-size: contain;
	margin-left: -30px;
	margin-top: 11px;
}

.subscription .nonmember .btn,
.loginBox .nonmember .btn {
	background-color: #000;
	text-align: center;
	color: white;
	width: 214px;
	height: 46px;
	font-size: 14px;
	line-height: 46px;
	padding-left: 12px;
	transition: 200ms;
}

.subscription .nonmember .btn:hover,
.loginBox .nonmember .btn:hover {
	opacity: 0.5;
}

.subscription .nonmember .btn::before,
.loginBox .nonmember .btn::before {
	content: "";
	display: inline-block;
	position: absolute;
	width: 8px;
	height: 8px;
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	background-size: contain;
	margin-left: -30px;
	margin-top: 19px;
}

.subscription .btn,
.loginBox .btn {
	width: 214px;
	height: 46px;
	margin: 40px auto auto;
	display: block;
}

.subscription input, .login input {
	border: 1px solid #d3d3d3;
	height: 32px;
	text-indent: 13px;
	background-color: white;
	width: 500px;
}

.subscriptionForm, .loginForm {
	width: 620px;
	margin: auto;
}

.subscriptionForm .pass,
.subscriptionForm .mailaddress,
.loginForm .pass,
.loginForm .mailaddress {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}

.loginBox .forget {
	text-decoration: underline;
	margin-bottom: 40px;
	text-align: center;
	margin-top: 40px;
}

.login .line {
	border-bottom: 1px solid #9e9e9e;
}

/* @end */

/* @group kenchiku */

.kenchi {
	width: 960px;
	margin: auto;
}

.kenchiImgWrapper {
    width: 100%;
    background-color: #000;
    height: 100px;
    display: table;
    text-align: center;
    margin-bottom: 40px;
}

 .kenchiImg{
 	width: 302px;
    display: table-cell;
 	vertical-align: middle;
 }

.kenchiImg img {
    width: 302px;
}

.kenchiTitle{
	line-height: 32px;
	padding-bottom: 10px;
	color: #000;
	border-bottom: 1px solid black;
	margin-bottom: 30px;
}

.kenchiLeft {
	width: 620px;
	margin-right: 40px;
	float: left;
}

.kenchiBook {
	width: 280px;
	margin-right: 40px;
	float: left;
	box-shadow: 0 0 1px #999;
	margin-bottom: 40px;
}

.kenchiText {
	width: 300px;
	float: left;
	margin-bottom: 40px;
}

.kenchi h3 {
	font-size: 22px;
	line-height: 33px;
	margin-bottom: 40px;
}

.kenchiNews{
    background-color: #f7f7f7;
    padding-top: 20px;
    display: inline-block;
    width: 100%;
	margin-bottom: 40px;
}
.kenchiRevision{
    padding-top: 20px;
    display: inline-block;
    width: 100%;
	margin-bottom: 40px;
	border: 1px solid #000;
}
.kenchi .kenchiNewsInner {
	width: 94%;
	min-width: 620px;
	position: relative;
}

.kenchiNewsArticle {
	width: 100%;
	float: left;
	margin-bottom: 20px;
	overflow: hidden;
}

.kenchiNewsInner h2.kenchiTitle {
	text-align: left;
	margin: 0 auto 20px;
	border-bottom: 1px solid #000;
	text-indent: 20px;
	padding-bottom: 10px;
}

.kenchiNewsList {
	width: 100%;
	margin-right: 20px;
	margin-left: 20px;
}

.kenchiNewsArticle .date {
	float: left;
	margin-right: 5px;
	bottom: 2px;
	position: relative;
	width: 80px;
}
.kenchiNewsArticle .category {
	float: left;
	font-size: 10px;
	border: 1px solid #333;
	width: 110px;
	text-align: center;
	margin-right: 15px;
	letter-spacing: -1px;
}

.kenchiNews .kenchiNewsArticle a {
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) left 0px top 6px no-repeat;
	background-size: 4px 7px;
	padding-left: 12px;
	float: left;
	width: 100%;
	margin-right: -252px;
	padding-right: 252px;
	font-size: 12px;
}

.kenchiRevision .kenchiNewsArticle a {
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) left 0px top 6px no-repeat;
	background-size: 4px 7px;
	padding-left: 12px;
	float: left;
	width: 100%;
	margin-right: -142px;
	padding-right: 142px;
	font-size: 12px;
}

.kenchiNewsBtn  {
	right: 20px;
	float: right;
	position: absolute;
	top: 3px;
}
.kenchiNewsBtn a {
	background: url(/img/circlearrow-182641078ca884fa70402ee30d22bb1d.svg) left 0px top 2px no-repeat;
	background-size: 12px 12px;
	padding-left: 16px;
}
.kenchiBanner {
	float: left;
	width: 300px;
}
.kenchiBanner img{
	width:  100%;
	height: auto;
	margin-bottom: 20px;
}
.kenchiWrapper {
	overflow: hidden;
}
.backNumber h2{
	line-height: 32px;
	padding-bottom: 10px;
	color: #000;
	border-bottom: 1px solid black;
	margin-bottom: 30px;
	text-align: left;
}
.backNumber .listBox{
	overflow: hidden;
}
.backNumber a img:hover {
	opacity: 1;
}

.backNumber  .item {
	font-size: 12px;
	line-height: 18px;
	margin-right: 40px;
	margin-bottom: 40px;
	width: 160px;
	float: left;
}
.backNumber .item P {
	margin-bottom: 0;
}

.backNumber .item a:hover .itemImgWrapper {
	opacity: 0.5;
}

.backNumber .item:nth-child(5n) {
	margin-right: 0px;
}

.backNumber .item:nth-child(5n+1) {
	clear: both;
}

.backNumber .itemImgWrapper {
	margin-bottom: 10px;
	display: table;
	width: 100%;
}

.backNumber .itemImg {
	display: table-cell;
	vertical-align: middle;
	background-color: #fff;
	width: 160px;
	height: 231px;
	text-align: center;
}

.backNumber .itemImg img{
	display: block;
	max-width: 160px;
	max-height: 231px;
	border: 1px solid #efefef;
	margin-left: auto;
	margin-right: auto;
}
.backNumber .item P {
	margin-bottom: 0;
}
.backNumber  .btn {
	background-color: #000;
	text-align: center;
	color: white;
	width: 214px;
	height: 46px;
	font-size: 14px;
	line-height: 46px;
	padding-left: 12px;
	transition: 200ms;
}

.backNumber .btn:hover {
	opacity: 0.5;
}

.backNumber .btn::before {
	content: "";
	display: inline-block;
	position: absolute;
	width: 8px;
	height: 8px;
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	background-size: contain;
	margin-left: -30px;
	margin-top: 19px;
}
.backNumber .btn {
	width: 214px;
	height: 46px;
	margin: 40px auto auto;
	display: block;
}
/* @end */

@media screen and (max-width: 640px){
/* for SmartPhone */

/* @group common */

.onlySP {
	display: block;
}
.onlyPC {
	display: none;
}
a img:hover {
	opacity: 1;
}
a:hover {
  color:#333;
}
a:active {
  color:#999;
}
.breadcrumb {
	margin-bottom: 30px;
}

/* @end */

/* @group header */

header {
	margin-bottom: 20px;
	margin-top: 0px;
	border-bottom: 1px solid #eee;
	padding-top: 15px;
	padding-bottom: 0px;
}

header .headerInner {
	min-width: 100px;
	margin: 0;
	width: 100%;
	padding: 0;
	line-height: 0;
}

header .headerSub {
	display: none;
}

header #searchBox,
header #searchBoxSP {
	outline: 0;
	width: 100%;
}

header nav {
	display: block;
}

header .logo {
	width: 200px;
	float: left;
	margin-left: 3%;
	margin-top: 0px;
}

header .logo h1 img {
	width: 200px;
	height: 27px;
}

header .headerText p{
	font-size: 8px;
	margin-top: 4px;
	margin-bottom: 17px;
}

header .headerText img {
	height: 10px;
}

/* @end */

/* @group index */

.ContentsWidth {
	width: 100%;
	padding-right: 5%;
	padding-left: 5%;
}

h2.indexTitle {
	background: url(/img/indexTitle-b850ee2e2f69fc14b19911d0e878de21.svg) left 0px top 4px no-repeat;
	background-size: 18px;
	padding-left: 30px;
	font-size: 16px;
	margin-bottom: 40px;
	font-weight: bold;
	line-height: 1.5;
}

section.newArrival h2.indexTitle ,
section.Recently h2.indexTitle {
	margin-left: 5%;
}

a:hover .item-info {
	opacity: 0;
}
.indexCategory .indexCate {
	width: 100%;
	border: 1px solid #e5e5e5;
}

.indexCateOuter a {
	font-size: 12px;
	line-height: 16px;
	width: 48%;
	height: auto;
}

.indexCategory .indexCateOuter{
	justify-content: space-between;
}

.indexCate .CategoryThum {
	width: 15vw;
	height: 15vw;
}

.indexCate .indexCateName {
    padding-left:  2vw;
}

.MagazineOuter {
    justify-content: space-around;
}

.indexMagazine .MagazineBox {
	width: 100%;
    flex-direction: column;
}

.indexMagazine .MagazineImg {
	flex-grow: 1;
	width: 100%;
}

.indexMagazine .MagazineBox:first-child {
	margin-right: 5%;
}

.indexMagazine .MagazineBox img{
	width: 100%;
	margin-right: 0px;
}

.indexMagazine .MagaText {
	width: 100%;
}

.indexMagazine .MagazineBox .MagaText p {
	font-size: 16px;
}

.indexMagazine .MagazineBox .MagaText p.MagaDetail
{
	font-size: 12px;
	line-height: 18px;
}

.pickUpBox {
	display: block;
}

.pickUpInner  {
	width: 100%;
	padding-left: 10%;
	padding-right: 10%;
}

.pickUp.ContentsWidth .pickUpTitle {
	height: 60%;
}

.pickUp.ContentsWidth .pickUpTitle h2{
    padding-left: 15%;
	font-size: 18px;
}

.pickUpImg {
	padding-left: 15%;
	padding-bottom: 20px;
}

.pickUp .pickUpImg img{
	width: 100%;
	margin-right: 10%;
}

.pickUpText p {
	margin-right: 0;
	font-size: 16px;
	padding-left: 15%;
	margin-top: 0;
}

.pickUpCopy {
	margin-right: 0px;
}

.pickUpCopy p{
	padding-left: 22px;
	margin-top: 20px;
	font-size: 14px;
}

h2.rankingTitle {
	background: url(/img/rankingTitle-76ce9293bd8f633ad9946ccd73c67a94.svg) left 0px top 3px no-repeat;
	background-size: 21px;
	padding-left: 30px;
	font-size: 16px;
}

.pickUpInner .btnRed {
	float: none;
	width: 100%;
}

p.pickUpStyle2 {
	font-size: 12px;
	padding-left: 0;
}

.allDelete {
	right: 5%;
}
.bannerArea.ContentsWidth img {
	width: 100%;
	height: auto;
}

/* @end */

/* @group footer */

footer {
	margin-top: 40px;
}

footer .footerInner {
	min-width: 100px;
}

footer .footerSub,
footer .footerMain{
	display: block;
	margin-top: 0;
}

.footerMain .footerLeft {
	width: 100%;
	margin-right: 0;
	padding-right: 0;
	margin-bottom: 20px;
	overflow: hidden;
}

footer ul {
	width: 33.3%;
}

footer li {
	font-size: 11px;
}

.footerSub .footerLeft {
	width: 100%;
	margin-bottom: 10px;
}

.footerMain .footerRight,
.footerSub .footerRight {
	width: 100%;
}

.footerMain .footerRight {
	border-top: 1px solid #666;
	border-bottom: 0px solid #666;
	padding-top: 20px;
	overflow: hidden;
}

/* @end */

/* @group list */

.detail ,
.searchList .breadcrumb  ,
.listBox,
.listLine{
	width: 94%;
	margin-right: 3%;
	margin-left: 3%;
}

.searchList .sideBar {
	display: none;
}

.searchList,
.searchList .listWrapper,
.searchList .listTitle ,
.searchList .listBox .itemImg img{
	width: 100%;
}

.searchList  ,
.downMenu{
	width: 100%;
}

.searchList .listBox .item {
	width: 29%;
	margin-right: 6%;
}
.searchList .listBox .item:nth-child(4n) {
     margin-right: 6%;
}
.searchList .listBox .item:nth-child(3n) {
     margin-right: 0px;
}

.searchList .listBox .item a:hover .itemImgWrapper {
	opacity: 1;
}

.searchList .listLine .item a:hover {
	opacity: 1;
}

.searchList .listTitle {
  flex-wrap: wrap;
	border-bottom-style: none;
}

.searchList .listTitle h2 {
	width: calc(98% - 88px);
	padding-left: 2%;
	padding-right: 0;
}

.listTitle > h2 {
    order: 1;
}

.listTitle > .narrowing {
    order: 3;
}

.listTitle > .listBtnWrapper {
    order: 2;
}

.narrowing {
	width: 100%;
	margin-top: 10px;
}

.narrowing summary {
	background-color: #f7f7f7;
	white-space:nowrap;
	border: 1px solid #9e9e9e;
	padding: 10px 10px 10px 35px;
	border-right-width: 0;
	border-left-width: 0;
}

.narrowing summary:after {
	left: 15px;
}

.narrowingMenuWrapper  {
	position: relative;
	top: 0px;
}

ul.narrowingMenu {
	padding: 3%;
	width: 94%;
	background: #f7f7f7;
	border-radius: 0px;
	margin-top: 0;
	border-top-width: 0;
	border-left-width: 0;
	border-right-width: 0;
}

ul.narrowingMenu li {
	width: 50%;
	min-width: 0;
}

ul.narrowingMenu li a {
	padding-left: 12px;
	display: block;
}

.subList ul li{
	width: 50%;
}
.subList {
	margin-bottom: -40px;
	padding-right: 3%;
		padding-left: 3%;
}

.searchList .indexCate {
	display: flex;
	position:relative;
	margin-bottom: 24px;
	width: 100%;
	border: 1px solid #e5e5e5;
}

.searchList .indexCateOuter{
	flex-wrap: wrap;
	margin-top: 40px;
	justify-content: space-between;
	padding-right: 5%;
	padding-left: 5%;
	padding-top: 40px;
	display: flex;
}

/* @end */

/* @group detail */

.lg-actions .lg-next,
.lg-actions .lg-prev {
	/* lightbox */
	display: none !important;
}

.detail .detailLeftBox h2 {
	display: block;
	margin-bottom: 30px;
}

.detail .detailLeftBox a .sample {
	width: 48.5%;
}

.detail .detailLeftBox .support {
	width: 48.5%;
}

/*.detail .detailLeftBox .ecStore a {
	margin-top: 3%;
	display: inline-block;
	float: left;
	width: 48.5%;
}*/

.detail .detailLeftBox .ecStore img {
	width: 100%;
}

.searchList .listLine img {
	width: 30%;
	margin-right: 10px;
}

.detail .detailLeftBox .detailPh {
	width: 70%;
	margin-right: auto;
	margin-left: auto;
}

.detail .detailLeftBox,
.detail .detailLeftBox .detailTable,
.detail .detailLeftBox .detailPh img {
	width: 100%;
	margin-right: 0px;
}

.detail .detailLeftBox {
	float: none;
}

.detail .detailRightBox {
	margin-top: 40px;
	width: 100%;
}

.detail .detailRightBox h2 {
	display: none;
}

.detail .detailText h3:first-of-type  {
	border-top: 1px solid #efefef;
	padding-top: 20px;
	margin-bottom: 20px;
	margin-top: 2px;
}

.detail .detailRightBox .item {
	margin-right: 3%;
	width: 48.5%;
}

.detail .detailRightBox .item a:hover .itemImgWrapper {
	opacity: 1;
}

.detail .detailRightBox .item:nth-child(even) {
	margin-right: 0%;
}

.detail .detailRightBox .item:nth-child(odd) {
	clear: both;
}

/* @end */

/* @group form */
.form  ,
.newsList,
.newsDetail,
.subscription,
.mypage,
.login  {
	width: 94%;
	margin-right: 3%;
	margin-left: 3%;
}

.form .formInput {
	width: 94%;
	margin-right: 3%;
	margin-left: 3%;
	padding-top: 10px;
	padding-left: 0px;
	padding-bottom: 0;
}

.form .zasshi{
	width: 100%;
	margin-bottom: 10px;
}

.form .formItem {
	width: 100%;
	padding-right: 3%;
	padding-left: 3%;
	float: none;
	padding-bottom: 10px;
	padding-top: 10px;
}

.form  .formLine{
	display: block;
}

.form .bookNoBox  {
	width: 97%;
	margin-left: 3%;
	padding-top: 10px;
	padding-left: 0px;
}

.form .inputNo {
	width: 48.5%;
	margin-right: 3%;
}

.form .inputNo:nth-child(even) {
	width: 48.5%;
	margin-right: 0%;
}

.form .textHalf,
.form .textLong {
	width: 100%;
	margin: 0 0 10px;
}

.form .textArea {
	margin-bottom: 10px;
	padding: 10px;
	width: 100%;
}

.form .kubun input {
	margin-bottom: 10px;
}

input,
textArea,
select {
	font-size: 16px;
}

/* 花嶋 */
.inputPass,
.ec .formCheck {
	width: 100%;
	margin: 0 0 10px;
}

/* @end */

/* @group newsList */

.newsList .newsListLine {
	height: auto;
	width: 100%;
	padding-left: 3%;
	padding-right: 3%;
	overflow: hidden;
}

.newsList .newsTitle{
	float: left;
	width: 100%;
}

.newsList .newsListDay ,
.newsList .newsListTag {
	margin-bottom: -10px;
}

/* @end */

/* @group newsDetail */

.newsDetailBox {
	width: 100%;
}

.newsDetailTitle {
	padding-right: 3%;
	padding-left: 3%;
}

.newsDetailText {
	padding-right: 3%;
	padding-left: 3%;
}

/* @end */

/* @group subscription login */

.subscription input,
.login  input{
	width: 100%;
}

.subscriptionForm,
.loginForm {
	width: 100%;
}

.subscriptionForm .pass ,
.subscriptionForm .mailaddress,
.loginForm .pass ,
.loginForm .mailaddress{
	display: block;
}

/* @end */

/* @group kenchiku */
.kenchi {
	width: 100%;
	padding-right: 3%;
		padding-left: 3%;
}
.kenchiLeft,
.kenchiBook,
.kenchiText,
.kenchi .kenchiNewsInner,
.kenchiBanner,
.backNumber .listWrapper,
.backNumber .listTitle
{
	width: 100%;
}
.kenchi .kenchiNewsInner {
	min-width: 100%;
}
.backNumber .listWrapper,
.backNumber .listTitle {
	width: 100%;
}

.backNumber .listBox .item {
	margin-right: 3%;
	width: 48.5%;
}

.backNumber .listBox .item a:hover .itemImgWrapper {
	opacity: 1;
}

.backNumber .item:nth-child(even) {
	margin-right: 0%;
}

.backNumber .listLine .item a:hover {
	opacity: 1;
}
.backNumber .item:nth-child(5n+1) {
	clear: none;
}
.kenchiNews .kenchiNewsArticle a{
	margin: 5px 0px 5px 0;
	width: 94%;
	padding: 0 3%;
}
.kenchiRevision {
	width: 100%;
	float: left;
	margin-right: -0px;
	padding-right: 0px;
	margin-bottom: 40px;
}

.kenchiRevision .kenchiNewsArticle a {
	margin: 5px 0px 5px 0;
	width: 94%;
	padding: 0 3%;
}
/* @end */

}

@media screen and (max-width: 320px){

/* for iPhone SE */
.grid-item {
	width: 80px;
}

}

/* 以下花嶋追加 */

/* EC会員登録 */

.ec .mailaddress, .ec .pass {
	margin-bottom: 20px;
}

.ec .mailaddress p, 
.ec .pass p, 
.ec .birth p {
	margin: auto auto 5px;
}

.membershipTerms {
	margin-top: 50px;
}

.membershipTerms h4 {
	margin: 10px 0;
}

.membershipTerms span {
	margin-bottom: 10px;
	font-size: 15px;
}

.scroll {
	overflow: auto;
	max-width: 960px;
	max-height: 300px;
	border: 1px solid #000;
	padding: 16px;
}

.scroll p,
.scroll h2,
.scroll ol {
	margin-bottom: 0;
}

.scroll ol {
	padding-left: 0;
}

.scroll ol li:not(.ql-indent-1) {
	counter-increment: list-0;
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    padding-left: 32px;
}

.scroll ol li:not(.ql-indent-1):before {
    content: counter(list-0, decimal) '. ';
    margin-left: -32px;
    display: inline-block;
    width: 32px;
}

.scroll ol li.ql-indent-1 {
	counter-increment: list-1;
    counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    padding-left: 6em;
}

.scroll ol li.ql-indent-1:before {
    content: '（' counter(list-1, em-decimal) '）';
    margin-left: -3em;
}

@counter-style em-decimal {
  system : numeric;
  symbols : "\FF10" "\FF11" "\FF12" "\FF13" "\FF14" "\FF15" "\FF16" "\FF17" "\FF18" "\FF19";
}

.scroll ol > li, .scroll ul > li {
    list-style-type: none;
}

.scroll .ql-indent-1 {
	padding-left: 3em;
}

.termsCheck {
	margin: 30px 15px;
	font-size: 20px;
}

.termsCheck label {
	cursor: pointer;
}

.termsCheck input[type = checkbox] {
	width: 19px;
	height: 19px;
	transform: scale(1.4);
	cursor: pointer;
}

.birthYM {
	cursor: pointer;
	border: 1px solid #ddd;
	border-radius: 2px;
}

.termsLink {
	font-size: 20px;
	text-align: left;
	margin-left: 15px;
}

.termsLink a {
	/* 矢印
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 7px center no-repeat;
    background-size: 7px;
    padding-left: 18px;
    padding-right: 5px;
    */
    
    /* 下線 */
    border-bottom: 1px solid #000;
}

.form .ec .birthday {
	width: 30%;
}

.form .ec .address, .form .ec .tel {
	width: 50px;
	float: none;
	margin: 0;
	margin-bottom: 10px;
}

.form .ec .phone p {
	margin-bottom: 5px;
}

.radioMargin {
	margin-right: 5px;
}

/* パスワード表示 */
.ec .inputPass {
	display: flex;
	border: 1px solid #ddd;
	margin: 0 0 10px;
	position: relative;
    float: left;
    height: 32px;
    text-indent: 10px;
}

.ec .inputPass .textHalf {
	margin: 0;
	padding-right: 40px;
	border: none;
}

.passToggle, .passToggle2, .passToggle3 {
	display: flex;
	width: 40px;
	border: none;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='M24 31.5q3.55 0 6.025-2.475Q32.5 26.55 32.5 23q0-3.55-2.475-6.025Q27.55 14.5 24 14.5q-3.55 0-6.025 2.475Q15.5 19.45 15.5 23q0 3.55 2.475 6.025Q20.45 31.5 24 31.5Zm0-2.9q-2.35 0-3.975-1.625T18.4 23q0-2.35 1.625-3.975T24 17.4q2.35 0 3.975 1.625T29.6 23q0 2.35-1.625 3.975T24 28.6Zm0 9.4q-7.3 0-13.2-4.15Q4.9 29.7 2 23q2.9-6.7 8.8-10.85Q16.7 8 24 8q7.3 0 13.2 4.15Q43.1 16.3 46 23q-2.9 6.7-8.8 10.85Q31.3 38 24 38Zm0-15Zm0 12q6.05 0 11.125-3.275T42.85 23q-2.65-5.45-7.725-8.725Q30.05 11 24 11t-11.125 3.275Q7.8 17.55 5.1 23q2.7 5.45 7.775 8.725Q17.95 35 24 35Z'/></svg>") no-repeat center center;
	background-size: 50% auto;
	cursor: pointer;
	position: absolute;
	height: 32px;
	right: 0;
}

.passToggle.is-visible, .passToggle2.is-visible, .passToggle3.is-visible {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='m31.45 27.05-2.2-2.2q1.3-3.55-1.35-5.9-2.65-2.35-5.75-1.2l-2.2-2.2q.85-.55 1.9-.8 1.05-.25 2.15-.25 3.55 0 6.025 2.475Q32.5 19.45 32.5 23q0 1.1-.275 2.175-.275 1.075-.775 1.875Zm6.45 6.45-2-2q2.45-1.8 4.275-4.025Q42 25.25 42.85 23q-2.5-5.55-7.5-8.775Q30.35 11 24.5 11q-2.1 0-4.3.4-2.2.4-3.45.95L14.45 10q1.75-.8 4.475-1.4Q21.65 8 24.25 8q7.15 0 13.075 4.075Q43.25 16.15 46 23q-1.3 3.2-3.35 5.85-2.05 2.65-4.75 4.65Zm2.9 11.3-8.4-8.25q-1.75.7-3.95 1.075T24 38q-7.3 0-13.25-4.075T2 23q1-2.6 2.775-5.075T9.1 13.2L2.8 6.9l2.1-2.15L42.75 42.6ZM11.15 15.3q-1.85 1.35-3.575 3.55Q5.85 21.05 5.1 23q2.55 5.55 7.675 8.775Q17.9 35 24.4 35q1.65 0 3.25-.2t2.4-.6l-3.2-3.2q-.55.25-1.35.375T24 31.5q-3.5 0-6-2.45T15.5 23q0-.75.125-1.5T16 20.15Zm15.25 7.1Zm-5.8 2.9Z'/></svg>");
}

.ec .loginBox .nonmember {
	width: 214px;
	margin: auto;
}

/* アコーディオンメニュー */
.ec .formCheck {
	width: 100%;
}

.accordion,
.ec .guideOrder .accordion {
	cursor: pointer;
	position: relative;
}

.accordion:before {
    position: absolute;
    content: "+";
    right: 20px;
    width: 20px;
}

.accordion.open:before {
	position: absolute;
    content: "-";
    right: 20px;
    width: 20px;
}

.accordionDetails {
	display: none;
}

/* パスワード再設定 */

.ec .mypageOrHome {
	margin: 40px auto auto;
	display: table;
}

.ec .mypageOrHome a {
	margin-right: 10px;
    margin-left: 10px;
    display: inline-block;
}

@media screen and (max-width: 640px) {
	.ec .mypageOrHome {
		width: 214px;
	}

	.ec .mypageOrHome a:first-child {
		margin-bottom: 10px;
	}
}

.birth {
	display: flex;
	align-items: center;
}

.birth .formInput {
	width: 500px;
}

.birth .birthday {
	width: 32.8%;
	height: 32px;
    border: 1px solid #ddd;
    border-radius: 0px !important;
    text-indent: 10px;
    background: url(/img/select-1eaade42c7d65d3eea90fe5e4621d62c.svg) right 10px center no-repeat;
    background-size: 7px 14px;
    background-color: #fff;
}

@media screen and (max-width: 640px){
	.birth {
		display: block;
	}
	
	.birth .formInput {
		width: 100%;
	}
	
	.birth .birthday {
		width: 32%;
	}
}

.formBox .right {
	text-align: right;
}

.formBox .left {
	text-align: left;
}

.formBox .formText {
	font-size: 12px;
    color: #666666;
    margin-bottom: 10px;
    clear: both;
    width: 100%;
}

.formBox .mailaddress {
	margin-top: 0;
}

.passwordReset {
	padding: 0;
}

/* ECカラーリング */

.EC {
	color: #3450a4;
}

.form .ec .formLine:not(:last-child) {
	border-bottom: 1.5px dashed #d3d3d3;
}

/* ECマイページ */

.ec .contain {
	display: flex;
	max-width : 100%;
	justify-content: center;
}

.ec .honorifics {
	font-size: 80%;
}

.ec .contain .mypageImg {
	width: 140px;
}

.ec .contain .mypageImg:not(:last-child) {
	margin-right: 30px;
}

.ec .contain .mypageImg img {
	width: 140px;
	height: 186px;
}

.ec .notice {
	margin-bottom: 40px;
	background-color: #EFEFEF;
	padding: 20px;
}

.ec .notice ul {
	margin-bottom: 0;
	padding: 0;
	margin-top: 10px;
}

.ec .notice li {
	margin-bottom: 0;
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 5px center no-repeat;
  background-size: 6px;
	list-style: none;
	padding-left: 16px;
}

.ec .notice li:before {
	content: none;
}

.ec .purchased {
	margin-bottom: 40px;
	margin-top: 20px;
}

.ec .moreBook:before {
	content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 7px center no-repeat;
    background-size: 8px;
    z-index: -1;
}

.ec .moreBook {
	width: 65px;
	font-weight: bold;
	margin: 10px 0;
}

.ec .coupoint .coupointContent {
	margin-bottom: 10px;
	border: 1px solid #ccc;
	max-width : 100%;
}

.ec .coupoint .ecMypageItems {
	width: 100%;
	padding: 20px;
}

.ec .coupoint .ecMypageItems .btn {
	margin-top: 0;
}

.ec .coupoint h3 {
	display: initial;
}

.ec .coupoint .ecMypageItems .pt {
	display: flex;
	justify-content: space-between;
}

.ec .coupoint .ecMypageItems h4 {
	margin: 0;
}

.ec .morePoint:before, .ec .moreCoupon:before {
	content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 7px center no-repeat;
    background-size: 8px;
    z-index: -1;
}

.ec .morePoint.open:before, .ec .moreCoupon.open:before {
	content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 7px center no-repeat;
    background-size: 8px;
    z-index: -1;
}

.ec .btn {
	width: 214px;
	height: 46px;
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

.ec .pt {
	margin-bottom: 10px;
}

.ec .pt .ptNumber {
	color: red;
	font-size: 24px;
	font-weight: bold;
	margin-right: 2px;
}

.ec .kigen .ptNumber {
	color: red;
	font-weight: bold;
	margin-right: 2px;
	margin-left: 6px;
}

.ec .morePoint, .ec .moreCoupon {
	width: 200px;
	margin-top: 5px;
}

.ec #moreBook, .ec #moreCoupon, .ec #morePoint {
	margin-left: 22px;
	cursor: pointer;
}

.ec .hiddenPoint {
	display: none;
}

.ec .hiddenPoint h4 {
	margin-top: 0 !important;
}

@media screen and (max-width: 640px){
	.ec .contain {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.ec .contain .mypageImg {
		margin-bottom: 30px;
	    margin-right: 18px !important;
	    margin-left: 18px;
	}
	
	.ec .coupoint .coupointContent {
		width: 100%;
	}
	
	.ec .coupoint .ecMypageItems {
		width: 100%;
	}
}

.ec .ecMypageHeader {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 10px;
	border-bottom: 1px solid #000;
	margin-bottom: 30px;
}

.ec .ecMypageHeader h2 {
	border: none;
	padding: 0;
	margin: 0;
}

.ec .ecMypageHeader .point {
	padding: 5px;
	border: 1px solid #000;
	text-align: right;
}

.ec .ecMypageItem {
	padding: 0;
	border: 1px solid #ccc;
	margin-bottom: 40px;
	display: table;
	width: 100%;
}

.ec .ecMypageItemTitle {
	border-right: 1px solid #ccc;
	display: table-cell;
	width: 20%;
	padding: 20px;
}

.ec .ecMypageItemContent {
	display: table-cell;
	padding: 20px;
}

@media screen and (max-width: 640px){
	.ec .ecMypageItem {
		padding: 0;
		border: 1px solid #ccc;
		margin-bottom: 40px;
		display: block;
		width: 100%;
	}
	.ec .ecMypageItemTitle {
		border-bottom: 1px solid #ccc;
		border-right: 0px solid #ccc;
		width: 100%;
		display: block;
		padding-top: 15px;
		padding-bottom: 15px;
	}
	
	.ec .ecMypageItemContent {
		width: 100%;
		display: block;
		padding-top: 15px;
		padding-bottom: 15px;
	}
}

.ec .ecMypageItemTitle h3 {
	margin-bottom: 0;
	margin-top: 0px;
	line-height: 120%;
}

.ec .ecMypageItemContent h4 {
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
}

.ec .ecMypageItemContent .teiki:nth-child(n+2) {
	margin-top: 15px;
}

.ec .ecMypageItem .menuList li:before {
	content: none;
}

.ec .ecMypageItem .menuList li {
	background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) 5px center no-repeat;
	background-size: 5px;
	border-bottom: 1px solid #ccc;
}

.ec .ecMypageItem .menuList li:last-child {
	border: none;
}

.ec .toBookshelf {
	color: white;
}

@media screen and (max-width: 640px){
	.ec .ecMypageItem .menuHeader, .ec .ecMypageItem .menuList div {
		height: 35px;
		display: flex;
		align-items: center;
	}
}

/* 確認コード入力 */
@media screen and (max-width: 640px){
	.identification .subscriptionForm {
		width: auto;
	}
	
	.resend {
		margin-top: 20px;
		text-align: center;
	}
	
	.resend .btn {
		margin: auto !important;
		padding: 0 !important;
	}
}

.identification {
	padding: 40px;
	border: 1px solid #efefef;
}

.identification .resend .btn {
	margin: 0;
	padding: 0;
	width: 130px;
}

.identification .resend .btn::before {
	content: none;
}

.identification .form .formBox {
	border: none;
}

.identification .form .formLine {
	border: 1px solid #d3d3d3;
}

/* 購入履歴 */

.ec .textLeft {
	text-align: left;
}

.ec .textRight {
	text-align: right;
}

.ec .center {
	text-align: center;
}

.ec .bookNameSearch {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.ec .bookNameSearch input#searchBox {
	padding: 0;
}

.ec .bookNameSearch select {
	border: 1px solid #ccc;
	cursor: pointer;
	background: url(/img/select-1eaade42c7d65d3eea90fe5e4621d62c.svg)right 5px center no-repeat;
	background-size: 7px 14px;
	width: 6em;
	padding-left: 5px;
	height: 30px;
}

.ec .bookNameSearch .btn {
    text-align: center;
    background-color: #000;
    color: #fff;
    width: 50px;
    height: 30px;
    font-size: 14px;
    margin: 0;
    transition: 200ms;
    line-height: 0;
    padding: 0;
}

.ec .bookNameSearch .btn::before {
	content: none;
}

.ec .bookNameSearch .btn:hover {
	opacity: 0.5;
}

.ec .bookNameSearch input {
	width:18em;
	height: 30px;
	margin-left: 10px;
}

.ec .history, .ec .history2 {
	border: 1px solid #000;
	margin-bottom: 15px;
}

.ec .historyHeader {
	display: flex;
	justify-content: space-between;
	padding: 5px;
	border-bottom: 3px solid #ccc;
	position: relative;
}

.ec .historyHeader table {
	width: 100%;
}

.ec .historyHeader th.left {
	width: 80px;
}

.ec .historyHeader .right {
	width: 100px;
}

.ec .historyHeader .btn {
    text-align: center;
    background-color: #000;
    color: #fff;
    width: 50px;
    height: 30px;
    font-size: 14px;
    transition: 200ms;
    margin-top: 0;
    margin-right: 0;
}

.ec .historyHeader .btn:hover {
	opacity: 0.5;
}

.ec .historyDetailsLeft H3 {
	margin-top: 20px;
}

.ec .historyDetailsLeft H4 {
	margin: 0 1%;
	font-size: 14px;
}

.ec .historyDetailsLeft td{
	padding: 5px;
}

.ec .historyDetailsLeft th{
	padding: 3px;
	text-align: center;
}

.ec .historyDetails .historyDetailsLeft table {
	border-collapse: collapse;
	width: 98%;
	margin: 1%;
	border: 0px solid #ccc;
}

.ec .historyDetails .historyDetailsLeft table td {
	border: 2px solid #ccc;
}

.ec .historyDetails .historyDetailsLeft table th {
	border: 2px solid #ccc;
}

@media screen and (min-width: 641px){
	.ec div:not(orderConfirm) .historyDetails .historyDetailsLeft tr:not(:last-child) td:last-child {
		width: 190px;
	}
	.payDetails div:not(orderConfirm) table {
		width: 270px;
	}
	.orderConfirm .historyDetailsLeft tr:not(:last-child) td:last-child {
		width: 190px;
	}
}
@media screen and (max-width: 640px){
	.ec .historyDetails .historyDetailsLeft tr:not(:last-child) td:last-child {
		width: 130px;
	}
}

.ec .historyDetails td.num {
	text-align: right;
}

.ec .mini {
	font-size: 90%;
}

.ec .orderDetails {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}
.ec .payDetails {
	text-align: left;
	padding: 5px;
	flex: 1;
}

.ec .deliveryAddressDetails {
	text-align: left;
	padding: 5px;
	flex: 1;
}

.ec .deliveryAddressDetails th {
    padding-right: 1em;
}

.ec .payDetails table {
	margin: auto 1% auto auto;
	border-spacing: 0 5px;
	border-collapse: initial;
}

.ec .deliveryAddressDetails table {
	margin: auto auto auto 1%;
	border-spacing: 0 5px;
	border-collapse: initial;
}

.ec .pager li:before {
	content: none;
}

.ec .pager li {
	padding: 0;
}

.deliveryAddress {
	float: left;
	
}
.deliveryAddressArea {
	justify-content: right;
	display: flex;
}
.deliveryAddressTitle {
	width: 5em;
}

.deliveryAddressArea .deliveryAddressDetail {
	 max-width: 400px;
}

.indent {
	font-weight: normal;
	padding: 0.3em 0.3em 0 1em;
}
.payDetails .indent {
	padding-right: 1em;
	padding-left: 2em;
}
.deliveryAddressDetails .indent {
	padding-right: 1em;
	padding-left: 2em;
}
.trEnd{
	height: 0px !important;
}
.floatTitle {
	float: left;
}
.separatePayPoint {
	border-bottom: 1px solid #ccc;
}

@media screen and (max-width: 640px){
	.ec .bookNameSearch select {
		width: 6em;
	}
	
	.ec .historyDetails .historyDetailsLeft table {
		width: 96%;
		margin: 2%;
	}

	.ec .orderDetails {
		flex-direction: column;
	}
	
	.ec .payDetails,
	.ec .deliveryAddressDetails {
		width: 100%;
	}
	
	.ec .payDetails table {
		width: 96%;
    	margin: 2%;
	}
	
	.ec .deliveryAddressDetails table {
		width: 96%;
    	margin: 2%;
	}
	
	.deliveryAddress {
		float: none;
	}
	
	.deliveryAddressArea {
		display: flex;
		justify-content: left;
	}
	
	.deliveryAddressArea .deliveryAddressDetail {
		 max-width: 110px;
	}
	
	.miniSp {
		font-size: 80%;
	}
}

.forNarrow {
	display: none;
}

.receiptErrorWide {
	padding-left: 10px;
}

@media screen and (max-width: 640px){
	.forNarrow {
		display: table-row;
	}
	
	.forWide {
		display: none;
	}
	
	.ec .historyHeader .receiptAddress {
	 width: 100%; 
	 margin-right: 5px; 
	 height: 32px;
	}
	
	.paper {
		width: -webkit-fill-available;
    	max-width: fit-content;
	}
}

@media screen and (min-width: 641px){
	.ec .historyHeader .receiptAddress {
		 width: 18em; 
		 margin: 0 5px 0 10px; 
		 height: 32px;
	}
}

/* sctl */

.ec .sctlSection table {
	margin-left: 20px;
	width: 920px;
	margin-right: 20px;
}

.ec .sctlSection table th {
	width: 12rem;
}

@media screen and (max-width: 640px){
	.ec .sctlSection table {
		margin-left: 0px;
		width: 100%;
		margin-right: 0px;
	}
	
	.ec .sctlSection table th {
		width: 8rem;
	}
}

/* ご利用ガイド */
.ec .guideOrder,
.ec .guideOther,
.ec .guidePayMethod {
	margin-bottom: 0;
}

.ec .guideOrder,
.ec .guideOrder .accordionDetails {
	overflow: hidden !important;
}

.ec .guideOrder.ql-editor {
	white-space: initial;
	padding: 0;
}

.ec .guideOrder p {
	margin: 0;
}

.ec .guideOrder h1 {
	border: none;
}

.ec .guideOrder h2 {
	padding: 0;
	border: none;
	margin: 0;
	line-height: initial;
}

.ec .guideOrder li.faq::before {
	margin-left: 0;
	width: 0;
}

.ec .guideOrder h3,
.ec .guideOther h3,
.ec .guidePayMethod h3 {
	margin-bottom: 16px;
	border-bottom: 1px solid #CCB;
}

.ec .guideOrder .faq h4 {
	margin-bottom: 0;
	margin-top: 20px;
}

.ec .guideOrder .faq:first-child h4 {
	margin-top: 0;
}

.ec .guideOrder .faq ol,
.ec .guideOrder .faq ul {
	padding: 0;
}

.ec .guideOrder .faq li::before {
	position: initial;
}

.ec .guideOrder .faq li {
	margin-bottom: 0;
}

.ec .guideOther,
.ec .guidePayMethod {
	padding: 0;
}

.ec .guideOther h3 {
	margin-top: 18px;
}

.ec .guideOther .transition,
.ec .guidePayMethod li {
	font-size: 110%;
	font-weight: bold;
}

.ec .guideOther li:before {
	content: "";
}

.ec .guideOther .transition:before {
	content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    background: url(/img/arrow-fac7ad5bb1b375ef1367638d0be2edb7.svg) bottom no-repeat;
    background-size: 5px;
    z-index: -1;
    left: 0;
}

.ec .guideList h4, .ec .guideList h5 {
	margin: 0;
}

.ec .hidden {
	display: none;
	margin: 0 0 10px 10px;
}

.ec .hidden a {
	border-bottom: 1px solid #000;
}

.ec .hidden div {
	margin-bottom: 5px;
}

.ec .guidePayMethod .creditCards {
	margin-left: 16px;
}

/* EC会員メニュー */
header .headerSub .ec {
	float: right;
	color: #fff;
	background-color: #000;
	font-size: 12px;
	line-height: 12px;
}

.mydata {
	float: left;
	margin-right: 10px;
}

.headerMember {
	float: left;
	width: 124px;
	height: 40px;
	margin-right: 10px;
}

.headerMember a {
	color: #ffffff;
	display: block;
	height: 40px;
	text-align: center;
	line-height: 40px;
	background: url(/img/i_member-4b256219cfc56e343061e72d47849899.png) 8px 8px no-repeat #000000;
	background-size: 24px;
	border-radius: 6px;
	padding-left: 20px;
	width: 124px;
}

.headerMember a:hover {
	transition: 200ms;
	background-color: #666;
}

.headerLogin {
	float: left;
	width: 124px;
	height: 40px;
	margin-right: 15px;
}

.headerLogin a {
	color: #ffffff;
	display: block;
	height: 40px;
	text-align: center;
	line-height: 40px;
	background: url(/img/i_login-8acf8e894c81a98c6eac40cb1bf2e4a3.png) 8px 8px no-repeat #000000;
	background-size: 24px;
	border-radius: 6px;
	padding-left: 20px;
	width: 124px;
}

.headerLogin a:hover {
	transition: 200ms;
	background-color: #666;
}

.headerLogout {
	float: left;
	width: 124px;
	height: 40px;
	margin-right: 15px;
}

.headerLogout a {
	color: #ffffff;
	display: block;
	height: 40px;
	text-align: center;
	line-height: 40px;
	background: url(/img/i_logout-73cc3e885fcc7e67bdfc9da5570ae05a.png) 8px 8px no-repeat #000000;
	background-size: 24px;
	border-radius: 6px;
	padding-left: 20px;
	width: 124px;
}

.headerLogout a:hover {
	transition: 200ms;
	background-color: #666;
}

.headerCart {
	float: left;
	margin-right: 0px;
	background: url(/img/i_cart-d59107fda758fc24d4e4de78b9165ed7.png) 5px 6px no-repeat;
	background-size: 26px;
	width: 40px;
	height: 40px;
	position: relative;
}

.headerCart a {
	display: block;
	height: 40px;
	color: #000;
}

.headerCart:hover {
	opacity: 0.5;
	transition: 200ms;
}

.headerCart.sp {
	display: none;
}
@media screen and (max-width: 640px){
	.headerCart.sp {
		margin-right: 0;
		background: url(/img/i_cart-d59107fda758fc24d4e4de78b9165ed7.png) 5px 6px no-repeat;
		background-size: 26px;
		width: 40px;
		height: 40px;
		position: absolute;
		right: 60px;
		top: 2px;
		display: block;
	}
}

.headerCartNum {
	position: absolute;
	top: 1px;
	width: 30px;
	font-weight: bold;
	text-align: center;
	line-height: 100%;
	left: 5px;
	font-size: 12px;
}

.headerCartTxt {
	position: absolute;
	width: 40px;
	font-size: 10px;
	text-align: center;
	color: #000;
	line-height: 100%;
	top: 30px;
	font-weight: bold;
}

header .headerSub #member .headerCartTxt {
	position: absolute;
	left: 10px;
}

.member-menu-btn-icon,
.member-menu-btn-icon:before,
.member-menu-btn-icon:after {
  position: absolute;
  top: 12px;
  left: 18px;
  height: 2px;
  width: 24px;
  background: #333;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.member-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}
.member-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}

.contentsNum {
	border-radius: 0.25em;
	padding: 0.2em 0.6em 0.3em;
	font-weight: bold;
}

.mydataSP {
	float: left;
	margin-top:10px;
	font-size: 85%;
	right:135px;
	position: absolute;
}

.mydataSP2 {
	float: left;
	margin-top:10px;
	font-size: 85%;
	right:50px;
	position: absolute;
}

.namePtSP {
	padding: 5px;
	border: 1px solid #000;
	text-align: left;
}

.contentsNumSP {
	background-color: #cc1919;
	border-radius: 0.25em;
	padding: 0.2em 0.4em 0.1em 0.4em;
	font-weight: bold;
	color: #fff;
}

/* 注文内容表示 */
.ecItemBox .ec {
	width: 100%;
}

/* カート 合計金額、獲得ポイント */
.cartPayDetails {
	margin-left: auto;
	text-align: right;
}

.cartPayDetails th, .cartPayDetails td {
	padding-left: 5px;
	padding-right: 5px;
}

/* 太文字左寄せ */
.ecItemBold.left {
	text-align: left;
}

/* フッターリンクホバー */
footer a:hover {
  color:#999;
}

/* リンク下線 */
.subscriptionBox a, .blockIndent a {
	text-decoration: underline;
}

/* 支払方法入力 */
.addCredit {
	color: white;
	cursor: pointer;
}

/* FAQ */
.ec .faqList .hidden a {
	border-bottom: none;
}

.ec .faqList .hidden a:hover {
	border-bottom: 1px solid #000;
}

/*三澤追加*/
@media screen and (max-width: 640px){
	.ecItemBox {
		height: auto;
		border-bottom: solid 1px #d3d3d3;
		padding: 0;
		vertical-align: middle;
	}

	.ecSpWidthNone {
		width: 0%;
	}
	.ecSpWidthFull {
		display: block !important;
		width: 100%;
	}

	.ecBtnCommon {
		font-size: 85%;
	}

	.ecSelect {
		border: 1px solid #ddd;
		background: url(/img/select-1eaade42c7d65d3eea90fe5e4621d62c.svg) right 2px center no-repeat;
		background-size: 6px 12px;
		width: auto;
		min-width: 30px;
		padding: 0 9px 0 9px;
		font-size: 100%;
		margin: 2px;
	}
}
@media screen and (min-width: 641px){
	.ecItemBox {
		display: flex;
		height: auto;
		border-bottom: solid 1px #d3d3d3;
		padding: 5px;
		vertical-align: middle;
	}

	.ecSelect {
		border: 1px solid #ddd;
		background: url(/img/select-1eaade42c7d65d3eea90fe5e4621d62c.svg) right 2px center no-repeat;
		background-size: 6px 12px;
		width: auto;
		min-width: 30px;
		padding: 0 9px 0 9px;
		margin: auto;
	}
}
/*表示用共通*/
article h1 {
	border-bottom: solid 2px;
}

.ecBtnCommon {
	margin: auto;
	background-color : #FFF;
	width: auto;
	padding: 3px 5px 3px 5px;
	border: solid 1px;
}

div.ecBtnCommon {
	text-align: center;
}

button.ecDlBtn {
	margin: auto auto 10px;
	width: auto;
	padding: 3px 5px 3px 5px;
	border: 1px solid #707070;
}

button.ecDlBtn:hover {
	border: 1px solid #ccc;
	background-color: rgba(255,255,255,0.7);
  background-blend-mode: lighten;
}

div.ecDlBtn {
	text-align: center;
	margin: auto auto 10px;
	background-color : #eee;
	width: auto;
	padding: 3px 5px 3px 5px;
	border: 1px solid #eee;
}

.ecBtnCommonBlock {
	margin: 5px 0 5px 0;
}

.ecInfoBox {
	margin: 30px 0 30px 0;
	border-top: solid 1px #d3d3d3;
	border-left: solid 1px #d3d3d3;
	border-right: solid 1px #d3d3d3;
}

.ecInfoBoxRight {
	vertical-align: middle;
	text-align: right;
	margin: 10px;
}

.ecInfoBoxBorderFull {
	margin: 30px 0 30px 0;
	border: solid 1px #d3d3d3;
}

.ecInfoBoxFlex {
	display: flex;
	height: auto;
	padding: 5px;
}

.ecInfoBoxBorderFull th {
	width: 50%;
}

.ecInfoBoxBorderFull td {
	width: 50%;
}

.ecBtnBlock {
	margin-bottom: 40px;
/*	border: 2px solid #23ABDD;
	border-radius: 10px;
	padding: 18px;*/
}

.ecInfoBoxBorderLess {
	margin: 20px 0 20px 0;
}

.ecInfoBoxBorderLess input {
	float: none !important;
}

.creditCards img {
	width: 30%;
}

.formInput .creditCards img {
	width: 45%;
}

.ecRadiolabel {
	border: 1px solid #ddd;
	padding: 10px;
}

.ecRadiolabel input {
	margin-right: 5px;
}

.ecRadioNote {
	font-size: 90%;
	margin: 10px 0 10px 0;
}

.ecRadioForm {
	margin: 10px 0 10px 0;
}

/*画像サイズ調整用*/
.ecImg {
	width: 100%;
}

.epubPdf {
	font-size: 11px;
	border-radius: 3px;
	padding: 4px;
	margin-right: 4px;
	text-align: center;
	color: white;
	line-height: 11px;
}



.subscriptionThumbnail {
	width: 120px;
	height: 160px;
}

/*定期購読戻るボタン調整*/
.form .backSubscriptionBtn {
	background-color:#efefef;
	text-align: center;
	color: black;
	width: 80px;
	height: 36px;
	padding-left: 12px;
	transition: 400ms;
	border: 1px solid #d3d3d3;
}

.form .backSubscriptionBtn:hover {
	opacity: 0.5;
}

.form .backSubscriptionBtn::before{
	content: "";
	display: inline-block;
	position: absolute;
	width: 8px;
	height:8px;
	border-top: solid 1px #000;
	border-right: solid 1px #000;
	-webkit-transform: rotate(225deg);
	transform: rotate(225deg);
	background-size: contain;
	margin-left: -10px;
	margin-top: 4.5px;
}

/*商品一覧表示要素*/
.ecItemBold {
	font-weight: bold;
}

.ecItemBookName {
	font-size: 120%;
}

.ecItemBookPrice {
	font-size: 120%;
	font-weight: bold;
}

.ecItemBookPriceLg {
	font-size: 200%;
	font-weight: bold;
}

.ecItemBookPrice span {
	font-size: 80%;
}

.ecItemPoint {
	color: #C12510;
}

.ecItemPreOrder {
	color: #C12510;
	font-size: 100%;
	font-weight: bold;
}

.ecItemAuthor {
	font-size: 80%
}

.ecItemBox ul {
	padding-left: 3%;
	font-size: 90%;
}

.ecItemBox li {
	list-style:none;
	padding: 1px;
}

/*注意事項*/
.ecNoticeBox {
	vertical-align: middle;
	height: auto;
	border: solid 1px #d3d3d3;
	margin-bottom: 30px;
}

.ecNoticeBox h3 {
	text-align: left;
	background-color: #ffe6e6;
	color: #FF0000;
	padding: 5px 10px 5px 10px;
}

.ecNoticeBox p {
	margin: auto;
	padding: 10px;
}

.ecNotice {
	font-size: 85%;
}

.ecNote .ecNotice {
	padding-left: 1em;
}

.ecAdulationBtnBlock {
	background-color: #FFF;
	z-index: 9;
	top: 270px;
	margin: auto;
	text-align: center;
}

/*電子版定期購読詳細画面*/
.btnElectronicSubscription {
	text-align: center;
	color: white;
	width: 100%;
	height: 60px;
	padding-left: 10px;
	border-radius: 6px;
	font-weight: bold;
	font-size: 20px;
	background: url(/img/i_book_w-4f8dbd7e81cfbf41306923fe99398c0a.svg) 16px center no-repeat #23ABDD;
	background-size: 24px;
}

.btnElectronicSubscription:hover {
	opacity: 0.7;
	transition: 200ms;
}

.ecSubscriptionImg {
	width: 80%;
}

.ecSubscriptionHeadline {
	padding: 10px 0 10px 0;
}

.cartBtnSubscription {
	font-size: 14px;
	width: 100%;
	height: 50px;
	background: url(/img/cartWhite-6802ff1a8a512fa665a5d4ab5393b660.png) 10% center no-repeat;
	background-size: 20px;
	background-color: #000;
	color: white;
	padding-left: 25px;
	transition: 200ms;
}

/*定期購読状況確認画面*/
.ecBtnSubscriptionConfirmBlock {
	text-align: center;
	margin: 30px 0 30px 0;
}
.ecBtnSubscriptionConfirmBlock .btn {
	margin: 10px;
}

.divTitle {
	text-align: center;
}
.divTitle h3 {
	margin-top: 20px;
}
.ecCustomerInfo table {
	width: 100%;
	margin: 10px 0 10px 0;
}
.ecCustomerInfo th {
	padding-right: 10px;
	text-align: right;
}
.ecCustomerInfo td {
	padding-left: 10px;
	text-align: left;
}

.breakWord {
	overflow-wrap: anywhere;
}

/*金額確認ボックス用*/
.ecConfirmImg img {
	width: 40px;
}
.ecItemBox .totalAmount {
	width: 100%;
	font-size: 100%;
	text-align: right;
}
.totalAmountColumn {
	text-align: right;
	display: flex;
} 
.ecSmallText {
	font-size: 60%;
}

/*ポイント,クーポン関連*/
.ecFormPoint {
	padding: 35px 0 35px 40px;
}

/*最終確認*/
.btnOrderComplete {
	background-color: #FF4040;
	text-align: center;
	color: white;
	width: 214px;
	height: 46px;
	padding-left: 12px;
}
.btnOrderComplete:hover {
	opacity: 0.5;
}
.btnOrderComplete::before{
	content: "";
	display: inline-block;
	position: absolute;
	width: 8px;
	height:8px;
	border-top: solid 1px #FFF;
	border-right: solid 1px #FFF;
	-webkit-transform: rotate(225deg);
	transform: rotate(45deg);
	background-size: contain;
	margin-left: -30px;
	margin-top: 7px;
}
.ecNote h3 {
	margin-bottom: 20px;
}
.ecNote > div {
	width: 100%;
	border: 1px solid #ccc;
	text-align: center;
	padding: 20px 0 0;
	margin-top: 10px;
}

/*注文完了*/
.ecLink {
	text-decoration: underline;
}

/*書籍詳細カート情報レイアウト調整*/
.detailCartBoxPC {
	font-size: 12px;
	width: 240px;
	margin-right: 0;
	margin-bottom: 0;
	float: right;
}

.detailCartBoxSP {
		display: none;
}

@media screen and (max-width: 640px){
	.detailCartBoxPC {
		display: none;
	}
	
	.detailCartBoxSP {
		font-size: 12px;
		width: 100%;
		display: block;
		margin-bottom: 40px;
	}
}

/*電子書籍本棚画面*/
.ecBookShelfIconBox .sortAndList {
	display: flex;
	justify-content: center;
}

@media screen and (max-width: 640px){
	.ecBookShelfIconBox {
		display: block !important;
	}
	
	.ecBookShelfIconBox .ecBookShelfIconBox{
		text-align: center;
	}
	
	.ec .searchList .listTitle {
		border-bottom-style: solid;
	}
	
	.ec .ecBookShelfIconBox input#searchBox {
		width: 90%;
	}
	
	.ec .ecBookShelfIconBox button#searchButton {
		top: 12px;
		right: 10px;
		margin-left: -20px;
	}
}

.ecBookShelfIcon {
	width: 21px;
}

.ecBookShelfIconBox {
	display: flex;
	justify-content: space-between;
}

.ecBookShelfIconBox div {
	margin: 0 5px 0 5px;
}

.btnNoneTransition {
	background-color:black;
	text-align: center;
	color: white;
	width: 234px;
	height: 46px;
	font-size: 14px;
	line-height: 46px;
	transition: 400ms;
	cursor: pointer;
}
.btnBlockLargeBottom {
	width: 234px;
	height: 46px;
	margin: 80px auto 80px auto;
}

.ec input#searchBox {
	height:28px;
	padding: 0 30px 0 10px;
	border-radius:20px;
	outline:0;
	border: 1px solid #d3d3d3;
	width: 220px;
	font-size: 12px;
}

.ec button#searchButton {
	height:30px;
	border:none;
	font-size:13px;
	position: relative;
	right: 30px;
	padding-left: 7px;
	line-height: 13px;
	top: -1px;
	width: 20px;
    background-image: url(/img/search-icon-771cd86672130870c0ebabb924a9c5ec.svg);
    background-size: 60%;
    background-position: center;
}

/*ボックス表示*/
.searchList .bookShelfListBox a:hover {
	opacity: 1;
}

.searchList .bookShelfListBox {
	display: flex;
	flex-wrap:wrap;
}

.searchList .bookShelfListBox .item {
	margin-bottom: 30px;
	margin-right: 65px;
	width: 140px;
}
.searchList .bookShelfListBox .item:nth-child(5n) {
     margin-right: 0px;
}

@media screen and (max-width: 640px){
	.searchList .bookShelfListBox {
		justify-content: space-around;
	}
	
	.searchList .bookShelfListBox .item {
		margin-right: 0;
	}
}

.searchList .bookShelfListBox .itemImg,
.searchList .purchased .itemImg,
.searchList .bookShelfList .itemImg {
    margin-bottom: 10px;
}

.searchList .bookShelfListBox .itemImg img, 
.searchList .purchased .itemImg img,
.searchList .bookShelfList .itemImg img {
	border: 1px solid #efefef;
	width: 140px;
	height: 186px;
}

.searchList .bookShelfList .ecDlBtn {
	width: 140px;
	margin: 0;
}

.searchList .bookShelfList .item .itemImg a:hover {
	opacity: 0.5;
}

.searchList .bookShelfList .item a:hover {
	opacity: 1;
}

.mypageMenu img {
	max-height: 80px;
	max-width: 100px;
	margin-top: 20px;
}

.pdf ,
.epub ,
.new,
.preOrderItem,
.paper {
	font-size: 11px;
	border-radius: 3px;
	padding: 4px;
	margin: 0 5px 5px 0;
	text-align: center;
	color: white;
	line-height: 11px;
	height: 100%;
}

.ecItemFormat {
	display: flex;
	align-items: center;
}

.ecItemFormat .pdf,.paper {
	margin-left: 5px;
}

.pdf{
	background-color: #ff7800;
}

.epub {
	background-color: #52abd2;
}

.new {
	background-color: #32CD32;
}

.preOrderItem {
	background-color: #3450a4;
}

.paper {
	background-color: #8c6ccb;
	white-space: nowrap;
}

.sale {

	background-color: #cc1919;
	font-size: 11px;

	border-radius: 3px;

	color: #fff;

	line-height: 11px;
	font-weight: bold;
	padding: 4px;
	float: none;

	display: inline-block;
	margin-bottom: 5px;
	margin-right: 5px;
}

.pointup {
	font-size: 11px;
	border-radius: 3px;
	color: white;
	line-height: 11px;
	color: #dd9900;
	border: 1px solid #dd9900;
	font-weight: bold;
	background: url(../image/common/i_pointup.svg) left center no-repeat #ffffff;
	background-size: 18px;
	padding: 5px 4px 4px 20px;
	float: none;
	display: inline-block;
	margin-top: 3px;
}

.paper,
.pdf {
	margin: 5px !important;
}

.bookShelfListBox .ecDlBtn,
.purchased .ecDlBtn {
	width: 100%;
}

/* ダウンロード画面 */
.dlBtn {
	font-size: 14px;
	width: 100%;
	height: 50px;
	background-color: #000;
	color: white;
	transition: 200ms;
}

.dlTable {
	width: 100%;
	text-align: left;
	padding: 20px;
	line-height: 26px;
	margin-bottom: 30px;
	background-color: #fff7e7;
	border-collapse: initial;
}

.dlTable th {
	text-align: left;
    padding-right: 5px;
    white-space: nowrap;
}

@media screen and (max-width: 640px){
	.ecDetailBox {
		width: 94%;
		margin: auto;
	}
}

@media screen and (min-width: 641px){
	.ecDetailBox {
		display: flex;
		/* width: 98%; */
		margin: auto;
	}
	.detailDlDisp {
		display: none;
	}
}

/*マイページメニュー表示*/

.mypageMenu {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 20px;
}

.mypageMenu:after {
	content: "";
  display: block;
  width: 32%;
  height: 0;
}

@media screen and (min-width: 641px){
	.mypageMenu .mypageMenuItem {
		width: 32%;
		height: 90px;
		margin-bottom: 2%;
	}
}
@media screen and (max-width: 640px){
	.mypageMenu .mypageMenuItem {
		width: 48.5%;
		height: 70px;
		margin-bottom: 3%;
	}
}

.mypageMenu .mypageMenuItem a {
	text-align: left;
	font-size: 16px;
	height: 100%;
	display:flex;
	align-items: center;
	justify-content: left;
	color: white;
	padding-left: 36px;
	padding-right: 10px;
	line-height: 140%;
	border-radius: 6px;
	background: url(/img/arrow_w-196a0b4c9d9328a0e0f229a0770869fb.svg) 16px center no-repeat #999;
	background-size: 10px;
	transition: 200ms;
}

.mypageMenu .mypageMenuItem a:hover  {
	background-color: #000;
}

/*定期購読*/
.stylRed {
	color: #cc1919;
}
.ecSubscriptionLi {
	width: 100% !important;
	text-indent: -1em;
   	padding-left: 1em;
   	margin-left: 0 !important;
}
.ecSubscriptionLi li:before {
	position: static;
}
.ecSubscriptionLi li{
	padding-left: 0 !important;
}
.ecCheckbox {
	float: none !important;
	padding: 10px 10px !important;
}
@media screen and (max-width: 640px){
	.ecInfoBoxBorderLess .ecItemPoint {
		margin: 10px 0;
		display: block;
	}
}
.form .ecFormTextInline {
	font-size: 12px;
	color: #666666;
	margin-bottom: 10px;
	clear: both;
}
.ecNoticeIndent {
	text-indent: -1em;
   	padding-left: 1em;
}
.ecNoticeIndent:before {
	content: "・";
	color: #FF0000;
	position: absolute;
}
.subscriptionTermKenchi {
	padding-left: 2em;
}
.subscriptionTermBuilders {
	padding-left: 2em;
}
.ecLinkBtn {
	background-color: #333;
	height: 32px;
	color: white;
	float: left;
	width: 120px;
	margin-bottom: 20px;
}
.ecLinkBtnInner {
	background-size: 14px;
	padding-left: 15%;
	padding-top: 8px;
	font-size: 12px;
}
.ecLinkBtnOrder {
	width: 214px;
	margin: 20px auto;
}
/*支払情報編集*/
.paymentImg {
	vertical-align: middle;
}
input[name="paymentDefault"] {
	margin-left: 10px;
}
.paymentEdit {
	display: flex;
	width: 100%;
	align-items: center;
	text-align: center;
}
.paymentEdit1 {
	width: 25%;	
}
.paymentEdit2 {
	width: 25%;	
}
.paymentEdit3 {
	width: 25%;	
}
.paymentEdit4 {
	width: 25%;	
}
.subscripsionConfirm {
	margin: 15px 0 15px 0;
}
.subscripsionConfirm h4 {
	margin: 5px;
}
.subscripsionConfirm span {
	margin: 5px;
}
.expirationDate select{
	width: 5em;
}
.paymentFlowImg {
	text-align:center;
	width:100%;
}
.paymentFlowImg img {
	width: 50%;
}
@media screen and (max-width: 640px){
	.paymentFlowImg img {
		width: 100%;
		margin-bottom: 10px;
	}
}
/*支払編集モーダル*/
/*モーダルを開くボタン*/
.modal-open{
	/*
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  width: 300px;
  height: 50px;
  font-weight: bold;
  color: #fff;
  background: #000;
  margin: auto;
  cursor: pointer;
  transform: translate(-50%,-50%);*/
}
/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(0,0,0,50%);
  padding: 40px 20px;
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  box-sizing: border-box;
  z-index:1000;
}
/*モーダル本体の擬似要素の指定*/
.modal-container:before{
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active{
  opacity: 1;
  visibility: visible;
}
/*モーダル枠の指定*/
.modal-body{
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 90%;
  z-index: 1001;
}
/*モーダルを閉じるボタンの指定*/
.modal-close{
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -40px;
  right: -40px;
  width: 40px;
  height: 40px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
}
/*モーダル内のコンテンツの指定*/
.modal-content{
  background: #fff;
  text-align: left;
  padding: 30px;
}

/*ヘッダーお知らせ*/

.notification {
    display: inline-block;
    position: relative;
}

.notification > div {
    cursor: pointer;
}

.notification > span {
    display: flex;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    padding: .5em 1em;
    border-radius: 3px;
    background-color: #efefef;
    color: #000;
    font-size: .7em;
    white-space: nowrap;
    transition: opacity .3s;
}

.notification > span::before {
    position: absolute;
    top: -6px;
    width: 9px;
    height: 6px;
    background-color: inherit;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    content: '';
}

.notification:hover > span {
    visibility: visible;
    opacity: 1;
}

/* xkhpのメッセージ表示 */
.alert {
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
}

.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}

.wordBreak{
	word-break: break-word;
}

.item-thumbnail{
	width: 120px;
	height: 160px;
}

.mt-1 {	margin-top: 10px;	}
.mt-2 {	margin-top: 30px;	}
.mt-3 {	margin-top: 50px;	}
.mt-4 {	margin-top: 70px;	}
.mt-5 {	margin-top: 90px;	}

@media screen and (min-width: 641px){
	.negative {
		position: relative;
		top: 4px;
		display: inline-block;
	}
}
@media screen and (max-width: 640px){
	.negative {
		position: relative;
		top: 3px;
		display: inline-block;
	}
}

.ecMember.address-box {
      border: 1px solid #333;
      padding: 16px;
      margin-bottom: 20px;
      max-width: 500px;
      font-family: sans-serif;
    }

.ecMember.label-title {
  font-weight: bold;
  margin-bottom: 4px;
  margin-top: 4px;
}

.ecMember.delivery-address {
  margin-left: 1em;
}

.ecMember.checkbox-area {
  margin-top: 12px;
  padding: 8px;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
  font-size: 14px;
}

.warnArea {
	text-align: left;
	background-color: #ffe6e6;
	color: #FF0000;
	padding: 2px 5px 2px 5px;
}

.warnArea p {
	margin: auto;
	padding: 10px;
}

.sym {
	margin-left: 0.3em; 
}

.ecPhone {
	float: none !important;
}

.ecPhoneDiv {
	width: 100%;
	clear: both;
	display: block;
	margin: 10px 0 0;
}