@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template: cocoon-master
Version:1.0.8
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
.card-thumb img {aspect-ratio: auto !important;}
.e-card-snippet {display:none !important}

table.idol01 {width:100%;border:none;background:#fff;}
table.idol01 th {border:none;background:#fff;font-weight:normal;font-size:14px;background:#f791ee;color:#fff}
table.idol01 td {border:none;background:#fff;text-align:center;border-bottom:2px solid #f791ee;}
table.idol01 td img {vertical-align: middle}
table.idol01 td .idol02 {font-size:24px;font-weight:bold;color:#0000ff}

.btn-animation {display: inline-block;width: 200px;text-align: center;background-color: #fd568c;border: 2px solid #fd568c;font-size: 16px;color: #fd568c;text-decoration: none;font-weight: bold;padding: 10px 24px;border-radius: 4px;position: relative;}
.btn-animation span {position: relative;z-index: 1;}
.btn-animation::before,.btn-animation::after {content: "";display: block;background-color: #FFF;width: 50%;height: 100%;position: absolute;top: 0;transition: .2s;}
.btn-animation::before {left: 0;}
.btn-animation::after {right: 0;}
.btn-animation:hover:before,.btn-animation:hover:after {width: 0;background-color: #FFF;}
.btn-animation:hover {color: #FFF;}

.idol-side {width:48%;margin:0 1%;float:left;text-align:center;}
.idol-side img {margin:1px auto;max-height: 200px;}
.api-web {margin:100px 20px 20px;text-align:right}

.idol-top {text-align:center;}
.entry-content > *, .demo .entry-content p {margin-top: 0;margin-bottom: 0;}

.av-idol-top {text-align:center;}
.av-top  {display: inline-block;width: calc(100% / 6);}
.av-top img {width:95%;margin:0 auto;}

h1.entry-title {background:#c91dc7;font-weight:normal;color:#fff;font-size:24px;padding:20px 10px;}
h2.related-entry-heading {text-align:center;background:#c91dc7;font-weight:normal;color:#fff;line-height:60px;}

h1.archive-title {position: relative;font-size:18px;padding: 1rem 2rem; -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .1); box-shadow: 0 2px 14px rgba(0, 0, 0, .1);}
h1.archive-title:before,h1.archive-title:after { position: absolute;left: 0;width: 100%;height: 4px;content: '';background-image: -webkit-linear-gradient(315deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);background-image: linear-gradient(135deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);}
h1.archive-title:before {top: 0;}
h1.archive-title:after {bottom: 0;}

.archive-title span {display: none;}

h2.top-news-h2 {position: relative;font-size:16px;padding: 0.5rem 2rem; -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .1); box-shadow: 0 2px 14px rgba(0, 0, 0, .1);}
h2.top-news-h2:before,h2.top-news-h2:after { position: absolute;left: 0;width: 100%;height: 4px;content: '';background-image: -webkit-linear-gradient(315deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);background-image: linear-gradient(135deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);}
h2.top-news-h2:before {top: 0;}
h2.top-news-h2:after {bottom: 0;}
ul.top-news {list-style: none;margin:10px auto 20px;border:1px solid #eee;padding:10px;}
ul.top-news li {font-size:14px}
.mb20 {margin-bottom:20px;}

.entry-card-title, .related-entry-card-title {line-height: 1.3; max-height: 90px;  overflow: hidden;}

.page-numbers { width: 60px;}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
/*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
/*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px){
/*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
/*必要ならばここにコードを書く*/

table.idol01 th {display:block;}
table.idol01 td {display:block;border-bottom:none !important;}
}