@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
	2020 renewal
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body {
	line-height: 1;
    position: relative;
}

* {
	box-sizing: border-box;
	word-break: break-all;
}

#container,
header {
	position: relative;
}

img {
	vertical-align: bottom;
}

.clearfix:after {
	display: table;
	clear: both;
	content: '';
}

/* ----------------------------------------------------
	wrapper
---------------------------------------------------- */
#main-container-wrap {
	width: 1240px;
	margin: 30px auto 0;
	display: flex;
	justify-content: center;
	flex-wrap: nowrap;
}

#main-container-wrap::after {
	content: "";
	clear: both;
	display: block;
}

/* 左右カラム無しの場合 */
.col-main {
	/*float: left;
	margin-left: 270px;*/
	width: 760px;
    min-width: 760px;
    margin: 0 auto;
}

.col-main.two-column {
    /*float: left;*/
	/*margin-left: 270px;*/
    margin-left: 30px;
}


.col-main.two-column.left-fixed {
    margin-left: 270px;
}

#sidebar-wrap {
    position: relative;
}

#sidebar .np-keyword-suggest,
#sidebar .np-keyword-suggest div {
    width: 380px;
}

#sidebar .np-keyword-suggest .item {
    height: 25px;
    line-height: 25px;
}

#sidebar .np-keyword-suggest .item .clearHistory {
    position: absolute;
    right: 5px;
    width: 25px;
    height: 23px;
    border: none;
    background: url(/user_data/books/packages/default/img/icon/icon_cross_mark_blk.svg) no-repeat center center;
    background-size: 12px 12px;
    cursor: pointer;
    font-size: 0;
}

#sidebar .np-keyword-suggest .item.selected {
     color:#fff;
}

#sidebar .np-item-suggest {
    width: 380px;
    top: 30px !important;
    left: 380px !important;
}

#sidebar .np-item-suggest > div > div {
    font-size: 14px !important;
    text-align: center;
    padding: 10px 0;
}

#sidebar .np-item-suggest table tr {
    border-bottom: 1px solid #ccc;
}

#sidebar .np-item-suggest table tr td {
    text-align: left;
}

.col-l {
	/*float: left;*/
	width: 240px;
	z-index: 100;
}

.col-l a:hover {
	text-decoration: none;
}

.col-l.fixed {
    position: fixed;
    bottom: 10px;
}

.col-l.under {
    position: absolute;
    bottom: 0;
}

.col-r {
	/*float: right;*/
    margin-left: 30px;
	width: 180px;
}

header .block,
header .block,
.col-main-top .w-sec,
.footer-wrap .footer-area .block {
	width: 1240px;
	margin: 0 auto;
}

.col-l .block,
.col-r .block {
	margin: 20px 0;
}

.col-main-top .block {
	margin: 70px 0;
}

.col-main .block {
	margin: 60px 0;
}

::placeholder {
	color: #ccc;
}

/* ----------------------------------------------------
	書体
---------------------------------------------------- */
.heading {
	font-family: 'Marcellus', serif;
	letter-spacing: 3px;
	font-weight: 500;
}

.heading_mim,
.col-l .selection-gender a,
.col-main .pagination .num {
	font-family :'游明朝','Yu Mincho','游明朝体','YuMincho','ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','HiraMinProN-W3','HGS明朝E','ＭＳ Ｐ明朝','MS PMincho',serif;
	font-weight: bold;
}

/* IEの游明朝なし対応 */
@media all and (-ms-high-contrast:none){
	.yumincho,
	.col-l .selection-gender a {
		font-family: “ヒラギノ明朝 ProN W3”, “Hiragino Mincho ProN”, “HG明朝E”, “ＭＳ Ｐ明朝”, “ＭＳ 明朝”, serif;
		font-weight: bold;
	}
}

/* ----------------------------------------------------
	位置
---------------------------------------------------- */
.tac {
	text-align: center;
}

.tal {
	text-align: left;
}

.tar {
	text-align: right;
}

/* ----------------------------------------------------
	モーダル
---------------------------------------------------- */
.modal-win {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 500px;
	z-index: 9800;
	background: #fff;
	transform: translate(-50%, -50%);
	border-radius: 10px;
	padding-bottom: 25px;
}

.modal-win.brand {
	width: 760px;
}

.modal-win .tl {
	text-align: center;
	font-size: 20px;
	background: #f8f8f8;
	border-radius: 10px 10px 0 0;
	padding: 20px 0;
	margin-bottom: 25px;
}

.modal-win .img {
	width: 230px;
	margin: 0 auto;
}

.modal-win .img img {
	width: 100%;
}

.modal-win .btn-search-split {
	display: flex;
	justify-content: space-between;
	width: 320px;
	margin: 0 auto;
}

.modal-win .btn-search-split li {
	width: calc((99.99% - 20px) / 2);
}

.modal-win .btn-search-split,
.modal-win .btn-search-magazine {
	margin-top: 15px;
	font-size: 14px;
}

.modal-win .btn-search-split a,
.modal-win .btn-search-magazine a,
.modal-win .btn-search-split input[type="reset"],
.modal-win .btn-search-split input[type="button"] {
	display: block;
	border-radius: 100px;
	font-weight: bold;
	text-align: center;
}

.modal-win .btn-search-split input[type="reset"],
.modal-win .btn-search-split input[type="button"] {
	line-height: 1;
	padding: 5px;
	width: 100%;
	cursor: pointer;
}

.modal-win .btn-search-split a {
	padding: 5px;
	border: 3px solid #ffec9d;
}

.modal-win .btn-search-magazine a {
	width: 320px;
	margin: 0 auto;
	background: #ffec9d;
	padding: 10px 0;
}

.modal-win .btn-search-split a:hover,
.modal-win .btn-search-magazine a:hover,
.modal-win .btn-search-split input[type="reset"]:hover,
.modal-win .btn-search-split input[type="button"]:hover {
	text-decoration: none;
	opacity: .7;
}

.modal-win .btn-search-split input[type="reset"] {
	background: none;
	border: 3px solid #ffec9d;
}

.modal-win .btn-search-split input[type="button"] {
	background: #ffec9d;
	border: 3px solid #ffec9d;
}

.modal-win.brand .brand-area {
	padding: 0 40px;
}

.modal-win.brand .brand-area .sub-tl {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.modal-win.brand .brand-area .sub-tl .heading_mim {
	font-size: 16px;
}

.modal-win.brand .brand-list-result {
	overflow: auto;
	width: 100%;
	height: 250px;
	margin: 15px 0 20px;
	padding-right: 10px;
}

.modal-win.brand .brand-list-result > ul > li {
	border-bottom: 1px solid #ddd;
}

.modal-win.brand .brand-list-result > ul >li:first-of-type {
	border-top: 1px solid #ddd;
}

.modal-win.brand .brand-list-result input[type="checkbox"] {
  display: none;
}

.modal-win.brand .brand-list-result input[type="checkbox"]:checked + p {
	position: relative;
}

.modal-win.brand .brand-list-result input[type="checkbox"]:checked + p::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 13px;
  margin: auto;
  width: 5px;
  height: 10px;
  transform: rotate(40deg);
  border-bottom: 2px solid #777;
  border-right: 2px solid #777;
}

.modal-win.brand .brand-list-result input + p {
	padding: 12px 10px;
}

.modal-win.brand .brand-list-result input + p.active,
.modal-win.brand .brand-list-result input + p:hover {
	background: #fff5c9;
}

/* モーダルClose */
.modal-win button.mfp-close {
	width: 40px;
	height: 40px;
	position: absolute;
	bottom: -55px;
	right: 0;
	left: 0;
	top: auto;
	margin: auto;
	cursor: pointer;
	background: none;
	border: 0;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	line-height: 1;
	opacity: 1;
}

