.coupon {
	width:			244px;
	height:			88px;
	overflow:		hidden;
	position:		relative;
}
.coupon .caption {
	font-size:		90%;
	color:			#fff;
	padding-top:		10px;
	text-align: 		center;
}
.coupon .mask {
	width:			100%;
	height:			50px;
	position:		absolute;
	top:			-50px;	/* 枠の上に置いて表示しない */
	left:			0;
	background-color:	rgba(0,0,0,0.4);
	-webkit-transition:	all 0.4s ease;
	transition:		all 0.4s ease;
}
.coupon:hover .mask {
	top:		0px;	/* 下に降りてくるように見せる */
}
.coupon img {
	-webkit-transition:	all 0.4s ease;
	transition:		all 0.4s ease;
	-webkit-transform:	scale(1.2);	/* 1.2倍の大きさで表示 */
	transform:		scale(1.2);
}
.coupon:hover img {
	margin-top:		50px;			/* 画像の絵を下にずらす */
	-webkit-transform:	scale(1);	/* 元の大きさに戻す */
	transform:		scale(1);
}
div.fs-p-snsArea {
    align-items: flex-start;
    padding-top: 10px;
}

li.coupon.login-false {
    height: auto;
}
li.coupon.login-false:hover a img {
    margin-top: 0;
}
li.coupon.login-false img {
    transform: scale(1);
}

.fs-c-productPrice--member .fs-c-productPrice__main__price{
color: #ff0000!important;
}

.cp_menu label {
	color: #ffffff;
}
.cp_menu input {
	display: none;
}
div.fs-c-breadcrumb{ float: right; margin-top:20px; padding-bottom:20px;}
div.fs-c-breadcrumb a {
	color:#3c8fcf;	
}
div.fs-c-breadcrumb ol li {
	font-size: 14px;
}
.accordion {display: none;}

