/*
Theme Name: JIN Child
Template: jin
Author: CrossPiece
Author URI: https://crosspiece.jp
Version: 2.530.1594202323
Updated: 2020-07-08 18:58:43

*/

/*CLS改善てったい。多分*/
@media (max-width: 767px) {
	#header {
		height: 70px;
	}
}
/*--------------------------------------
 トップページ挨拶
--------------------------------------*/
/*テープ付きの紙*/
.tape-box{
  margin: 1em 0;
  padding: 1em;
  background-color: #f2e2ff;
  box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15);
}

.tape{
  display: block;
  background-color: #ccb;
  opacity: 0.2;
  transform: rotate(3deg);
  width: 40%;
  height: 35px;
  margin: -2em auto 0 auto;
  border-left: 3px dotted rgba(0,0,0,.1);
  border-right: 3px dotted rgba(0,0,0,.1);
}

.tape-box p{
	font-size: 13px;		
  margin: 0;
  padding: 0;
}
/*--------------------------------------
 広告画像サイズ指定
--------------------------------------*/
.ad_img-1 {
    display:block;
    margin: .3em auto .3em auto;
	width: 325px !important;	
	height: 271px !important;
}
.ad_img-2 {
    display:block;
    margin: .3em auto .3em auto;
	width: 325px !important;	
	height: 102px !important;
}
.ad_img-3 {
    display:block;
    margin: 0 auto 0 auto;
	width: 325px !important;	
	height: 51px !important;
}

.aff_img_320x250 {
    display:block;
    margin: .3em auto .3em auto;
	width: 325px !important;	
	height: 271px !important;
}
.aff_img_300x100 {
    display:block;
    margin: .3em auto .3em auto;
	width: 325px !important;	
	height: 102px !important;
}

.aff_img_300x50 {
    display:block;
    margin: 0 auto 0 auto;
	width: 325px !important;	
	height: 51px !important;
}

/*--------------------------------------
 スマホのみヘッダー画像を非表示にする方法
--------------------------------------*/
/*
@media (max-width: 767px) {
.main-image{
display: none;
}
}
*/
/*--------------------------------------
 光るボタンとその周りのマイクロコピー
--------------------------------------*/
.abtn-mc1 a {
display: block;
position: relative;
z-index: 2;
overflow: hidden;
width: 80%;
margin: 0px auto;	
font-weight: bold ;
font-size: 14px;
/*border-bottom: solid 5px #82c374 ;*/
border-radius: 5px;
background-color: #90d582 ;
color: #ffffff !important;
padding: 8px 0;
text-align: center;
text-decoration: none;
transition: .25s linear;
-webkit-transition: .25s linear;
-moz-transition: .25s linear;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
}
.abtn-mc1 {
display: block;
width: 100%;
margin-bottom: 1em;
}
.abtn-mc1 a:hover {
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}
.abtn-mc1 a:after {
    content: "\f138";
    font-family: "font awesome 5 free";
    font-weight: 900;
    margin-left: 15px;
}
.abtn-mc1 a:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: abtn-mc1 3s ease-in-out infinite;
}
@-webkit-keyframes abtn-mc1 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
p.abtn-mc1-top-text {
    font-weight: bold;
    margin-bottom: 3px;
}
p.abtn-mc1-under-text {
    font-size: .8em;
    margin-top: -10px;
}

/* ************************************************ 
*   作家一覧の作品数をカテゴリと同じパターンに元CSSからコピペ（widget_categories→widget_recent_entries）
* ************************************************ */
.widget_recent_entries ul .count,
.widget_archive ul .count {
  position: absolute;
  right: 3px;
  top: 13px;
  padding: 1px 3px;
  min-width: 30px;
  font-size: 0.7rem;
  color: #aaa;
  border: 1px solid #ccc;
  border-radius: 2px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1rem;
  text-align: center;
  -webkit-transition: color 0.3s ease, background 0.3s ease, transform 0.3s ease, opacity 0.3s ease, border 0.3s ease, padding 0.3s ease, left 0.3s ease, bottom 0.3s ease, box-shadow 0.3s ease;
  transition: color 0.3s ease, background 0.3s ease, transform 0.3s ease, opacity 0.3s ease, border 0.3s ease, padding 0.3s ease, left 0.3s ease, bottom 0.3s ease, box-shadow 0.3s ease; }