.modal-win button.mfp-close:before {
	content: '';
	position: absolute;
	top: 18px;
	left: 0;
	width: 40px;
	height: 2px;
	background: #fff;
	display: inline-block;
	transform: rotate(45deg);
}

.modal-win button.mfp-close:after {
	content: '';
	position: absolute;
	top: 18px;
	left: 0;
	width: 40px;
	height: 2px;
	background: #fff;
	display: inline-block;
	transform: rotate(-45deg);
}

/* overlay at start */
.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-bg.mfp-removing {
  opacity: 0;
}
/* content at start */
.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* content animate out */
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

/* ----------------------------------------------------
	header
---------------------------------------------------- */
.header-site {
	border-bottom: 1px solid #e1e1e1;
}

.header-site > ul {
	display: flex;
}

.header-site li {
	margin-right: 30px;
}

.header-site li a {
	padding: 8px 0;
	display: block;
	color: #bababa;
}

.header-site a:hover {
	text-decoration: none;
	color: #525252;
}

.header-site .selected {
	border-bottom: 3px solid #777;
}

.header-site .selected a {
	color: #525252;
}

.header-area {
	padding: 12px 0;
}

.header-area .header-area-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.header-area .thinBanner-area a {
	display: block;
	width: 300px;
}

.header-area .thinBanner-area a:hover {
	opacity: .7;
}

.header-area .thinBanner-area img {
	width: 100%;
}

.header-area .site-function {
	flex: 1;
}

.header-area .site-function > ul {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.header-area .site-function .login {
	padding-right: 10px;
}

.header-area .site-function .login a {
	border: 1px solid #333;
	padding: 5px 10px;
	border-radius: 4px;
}

.header-area .site-function .login a:hover {
	background: #f0f0f0;
	text-decoration: none;
}

.header-area .site-function .magazine,
.header-area .site-function .mypage,
.header-area .site-function .cart,
.header-area .site-function .sns_facebook,
.header-area .site-function .sns_instagram {
	width: 55px;
}

.header-area .site-function .magazine a,
.header-area .site-function .mypage a,
.header-area .site-function .cart a,
.header-area .site-function .sns_facebook a,
.header-area .site-function .sns_instagram a {
	display: block;
	width: 40px;
	height: 25px;
	margin: 0 0 0 auto;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	font-size: 0;
}

.header-area .site-function .cart {
	position: relative;
}

.header-area .site-function .magazine a {
	background: url("/user_data/books/packages/default/img/icon/icon_mail.svg") center center / contain no-repeat;
}

.header-area .site-function .mypage a{
	background: url("/user_data/books/packages/default/img/icon/icon_mypage.svg") center center / contain no-repeat;
}

.header-area .site-function .cart a {
	background: url("/user_data/books/packages/default/img/icon/icon_cart.svg") center center / contain no-repeat;
}

.header-area .site-function .sns_facebook a {
	background: url("/user_data/books/packages/default/img/icon/icon_sns_facebook.svg") center center / contain no-repeat;
}

.header-area .site-function .sns_instagram a {
	background: url("/user_data/books/packages/default/img/icon/icon_sns_instagram.svg") center center / contain no-repeat;
}

.header-area .site-function .magazine a:hover,
.header-area .site-function .mypage a:hover,
.header-area .site-function .cart a:hover,
.header-area .site-function .sns_facebook a:hover,
.header-area .site-function .sns_instagram a:hover {
	opacity: .7;
}

.header-area h1 {
	width: 250px;
}

.header-area h1 a {
	/*
	background: url(../img/header/n_logo.png);
	*/
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/n_logo.png) no-repeat;
	background-size: contain;
	display: block;
	width: 160px;
	height: 36px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.header-area h1 a:hover {
	opacity: .7;
}

.header-area-sub {
	background: #333;
}

.header-area-sub .block {
	display: flex;
	justify-content: flex-end;
}

.header-area-sub .block li {
	padding: 5px 0 5px 20px;
}

.header-area-sub a {
	color: #ddd;
}

.header-area-sub a::before {
	content: "\f105";
	font-family: FontAwesome;
	display: inline-block;
	margin-right: 5px;
}


/* global navi */
#global-nav {
	border-bottom: 1px solid #e1e1e1;
}

#global-nav ul {
	margin: 0 auto;
	border-left: 1px solid #e1e1e1;
	border-right: 1px solid #e1e1e1;
	display: flex;
	flex-wrap: wrap;
}

#global-nav li {
	width: calc(99.99% / 7); /* IEズレ対応 */
	border-right: 1px solid #e1e1e1;
	box-sizing: border-box;
	font-size: 0;
}

#global-nav li:nth-of-type(7n+7) {
	border-right: 0;
}

#global-nav li:nth-of-type(-n+7) {
	border-bottom: 1px solid #e1e1e1;
}

#global-nav li a {
	display: block;
	height: 50px;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
}

#global-nav .selestory a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_selestory.png) no-repeat center top;
}

#global-nav .hers a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_hers.png) no-repeat center top;
}

#global-nav .very a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_very.png) no-repeat center top;
}

#global-nav .classy a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_classy.png) no-repeat center top;
}

#global-nav .jj a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_jj.png) no-repeat center top;
}

#global-nav .kokodeplus a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokodeplus.png) no-repeat center top;
}

#global-nav .mart a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_mart.png) no-repeat center top;
}

#global-nav .wakosroom a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_wako.png) no-repeat center top;
}

#global-nav .kokode_travel a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_travel.png) no-repeat center top;
}

#global-nav .kids_baby a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kids_baby.png) no-repeat center top;
}

#global-nav .first_floor a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_first_floor.png) no-repeat center top;
}

#global-nav .kokode_lo a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_lo.png) no-repeat center top;
}

#global-nav .kokode_west a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_west.png) no-repeat center top;
}

#global-nav .kokode_beauty_annex a {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/kokode_beauty_annex.png) no-repeat center top;
}

#global-nav li a:hover {
	background-position: center -50px;
}

#global-nav .selestory a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_selestory.png) no-repeat,#000;
}

#global-nav .hers a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_hers.png) no-repeat,#000;
}

#global-nav .very a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_very.png) no-repeat,#000;
}

#global-nav .classy a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_classy.png) no-repeat,#000;
}

#global-nav .jj a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_jj.png) no-repeat,#000;
}

#global-nav .kokodeplus a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokodeplus.png) no-repeat,#000;
}

#global-nav .mart a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_mart.png) no-repeat,#000;
}

#global-nav .wakosroom a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_wako.png) no-repeat,#000;
}

#global-nav .kokode_travel a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_travel.png) no-repeat,#000;
}

#global-nav .kids_baby a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kids_baby.png) no-repeat,#000;
}

#global-nav .first_floor a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_first_floor.png) no-repeat,#000;
}

#global-nav .kokode_lo a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_lo.png) no-repeat,#000;
}

#global-nav .kokode_west a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/nav_kokode_west.png) no-repeat,#000;
}

#global-nav .kokode_beauty_annex a.active {
	background: url(//data.kokode.jp/user_data/books/packages/default/img/header/kokode_beauty_annex.png) no-repeat,#000;
}

#global-nav .selestory a.active,
#global-nav .hers a.active,
#global-nav .very a.active,
#global-nav .classy a.active,
#global-nav .jj a.active,
#global-nav .kokodeplus a.active,
#global-nav .mart a.active,
#global-nav .wakosroom a.active,
#global-nav .kokode_travel a.active,
#global-nav .kids_baby a.active,
#global-nav .first_floor a.active,
#global-nav .kokode_lo a.active,
#global-nav .kokode_west a.active,
#global-nav .kokode_beauty_annex a.active {
	background-position: center -100px;
}

/* パンくず　既存打ち消し　再構成 */
.breadcrumb {
	height: auto;
	padding: 8px 0;
	border-top: 0;
}

