/*
Theme Name: cocoon-child
Template: cocoon-master
*/


/* １．サイト全体================================ */

/* コンテンツの背景を統一 */

.header-container,
.main,
.sidebar,
.footer {
background-color: #EBE8D3;
}


/* 固定ページタイトルを非表示 */
.entry-title {
display: none;
}


/* ヘッダーボタンの背景と文字の色変更 */
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background-color: #ebe8d3;
	color: #000;
	font-size:1.2em;
	box-shadow:none!important;
}

.search-menu-button.menu-button,
.navi-menu-button.menu-button a{
	color: #000;
}

.menu-caption{
	color: #000!important;
}

.logo-menu-button.menu-button{
	background-color: #ebe8d3;
		box-shadow:none!important;
}






/* ２．TOP================================ */

/*＝＝＝＝ タイトルデザイン出し分け＝＝＝＝*/
/* パソコンで見たときは"pc"が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

/* スマートフォンで見たとき画像がはみ出ない */
@media only screen and (max-width: 750px) {
    img { max-width: 100%; }
}

/* タイトルデザイン */

.title_news {
    position: relative;
    display: inline-block;
    padding: 0 30px;
    margin-bottom: 37px;
    font-size: 24px;
}
       
.title_news:before {
    position: absolute;
    left: 10px;
    top: 1px;
    content: "";
    width: 1px;
    height: 40px;
    background: #000;
    border-radius: 1px;
    transform: rotate(-25deg);
}
       
.title_news:after {
    position: absolute;
    content: "";
    right: -426px;
    top: -500px;
    width: 1px;
    height: 1080px;
    background: #000;
    border-radius: 1px;
    transform: rotate(90deg);
}



.title_artist {
    position: relative;
    display: inline-block;
    padding: 0 30px;
    margin-bottom: 37px;
    font-size: 24px;
}
       
.title_artist:before {
    position: absolute;
    left: 10px;
    top: 1px;
    content: "";
    width: 1px;
    height: 40px;
    background: #000;
    border-radius: 1px;
    transform: rotate(-25deg);
}
       
.title_artist:after {
    position: absolute;
    content: "";
    right: -411px;
    top: -500px;
    width: 1px;
    height: 1080px;
    background: #000;
    border-radius: 1.px;
    transform: rotate(90deg);
}


/* スマホで表示させる内容 */

.title_artist_sp {
    position: relative;
    display: inline-block;
    padding: 0 30px;
    margin-bottom: 37px;
    font-size: 24px;
}
       
.title_artist_sp:before {
    position: absolute;
    left: 10px;
    top: 1px;
    content: "";
    width: 1px;
    height: 40px;
    background: #000;
    border-radius: 1px;
    transform: rotate(-25deg);
}
       
.title_artist_sp:after {
    position: absolute;
    content: "";
    right: -20px;
    top: -110px;
    width: 1px;
    height: 300px;
    background: #000;
    border-radius: 1.px;
    transform: rotate(90deg);
}



.title_news_sp {
    position: relative;
    display: inline-block;
    padding: 0 30px;
    margin-bottom: 37px;
    font-size: 24px;
}
       
.title_news_sp:before {
    position: absolute;
    left: 10px;
    top: 1px;
    content: "";
    width: 1px;
    height: 40px;
    background: #000;
    border-radius: 1px;
    transform: rotate(-25deg);
}
       
.title_news_sp:after {
    position: absolute;
    content: "";
    right: -35px;
    top: -110px;
    width: 1px;
    height: 300px;
    background: #000;
    border-radius: 1.px;
    transform: rotate(90deg);
}









/* ARTIST */

.top_artistimg{
	margin-left:10px;	
	width:230px;
	text-align:center;
}


.container_a {
display: flex;
text-decoration:none;
}

.box_a {
margin-left:10px;
}

.box_a_sp {
margin:-40px -110px 0 0;
font-size:12px;
text-align:left;
}

.box_sptext{
	margin-left:10px;
}



/* ３．NEWS================================ */


/* NEWS 一覧表示 */

.wp-show-posts-columns .wp-show-posts-single:not(.wp-show-posts-masonry-block) {
  display: block;
}
 

.wp-show-posts-entry-content p {
  font-size: 12px;
}
 
.wp-show-posts-columns {
width:100%;
}
.wp-show-posts-columns .wp-show-posts-inner {
  margin: 0 0 20px 50px !important;
	width:180px;
}
 


 
 /* 背景色*/
.wp-show-posts-inner{
	background-color:rgba(255,255,255,0.5);
}

.wp-show-posts-entry-content p:first-child {
  display: none;
}


/* NEWS 一覧表示  詳細ボタンとテキスト・タイトル*/
section {
  max-width: 1000px;
  margin: 0 auto;
}
.wpsp-read-more{
	margin-left:125px;
   display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 25px;
  box-sizing: border-box;

  color: #333;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-decoration: none;
  position: relative;
}
.read-more  {
		text-decoration:none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 20px;
  background: #000;
  color:#fff;
  box-sizing: border-box;
  position: absolute;
  top: -2px;
  left: -2px;
  transition-duration: 0.1s;
}

.read-more:hover{
	color:#fff;
	background: #c6af2a;
  left: -1px;
  top: -1px;
}



/*タイトル*/
.wp-show-posts-entry-title{
font-size:14px;
	padding:0px 0  0 10px ;
}

/*日付とカテゴリ*/
.wp-show-posts-entry-meta{
	font-size:12px;
	padding:0 0 0 10px;
}

