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

#heading {
    padding-bottom: 0;
    margin-bottom: 30px;
    background-color: #f5f5f5;
}
#heading ul.breadcrumb {
    padding: 10px 0;
    margin-bottom: 0;
}
.contentIn {
  max-width: 860px;
}

div.category-heading {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 300px;
}
div.category-heading-contents {
  display: flex;
  align-items: center;
  font-weight: bold;
  color: #09529e;
}
div.category-heading-ttl {
  font-size: 70px;
}
div.category-heading-ruby {
  font-size: 16px;
  border-bottom: 2px solid;
  padding-bottom: 15px;
  margin-left: 25px;
  margin-bottom: -15px;
}

h2.style01 {
  position: relative;
  padding: 0 0 10px 10px;
  margin-bottom: 50px;
  border-bottom: solid 1px #bdd9ff;
}
h2.style01::after {
  position: absolute;
  content: "";
  display: block;
  border-bottom: solid 4px #5e91c6;
  bottom: -2px;
  left: 0;
  width: 50px;
}



.list ul li.picarea {
  display: flex;
}
.list ul li.picarea span.new {
  position: absolute;
  top: 0;
  left: 0;
  background: #ff0000;
  color: #fff;
  border-radius: 10px 0 0 0;
  padding: 0.25em 0.5em;
}
.list ul li.picarea .picareaImg {
  margin: 0 0 30px;
  position: relative;
}
.list ul li.picarea .picareaContents {
  padding: 10px 60px 70px;
  width: 515px;
}