.breadcrumb .cnt,
.top_breadcrumb .cnt {
	width: 1240px;
}

.top_breadcrumb {
	margin: 0 auto;
	height: auto;
	padding: 0;
}

.breadcrumb ul, .top_breadcrumb ul {
	width: auto;
	display: flex;
	align-items: center;
}

.breadcrumb li, .top_breadcrumb li {
	height: auto;
	padding: 0;
}

.breadcrumb li, .top_breadcrumb li,
.breadcrumb li:first-child, .top_breadcrumb li:first-child,
.breadcrumb li:last-child, .top_breadcrumb li:last-child {
	float: none;
}

.breadcrumb li:first-child, .top_breadcrumb li:first-child {
	margin-right: 10px;
	padding-right: 12px;
}

.breadcrumb li:last-child, .top_breadcrumb li:last-child {
	padding-top: 0;
}

.breadcrumb .home, .top_breadcrumb .home {
	margin: 0;
	height: auto;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background-position: center;
	padding: 8px 0;
}

/* ----------------------------------------------------
	footer
---------------------------------------------------- */
.footer-wrap {
	margin-top: 130px;
}

.footer-wrap .official-site .heading,
.footer-wrap .official-shop .heading {
	color: #ba9f76;
	text-align: center;
	padding: 5px;
	font-size: 14px;
	font-weight: bold;
}

.footer-wrap .official-site .heading {
	background: #333;
}

.footer-wrap .official-shop .heading {
    background: #f8f8f8;
}

.footer-wrap .official-site .detail-list,
.footer-wrap .official-shop .detail-list {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 20px 0;
}

.footer-wrap .official-site .detail-list li,
.footer-wrap .official-shop .detail-list li {
	padding: 0 10px
}

.footer-wrap .official-site .detail-list a,
.footer-wrap .official-shop .detail-list a {
	display: block;
}

.footer-wrap .official-site .detail-list a:hover,
.footer-wrap .official-shop .detail-list a:hover {
	opacity: .7;
}

.footer-wrap .footer-area {
	background: #333;
	color: #ddd;
	padding: 10px 0 40px;
}

.footer-wrap .footer-area a {
	color: #ddd;
}