.widget_recent_entries ul li a:hover .count,
.widget_archive ul li a:hover .count {
  color: #fff;
  background: #aaa;
  border: 1px solid #aaa; }

.widget_recent_entries ul li ul li ul li .count {
  display: none;
  top: 2px; }

@media (max-width: 767px) {
  .widget_recent_entries ul li ul li .count {
    top: 2px; } }
@media (min-width: 768px) {
  .widget_recent_entries ul li ul li .count {
    top: 2px; } }
/*--------------------------------------
  テキストリンク ハート動くやつ
<div class="txt-link is-cv is-trembling"><a href="○URL○" target="_blank" >○テキスト○</a></div>
--------------------------------------*/
.txt-link {
  font-size: 1.1em;
  font-weight: bold;
  margin: .3em 0 .3em;
  text-align: center;
}
.txt-link.is-cv a {
text-decoration: underline;	
  padding-left: 25px;
  position: relative;
  color: #fa4e87;	
}
.txt-link.is-cv a:before {
  color: #fa4e87;
  content: "♡";	
  font-size: .9em;
  left: 0;
  margin: 0 5px 0 2px;
  position: absolute;
  /*text-shadow: 1px 2px 0 rgba(0,0,0,.3);*/
}

/* CVボタン矢印揺れ */
.is-trembling a:before {
  -webkit-animation-name:is-trembling;
  -webkit-animation-duration:.8s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:ease;
  -moz-animation-name:is-trembling;
  -moz-animation-duration:1s;
  -moz-animation-iteration-count:infinite;
  -moz-animation-timing-function:ease;
}
@-webkit-keyframes is-trembling {
  0% {-webkit-transform:translate(-3px, 0);}
  100% {-webkit-transform:translate(0, 0);}
}

/*--------------------------------------
  二文字背景丸
<span class="maru2">★文字★</span><a class="aff_link" href="★URL★" target="_blank" >★テキスト★</a></span>
--------------------------------------*/
.maru2 {
    background: #cf93d9;/*背景色*/
    color: white;/*文字色*/
    border-radius: 30px;/*丸に*/
    display: inline-block;/*幅と高さを設定できるように*/
    font-size: 12px;/*文字サイズ*/
    width: 34px;/*幅*/
    line-height: 34px;/*行の高さ*/
    font-weight: bold;	
    text-align: center;/*中央揃え*/
    margin: 8px 10px 0 0;/*外側　右余白*/
}

a.aff_link  {
font-weight: bold;
}
a.aff_link:link {color: #1754f1;text-decoration: underline;	}
a.aff_link:hover {color: #6c94fc;}

/* wpp カスタムショートコード用　スタイル　*/
.wpp-rank h2::before{
    content: none;
}

.post-list.basicstyle .wpp-rank a.post-list-link{
    text-decoration: none;
}
.post-list.basicstyle .wpp-rank .post-list-inner .post-list-cat{
    font-size:1rem
}

.post-list.basicstyle .wpp-rank p{
	height:0;
}

@media (min-width: 1024px){
    .post-list.basicstyle .wpp-rank .post-list-inner .post-list-cat{
        font-size:0.8rem
    }
}
.cps-post-main .wpp-rank img{
    margin-bottom: 0;
}

.cps-post-main .wpp-rank p{
	height:0;
	padding:0;
}
.cps-post-main .wpp-rank br{
	display:none;
}


body{
  counter-reset: number 0;/* number のカウンタを 0 にセット */
}
/*
.wpp-list > li{
  display: flex;
}
.wpp-list > li::before{
  counter-increment: number 1;
  content: counter(number);
  font-size: 18px;
  font-weight: bold;
}
*/
.novel-br {
  margin:70px 0px 70px 0px;
}
/* ウィジェット内のリンク全て */
.widget a{
 text-decoration:none;/* リンクの下線消す */
 color:#222;/* リンクカラー */
}
/* ウィジェット内外部リンクアイコン削除 */
.widget a[target="_blank"]:after {
 content:none;
}
/* テキストと背景指定 */
.popular-posts .wpp-list{
  background:#fdfdfd;/* 背景カラー */
  font-weight: bold;/* テキスト太字 */
  letter-spacing: 1.3px;/* テキスト字間 */
  font-size:11px;/* テキストサイズ */	
}
/* アーカイブタイトル */
.wpp-list-title69 {
  font-size:11px;
}
/* アーカイブビュー */
.wpp-list-title69ve {
  font-size:9px;
　color:#cccccc;	
}

/* ポピュラーポストのデザインや順位付けばなんさんせにゃん */
ul.wpp-list li {
 border-bottom: 1px solid #ddd;/* 投稿下に下線 */
 position:relative;/* 位置の指定 */
}

/* リスト1段目の余白 */
ul.wpp-list li:nth-child(1){
padding: 10px 5px!important;
}
/* リスト2段目〜10段目の余白 */
ul.wpp-list li:nth-child(n+2):nth-child(-n+10){
padding:2px 5px 10px 5px!important;
}
/* ランキングカウンター実装 */
ul.wpp-list li:before{
content:counter(wpp-count);
display:block;
position:absolute;
color:#fff;
text-shadow:0 1px 2px rgba(0,0,0,0.2);
font-size:13px;
font-weight:bold;
background:#555;
padding:3px 8px;
border-radius:50%;
z-index:1;
}
/* カウント数を実装 */
ul.wpp-list li {
counter-increment: wpp-count;
}
/* 上位3位の背景色変更 */
ul.wpp-list li:nth-child(1):before{
background: #fdd35c;
}
ul.wpp-list li:nth-child(2):before{
background: #a0a0a0;
}
ul.wpp-list li:nth-child(3):before{
background: #bf783e;
}
ul.wpp-list li:nth-child(10):before{
padding:3px 10px;
}

/* Sp表示時のshortcode alutimateタブの横並び*/
@media only screen and (max-width: 768px){
    .su-tabs-mobile-stack .su-tabs-nav span {
        display: inline-block !important;
    }
}

/*----------------------------------------------------------------------------
画像
----------------------------------------------------------------------------*/
.aff_img {
    display:block;
    margin: 0px auto 5px auto;
	width: 320px;
}
.aff_img69 {
    display:block;
    margin: .5em auto .5em auto;
	width: 100%;
}
.dmm_top_img {
    display:block;
    margin: .3em auto .3em auto;
	width: 100%;
}


/*----------------------------------------------------------------------------
ページング丸を四角に
----------------------------------------------------------------------------*/
.pagination a {
    border-radius: 3px;
}

/*----------------------------------------------------------------------------
FIN <div class="fin">－　FIN　－</div>
----------------------------------------------------------------------------*/

.fin {
  margin: 5em 0 0.4em 0;	
/*   font-family: 'Amatic SC', cursive;*/
  font-size: 1.6em;
  background: url(https://movie-girls.net/zunko/siteimage/fin.png) repeat-x 0 25px;
  display: inline-block;
  padding: 0 10px
 
}
/*----------------------------------------------------------------------------
<div class="gyoukan">&nbsp;</div> 行間を空けるやつ
----------------------------------------------------------------------------*/
.gyoukan {
margin-bottom:5em;
}
/*----------------------------------------------------------------------------
h2 タイプ5のカスタマイズ アーカイブページには効かないｗ
----------------------------------------------------------------------------*/
@media (max-width: 500px){/*スマホ表示*/
.h2-style05 h2 {
font-size: 0.9rem;
padding: 5px 16px;
width: calc(100% + 30px);
margin-left: -15px;
border-radius: 0;
}}
@media (min-width: 501px) and (max-width: 768px){/*タブレット表示*/
.h2-style05 h2 {
font-size: 1.3rem;
padding: 12px 26px;
width: 108.5%;
border-radius: 0;
margin-left: -20px;
}}
@media (min-width: 769px){/*PC表示*/
.h2-style05 h2 {
font-size: 1.5rem;
padding: 12px 26px;
width: 108.5%;
border-radius: 0;
margin-left: -30px;
}}
/*----------------------------------------------------------------------------
h2 <h2 class="single-title">さんの官能小説TOP3</h2>
----------------------------------------------------------------------------*/
h2.single-title {
  position: relative;
padding-bottom: 10px;	
}

h2.single-title:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: -webkit-repeating-linear-gradient(-45deg, #fec9e5, #fec9e5 2px, #fff 2px, #fff 4px);
  background: repeating-linear-gradient(-45deg, #fec9e5, #fec9e5 2px, #fff 2px, #fff 4px);
}
/*--------------------------------------
  こんなやつ
<p class="banzai2">＼ 官能小説ランキング ／</p>
--------------------------------------*/
p.banzai {
font-size: 0.7rem;
margin-bottom: -28px;
}
p.banzai2 {
font-weight: bold;	
text-align: center;	
font-size: 1.0rem;
margin-bottom: -28px;
}

