@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/
#header-image {
	background-position:top;
}
.header-image__descr {
	font-size:0.75em;
	font-weight:bold;
}
.cardtype__article time {
	margin-top: 0;
}
.cat-name {
	position: unset;
	float: right;
	margin-right: 13px;
}

@media only screen and (min-width: 768px) {
	.header-image__descr {
		font-size:1.6em;
	}
}
.header-image__headline {
	font-size:1.65em;
}
@media only screen and (min-width: 768px) {
	.header-image__headline {
		font-size:3em;
	}
}
.pastel-bc, #inner-content .pastel-bc {
	background-color: #36caca!important;
}
#inner-content .hh18 {
	border-bottom: solid 3px #91e842;
}
#inner-content .hh18:after {
	border-bottom: 3px solid #36caca;
}
#inner-content .hh7 {
	color: #fff;
}
#inner-content .hh5 {
	color: #fff;
}
#inner-content .hh16 {
	background:#36caca;
}
.lkc-external-wrap, .lkc-internal-wrap, .lkc-this-wrap {
  background-image: none !important;
  border-radius: 3px !important;
  padding: 16px !important;
}
.lkc-card {
  margin: 0 !important;
}
.lkc-domain {
  font-weight: bold;
  color: #4eacd1 !important;
}
.lkc-content {
    margin-top: 6px !important;
    word-break: break-all !important;
    white-space: normal !important;
    overflow: hidden !important;
    position: relative !important;
    min-height: 100px !important;
    height: auto !important;
    padding-right: 110px !important;
}
.lkc-title {
  line-height: 1.4em !important;
}
.lkc-excerpt {
  line-height: 1.5em !important;
}
.lkc-thumbnail {
  margin: 0 !important;
}

.lkc-thumbnail img {
  border-radius: 0px !important;
}

.lkc-thumbnail img {
  width:100px !important;
  height:100px !important;
  padding: 0 !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
}
#custom_html-3.widget {
	background:none;
}
.yourprofile {
	margin-bottom:8px;
}
.reajoy-author-info__inner .reajoy-tb-left {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	padding: 20px 15px 5px;
}
.flex-box {
	width:20%;
}
@media only screen and (max-width: 768px) {
	.flex-box {
		width:40%;
	}
}
.flex-box a {
	color:#36caca;
}
.sidebar #custom_html-7 .widgettitle:before {
	content:"\f007";
}
.sidebar #custom_html-5 .widgettitle:before {
	content:"\f1e0";
}
/*トップページ人気記事用のウィジェット*/
.popular-posts .cardtype__article-info {
    padding-top: 0.5em;
}
.popular-posts .cardtype__link {
    padding-bottom: 10px;
}
.popular-posts.cardtype {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -moz-box;
    display: flex;
    flex-direction: row;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.popular-posts .cardtype__article {
  width: 48%;
  margin: 0 0 25px;
}
.popular-posts .cardtype__article:nth-child(odd){
  margin-right: 4%;
}
.popular-posts .cardtype__article p {
  margin: 0;
}
.popular-posts.cardtype h2 {
    margin: 0 5px;
    /* font-size: 15px; */
		font-size: 0.95em;
    text-align: center;
}
@media only screen and (max-width: 768px) {
	.popular-posts.cardtype h2 {
		font-size: 0.95em;
		text-align: center;
	}
}
.textwidget p.top-title {
	padding: .8em .2em;
	background:linear-gradient(45deg,#91e842,#36caca);
	color:#fff;
}
#inner-content .blue-bc {
    background: #36caca;
}
/*--------------------------------------
アイコンとユーザー名を追加
--------------------------------------*/
.tb-left.top-grid {
  display: flex;
  margin-left: 13px;
	margin-right: 13px;
	padding-bottom: 13px;
}
.tb-left.top-grid.single-page {
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 768px) {
	.tb-left.top-grid.single-page {
	  margin-left: 13px;
	  margin-right: 13px;
	}
}
.dfont.top-grid {
  margin-left: 8px;
  padding-top: 6px;
}
.author_img.top-grid {
  width: 48px;
  height: 48px;
}
.author_img.top-grid img {
  border: solid 3px #dfe2e8;
}
.top-grid .cardtype__link {
  padding-bottom: 13px;
}
.cardtype__link {
	padding-bottom:13px;
}
/*--------------------------------------
wppでランキング順位を表示する
--------------------------------------*/
/* カウンタをリセット */
.my-widget.show_num {
    counter-reset: wpp-ranking;
}
/* 一覧の表示 */
.my-widget.show_num li {
    position: relative;
}
/* 順位を表示 */
.my-widget.show_num li:before {
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
 	display: inline-block;
 	position: absolute;
 	z-index: 1;
 	top: 0;
 	left: -3px;
 	width: 23px;
 	height: 23px;
	border-radius: 50%;
	text-align: center;
	line-height: 23px;
}
/* 1位 */
.my-widget.show_num li:nth-child(1):before {
	background: #ff9a47;
	color: #fff;
}
/* 2位 */
.my-widget.show_num li:nth-child(2):before {
	background: #ff9a47;
	color: #fff;
}
/* 3位 */
.my-widget.show_num li:nth-child(3):before {
	background: #ff9a47;
	color: #fff;
}
/* 4位以降の色 */
.my-widget.show_num li:nth-child(n + 4):before{
	background: #f3f3f3;
	color: #9a9a9a;
}

/*--------------------------------------
　2019/01/28 追加
--------------------------------------*/
#header-image{
	min-height: auto;
}
span.author_sid {
	font-size: 13px;
}
.author_sid img {
	margin-right: 6px;
	border-radius: 50%;
	border: solid #dfe2e8 2px;
}
.single_views{
	margin-left: 6px;
}
i.fa.fa-eye {
	padding-right: 4px;
}
span.single_views {
	display: inline-block;
}
.widget .my-widget li span a {
	padding: 0;
}
.my-widget.show_num li {
	padding: 7px 0;
	display: table;
}