.footer-wrap .footer-area .block {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.footer-wrap .footer-area .footer-nav ul {
    display: flex;
}

.footer-wrap .footer-area .footer-nav li {
    padding-left: 20px;
}

.footer-wrap .footer-area .footer-nav li::before {
	content: "\f105";
	font-family: FontAwesome;
	font-weight: bold;
	margin-right: 5px;
}

.pagetop {
	position: fixed;
	right: 30px;
	width: 45px;
	height: 45px;
	background: #333;
	border-radius: 100%;
	z-index: 10000;
}

.pagetop::after {
	content: "";
	position: absolute;
	width: 10px;
	height: 10px;
	border-top: #ba9f76 3px solid;
	border-left: #ba9f76 3px solid;
	transform: rotate(45deg);
	top: 5px;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.pagetop:hover {
	opacity: .7;
}

/* ----------------------------------------------------
	左カラム
---------------------------------------------------- */
.col-l .select {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

.col-l .select::after {
	content: "";
	position: absolute;
	width: 6px;
	height: 6px;
	transform: rotate(135deg);
	top: 0;
	bottom: 0;
	margin:  auto;
	right: 10px;
	cursor: pointer;
}

.col-l .select::after {
	border-top: 1px solid #333;
	border-right: 1px solid #333;
}

.col-l select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	border: none;
	padding: 5px 5px 5px 10px;
	width: 100%;
	margin-top: 6px;
}

.col-l select::-ms-expand {
	display: none;
}


/* 背景色あり */
.col-l .tl-search,
.col-l .selection-magazine_brand,
.col-l .selection-price,
.col-l .selection-stock {
	background: #333;
}

.col-l .selection-magazine_brand,
.col-l .selection-price,
.col-l .selection-stock {
	color: #ddd;
	padding: 20px 10px;
}

.col-l .tl-search {
	padding: 10px;
	font-size: 20px;
	text-align: center;
	color: #fff;
}

.col-l .btn-search,
.col-l .btn-reset {
	border-radius: 4px;
	border: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: #ba9f76;
	display: inline-block;
	width: 60px;
	color: #fff;
	cursor: pointer;
	padding: 1px 0;
}

.col-l .btn-search:hover {
	background: #9b8763;
}

.col-l .btn-search:active,
.col-l .btn-reset:active {
	opacity: .7;
}

.col-l .btn-reset {
	background: none;
	border: 1px solid #ba9f76;
	color: #ba9f76;
}

.col-l .btn-reset:hover {
	border-color: #9b8763;
	color: #9b8763;
}

.col-l .search-keyword-wrap {
	position: relative;
	margin-top: 2px;
	border: 2px solid #333;
}

.col-l .search-keyword {
  padding: 5px;
  border: none;
  outline: none;
  width: calc(100% - 35px);
}

.col-l .btn-search-keyword {
	background: url("/user_data/books/packages/default/img/icon/icon_search.svg") center center / 15px no-repeat,#f0f0f0;
	border: 0;
	width: 35px;
	cursor: pointer;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
}

.col-l .btn-search-keyword:hover {
	opacity: .7;
}

.col-l .selection-gender {
	background: #f8f8f8;
	padding: 10px;
}

.col-l .selection-gender a {
	font-weight: bold;
}

.col-l .selection-gender a.active,
.col-l .selection-gender a:hover {
	background: #fff;
}

.col-l .selection-gender a:hover,
.col-l .selection-gender a:hover:before {
	transition: .3s;
}

.col-l .selection-gender .all {
	display: block;
	background: #f0f0f0;
	border-radius: 100px;
	text-align: center;
	padding: 5px;
	margin-top: 10px;
}

.col-l .selection-gender ul {
	display: flex;
	justify-content: space-between;
}

.col-l .selection-gender li > a {
	background: #f0f0f0;
	border-radius: 50%;
	width: 53px;
	height: 53px;
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	transition: .3s;
}

.col-l .selection-gender li > a:hover:before {
	transform: scale(1.1);
}

.col-l .selection-gender li > a.active:hover:before {
	transform: scale(1);
}

.col-l .selection-gender li > a::before {
	content: "";
	position: absolute;
	bottom: 10px;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 34px;
	height: 34px;
}

.col-l .selection-gender li > a.kids::before {
	width: 17px;
}

.col-l .selection-gender li > a.men::before {
	background: url("/user_data/books/packages/default/img/icon/icon_man_off.svg") no-repeat center bottom;
}

.col-l .selection-gender li > a.women::before {
	background: url("/user_data/books/packages/default/img/icon/icon_woman_off.svg") no-repeat center bottom;
}

.col-l .selection-gender li > a.kids::before {
	background: url("/user_data/books/packages/default/img/icon/icon_kids_off.svg") no-repeat center bottom;
}

.col-l .selection-gender li > a.men.active::before,
.col-l .selection-gender li > a.men:hover::before {
	background: url("/user_data/books/packages/default/img/icon/icon_man_on.svg") no-repeat center bottom;
}

.col-l .selection-gender li > a.women.active::before,
.col-l .selection-gender li > a.women:hover::before {
	background: url("/user_data/books/packages/default/img/icon/icon_woman_on.svg") no-repeat center bottom;
}

.col-l .selection-gender li > a.kids.active::before,
.col-l .selection-gender li > a.kids:hover::before {
	background: url("/user_data/books/packages/default/img/icon/icon_kids_on.svg") no-repeat center bottom;
}

.col-l .selection-magazine_brand .tl-magazine_brand {
	text-align: center;
	font-size: 16px;
}

.col-l .selection-magazine_brand .select-brand {
	display: block;
	border: 1px solid #ddd;
	border-radius: 4px;
	color: #ddd;
	position: relative;
	padding: 5px 10px;
}

.col-l .selection-magazine_brand .select-brand:hover {
	background: #424242;
}

.col-l .selection-magazine_brand .select-brand::after {
	content: "\f0da";
	font-family: FontAwesome;
	position: absolute;
	right: 10px;
}

.col-l .selection-magazine_brand .select-media-block {
	margin-left: -10px;
	margin-right: -10px;
}

.col-l .selection-magazine_brand .select-media {
	background: #555;
	padding: 5px 10px;
	font-weight: bold;
	font-size: 11px;
	border-bottom: 1px solid #777;
}

.col-l .selection-magazine_brand .select-brand-list li {
	padding: 8px 20px 8px 10px;
	border-bottom: 1px solid #777;
	position: relative;
	cursor: pointer;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.col-l .selection-magazine_brand .select-brand-list li::after {
	content: "";
	position: absolute;
	right: 10px;
	top: 0;
	bottom: 0;
	margin: auto;
	background: url("/user_data/books/packages/default/img/icon/icon_cross_mark.svg") center center / contain no-repeat;
	width: 7px;
	height: 7px;
}

.col-l .selection-magazine_brand .select-brand-list li:hover {
	background: #424242;
}

.col-l .selection-category {
	border-top: 3px solid #333;
	border-bottom: 3px solid #333;
}

.col-l .selection-category .tl-category {
	font-size: 16px;
	padding: 10px;
	border-bottom: dotted 1px #ececec
}

.col-l .selection-category .category-list a {
	display: block;
	color: #8d8d8d;
	padding: 10px;
	line-height: 1.6;
}

.col-l .selection-category .category-list > li {
	position: relative;
}

.col-l .selection-category .category-list > li > a {
	border-bottom: dotted 1px #ececec;
}

.col-l .selection-category .category-list > li > a:hover,
.col-l .selection-category .category-list > li > a.active {
	background: #f0f0f0;
}

.col-l .selection-category .category-list-sub {
	background: #f8f8f8;
	position: absolute;
	top: 0;
	left: 240px;
	width: 240px;
	display: none;
    z-index: 2;
}

.col-l .selection-category .category-list-sub a:hover,
.col-l .selection-category .category-list-sub a.active {
	background: #ededed;
}

.col-l .selection-price .price_form {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.col-l .btn-search-set {
	text-align: right;
	padding-top: 10px;
}

/* ----------------------------------------------------
	右カラム
---------------------------------------------------- */
.col-r .info-wrap {
	background: #333;
	color: #ddd;
	padding: 20px 10px;
}

.col-r .info-wrap .tl-info {
	text-align: center;
	font-size: 16px;
	border-bottom: 1px solid #fff;
	padding-bottom: 10px;
}

.col-r .info-wrap a {
	color: #ddd;
	line-height: 1.8;
}

.col-r .info-wrap .detail-list {
	padding: 0 5px;
}

.col-r .info-wrap .detail-list li {
	margin: 20px 0 0;
}

.col-r .banner-list li {
	padding-top: 15px;
}

.col-r .banner-list li:first-of-type {
	padding-top: 0;
}

.col-r .banner-list a {
	display: block;
}

.col-r .banner-list a:hover {
	opacity: .7;
}

/* ----------------------------------------------------
	メインカラム　トップオブ
---------------------------------------------------- */
.col-main-top .infomation-wrap dl {
	display: flex;
	justify-content: center;
	align-items: center;
}

.col-main-top .infomation-wrap dt {
	font-size: 16px;
	padding-right: 20px;
}

.col-main-top .infomation-wrap dd {
	border-left: 1px solid #333;
	padding-left: 20px;
}

.col-main-top .infomation-wrap dd p {
	margin: 5px 0;
}

.col-main-top .infomation-wrap dd a {
	line-height: 1.6;
}

.col-main-top .top-s-banner-wrap {
	width: 1180px;
	margin-right: auto;
	margin-left: auto;
}

.col-main-top .top-s-banner-wrap > ul {
	display: flex;
	flex-wrap: wrap;
}

.col-main-top .top-s-banner-wrap > ul > li {
	width: calc((99.99% - 100px) / 6);
}

.col-main-top .top-s-banner-wrap > ul > li:not(:nth-of-type(6n+1)) {
	margin-left: 20px;
}

.col-main-top .top-s-banner-wrap > ul > li:nth-of-type(n+7) {
	padding-top: 20px;
}

.col-main-top .top-s-banner-wrap > ul > li a:hover {
	opacity: .7;
}

.col-main-top .yotpo-wrap {
	width: 1240px;
	margin: 0 auto;
}

.col-main-top .tl-brand-list,
.col-main-top .tl-links,
.col-main-top .tl-readers-service,
.col-main-top .tl-shops {
	text-align: center;
	font-size: 32px;
	margin: 50px 0;
	font-weight: bold;
	color: #333;
}

.col-main-top .tl-brand-list,
.col-main-top .tl-links {
	margin-bottom: 30px;
}

.col-main-top .brandlist-wrap {
	background: #333;
}

.col-main-top .tl-brand-list {
	color: #fff;
	font-weight: normal;
	margin-top: 0;
	padding-top: 50px;
}

/* 既存打ち消し */
.col-main-top #image-bloc2 {
	height: auto;
	border-color: #777;
	padding: 20px 0;
	width: 1040px;
	margin: 0 auto;
}

.col-main-top #image-bloc2 li a:hover {
	opacity: .7;
	display: block;
	text-align: center;
}

.col-main-top #image-bloc2 .bx-wrapper .bx-controls-direction a {
	top: 0;
	bottom: 0;
	margin: auto;
	text-indent: 0;
	font-family: FontAwesome;
	color: #fff;
	display: flex;
	align-items: center;
	font-size: 25px;
	width: auto;
	height: auto;
}

.col-main-top #image-bloc2 .bx-wrapper .bx-controls-direction a:hover {
	text-decoration: none;
	opacity: .7;
}

.col-main-top #image-bloc2 .bx-wrapper .bx-prev,
.col-main-top #image-bloc2 .bx-wrapper .bx-next {
	background: none;
}

.col-main-top #image-bloc2 .bx-wrapper .bx-prev {
	left: -30px;
}

.col-main-top #image-bloc2 .bx-wrapper .bx-next {
    right: -30px;
}
/* 既存打ち消し end */

.col-main-top .tl-brand-list .inner {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 20px 0;
}

.col-main-top .brandlist-wrap .more-link {
	text-align: center;
}

.col-main-top .brandlist-wrap .more-link a {
	display: inline-block;
	color: #ddd;
	text-align: center;
	padding: 30px 0 50px;
	font-size: 14px;
}

.col-main-top .brandlist-wrap .more-link a::after {
	content: "\f105";
	font-family: FontAwesome;
	font-weight: bold;
	padding-left: 10px;
}

.col-main-top .brandlist-wrap .more-link a:hover {
	text-decoration: none;
	opacity: .7;
}

.col-main-top .links-wrap .inner {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 20px 0;
}

.col-main-top .links-wrap .inner > ul {
	display: flex;
	justify-content: center;
	align-items: center;
}

.col-main-top .links-wrap .inner > ul a {
	display: block;
	border: 1px solid #ddd;
	margin: 0 10px;
}

.col-main-top .links-wrap .inner > ul a:hover {
	opacity: .7;
}

.col-main-top .top-search-wrap {
	border-bottom: 5px solid #333;
}

.col-main-top .top-search-wrap .top-search {
	background: #333;
	padding: 20px 60px;
	display: flex;
	align-items: center;
}

.col-main-top .top-search-wrap .top-search .np-keyword-suggest,
.col-main-top .top-search-wrap .top-search .np-item-suggest {
    width: 853px !important;
}

.col-main-top .top-search-wrap .top-search .np-keyword-suggest div {
    width: 100% !important;
}