@media screen and (max-width: 767px){
.accordion {display: block;margin-bottom: 60px;}
.displayNone {
display: none;
}
.accordion li {
border-bottom: 1px solid #565656;
padding: 10px;
}
.accordion a {
display: block;
}
.contentWrap {
margin: 10px;
}
.switch {
cursor:pointer;
padding:10px 40px 10px 10px;
font-size: 14px;
border-bottom: 1px solid #565656;
position: relative;
}

.switch:after {
content: ">";
position: absolute;
right: 10px;
top: -100%;
bottom: -100%;
margin: auto;
font-size: 16px;
height: 16px;
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
font-family: sans-serif;
}
.switch.open:after {
content: "x";
}
}
}
/* ↓20210421↓トップ注目キーワード↓ */
div.hd_inner div.trend_keyword { background-color: #e3eff8; clear:both; }
div.hd_inner div.trend_keyword div { background-color: #e3eff8; clear:both; margin:5px 0 0 0; padding:7px 0 0 10px;}
div.header03 div.hd_inner div.trend_keyword p.keyword { font-size:13px; line-height: 1.8; margin:0 0 0 0; padding:0 0 0 10px;}

div.trend_keyword p.keyword span {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
        font-size:12px;
	line-height: 26px;
	position: relative;
	display: inline-block;
	height: 26px;
	margin: 0 0px 10px 0;
	padding: 0px 10px 0 23px;
	-webkit-transition: color 0.2s;
	        transition: color 0.2s;
	text-decoration: none;
	color: #FFF;
	border-radius: 3px 0 0 3px;
	background: #ffad1f;
font-weight:bold;
}
div.trend_keyword p.keyword span::before, div.trend_keyword p.keyword span::after {
	background: #e3eff8;/*背景色*/
}
div.trend_keyword p.keyword span::before {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 6px;
	height: 6px;
	content: '';
	border-radius: 10px;
}
div.trend_keyword p.keyword span::after {
	position: absolute;
	top: -2px;
	right: -6px;
	width: 0;
	height: 0;
	content: '';
	border-width: 15px 0 15px 8px;
	border-style: solid;
	border-color: transparent transparent transparent #ffad1f;
	border-radius: 4px;
}
div.trend_keyword p.keyword a { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; font-size:14px; color:#0077cc; text-decoration: underline;}
div.trend_keyword p.keyword a:hover { text-decoration: none; }


@media screen and (min-width: 980px) {
div.trend_keyword_sp { display: none;}
}　/* パソコン表示 */
@media screen and (min-width: 768px) and (max-width: 979px) {
div.trend_keyword_sp { display: none;}
}　/* タブレット端末表示 */


p.recommend_text { padding:10px; margin-bottom:10px; font-size:14px; font-weight:bold;
background-size: 7px 7px;
background-image: linear-gradient(
    -45deg,
    #f2f2f2, #f2f2f2 48.5%,
    #fff 49.5%, #fff 50.5%,
    #f2f2f2 51.5%, #f2f2f2
  );
}
@media screen and (max-width: 479px){
p.recommend_text { font-size:10px;}
}


.category_list {
  display: flex;
  flex-wrap: wrap;
  padding: 0px;
  margin: 0 0 10px;
}

ul li.item{
  border: 3px solid #DEDEDE;
  background: #f9f9fa;
  padding: 10px;
  flex-shrink: 0;
  flex-basis: 220px;
  margin: 0px 10px 10px 0px;
}

ul li.item:hover {
	border: 3px solid #3c8fcf;
cursor : pointer;
}

ul li.item h2{
	display: table;
	font-size: 16px;
	margin: 0 0 10px 0; padding: 0;
	color:#3c8fcf;
	font-weight:bold;
	line-height: 1.6;
}
ul li.item a, ul li.item a:hover {
	text-decoration: none;
}

ul li.item dl > div {
    display: flex;
    flex-wrap: wrap;
}
ul li.item dt {
  width: 100%;
  padding: 0px 0px 0px 0px;
  margin: 0 0px 10px 0;
  font-size: 12px;
}
ul li.item dt a,ul li.item dt a:hover {
text-decoration: none;
}

ul li.item dt img{
  width:100%;
}
ul li.item dt img:hover {
	opacity: 0.5;
}
ul li.item dd {
display: block;
  width: 100%;
  padding: 0px 0px 0px 0px;
  margin: 0 0 0px 0;
  font-size: 13px;
  line-height: 1.8;text-decoration: none;
}
ul li.item dd p {
	margin:5px 0 0 0;
}

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

 ul li.item{
  flex-basis: 47%;
  border: 1px solid #3c8fcf;
  padding: 5px;
  margin: 0px 10px 12px 0px;
}
ul li.item dt {
	  text-align: center;
}
ul li.item h2{
	font-size: 12px;
	line-height: 1.4;
}
ul li.item dt img{
  width:80%;
  margin: 10px 0px 0px 0px;
}
	ul li.item dd {
  font-size: 12px;
  line-height: 1.4;
}
}


/* ↓20210326ヘッダー修正↓ */
body#fs_CustomPage .fs-l-pageMain a, .news_cnt a, .contact_message a{color: #101010;text-decoration: none;}
div.trend_keyword p.keyword a{padding:0 6px;}
.menu{margin-top: 5px;max-width: 100%;display: flex;}
.menu__mega{width: 300px;text-align: center;margin-right: 2px;}
.headbtn{background-color: #3c8fcf;
    color: #fff!important;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    position: relative;
    cursor: pointer;
}
.menu__mega a::after{content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 4.5px 0 4.5px;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: calc(50% - 4px);
    right: 11px;}
.menu__second-level{
    position: absolute;
    background-color: rgba(0,0,0,0.5);
    padding: 20px;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
    z-index: 99;
opacity: 0;
  visibility: hidden;
  transition-delay: .5s;
}
.menu__mega:hover > .menu__second-level{opacity: 1;
  visibility: visible;}
.menu__second-level-inner{width: 1200px;
    margin: 0 auto;}
.menu__second-level-inner br{display:none;}
.cate li{float: left;}
.cate li a{display: flex;
    align-items: center;
    padding: 22px;
    height: 60px;
    width: 399px;
    background-color: #fff;
    margin-right: 1px;
    margin-bottom: 1px;}
.cate li a .image{max-width: 31px;
    margin-right: 0.8em;}
.scene_contents{padding: 30px 30px 30px 42px;
    background-color: #f2f2f2;
    margin-bottom: 30px;text-align: left;}
.scene_contents span{display: inline-block;
    margin: 0 5px 0 0;
    font-size: 25px;}
.scene_contents h3{text-align: left;
    font-size: 16px;
    margin: 0 auto 15px;}
.scene_contents ul li{width: calc(98%/4);
    background-color: #fff;
    display: inline-block;margin-bottom: 4px;}
.scene_contents ul li a{font-size: 14px;
    height: 60px;
    padding: 10px;
    display: flex;
    align-items: center;}
.scene_contents ul li a .image{max-width: 40px;}
.scene_contents ul li a .txt{padding-left: 14px;
    line-height: 1.25;}
.scene_contents br{display:block;}
.side_cnt ul li{float: none !important;}
.side_cnt ul li a{display:flex !important;
    align-items: center !important;
    font-size: 13px !important;
    line-height: 1.15385 !important;
    padding: 12px !important;width: auto !important;
    height: auto !important;
    margin-bottom: auto !important;}
.top_cate ul li a{display: block;background-color: unset;}
/* ↑20210326ヘッダー修正↑ */

/*数量選択の[入力してください]のメッセージの位置調整*/
.fs-body-product .fs-c-quantity{
  position: relative;
}
.fs-body-product .fs-c-quantity__message{
  bottom:-22px;
  left:40px;
}

/*　カテゴリーサイドメニュー吹き出し追加20210422　*/

#leftcolumn .gmenu ul li{position:relative;}
#leftcolumn .gmenu ul li:hover dl{visibility:visible; margin:0; opacity:1; filter:drop-shadow(0 0 1px rgba(0,0,0,.3))}
#leftcolumn .gmenu ul dl{position:absolute; top:-20px; left:180px; z-index:100; visibility:hidden; margin:0; padding:14px 20px; width:auto; height:auto; border:3px solid #c2c2c2;; border-radius:6px; background:#fff; opacity:0; transition:all .1s; transition-delay:.2s}
#leftcolumn .gmenu ul dl:before{left:-18px; margin-top:-13px; border-top:13px solid transparent; border-right:18px solid #ccc; border-bottom:16px solid transparent}
#leftcolumn .gmenu ul dl:after,#leftcolumn .gmenu ul dl:before{position:absolute; top:40px; border-left:0; content:""}
#leftcolumn .gmenu ul dl:after{left:-13px; z-index:9; margin-top:-12px; border-top:12px solid transparent; border-right:18px solid #fff; border-bottom:16px solid transparent; filter:drop-shadow(0 0 0 transparent)}
#leftcolumn .gmenu ul dl dt{margin:0; padding:4px 8px 0 0; color:#3c8fd6; font-weight:700; font-size:16px}
#leftcolumn .gmenu ul dl dt span{font-weight:400}
#leftcolumn .gmenu ul dl dt a.link{position:absolute; top:15px; right:15px; padding:6px 11px; border:3px solid #07c; border-radius:100px; background:#07c; color:#fff; font-size:12px; line-height:1; transition:all .2s linear}
#leftcolumn .gmenu ul dl dt a.link:hover{background:#fff; color:#07c}
#leftcolumn .gmenu ul dl dd{margin:0; padding:0}
#leftcolumn .gmenu ul dl dd p{margin:0; padding:0 0 10px; width:340px; color:#07c; font-size:11px}
#leftcolumn .gmenu ul dl ol{margin:0; padding:0; width:450px; list-style-type:none}
#leftcolumn .gmenu ul dl ol li{display:inline-block; margin:0; padding:0; width:220px; border:0; vertical-align:top}
#leftcolumn .gmenu ul dl ol li h3{margin:0; padding:8px 0 6px; color:#000; font-weight:700; font-size:13px}
#leftcolumn .gmenu ul dl ol li ul{margin:0; padding:0 0 10px; border:0}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li{padding:0; border:0; margin:0 0 -15px 0; line-height: 1;}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li a {position:relative; display:inline-block; padding:0px 0 0 13px; vertical-align:middle; text-decoration:none; font-size:13px;}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li a:after,#leftcolumn .gmenu ul dl ol li ul li a:before{position:absolute; top:-1px; bottom:0; left:0; margin:auto; content:""; vertical-align:middle}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li a:before{left:0; width:4px; height:4px; border-top:3px solid #ea807d; border-right:3px solid #ea807d; -webkit-transform:rotate(45deg); transform:rotate(45deg)}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li a:hover{text-decoration:underline}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li span{margin:0 0 0 4px; color:#aaa; font-size:11px; font-family:Helvetica,Arial}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li small{font-size:11px}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li small a{padding:0; font-size:11px}
section.side_cnt div#leftcolumn div.gmenu ul dl ol li ul li small a:before{border:0; content:""}
section.side_cnt ul li.title > a.bold {
    display: block;
    padding: 10.5px 12px;
    position: relative;
}
section.side_cnt ul li.title  {
	padding:5px 0px 5px 0px;
}	
section.side_cnt ul li.title span.ttl {
	font-size: 16px;
}

section.side_cnt div#leftcolumn div.gmenu ul li.title > a.bold::after {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-right: 2px solid;

    border-top: 2px solid;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 3px);
    right: 14px;
}
@media screen and (max-width: 479px){
section.side_cnt #leftcolumn .gmenu ul li dl{ display: none;}
}
aside.fs-l-sideArea {
    overflow: visible;
}