.my-widget li a .my-widget__img {
	display: block;
}

.my-widget__img img {
  width: 100%;
  border: solid 2px #f3f3f3;
  transition: .3s ease-in-out;
}

.my-widget li a .my-widget__img {
	display: block;
	width: 130px;
	height: 88px;
	padding-right: 6px;
	vertical-align: middle;
}

.widget .my-widget li a {
	display: block;
	padding: 0;
}
.my-widget.show_num li div {
	display: table-cell;
}

.my-widget__text {
	width: 180px;
	width: calc(100% - 88px);
	font-size: .9em;
	vertical-align: top;
	line-height: 1.5;
}
.label-popular a{
	color:#fff;
}

.widget h4 + * {
  margin-top: 0;
  margin-bottom: 0;
  padding: 8px 8px;
}
/* オーディブル */
.Audible{
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
  width: 100%;
	max-width: 640px;
	display: block;
}
.Audible-Img{
	padding-top: 15.625%;
	width: 100%;
	display: block;
}
.Audible300{
	margin-left: auto;
	margin-right: auto;
  width: 100%;
	max-width: 300px;
	display: block;
}
.Audible300-Img{
	padding-top: 83.33%;
	width: 100%;
}
.AudibleArticle{
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
  width: 100%;
	max-width: 640px;
	display: block;
}
.AudibleArticle-Img{
	padding-top: 57.35%;
	width: 100%;
	display: block;
}
.AudibleHeader{
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
  width: 100%;
	max-width: 640px;
	display: block;
}
.AudibleHeader-Img{
	padding-top: 15.625%;
	width: 100%;
	display: block;
}
@media screen and (max-width: 768px) {
	.Audible{
		margin-top: 10px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.AudibleHeader{
		margin-top: 10px;
		padding-left: 15px;
		padding-right: 15px;
	}
}
/*--------------------------------------
　2020/02/24 追加
  フッター固定キャンペーン
--------------------------------------*/
.FixedMenuSection {
  position: fixed;
  left: 0;
  bottom: 60px;
  width: 62%;
	padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  background: #36caca;
	box-shadow: 0 -1px 3px rgba(100,120,130,.25);
	z-index: 100;
	opacity: 0;
	transition: all 0.65s;
	pointer-events: none;
}
.FixedMenuSection.isActive{
	opacity: 1;
	transition: all 0.65s;
	pointer-events: auto;
}
.FixedMenu-Inner-Btn{
	position: absolute;
	top: 4px;
	right: 4px;
	width: 20px;
	height: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.FixedMenu-Inner-Btn-Icon{
	color: #fff;
	font-size: 20px;
}

.FixedMenu-Inner-List {
  display: flex;
}
.FixedMenu-Inner-List-Item {
  width: 100%;
  color: #fff;
	font-weight: bold;
  font-size: 12px;
}
/*--------------------------------------
　2020/04/30 追加
  Ad Inserterで挿入した関連記事のボーダースタイル
--------------------------------------*/
.code-block .linkto{
  border: solid 2px #eaedf2!important;
}
/*--------------------------------------
　2020/05/25 追加
  「Amazonで購入」「Kindleで読む」のボタン色を反対に
--------------------------------------*/
.cstmreba .kaerebalink-link1 .shoplinkamazon, .booklink-link2 .shoplinkamazon{
  background: #ffb36b;
}
.cstmreba .kaerebalink-link1>div, .booklink-link2>div{
  background: #73c1ea;
}
/*--------------------------------------
　2020/05/25 追加
  .main-bcの背景色を「#ff9a47」に変更
--------------------------------------*/
.main-bc{
  background-color: #ff9a47!important;
}
/*--------------------------------------
　2020/06/18 追加
  一般書籍記事の電子書籍.main-bcの背景色を「#36caca」に変更
--------------------------------------*/
.main-bc.isBookReviewEbook{
  background-color: #36caca!important;
}
/*--------------------------------------
　2020/06/21 追加
  漫画最新話をカテゴリー一覧から除外
--------------------------------------*/
.cat-item-858,
.cat-item-860,
.cat-item-861,
.cat-item-856,
.cat-item-857,
.cat-item-859,
.cat-item-890,
.cat-item-903,
.cat-item-1145,
.cat-item-1309,
.cat-item-1369{
  display: none;
}
/*--------------------------------------
　2020/08/27 追加
  PC版のアイキャッチ横線のエラーを解消する
--------------------------------------*/
.logly-lift-widget-header::after{
  display: none!important;
}
/*--------------------------------------
　2020/09/5 追加
  ヘッダー下に漫画王国バナー
--------------------------------------*/
.MangaOkokuHeader{
	margin-left: auto;
	margin-right: auto;
  width: 100%;
	display: none;
}
.MangaOkokuHeader-Img{
	padding-top: 15.625%;
	width: 100%;
	display: block;
}
@media screen and (max-width: 480px) {
	.MangaOkokuHeader{
		display: block;
		/* margin-top: 10px;
		padding-left: 15px;
		padding-right: 15px; */
	}
}
/*--------------------------------------
　2020/09/23 追加
  オーバーレイ広告のための余白作成
--------------------------------------*/
@media screen and (max-width: 480px) {
	#container{
		padding-bottom: 140px;
	}
	.totop{
		/*bottom: 148px;*/
	}
}
/*--------------------------------------
　2020/09/23 追加
  PC用2カラムアドセンス
--------------------------------------*/
.is2clAd{
	display: flex;
	justify-content: center;
}
.is2clAd>div{
	width: calc((100% - 30px) / 2);
	height: auto;
}
.is2clAd>div:nth-child(2){
	margin-left: 30px;
}
#ed_toolbar input{display: none!important;}
/*--------------------------------------
　2021/03/12 追加
  トップページブックコラム一覧
--------------------------------------*/
.home_top{
	margin:0!important;
}
.widget_text.home_top{
	margin: 0 6% 1em 0!important;
}

.home_top .c_linkto{
  margin:0 4% 25px 0;
  width: 45%;
}
.isTopCard{
	margin-top: 1.5em;
}
@media screen and (max-width: 480px) {
	.widget_text.home_top{
	  margin: 0 auto!important;
    }
	.home_top .c_linkto{
	  margin: 0 0 25px;
      width: 100%;
	}
}
/*--------------------------------------
　2021/04/02 追加
  ページャーのカレント見た目調整
--------------------------------------*/
.page-links{
	margin: 2em 0!important;
}
.page-links span.current span{
	margin: 0!important;
	background: #36caca!important;
  color: #fff!important;
}
.page-links a span{
	background: #fff!important;
  color: #36caca!important;
  border: 1px solid #ccc!important;
}
/*--------------------------------------
　2021/04/013 追加
  次のページのh2のスタイリング
--------------------------------------*/
.NextH2{
	border: 2px solid #252525;
	margin-left: auto;
  margin-right: auto;
	width: 56%;
  display: flex;
}
@media screen and (max-width: 480px){
	.NextH2{
		width: 90%;
	}
}
.NextH2-Label{
	position: relative;
	padding: 6px 0px;
	width: 27%;
	display: flex;
	justify-content: center;
  align-items: center;
	text-align: center;
  background: #252525;
  color: #fff;
	font-weight: bold;
  font-size: 14px;
}
.entry-content .NextH2 > *{
	margin: 0!important;
}
.entry-content .NextH2 > * + *{
	width: 73%;
	line-height: 1.25;
}
.NextH2-Title{
  padding-top: 10px;
	padding-left: 24px;
	padding-right: 34px;
  padding-bottom: 8px;
  width: 100%;
	height: 100%;
	display: block;
	text-decoration: none!important;
	color: #252525!important;
	font-weight: bold;
	font-size: 14px;
}
/*星のスタイル*/
.rating-star{
  color: #f5bc55;
  font-size: 1.2em;
}
/*数字のスタイル*/
.rating-number{
  color: #333;
  font-size: 0.9em;
  margin-left: 0.4em;
}
/*--------------------------------------
　2021/06/28 追加
  目次スタイル
--------------------------------------*/
#toc_container .toc_list{
  margin-left: 3px;
  list-style: none;
}
/*--------------------------------------
　2021/06/28 追加
  比較表スタイル
--------------------------------------*/
.isTable28971 table{
	height: auto;
  display: block;
  overflow-x: scroll;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}