.col-main-top .top-search-wrap .top-search .np-keyword-suggest .item {
    height: 25px;
    line-height: 25px;
}

.col-main-top .top-search-wrap .top-search .np-keyword-suggest .item .clearHistory {
    position: absolute;
    right: 10px;
    width: 25px;
    height: 25px;
    border: none;
    background: url(/user_data/books/packages/default/img/icon/icon_cross_mark_blk.svg) no-repeat center center;
    background-size: 15px 15px;
    cursor: pointer;
    font-size: 0;
}

.col-main-top .top-search-wrap .top-search .np-keyword-suggest .item.selected {
     color:#fff;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest > div > div {
    font-size: 16px !important;
    text-align: center;
    padding: 10px 0;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest table tr {
    border-bottom: 1px solid #ccc;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest table tr td:first-of-type {
    width: 10% !important;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest table tr td:first-of-type img {
    width: 100% !important;
    height: auto !important;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest table tr td:last-child {
    width: 90% !important;
    text-align: left !important;
}

.col-main-top .top-search-wrap .top-search .np-item-suggest table tr td:last-child a {
    width: auto !important;
}

.col-main-top .top-search-wrap .tl-search {
	color: #fff;
	font-size: 30px;
	padding-right: 60px;
}

.col-main-top .search-keyword-wrap {
	position: relative;
	flex: 1;
}

.col-main-top .search-keyword {
	padding: 8px 15px;
	border: none;
	outline: none;
	width: 100%;
	font-size: 20px;
}

.col-main-top .btn-search-keyword {
	background: url("/user_data/books/packages/default/img/icon/icon_search.svg") center center / 20px no-repeat,#f0f0f0;
	border: 0;
	width: 80px;
	cursor: pointer;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
}

.col-main-top .btn-search-keyword:hover {
	opacity: .7;
}

.col-main-top .search-tag-list {
	padding: 50px 20px;
}

.col-main-top .search-tag-list ul {
	letter-spacing: -.4em;
}

.col-main-top .search-tag-list li {
	display: inline-block;
	background: #f8f8f8;
	border: 1px solid #333;
	letter-spacing: normal;
	margin: 5px 10px 5px 0;
}

.col-main-top .search-tag-list li a {
	display: block;
	padding: 10px 17px;
	font-size: 14px;
}

.col-main-top .restock-smallstock-wrap {
	display: flex;
	justify-content: space-between;
}

.col-main-top .restock-smallstock-wrap .detail {
	width: calc((99.99% - 40px) / 2);
}

.col-main-top .restock-smallstock-wrap a {
	background-size: auto auto;
	background-color: rgba(255, 255, 255, 1);
	background-image: repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(248, 248, 248, 1) 5px, rgba(248, 248, 248, 1) 10px );
	background-attachment: fixed;
	border: 1px solid #333;
	padding: 50px;
	display: block;
	text-align: center;
	font-size: 18px;
}

.col-main-top .restock-smallstock-wrap a:hover {
	opacity: .7;
	text-decoration: none;
}

.col-main-top .restock-smallstock-wrap .tl-heading {
	font-size: 26px;
	font-weight: bold;
	padding-bottom: 25px;
}

.col-main-top .restock-smallstock-wrap .for-list {
	padding-top: 25px;
	font-size: 16px;
}

.col-main-top .restock-smallstock-wrap .for-list::after {
	content: "\f105";
	font-family: FontAwesome;
	font-weight: bold;
	padding-left: 10px;
}

.col-main-top .readers-service-wrap {
	border: 1px solid #333;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.col-main-top .tl-readers-service {
	display: flex;
	align-items: center;
	width: 1040px;
}

.col-main-top .tl-readers-service::before,
.col-main-top .tl-readers-service::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #333;
}

.col-main-top .tl-readers-service::before {
	margin-right: 40px;
}

.col-main-top .tl-readers-service::after {
	margin-left: 40px;
}

.col-main-top .readers-service-wrap .detail-list {
	width: 1040px;
	margin: 0 auto 50px;
}

.col-main-top .readers-service-wrap .detail-list > ul {
	display: flex;
	flex-wrap: wrap;
}

.col-main-top .readers-service-wrap .detail-list > ul > li {
	width: 320px;
}

.col-main-top .readers-service-wrap .detail-list > ul > li:not(:nth-of-type(-n+3)) {
	margin-top: 30px;
}

.col-main-top .readers-service-wrap .detail-list > ul > li:not(:nth-of-type(3n+1)) {
	margin-left: 40px;
}

.col-main-top .readers-service-wrap .copy {
	line-height: 1.6;
	color: #999;
	margin-top: 5px;
}

.col-main-top .readers-service-wrap a {
	display: block;
}

.col-main-top .readers-service-wrap a:hover {
	opacity: .7;
}

.col-main-top .shops-wrap {
	border-top: 5px solid #333;
}

.col-main-top .detail-list {
	display: flex;
	flex-wrap: wrap;
	width: 1040px;
	margin: 0 auto;
}

.col-main-top .detail-list > div {
	width: calc((99.99% - 120px) / 4);
}

.col-main-top .detail-list > div:not(:nth-of-type(-n+4)) {
	margin-top: 40px;
}

.col-main-top .detail-list > div:not(:nth-of-type(4n+1)) {
	margin-left: 40px;
}

.col-main-top .detail-list a:hover {
	text-decoration: none;
}

.col-main-top .detail-list a:hover img {
	opacity: .7;
}

.col-main-top .detail-list .tl-heading,
.col-main-top .detail-list .release_date,
.col-main-top .detail-list .copy {
	margin: 5px 0;
}

.col-main-top .detail-list .tl-heading {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.col-main-top .detail-list .tl-heading.jisin .magazine_name {
    border-left: 3px solid #333;
    padding: 2px 0 2px 5px;
    font-weight: bold;
}

.col-main-top .detail-list .release_month {
	color: #fff;
	background: #ff5b9a;
	display: inline-block;
	padding: 4px 0;
	width: 60px;
	text-align: center;
}

.col-main-top .detail-list .release_date {
	font-size: 10px;
	background: #f0f0f0;
	padding: 5px;
}

.col-main-top .detail-list .copy {
	color: #999;
	font-size: 10px;
	line-height: 1.6;
}

.col-main-top .detail-list .btn-external-link {
	margin-top: 10px;
}

.col-main-top .detail-list .btn-external-link a {
	position: relative;
	border: 1px solid #333;
	display: block;
	padding: 5px 0;
	text-align: center;
}

.col-main-top .detail-list .btn-external-link a:hover {
	opacity: .7;
}

.col-main-top .detail-list .btn-external-link a::after {
	content: "\f105";
	font-family: FontAwesome;
	position: absolute;
	right: 10px;
	font-weight: bold;
}

.col-main-top .detail-list .btn-external-link.fb a {
	border-color: #4064ad;
	color: #4064ad;
}

.col-main-top .relation-site {
	width: 1040px;
	margin: 0 auto;
}
.col-main-top .tl-relation-site {
	background: #333;
	color: #fff;
	font-size: 24px;
	padding: 10px 15px;
	margin: 40px 0 20px;
}

/* ----------------------------------------------------
	メインカラム　ページング
---------------------------------------------------- */
.col-main .pagination-wrap {
	margin-bottom: 40px;
}

.col-main .pagination-wrap .total-num {
	text-align: center;
	padding: 10px;
	border-top: 1px solid #b8b8b8;
	border-bottom: 1px solid #b8b8b8;
	margin-bottom: 10px;
}

.col-main .pagination-wrap .pagination {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.col-main .pagination > li {height: 25px;line-height: 25px;}

.col-main .pagination .arrow {
    position: relative;
    color: #000;
    text-decoration: none;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    width: 20px;
    height: 20px;
}

.col-main .pagination .arrow a {
    display: block;
    width: 20px;
    height: 20px;
    position: relative;
    z-index: 1;
}

.col-main .pagination > li:not(.arrow) {
	flex: 1;
}

.col-main .pagination .arrow:hover {
	opacity: .7;
	cursor: pointer;
}

.col-main .pagination .arrow::before,
.col-main .pagination .arrow::after {
	content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

.col-main .pagination .prev::before {
    left: 2px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    transform: rotate(225deg);
}

.col-main .pagination .next::before {
    right: 2px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    transform: rotate(45deg);
}

.col-main .pagination .num {
	display: flex;
	justify-content: center;
}

.col-main .pagination .num li {
	padding: 0 15px;
	font-size: 16px;
	font-weight: bold;
}

.col-main .pagination .num a {
	color: #777;
	font-weight: normal;
}

.col-main .pagination .num a:hover {
	color: initial;
}

/* ----------------------------------------------------
	メインカラム　下層
---------------------------------------------------- */
.col-main .tl-heading {
	font-size: 30px;
}

.col-main .tl-heading.head {
	background: #333;
	color: #fff;
}

.col-main .tl-heading.parallel {
	display: flex;
	align-items: baseline;
	padding: 15px 25px;
	margin-bottom: 30px;
}

.col-main .magazine.type02 .tl-heading.parallel {
	margin-bottom: 0;
}

.col-main .tl-heading.parallel .tl-sub {
	color: #ddd;
	font-size: 12px;
	display: inline;
}

.col-main .tl-heading.vertical {
	padding-bottom: 30px;
}

.col-main .tl-heading.parallel .tl {
	padding-right: 10px;
}

.col-main .tl-heading.vertical .tl {
	padding: 30px 0 10px;
}

.col-main .tl-heading .search-result {
	background: #333;
	font-size: 14px;
	color: #fff;
	padding: 15px 20px;
}

.col-main .tl-heading .tl.magazine-name {
	background: #333;
	color: #fff;
	padding: 12px 0;
}

.col-main .tl-heading.item-list {
    background: #333;
    color: #fff;
}

.col-main .tl-heading.item-list .tl-sub {
	color: #ddd;
}

/* 媒体TOP */
.col-main .btn-basic {
	margin: 0 auto;
	width: 200px;
}

.col-main .btn-basic .arrow{
    position: relative;
    padding: 0 0 0 16px;
    color: #000;
    text-decoration: none;
    font-size: 15px;
}

.col-main .btn-basic .arrow::before,
.col-main .btn-basic .arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
    content: "";
}

.col-main .btn-basic .more.arrow::before {
	display: none;
}

.col-main .btn-basic .btn-item-list,
.col-main .btn-basic .more {
	border-radius: 100px;
	padding: 10px 30px;
	text-align: center;
	display: block;
}

.col-main .btn-basic .btn-item-list {
	background: #f5f5f5;
}

.col-main .btn-basic .btn-item-list:hover {
	background: #f0f0f0;
}

.col-main .btn-basic .more {
	background: #333;
	color: #ddd;
}

.col-main .magazine.type02 .btn-basic .more {
	background: none;
	color: #ddd;
	border: 1px solid #f5f5f5;
}

.col-main .magazine-ranking .btn-basic .more {
	background: #fff;
	color: #333;
	border: 1px solid #333;
}

.col-main .btn-basic .btn-item-list::before {
	width: 18px;
    height: 18px;
}

.col-main .btn-basic .btn-item-list::after,
.col-main .btn-basic .more::after {
	top: -1px;
    right: 16px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}

.col-main .magazine-ranking .btn-basic .more::after {
	border-color: #333;
}

.col-main .btn-basic .btn-item-list::before {
    border-radius: 50%;
    background: #333;
}

.col-main .btn-basic .btn-item-list::after {
    transform: rotate(135deg);
}

.col-main .btn-basic .more::after {
    transform: rotate(45deg);
}

.col-main .btn-basic .more:hover {
	opacity: .7;
  cursor: pointer;
}

/* toggle btn */
.col-main .btn-basic .more:hover {
	cursor: pointer;
}

.col-main .btn-basic.toggle .more::after {
	transform: rotate(135deg);
}

.col-main .btn-basic.toggle .more.active::after{
	transform: rotate(-45deg);
	top: 1px;
}

.col-main .magazine-list {
	margin: 30px 0;
}

.col-main .magazine-list ul {
	display: flex;
}

.col-main .magazine-list li {
	width: calc((99.99% - 40px) / 5);
}

.col-main .magazine-list li:not(:first-of-type) {
    margin-left: 10px;
}

.col-main .magazine-list img {
	width: 100%;
}

.col-main .magazine-list .release_month {
	background: #b4a995;
	color: #fff;
	text-align: center;
	padding: 5px;
}

.col-main .magazine-list .copy {
	line-height: 1.6;
	margin-top: 3px;
}

.col-main .magazine-list a:hover {
	text-decoration: none;
	opacity: .7;
}

.col-main .tl,
.col-main .product-wrap .tl {
	text-align: center;
	font-size: 30px;
}

.col-main .tl-sub,
.col-main .product-wrap .tl-sub {
	text-align: center;
	color: #777;
	font-size: 12px;
}

.col-main .product-wrap .pickup-item .tl,
.col-main .product-wrap .recommend-item .tl,
.col-main .product-wrap .ranking .tl {
	font-size: 18px;
}

.col-main .tl.bd_t {
	border-top: 6px solid #333;
}

.col-main .magazine.type01 .banner-list,
.col-main .magazine.type02 .banner-list {
	display: flex;
	flex-wrap: wrap;
}

.col-main .magazine.type01 .banner-list {
	padding-bottom: 30px;
}

.col-main .magazine.type02 .banner-list {
	width: 730px;
	margin: 0 auto;
	padding: 5px 0 20px;
}

.col-main .magazine.type01 .banner-list.col2 li {
	width: calc((99.99% - 10px) / 2);
}

.col-main .magazine.type01 .banner-list.col2 li:not(:nth-of-type(2n+1)) {
	margin-left: 10px;
}

.col-main .magazine.type01 .banner-list.col2 li:not(:nth-of-type(-n+2)) {
    padding-top: 10px;
}

.col-main .magazine.type01 .banner-list.col3 li {
	width: calc((99.99% - 20px) / 3);
}

.col-main .magazine.type01 .banner-list.col3 li:not(:nth-of-type(3n+1)) {
	margin-left: 10px;
}

.col-main .magazine.type01 .banner-list.col3 li:not(:nth-of-type(-n+3)) {
    padding-top: 10px;
}

.col-main .magazine.type02 .banner-list li {
	width: calc((99.99% - 10px) / 3);
}

.col-main .magazine.type02 .banner-list li:not(:nth-of-type(3n+1)) {
	margin-left: 5px;
}

.col-main .magazine.type02 .banner-list li:not(:nth-of-type(-n+3)) {
    padding-top: 5px;
}

.col-main .magazine.type01 .banner-list li a,
.col-main .magazine.type02 .banner-list li a {
	display: block;
	text-align: center;
}

.col-main .magazine.type01 .banner-list li a:hover,
.col-main .magazine.type02 .banner-list li a:hover {
	opacity: .7;
}

.col-main .magazine.type01 .banner-list li img {
	width: 100%;
}

.col-main .banner-area {
	text-align: center;
}

.col-main .banner-area a {
	display: block;
	width: 720px;
	margin: 15px auto;
}

.col-main .banner-area a img {
	max-width: 100%;
}

.col-main .banner-area a:hover img {
	opacity: .7;
}

.col-main .magazine.type02 .inner {
	background: #333;
	padding: 10px 0 30px;
}

.col-main .product-item-block .rank {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	width: 25px;
	height: 25px;
	line-height: 25px;
	border-radius: 100%;
	text-align: center;
	position: absolute;
	z-index: 1;
	left: -10px;
	top: -10px;
}

.col-main .product-item-block .rank1 {
	background: #95824c;
}

.col-main .product-item-block .rank2 {
	background: #70777d;
}

.col-main .product-item-block .rank3 {
	background: #815328;
}

.col-main .product-item-block .rank_other {
	background: #333;
}

.col-main .magazine-ranking .inner {
	background: #f8f8f8;
	padding: 0 50px 30px;
}

/* ----------------------------------------------------
	商品一覧
---------------------------------------------------- */
.col-main .product-item-block {
	display: flex;
	flex-wrap: wrap;
}

.col-main .product-item-block.search-photo-wrap {
	margin-bottom: 40px;
}

.col-main .product-item-block a {
	display: block;
}

.col-main .product-item-block a:hover {
	opacity: .7;
}

.col-main .product-item-block > li {
	margin-bottom: 40px;
	position: relative;
}

.col-main .product-item-block.search-photo-wrap > li {
	margin-bottom: 0;
}

.col-main .product-item-block.switch-col_l > li,
.col-main .product-item-block.static-col-common > li,
.col-main .product-item-block.static-col4 > li {
	width: calc((99.99% - 45px) / 4);
}

/* 画像表示件数切り替え時、静的　5カラム */
.col-main .product-item-block.switch-col_s > li,
.col-main .product-item-block.static-col5 > li {
	width: calc((99.99% - 60px) / 5);
}

/* 静的　3カラム */
.col-main .product-item-block.static-col3 > li {
	width: calc((99.99% - 30px) / 3);
}

.col-main .product-item-block.switch-col_l > li:not(:nth-of-type(4n+1)),
.col-main .product-item-block.switch-col_s > li:not(:nth-of-type(5n+1)),
.col-main .product-item-block.static-col-common > li:not(:nth-of-type(4n+1)),
.col-main .product-item-block.static-col5 > li:not(:nth-of-type(5n+1)),
.col-main .product-item-block.static-col4 > li:not(:nth-of-type(4n+1)),
.col-main .product-item-block.static-col3 > li:not(:nth-of-type(3n+1)) {
	margin-left: 15px;
}

.col-main .product-item-block .item_soldout {
	padding-top: 10px;
	color: #f06;
	font-size: 10px;
	font-weight: bold;
}

.col-main .product-item-block .item_img {
	position: relative;
	margin-bottom: 10px;
}

.col-main .product-item-block .item_img img {
	width: 100%;
}

.col-main .product-item-block .item_img .media-name {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	padding: 4px 10px;
	font-weight: bold;
	background: rgba(119,119,119,.8);
}

.col-main .product-item-block .brand {
	color: #aaa;
	font-size: 10px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: bold;
}

.col-main .product-item-block .category {
	color: #aaa;
	font-size: 10px;
	padding-top: 5px;
}

.col-main .product-item-block .catch-area {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 6px;
}

.col-main .product-item-block.search-photo-wrap .catch-area {
	position: absolute;
	bottom: 15px;
	right: 5px;
	margin: 0;
	background: rgba(255,255,255,.8);
	padding: 5px;
	border-radius: 100px;
	width: 33px;
	height: 33px;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

.col-main .product-item-block .price {
	font-size: 14px;
	color: #777;
	line-height: 1.2;
}

.col-main .product-item-block .price.base {
    text-decoration: line-through;
    font-size: 12px;
    padding-top: 10px;
    /* line-height: 15px; */
}

.col-main .product-item-block .price.off {
    color: #e73656;
}

.col-main .product-item-block .btn-fav {
	width: 20px;
	height: 20px;
	background: url(/user_data/books/packages/default/img/icon/icon_haert.svg) center center / contain no-repeat;
	cursor: pointer;
}

.col-main .product-item-block .btn-fav.active {
	background: url(/user_data/books/packages/default/img/icon/icon_heart_on.svg) center center / contain no-repeat;
}

.col-main .product-item-block .icon {
	margin-top: 8px;
	font-size: 0;
}

.col-main .product-item-block .icon img {
	margin-top: 2px;
	margin-right: 2px;
	display: inline-block;
}

.col-main .product-item-block .icon img:last-child {
	margin-right: 0;
}

.col-main .product-wrap .switch {
	border: none;
	cursor: pointer;
	width: 35px;
	height: 35px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	display: inline-block;
}

/* 表示件数切り替えボタン */
.col-main .product-wrap .switch.col_l {
	background: url(/user_data/books/packages/default/img/icon/icon_switch_col_l_off.svg) center center / contain no-repeat;
}

.col-main .product-wrap .switch.col_s {
	background: url(/user_data/books/packages/default/img/icon/icon_switch_col_s_off.svg) center center / contain no-repeat;
}

.col-main .product-wrap .switch.col_l.active {
	background: url(/user_data/books/packages/default/img/icon/icon_switch_col_l_on.svg) center center / contain no-repeat;
}

.col-main .product-wrap .switch.col_s.active {
	background: url(/user_data/books/packages/default/img/icon/icon_switch_col_s_on.svg) center center / contain no-repeat;
}

.col-main .item-disp-result {
	text-align: center;
	padding: 10px;
	border-top: 1px solid #b8b8b8;
	border-bottom: 1px solid #b8b8b8;
	margin: 20px auto 30px;
}

/* 商品ソート */
.col-main .product-wrap .sort-tab {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	margin-top: 1px;
}

.col-main .product-wrap .sort-tab li {
	width: calc((99.99% - 5px) / 6);
}

.col-main .product-wrap .sort-tab li:not(:first-of-type) {
	margin-left: 1px;
}

.col-main .product-wrap .sort-tab a {
	display: block;
	text-align: center;
	background: #f0f0f0;
	padding: 12px 0;
}

.col-main .product-wrap .sort-tab a.active {
	background: #ba9f76;
	color: #fff;
}

.col-main .product-wrap .sort-tab a:hover {
	text-decoration: none;
	opacity: .7;
}

.col-main .sort-select-magazine {
	background: #231815;
	padding: 15px 0;
}

.col-main .item-sort-area {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 20px;
}

.col-main .sort-select-form,
.col-main .item-sort-area .sort-select-form {
	position: relative;
	width: 400px;
	margin: 0 auto;
}

.col-main .item-sort-area .sort-select-form {
	width: 200px;
	margin: 0;
}

.col-main .sort-select-form.category {
	margin-top: 15px;
}

.col-main .sort-select-form::after,
.col-main .item-sort-area .sort-select-form::after {
	content: "";
	position: absolute;
	width: 10px;
	height: 10px;
	transform: rotate(135deg);
	top: -5px;
	bottom: 0;
	margin:  auto;
	right: 15px;
	cursor: pointer;
}

.col-main .sort-select-form::after {
	border-top: 2px solid #ba9f76;
	border-right: 2px solid #ba9f76;
}

.col-main .item-sort-area .sort-select-form::after {
	border-top: 1px solid #626262;
	border-right: 1px solid #626262;
}

.col-main .sort-select-form.category::after {
	border: none;
	background: linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #626262 50%) no-repeat top left/100% 100%;
	transform: rotate(-45deg);
	right: 16px
}

.col-main .sort-select-form select,
.col-main .item-sort-area .sort-select-form select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 40px;
	font-size: 14px;
	width: 100%;
	padding-left: 15px;
	cursor: pointer;
	background: #fff;
}

.col-main .sort-select-form select::-ms-expand,
.col-main .item-sort-area .sort-select-form select::-ms-expand {
	display: none;
}

.col-main .sort-select-form select:-moz-focusring,
.col-main .item-sort-area .sort-select-form select:-moz-focusring {
	color: transparent;
}

.col-main .sort-select-form select {
	border-color: #ba9f76;
	border-width: 2px;
	color: #ba9f76;
	font-weight: bold;
}

.col-main .sort-select-form.category select {
	border-color: #333;
	border-width: 1px;
	color: #333;
	font-weight: normal;
}

.col-main .item-sort-area .sort-select-form select {
	border: 1px solid #333;
	background: #f0f0f0;
	color: #333;
	font-weight: normal;
}

.col-main .sort-select-form select option,
.col-main .item-sort-area .sort-select-form select option {
	background: #fff;
}

.col-main .sort-select-form select option {
	color: #333;
}

/* ----------------------------------------------------
	recommend list
---------------------------------------------------- */
.col-main .recommend-list-wrap {
  padding-top: 30px;
}

/* ----------------------------------------------------
	ranking
---------------------------------------------------- */
.col-main .ranking-list-wrap {
  padding-top: 40px;
}

/* ----------------------------------------------------
	brand
---------------------------------------------------- */
.col-main .brand-wrap {
	padding-bottom: 30px;
}

.col-main .brand-wrap .inner {
	position: relative;
}

.col-main .brand-wrap .inner::after {
	content: "";
	display: block;
	clear: both;
}

/* ブランド紹介画像ありの場合　　.brand-img ~　 */
.col-main .brand-wrap .brand-img img {
	width: 300px;
}

.col-main .brand-wrap .brand-img,
.col-main .brand-wrap .brand-img ~ .brand-logo,
.col-main .brand-wrap .brand-img ~ .brand-txt {
	float: left;
	text-align: left;
}

.col-main .brand-wrap .brand-img ~ .brand-logo,
.col-main .brand-wrap .brand-img ~ .brand-txt {
	padding-left: 20px;
}

.col-main .brand-wrap .brand-img ~ .brand-logo {
	padding-top: 20px;
}

.col-main .brand-wrap .brand-img ~ .brand-txt {
	width: 460px;
}

.col-main .brand-wrap .brand-img ~ .brand-site {
	margin-top: 0;
	clear: both;
}

/* ブランド紹介画像なしの場合 */
.col-main .brand-wrap .brand-logo,
.col-main .brand-wrap .brand-txt {
	text-align: center;
}

.col-main .brand-wrap .brand-txt {
	line-height: 1.8;
	padding-top: 20px;
}

.col-main .brand-wrap .brand-site {
	text-align: center;
	padding-top: 30px;
}

.col-main .brand-wrap .brand-site a {
	color: #deb26c;
	position: relative;
	border: 1px solid;
	display: inline-block;
	padding: 5px 20px 5px 15px;
}

.col-main .brand-wrap .brand-site a::after {
	content: "";
	position: absolute;
	right: 10px;
	top: 0;
	bottom: 0;
	margin: auto;
	width: .5em;
	height: .5em;
	border-top: 1px solid #deb26c;
	border-right: 1px solid #deb26c;
	transform: rotate(45deg);
}

/* ブランドロゴだけの場合 */
.col-main .brand-wrap .inner > div:only-of-type.brand-logo {
	text-align: left;
}

/* 既存打ち消し */
.col-main .brand-wrap #category_image,
.col-main .brand-wrap .category_image_link,
.col-main .brand-wrap #category_image h2,
.col-main .brand-wrap #category_image p,
.col-main .brand-wrap .category_image_link a {
	float: none;
}
.col-main .brand-wrap #category_image {
	height: auto;
	padding-bottom: 10px;
}
.col-main .brand-wrap .category_image_link {
	text-align: right;
}

.col-main .brand-wrap .category_image_link a {
	display: inline-block;
}

.col-main .brand-list-wrap .initials {
	display: flex;
	justify-content: center;
	margin: 30px 0 20px;
    flex-wrap: wrap;
}

.col-main .brand-list-wrap .initials a {
	display: block;
	background: #f8f8f8;
	padding: 10px 12px;
	font-weight: bold;
	font-size: 14px;
}

.col-main .brand-list-wrap .initials li {
    margin-top: 2px;
	padding-left: 2px;
}

.col-main .brand-list-wrap .initials li:first-of-type {
	padding-left: 0;
}

.col-main .brand-list-wrap .initials a:hover {
	background: #f0f0f0;
}

.col-main .brand-list-result.scroll {
	overflow-y: scroll;
	height: 800px;
	border: 1px solid #ddd;
}

.col-main .brand-list-result .inner {
	padding: 0 40px;
}

.col-main .brand-list-result .heading_mim {
	font-size: 24px;
	padding: 30px 0;
}

.col-main .brand-list-result .brand  {
	display: flex;
	flex-wrap: wrap;
}

.col-main .brand-list-result .brand > li {
	width: calc((99.99% - 40px) / 3);
	line-height: 1.4;
	padding-bottom: 30px;
}

.col-main .brand-list-result .brand > li:not(:nth-of-type(3n+1)) {
	margin-left: 20px;
}

/* ----------------------------------------------------
	既存打ち消し ブランドページ
---------------------------------------------------- */
#category_image {
	float: none;
	height: 250px;
}

#category_image h2,
#category_image p{
	float: none;
}