span.marker_pink {
 background: linear-gradient(transparent 65%, #ffadad 65%);
font-weight: bold; 
border-radius:2px;
}

.fs-c-cartDiscountInfo__info{
 color:red; 
}

.fs-c-orderTotalTable__itemPriceSummary .fs-c-string {
    font-size: 0.9em;
}
span.fs-c-price__value {
    word-break: keep-all;
}


@media only screen and (min-width:768px) {
.sp_img{
display:none!important;
}
}
@media screen and (max-width:767px){
.center { text-align: center;}
.sp_img {
    display: block !important;
text-align: center;
margin:5px auto 0 auto;
  }
.sp_2col{
    display:flex;
	align-items: center;
}
.sp_2col>div{
    width:50%;
	padding: 3px;
}
} 

/*　ノーカーボン複写用紙カテゴリー　*/
@media screen and (min-width:768px){
.nocarbon-inner{margin-bottom:20px;}
.nocarbon-inner h3{
background:#009db4;
color: #fff;
text-indent: 0.8em;
padding: 10px 0;
font-size: 20px;
margin-bottom: 30px;
letter-spacing: 0.5px;
position: relative;
margin-top: 30px;
}
.nocarbon-inner h3:before{
content: '●';
color: #fff;
margin-right: 8px;
}
.nocarbon-lt{
width:31%;
display:inline-block;
margin-top: 15px;
vertical-align: top;
}
.nocarbon-rt{
width: 65%;
display: inline-block;
margin-left: 10px;
}
.nocarbon-rt span{
background: #009db426;
padding: 5px;
font-size: 14px;
}
.nocarbon-ct{
background: #ffea60cc;
padding: 15px;
margin-top: 34px;
border-radius: 0 5px 5px 5px;
}
.nocarbon-ct:before{
font-weight: 900;
content: 'ポイント！';
background: #ff7601;
color: #ffffff;
border-radius: 5px;
padding: 3px 7px 3px 10px;
font-size: 14px;
line-height: 1;
letter-spacing: 0.05em;
}
.howto1{
width: 30%;
display: inline-block;
vertical-align: top;
margin-right: 20px;
}
.howto1 p{
font-weight:bold;
margin-bottom: 15px;
}
.howto1 span{
font-size: 14px;
}
}

@media screen and (max-width:767px){
.pre-wrap{
white-space: pre;
text-indent: 2.2em;
display: block;
}
.nocarbon-inner h3{
background:#009db4;
color: #fff;
text-indent: 0.8em;
padding: 10px 0;
font-size: 20px;
margin-bottom: 30px;
letter-spacing: 0.5px;
position: relative;
margin-top: 30px;
}
.nocarbon-inner h3:before{
content: '●';
color: #fff;
margin-right: 8px;
}
.nocarbon-lt {
width: 100%;
text-align: center;
}
.nocarbon-rt {
width: 100%;
margin: 10px 0;
}
.nocarbon-rt span{
display: block;
text-align: center;
margin-top: 10px;
background: #009db426;
padding: 5px;
font-size: 14px;
}
.nocarbon-ct{
margin-top: 0;
background: #ffea60cc;
padding: 15px;
border-radius: 0 5px 5px 5px;
}
.nocarbon-ct:before {
font-weight: 900;
content: 'ポイント！';
background: #ff7601;
color: #ffffff;
border-radius: 5px;
padding: 3px 7px 3px 10px;
font-size: 14px;
line-height: 1;
letter-spacing: 0.05em;
margin-bottom: 10px;
display: inline-block;
}
.nocarbon-rt span {
}
.howto1 {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
}
.howto1 p {
    font-weight: bold;
    margin-bottom: 15px;
}
}

/*-- PC版表示CSS  --*/
.pc_area{
  display:block;
}
.sp_area{
  display:none;
}

/*-- スマホ版表示CSS  --*/
@media screen and (max-width: 768px){
  .pc_area{
    display:none;
  }
  .sp_area{
    display:block;
  }
 .sp_area ul.banner li{
	 margin-bottom:5px;
  }
}
/*--  バックライトフィルムバナー追加  --*/
.blf-banner{
	display: flex;
	flex-wrap:wrap;
	width:690px;
}
@media screen and (max-width:781px){
.blf-banner{
	width:100%;
	margin-top:10px;
}
}
	
.blf-banner li {
	width: calc(100%/2);
	padding:0 5px 10px 5px;
	box-sizing:border-box;
}
.blf-banner li img {
	max-width:100%; 
	height: auto; 
}

/*ランキング*/
section.cat11_top_ranking { margin-bottom:0px;}
section.cat11_ranking_dtl + section.cat11_ranking_dtl {
    margin-top: 10px;
}
section.cat11_ranking_dtl + section.cat11_ranking_dtl {
    margin-top: 10px;
}
section.cat11_ranking_dtl .inner {
    padding: 30px 40px 25px 40px;
    background-color: #e3eff8;
}
section.cat11_top_ranking h3.subtitle.bold {
    font-size: 22px;
    margin: 3px auto 15px;
    line-height: 1;
}
section.cat11_top_ranking h3.subtitle.bold::before {
    content: "";
    display: inline-block;
    width: 35px;
    height: 23px;
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking_sub.png") no-repeat center;
    background-size: contain;
    vertical-align: bottom;
    margin-bottom: 2px;
    margin-right: 8px;
}
section.cat11_ranking_dtl p.image {
    width: 265px;
    height: 265px;
    background: #fff;
    position: relative;
	overflow: hidden;
}
section.cat11_ranking_dtl p.image::before {
    content: "";
    display: inline-block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 0;
}
section.cat11_ranking_dtl ul li:nth-child(1) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking01.png") no-repeat center;
    background-size: contain;
}
section.cat11_ranking_dtl ul li:nth-child(2) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking02.png") no-repeat center;
    background-size: contain;
}
section.cat11_ranking_dtl ul li:nth-child(3) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking03.png") no-repeat center;
    background-size: contain;
}