.tableBgPrimary{
  text-align: center;
  background: #36caca;
  color: #fff;
}
.tableBgW{
  background: #fff;
}
.tableSticky{
  position: sticky;
  left: 0;
  z-index: 3;
}
/*--------------------------------------
　2021/07/6 追加
  おすすめ漫画表スタイル
--------------------------------------*/
.isTableFs14 th,
.isTableFs14 td{
  font-size: 14px;
}
/*--------------------------------------
　2021/07/10 追加
  あらすじ・読みどころポイントスタイル
--------------------------------------*/
.entry-content .isBorderLeft{
  margin: 2.6em 0 .7em;
  padding: 10px 0 10px 10px;
  border-left-width: 4px;
  border-left-style: solid;
  border-color: #36caca;
  font-weight: 700;
  font-size: 1.2em;
  line-height: 1.5;
}
.entry-content h2.isBorderLeft{
  font-size: 1.4em;
}
.entry-content h4.isBorderLeft{
  font-size: 1.1em;
}
/*--------------------------------------
　2021/08/5 追加
  商品リンクブロックアップデート
--------------------------------------*/
.cstmreba{
	border: none;
	padding: 0px 10px;
}
.booklink-box{
	display: flex;
  justify-content: center;
	flex-wrap: wrap;
}
.booklink-image{
	display: block;
  width: 50%;
}
.booklink-image img{
	box-shadow: 0 10px 15px -5px rgb(0 0 0 / 38%), 0 0 2px rgb(0 0 0 / 15%);
}
.booklink-info{
	margin-top: 15px;
	width: 100%;
  padding-left: 0;
  text-align: center;
}
.booklink-info .shoplinkbooklive{
  border: 1px solid #B4B4B4;
	border-radius: 4px;
	margin-right: 0!important;
  box-shadow: none;
  width: 100%;
  background: #fff;
	text-align: center;
}
.booklink-info .shoplinkbooklive a{
	width: 100%;
	color: #333;
	font-weight: 400;
}
.cstmreba .kaerebalink-link1 a:before, .booklink-link2 > div a:before{
	content: "";
}
.cstmreba .shoplinkbooklive a:before{
	padding-right: 3px;
    content: "\f518";
	font-family: Font Awesome\ 5 Free;
	font-weight: 900;
}
.kaerebalink-name p, .booklink-name p{
	margin-top: 10px;
}
.booklink-info .shoplinkrakuten,
.booklink-info .shoplinkamazon,
.booklink-info .shoplinkkindle{
	opacity: 0.9;
}
@media screen and (max-width: 480px){
	.cstmreba .kaerebalink-link1 > div:hover, .cstmreba .booklink-link2 > div:hover{
		box-shadow: 0 2px 3px rgb(0 0 0 / 28%);
	}
	.cstmreba .shoplinkbooklive:hover{
		box-shadow: none!important;
	}
}
/*--------------------------------------
　2021/08/16 追加
  お問い合わせ送信ボタンのUI
--------------------------------------*/
.wpcf7-form input[type=submit]{
  border: none;
}
/*--------------------------------------
　2021/09/02 追加
  商品ブロック画像サイズ調整
--------------------------------------*/
.booklink-image{
  width: 250px;
}
/*--------------------------------------
　2021/09/03 追加
  試し読みボタンの上部余白を半分に
--------------------------------------*/
.cstmreba .kaerebalink-link1, .booklink-link2{
	margin-top: 4px;
}
/*--------------------------------------
　2021/10/7 追加
  商品リンクボタンのUI
--------------------------------------*/
.booklink-link2{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.booklink-detail{
	width: 100%;
}
/* BookLiveボタン */
.cstmreba .kaerebalink-link1 .shoplinkbooklive02, .booklink-link2 .shoplinkbooklive02{
  position: relative;
  margin: 5px 0 5px!important;
	width: 48%;
  height: 50px!important;
  background: #fff;
  opacity: 1;
}
.shoplinkbooklive02::before{
  content: '';
  display: inline-block;
  position: absolute;
  bottom: 3px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 0;
  width: 84px;
  /* width: 40px; */
  height: 25px;
  /* height: 24px; */
  background-image: url(https://reajoy.net/wp-content/uploads/2021/10/booklive-2.png);
  background-size: contain;
}
.shoplinkbooklive02::after{
	content: '電子書籍最大50%OFF';
	position: absolute;
  top: -2px;
  left: 50%;
  z-index: 0;
  transform: translate(-50%,0);
	width: 100%;
  color: #FF1144;
  font-size: 11px;
}
.cstmreba .kaerebalink-link1 .shoplinkbooklive02 a, .booklink-link2 .shoplinkbooklive02 a{
  position: relative;
  z-index: 2;
  display: block!important;
  height: 100%;
  color: transparent;
}
/* 楽天ボタン */
.cstmreba .kaerebalink-link1 .shoplinkrakuten, .booklink-link2 .shoplinkrakuten{
  position: relative;
  margin: 5px 0 5px!important;
	width: 48%;
  height: 50px!important;
  background: #fff;
  opacity: 1;
}
.shoplinkaudible + .shoplinkrakuten{
  margin: 5px 0 5px 0!important;
}
.shoplinkrakuten::before{
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
  width: 84px;
  height: 50px;
  background-image: url(https://reajoy.net/wp-content/uploads/2021/10/rakuten.png);
  background-size: contain;
}
.cstmreba .kaerebalink-link1 .shoplinkrakuten a, .booklink-link2 .shoplinkrakuten a{
  position: relative;
  z-index: 2;
  display: block!important;
  height: 100%;
  color: transparent;
}
/* Amazonボタン */
.cstmreba .kaerebalink-link1 .shoplinkamazon, .booklink-link2 .shoplinkamazon{
  position: relative;
  margin: 5px 0 5px!important;
	width: 48%;
  height: 50px!important;
  background: #fff;
  opacity: 1;
}
.shoplinkamazon::before{
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
  width: 84px;
  height: 50px;
  background-image: url(https://reajoy.net/wp-content/uploads/2021/10/amazon.png);
  background-size: contain;
}
.cstmreba .kaerebalink-link1 .shoplinkamazon a, .booklink-link2 .shoplinkamazon a{
  position: relative;
  z-index: 2;
  display: block!important;
  height: 100%;
  color: transparent;
}
/* Audibleボタン */
.cstmreba .kaerebalink-link1 .shoplinkaudible, .booklink-link2 .shoplinkaudible{
  position: relative;
  margin: 5px 0 5px!important;
	width: 48%;
  height: 50px!important;
  background: #fff;
  opacity: 1;
}
.shoplinkaudible::before{
  content: '';
  display: inline-block;
  position: absolute;
  /* top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); */
	bottom: 8px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 0;
  width: 64px;
  height: 20px;
  /* height: 50px; */
  background-image: url(https://reajoy.net/wp-content/uploads/2021/10/audible-logo.png);
  background-size: contain;
}
.shoplinkaudible::after{
	content: 'オーディオブック１冊無料';
	position: absolute;
  top: -2px;
  left: 50%;
  z-index: 0;
  transform: translate(-50%,0);
	width: 100%;
  color: #FF1144;
  font-size: 10px;
}
.cstmreba .kaerebalink-link1 .shoplinkaudible a, .booklink-link2 .shoplinkaudible a{
  position: relative;
  z-index: 2;
  display: block!important;
  height: 100%;
  color: transparent;
}
.img-radius {
  border-radius: 50%;
}
.entry-content div.quote_silver{
	margin: 1.5em 0;
}
.entry-content div.quote_silver p{
  margin: 10px 0;
	line-height: 1.7;
}
/*--------------------------------------
　2021/11/11 追加 12/27変更
  吹き出し新UI
--------------------------------------*/
.say{
	position: relative;
	display: flex;
	flex-wrap: wrap;
}
.faceicon{
	margin-bottom: 0!important;
	width: 48px;
	padding-right: 0;
}
.faceicon img{
	border: solid 2px #eaedf2;
}
.faceicon span{
	position: absolute;
	top: 10px;
	right: 0;
	z-index: 2;
	padding-left: 4px;
  width: calc(100% - 48px);
  text-align: left;
	font-size: 100%;
}
.chatting{
	width: 100%;
	font-size: 100%;
}
@media only screen and (min-width: 481px){
	.chatting{
		padding-top: 0;
	}
}
.sc{
	border: none;
	padding: 8px 0 0;
	word-break: normal;
}
.sc:before{
	display: none;
}
.sc:after{
	display: none;
}
.sc p{
	margin: 0 0 0.8em;
}
/*--------------------------------------
　2021/12/2 追加
  箇条書きスタイルアップデート
--------------------------------------*/
.entry-content ul{
	border: none;
	padding: 0 1em 0 1.5em;
}
.li-check ul{
	border: solid 2px #ffb03f;
	padding: 1em 0.5em 1em 2.5em;
}
/*--------------------------------------
　2021/12/19 追加
  目次のフォント小さく
--------------------------------------*/
#toc_container{
	margin: 1rem 0;
	padding: 16px 15px;
	font-size: 14px;
}
#toc_container .toc_list li{
	line-height: 1.5;
}
#toc_container .toc_list li ul li{
	line-height: 1.8;
}
/*--------------------------------------
　2021/12/23 追加
  商品リンク コミックシーモアのUI
--------------------------------------*/
.cstmreba .kaerebalink-link1 .shoplinkcmoa02, .booklink-link2 .shoplinkcmoa02{
  position: relative;
  margin: 5px 0 5px!important;
	width: 48%;
  height: 50px!important;
  background: #fff;
  opacity: 1;
}
.shoplinkcmoa02::before{
  content: '';
  display: inline-block;
  position: absolute;
  bottom: 3px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 0;
  width: 84px;
  height: 25px;
  background-image: url(https://reajoy.net/wp-content/uploads/2021/12/cmoa03.png);
  background-size: contain;
}
.shoplinkcmoa02::after{
	content: '電子コミック50%OFF';
	position: absolute;
  top: -2px;
  left: 50%;
  z-index: 0;
  transform: translate(-50%,0);
	width: 100%;
  color: #FF1144;
  font-size: 11px;
}
.cstmreba .kaerebalink-link1 .shoplinkcmoa02 a, .booklink-link2 .shoplinkcmoa02 a{
  position: relative;
  z-index: 2;
  display: block!important;
  height: 100%;
  color: transparent;
}
/*--------------------------------------
　2021/12/24 追加
  CTAのコミックシーモアボタンのUI
--------------------------------------*/
.btn-cta{
	position: relative;
	border-radius: 8px;
	margin: .5em auto!important;
	padding: 13px 13px;
  width: 240px;
	display: block;
	font-size: 14px;
}
.btn-cta::after{
	content: "\f054";
	padding-left: 5px;
  font-family: Font Awesome\ 5 Free;
  font-weight: 900;
}
/*--------------------------------------
　2022/01/19 追加
  トップへ戻るボタンのUI変更
--------------------------------------*/
.totop:hover{
	text-decoration: none;
}
.totop{
	border: 1px solid #36caca;
	box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
.totop-box{
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.totop-box-icon{
	width: 18px;
	height: 15px;
}
.totop-box-text{
	margin-top: 4px;
	line-height: 10px;
	color: #000;
	font-weight: bold;
	font-size: 10px;
}