.category_image_link {
	text-align: right;
}

.category_image_link a {
	float: none;
	display: inline-block;
}

.brand_image::after {
	content: "";
	clear: both;
	display: block;
}

/* ----------------------------------------------------
	既存打ち消し TOPスライド
---------------------------------------------------- */
.image-bloc {
	margin: inherit;
	overflow: hidden;
}

/* ----------------------------------------------------
	既存打ち消し bxslider （TOP　BRAND LIST）　読み込み時、縦並び回避
---------------------------------------------------- */
.slider2 li {
	display: none; /* 読み込み時非表示 */
}

.bx-viewport .slider2 li {
	display: block !important; /* 読み込まれたら表示 */
	background: #fff;
	min-height: 50px;
	text-align: center;
}

.bx-viewport .slider2 li a {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}

/* ----------------------------------------------------
	既存調整 wako
---------------------------------------------------- */
.wako-top .prof .txt {
	width: auto;
}

/* ----------------------------------------------------
	既存調整 first floor
---------------------------------------------------- */
#first_floor {
	line-height: 1.6;
}

/* ----------------------------------------------------
	トップオブ　注目バナー
---------------------------------------------------- */
.special-banner {
	width: 1240px;
	margin: 70px auto;
}
.special-banner a {
	display: block;
}