section.cat11_ranking_dtl ul {
    display: block;
    margin: 0 -11.5px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}
section.cat11_ranking_dtl ul li {
    margin: 0 9.5px;
    width: 265px;
    white-space: normal;
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    color: #5d5d5d;
    line-height: 1.42858;
}
section.cat11_ranking_dtl ul li p.txt {
    margin-top: 7px;
}	
	
/*ランキング4567*/
section.cat11_ranking_dtl_45 + section.cat11_ranking_dtl_45 {
    margin-top: 10px;
}
section.cat11_ranking_dtl_45 .inner {
    padding: 0px 40px 40px 40px;
    background-color: #e3eff8;
}
	
	

section.cat11_ranking_dtl_45 p.image {
    width: 192px;
    height: 192px;
    background: #fff;
    position: relative;
	overflow: hidden;
}
section.cat11_ranking_dtl_45 p.image::before {
    content: "";
    display: inline-block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 0;
}
section.cat11_ranking_dtl_45 ul li:nth-child(1) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking04.png") no-repeat center;
    background-size: contain;
}
section.cat11_ranking_dtl_45 ul li:nth-child(2) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking05.png") no-repeat center;
    background-size: contain;
}
section.cat11_ranking_dtl_45 ul li:nth-child(3) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking06.png") no-repeat center;
    background-size: contain;
}
section.cat11_ranking_dtl_45 ul li:nth-child(4) p.image::before {
    background: url("https://paperandgoods.itembox.design/item/images/common/ico_ranking07.png") no-repeat center;
    background-size: contain;
}