.list .personality ul li {
	background: #e6f5cb;
}
.list ul li:nth-child(5n+5) {
	/* margin-right: 0%; */
}
.list ul li:nth-child(4n+4) {
	margin-right: 0%;
}
.list ul li img {
  border-radius: 10px;
}
.list ul li p {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.list ul li p.name {
	font-size: 2rem;
	margin: 5% 6% 5% 0;
	font-weight: bold;
  color: #09529e;
  /* float: left; */
}
.list ul li p.name span {
	font-size: 1rem;
	font-weight: normal;
  margin-left: 10px;
}

.list ul li .blogAndInstagramWrap {
  display: flex;
  width: 400px;
  font-size: 1.3rem;
  border-top: 1px dotted #09529e;
  border-bottom: 1px dotted #09529e;
  padding: 15px 0 10px;
}

.list ul li p.blog {
	/* background: url(../img/common/icon_blog01.png) no-repeat center left 5%, #fff; */
  /* float: left; */
  width: 200px;
  /* border-right: 1px solid #09529e; */
  /* margin-right: 15px; */
}

.list ul li p:nth-of-type(2) {
  border-left: 1px solid #09529e;
  padding-left: 15px;
}

.list ul li p.acount_instagram {
  width: 250px;
}

.list ul li .blogAndInstagramWrap .icon {
  vertical-align: middle;
  margin-right: 10px;
}

.list ul li p.blog img,
.list ul li p.acount_instagram img {
  border-radius: 0;
  width: 25px;
  height: 25px;
}

.list ul li p.blog a,
.list ul li p.acount_instagram a {
	display: block;
	/* padding: 0 5% 0 19%; */
  padding: 0;
	color: #09529e;
}
/*** ここまで ***/

.list ul li .programInCharge h6 {
  margin: 30px 0 15px;
  font-size: 1.3rem;
  font-weight: bold;
}
.list ul li .programInCharge p {
  line-height: 25px;
  padding-left: 10px;
}
.list ul li .programInCharge a {
  color: #09529e;
}


.personality {
	margin: 60px 0;
}

.anaBlogBanner {
	background: none;
	height: 100%;
}

.anaBlogBanner a {
	height: 100%;
	display: block;
	background: url(../img/announcer/bnr_announcer_blog_225x420.png) no-repeat center center;
	background-size: cover;
	text-indent:110%; white-space:nowrap; overflow:hidden; /* text hidden set */
	box-sizing: border-box;
	border: solid 2px #0052A5;
}



.announcer.announcerProfile {

}
.announcer.announcerProfile ul li {

}


.announcerProfileTextWrap {
  background-color: #f5f5f5;
  padding-bottom: 100px;
}
.announcerProfileText {
	/* float: left; */
	font-size: 1.1em;
	width: 69%;
  padding-top: 30px;
}
.announcerProfileText .flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
/* 最後のコンテンツを左寄せにする指定 */
.announcerProfileText .flex:after {
  content: "";
  display: block;
  width: 45%;  /* .flexItemに指定したwidthと同じ幅を指定 */
  height: 0;
}
.announcerProfileText .flex .flexItem {
  width: 45%;
  margin-bottom: 15px;
}

.announcerProfileText h6 {
  color: #0052A5;
  font-weight: bold;
  font-size: 1.5rem;
  border-bottom: 1px solid #0052A5;
  padding-bottom: 5px;
  margin-top: 30px;
  margin-bottom: 15px;
  margin-left: -5px;
}

.announcer.personality .announcerProfileText h6 {
	background: #8CC91F;
}

.announcer .announcerProfileText p {
	margin-bottom: 10px;
}

.announcer .announcerProfileText a {
	color: #0052A5;
}
.announcerProfileText .announcerYoutube {
  text-align: center;
  margin-top: 50px;
}


@media screen and (max-width : 899px) {
  body {
    min-width: auto;
  }
  #div-gpt-ad-1627601907778-0 {
    display: none;
  }
  #heading {
    height: 45px;
    margin-bottom: 50px;
  }
  #heading ul.breadcrumb {
    margin: 0;
  }
  .contentIn {
    padding: 0 20px;
  }
  .clearfix:after {
    content: none;
  }
  div.category-heading {
    height: 250px;
  }
  div.category-heading-ttl {
    font-size: 35px;
  }
  div.category-heading-ruby {
    font-size: 11px;
    border-bottom: 1px solid;
    padding-bottom: 5px;
    margin-left: 5px;
    margin-bottom: -5px;
  }

  h2.style01 {
    padding: 0 0 10px 0;
    margin-bottom: 30px;
    border-bottom: solid 2px #bdd9ff;
    font-size: 4vw;
  }
  h2.style01::after {
    border-bottom: solid 5px #5e91c6;
    bottom: -3px;
  }
  div.announcer ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  div.announcer ul:after {
    content: "";
    display: block;
    width: 45.8%;
    height: 0;
  }
  .list ul li.picarea {
    display: block;
    width: 90%;
    text-align: center;
  }
  .list ul li.picarea .picareaImg {
    margin: 0 auto 15px;
    width: 225px;
  }
  .list ul li img {
    margin: auto;
  }
  .list ul li:nth-child(2n+2) {
    margin-right: 0%;
  }
  .list ul li p.name {
    font-size: 1.5rem;
    float: none;
    margin: 5% auto;
  }
  .list ul li.picarea .picareaContents {
    padding: 0;
    width: 100%;
  }
  .list ul li p.name span {
    display: block;
    margin: 0;
  }
  .list ul li div.blogAndInstagramWrap {
    display: block;
    width: 100%;
    margin: auto;
  }
  .list ul li p.blog {
    width: 100%;
    border-right: none;
    margin: 0;
  }
  .list ul li p:nth-of-type(2) {
    border-left: none;
    border-top: 1px solid #09529e;
    padding-top: 15px;
    margin-top: 10px;
    padding-left: 0;
  }
  .list ul li p.acount_instagram {
    width: 100%;
  }
  .list ul li p.blog a, .list ul li p.acount_instagram a {
    text-align: left;
    font-size: 1rem;
  }
  .list ul li .programInCharge {
    text-align: left;
    padding-bottom: 30px;
  }
  .list ul li .programInCharge p {
    padding: 0;
  }
  .list ul li .programInCharge h6 {
    font-size: 1rem;
    font-weight: normal;
    margin: 30px 0 5px;
  }

  .announcerProfileTextWrap {
    padding-top: 10px;
  }
  .announcerProfileText {
    width: 90%;
  }
  .announcerProfileText .flex {
    display: block;
  }
  .announcerProfileText .flex .flexItem {
    width: 100%;
  }
  .announcerProfileText h6 {
    font-size: 1rem;
    margin-bottom: 10px;
    padding: 0 0 10px 0;
  }

  .announcerYoutube {
    position: relative;
    width:100%; /* 横幅は100%にしておく(ここを変えたい場合は実装コード2の方法を確認してください) */
    height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
    padding-top: 56.25%; /* 高さを指定(16:9) */
  }
  .announcerYoutube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}

/*** 2017/1/25 メディアセンター 加藤 追加　サイドバー「アナウンサー一覧」用 ***/
#sideBox .menuBox01 .icon_arrow03 li.announcerName {
	float: none;
	width: auto;
	background-color: #F2F2F2;
	margin-left: 15px;
	font-size: 14px;
}