.special-banner a:not(:first-of-type) {
	margin-top: 20px;
}

/* ----------------------------------------------------
	既存打ち消し yotpo
---------------------------------------------------- */
.switch-col_s .yotpo .standalone-bottomline .star-clickable {
	flex-wrap: wrap;
}

.switch-col_s .yotpo .standalone-bottomline .star-clickable .text-m {
	padding-top: 3px;
}

/* ----------------------------------------------------
	追加　20200525　媒体TOP
---------------------------------------------------- */
.col-main .classyCategory {
  background: #f5f5f5;
  padding: 40px 0;
}

.col-main .classyCategory > ul {
  display: flex;
  flex-wrap: wrap;
  width: 685px;
  margin: 0 auto;
}

.col-main .classyCategory > ul > li {
  width: calc((100% - 40px) / 3);
}

.col-main .classyCategory > ul > li:not(:nth-child(-n+3)) {
  padding-top: 15px;
}

.col-main .classyCategory > ul > li:not(:nth-of-type(3n+1)) {
  margin-left: 20px;
}

.col-main .classyCategory a {
  color: #695c40;
  display: block;
}

.col-main .category_name {
  text-align: right;
  font-weight: bold;
  padding-top: 8px;
}

.col-main .category_name:after {
  content:"▲";
  transform: rotate(90deg);
  display: inline-block;
  margin-left: 5px;
}

/* hers slide */
.col-main .slide-wrap .content {
  height: 400px;
}

/* hers new arrivals */
.col-main .newarrivals.hers {
  margin-bottom: 20px;
}