/*詳細*/
.wp-show-posts-entry-summary{
    margin-top:-10px;
	  font-size:15px;
}


.wp-show-posts-entry-summary p{
	font-size:12px;
	line-height:16px;
	padding:0 0 0 10px;
}


/* ３．ARTIST================================ */

/* 画像の位置など*/
.talent_box{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 1px black;
    border-bottom: solid 1px black;
	background-color:#f9f7ea;
}
.talent_box:before, .talent_box:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 1px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: black;
}
.talent_box:before {left: 10px;}
.talent_box:after {right: 10px;}
.talent_box p {
    margin: 0; 
    padding: 0;
}

/* 経歴タイトル部分*/
.border{
	font-size:19px;
	color:#fff;
	text-align:center;
	border-bottom: 1px solid #333;
  padding: 4px;
  background: #000;
	
}


/* プロフィール画像カルーセル表示*/
.imageList {
  width: 750px;
  display: flex;
		margin-left: -100px;
}
.imageList__view {
  flex: 0 0 430px;
  height: 700px;

}
.imageList__thumbs {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  height: 660px;

}
.imageList__thumbnail {
  margin-left: 0px;
	filter: grayscale(100%);
	margin-bottom:-300px;
  flex: 0 1 calc(50.5% - 10px);

}
.imageList__thumbnail:nth-child(n+3) {
  margin-top: 10px;
}
.imageList img {
  width: 100%;
  display: block;
}



.imageList_sp {
  width: 370px;
  display: flex;
}
.imageList__view_sp {
  flex: 0 0 200px;
  height: 300px;
	margin-left:-20px;
}
.imageList__thumbs_sp {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  height: 215px;

}
.imageList__thumbnail_sp {
  margin-left: 0px;
	filter: grayscale(100%);
	margin-bottom:0px;
  flex: 0 1 calc(35% - 3px);
}
.imageList__thumbnail_sp:nth-child(n+3) {
  margin-top: -25px;
}
.imageList_sp img {
  width: 100%;
  display: block;
}


/* コンポジボタン*/
.section2 {
  max-width: 300px;
  margin: 0 auto;
}
a.btn_04 {
  margin:-50px 0 0 -370px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 50px;
  position: relative;
  background: #000;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
}
a.btn_04:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -6px;
}
a.btn_04:hover {
  background: #c6af2a;
  color: #fff;
}
a.btn_04:hover:before {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}






a.btn_04sp {
	margin-left:-30px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 180px;
  height: 50px;
  position: relative;
  background: #000;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
}


a.btn_04sp:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -6px;
}
a.btn_04sp:hover {
  background: #c6af2a;
  color: #fff;
}
a.btn_04sp:hover:before {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}




/* 経歴タブ分け*/
.tabs {
  margin-top: 50px;
  padding-bottom: 20px;
	background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
	text-align: left;
  margin: 0 auto;
  font-size:15px;
	padding-left:-20px;
}

.tab_item {
  width: calc(100%/5);
  height: 50px;
  border-bottom: 3px solid #c6af2a;
	background-color: #000;
  line-height: 50px;
  font-size: 14px;
  text-align: center;
  color: #fff;
  display: block;
  float: left;
  text-align: center;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}

input[name="tab_item"] {
  display: none;
}

.tab_content {
  display: none;
  height:300px;
	padding:10px 20px;
	border:2px  #000;
  clear: both;
  overflow: auto;
	height:500px;
}

#web:checked ~ #web_content,
#mv:checked ~ #mv_content,
#direction:checked ~ #direction_content,
#webMovie:checked ~ #webMovie_content,
#radio:checked ~ #radio_content,
#movie:checked ~ #movie_content,
#drama:checked ~ #drama_content,
#tv:checked ~ #tv_content,
#pv:checked ~ #pv_content,
#magazine:checked ~ #magazine_content,
#stage:checked ~ #stage_content, 
#cm:checked ~ #cm_content,
#other:checked ~ #other_content{
  display: block;
}

.tabs input:checked + .tab_item {
  background-color: #c6af2a;
  color: #fff;
}



/* 経歴タブ分け　エリーさん*/
.tabs02 {
  margin-top: 50px;
  padding-bottom: 20px;
	background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
	text-align: left;
  margin: 0 auto;
  font-size:15px;
	padding-left:-20px;
}

.tab02_item {
  width: calc(100%/8);
  height: 50px;
  border-bottom: 3px solid #c6af2a;
	background-color: #000;
  line-height: 50px;
  font-size: 14px;
  text-align: center;
  color: #fff;
  display: block;
  float: left;
  text-align: center;
  transition: all 0.2s ease;
}
.tab02_item:hover {
  opacity: 0.75;
}

input[name="tab_item"] {
  display: none;
}

.tab02_content {
  display: none;
  height:300px;
	padding:10px 20px;
	border:2px  #000;
  clear: both;
  overflow: auto;
	height:500px;
}

#movie02:checked ~ #movie02_content,
#drama02:checked ~ #drama02_content,
#tv02:checked ~ #tv02_content,
#pv02:checked ~ #pv02_content,
#magazine02:checked ~ #magazine02_content,
#stage02:checked ~ #stage02_content, 
#cm02:checked ~ #cm02_content,
#radio02:checked ~ #radio02_content,
#other02:checked ~ #other02_content{
  display: block;
}

.tabs input:checked + .tab_item {
  background-color: #c6af2a;
  color: #fff;
}