section.cat11_ranking_dtl_45 ul {
    display: block;
    margin: 0 -11.5px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}
section.cat11_ranking_dtl_45 ul li {
    margin: 0 9.5px;
    width: 192px;
    white-space: normal;
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    color: #5d5d5d;
    line-height: 1.42858;
}
section.cat11_ranking_dtl_45 ul li p.txt {
    margin-top: 7px;
}	

@media screen and (max-width: 767px) {
section.cat11_ranking_dtl .inner {
    padding: 15px 20px 15px 20px;
}
  section.cat11_ranking_dtl ul li {
    margin: 0 5px;
    width: 150px;  
}

section.cat11_ranking_dtl p.image {
    width: 150px;
    height: 150px;
position: relative;
}
section.cat11_ranking_dtl p.image::before {
    width: 30px;
    height: 30px;
z-index: 1000; 
}
section.cat11_ranking_dtl_45 .inner {
    padding: 0px 20px 15px 20px;
}
section.cat11_ranking_dtl_45 ul li {
    width: 120px;
    margin: 0 5px;
}
section.cat11_ranking_dtl_45 p.image {
    width: 120px;
    height: 120px;
position: relative;
}

section.cat11_ranking_dtl_45 p.image::before {
    width: 25px;
    height: 25px;
z-index: 1000; 
}
}