@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;height:220px;}
.idol-side img {margin:1px auto;max-height: 210px;}
.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;}

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;}

div.mgs_widget_r_h h2.h2class_h { background-image: url("https://www.mgstage.com/img/common/widget_logo.gif") !important;}

.ero-list {text-align:center;margin:0 auto 10px;}
.ero-info {width:24%;padding:1px;font-size:14px;margin:1px;float: left;min-height: 260px;}
.ero-info a {text-decoration: none;line-height:1.2}
.ero-info img {max-height:140px}
.name-list {text-align:center;margin:0 auto 30px;}
.name-info {width:19%;padding:1px;font-size:14px;margin:1px;float: left;min-height: 350px;}
.name-info a {text-decoration: none;line-height:1.2}

table.table-ero {}
table.table-ero td {text-align:center;}

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

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

/*768px以下*/
@media screen and (max-width: 768px){
	.ero-info, .name-info {width:49%;padding:1px;min-height: auto;}

/*必要ならばここにコードを書く*/
}

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

table.idol01 th {display:block;}
table.idol01 td {display:block;border-bottom:none !important;}
	.ero-info, .name-info {width:98%;padding:1px;margin:0 auto;min-height: auto;}
}