@charset "UTF-8";
/* CSS Document */

/*対談*/
.talk {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 5px;
}
.talk_name {
width: 7%;
font-weight: 700;
white-space:nowrap;
color: black;
}

.talk_name.know {
color: #26720a;
}
.talk_name.listen {
color: #187489;
}
.talk_name.visit {
color: #d6550d;
}
.talk_name.view {
color: #3319c4;
}
.talk_name.pink {
color: #e156b8;
}


.talk_colon {
width: 2%
}
.talk_text {
width: 91%
}
.talk_text2 {
width: 46%;
}
.talk_photo  {
width: 45%;
margin-left: 12%;
}
.talk_photo.right img {
width: 93%;
margin-left:7%;
}
.talk_photo.left img {
width: 93%;
margin-right:7%;
}
body.noindex #contents p {
  margin: 0px 0px 5px 0px; /*上、左右、下への余白*/
}
.taidan h5 {
    border-bottom: 2px dotted #ccc;
    padding-bottom: 5px;
}


/*メルマガバックナンバー*/

/*ベース*/
section.typeC .tabLabel {	/*タブ*/
	margin-bottom: -1px;
	padding: 5px 10px ;
	display: block;
	color: #444;
	background: rgba(202,202,202,0.30);
	cursor: pointer;
	transition: .3s;
}
section.typeC .tabLabel::before {
	margin-right: .5em;
	font-weight: 700;
	font-family: 'Font Awesome 5 Free';
	content: "\f105";
}
section.typeC input {		/* ラジオボタン非表示 */
	display: none;
}
section.typeC .content {		/*本文*/
	height: 0;
	padding: 0 15px;
	overflow: hidden;
	opacity: 0;
	transition: .3s;
}
/*アクティブ設定*/
section.typeC input:checked + .tabLabel {
	color:#fff;
	background: rgba(229,150,63,0.70);
}
section.typeC input:checked + .tabLabel::before {
	margin-right: .5em;
	font-weight: 700;
	font-family: 'Font Awesome 5 Free';
	content: "\f107";
}
section.typeC input:checked + .tabLabel + .content {
	height: auto;
	margin-bottom: -1px;
	padding: 15px;
	overflow: auto;
	border: 1px solid LightGray;
	opacity: 1;
}

/*画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:800px) {
 body.noindex #contents h4 {
    margin: 0px 0px 0px 0px;
  }
  .talk_text2 {
width: 91%;
}
.talk_photo  {
width: 100%;
margin-left: 12%;
}
.talk_photo img {
width: 93%;
margin-left:7%;
}

/*対談でprofileが二つのとき、スマホでは写真を下にする*/
.profile{
  display: flex;
  flex-direction: column;
}
.child_1{
  order: 1;
}
}
    /*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
    @media screen and (max-width:480px) {
      /*全体の設定
---------------------------------------------------------------------------*/

.talk_name {
width: 15%
}
.talk_colon {
width: 4%
}
.talk_text, .talk_text2 {
width: 81%
}
.talk_photo.right img {
width: 81%;
margin-left:14%;
}
.talk_photo.left img {
width: 81%;
margin-right:14%;
}
}