@charset "UTF-8";
/*scssをインポート*/
/* 設定用。変数の宣言はここ*/
/*----------------------------------------------------
	ヘッダー
----------------------------------------------------*/
/*----------------------------------------------------
	色の設定
----------------------------------------------------*/
/*----------------------------------------------------
	各種角丸
----------------------------------------------------*/
/* ミックスイン、@extend、CSS3など*/
/* clearfix */
.clearfix, #crosstalk_210521 .info_box, #crosstalk_210521 .info_box .inner, #crosstalk_210521 .info_box p {
  *zoom: 1; }
  .clearfix:after, #crosstalk_210521 .info_box:after, #crosstalk_210521 .info_box .inner:after, #crosstalk_210521 .info_box p:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden; }

/*----------------------------------------------------
	全体に効かせたい設定
----------------------------------------------------*/
#crosstalk_210521 {
  margin: 0% auto;
  width: 60%;
  /*----------------------------------------------------
  対談部分
  ----------------------------------------------------*/
  /*----------------------------------------------------
  インタビュー参加者紹介部分
  ----------------------------------------------------*/
  /*----------------------------------------------------
  ボタン
  ----------------------------------------------------*/
 /*----------------------------------------------------
	#crosstalk_210521ここまで設定
----------------------------------------------------*/ }
  #crosstalk_210521 .prologue {
    text-align: left;
    font-size: 100%;
    line-height: 1.6em;
    margin: 5% auto 0; }
    @media all and (max-width: 640px) {
      #crosstalk_210521 .prologue {
        font-size: 90%; } }
  @media all and (max-width: 1024px) {
    #crosstalk_210521 {
      width: 90%; } }
  #crosstalk_210521 section {
    margin: 5% auto; }
    #crosstalk_210521 section .title {
      width: 70%;
      margin: 5% auto;
      padding: 2% 0 2% 0%;
      border: solid 0.2rem #ff858c;
      font-weight: 500;
      font-size: 120%;
      color: #ff858c;
      line-height: 1.6em;
      letter-spacing: 0.1em; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section .title {
          width: 99%;
          font-size: 90%; } }
    #crosstalk_210521 section .title__next {
      width: 70%;
      margin: 5% auto;
      padding: 2%;
      border: solid 0.2rem #00aebd;
      font-weight: 500;
      font-size: 100%;
      color: #00aebd;
      line-height: 1.4em;
      letter-spacing: 0.1em; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section .title__next {
          width: auto;
          font-size: 90%; } }
    #crosstalk_210521 section p {
      text-align: left;
      font-size: 100%;
      line-height: 1.8em;
      margin-bottom: 2%;
      letter-spacing: 0.03em; }
      #crosstalk_210521 section p span {
        color: red;
        font-weight: 600; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section p {
          font-size: 90%;
          line-height: 1.6em; } }
    #crosstalk_210521 section .mc {
      color: black;
      font-weight: 600;
      text-align: left;
      margin-bottom: 5%;
      line-height: 1.6em;
      letter-spacing: 0.03em; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section .mc {
          font-size: 90%;
          line-height: 1.6em; } }
    #crosstalk_210521 section .takahashi {
      color: #000;
      text-align: left; }
      #crosstalk_210521 section .takahashi .takahashi_name:before {
        color: #00aebd;
        content: "高橋　"; }
    #crosstalk_210521 section .ph_horizontal {
      display: block;
      margin: 0 auto 10%;
      width: 70%; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section .ph_horizontal {
          width: 100%; } }
    #crosstalk_210521 section .ph_vertical {
      display: block;
      margin: 0 auto 10%;
      width: 30%; }
      @media all and (max-width: 640px) {
        #crosstalk_210521 section .ph_vertical {
          width: 60%; } }
    #crosstalk_210521 section .last_paragpaph {
      margin-bottom: 10%; }
  #crosstalk_210521 .info_box {
    width: 80%;
    margin: 0 auto 5%;
    border: 0.2em solid #d9d9d9;
    padding: 3%;
    text-align: left; }
    #crosstalk_210521 .info_box a {
      color: #00aebd; }
    #crosstalk_210521 .info_box .inner {
      margin: 0% auto 3%;
      padding-bottom: 3%;
      border-bottom: 0.2em dotted #d9d9d9; }
    #crosstalk_210521 .info_box img {
      width: 30%;
      display: block;
      margin-right: 2%;
      float: left; }
    #crosstalk_210521 .info_box p {
      width: 65%;
      font-size: 80%;
      line-height: 1.6em;
      color: #000;
      float: right; }
      #crosstalk_210521 .info_box p .name {
        color: #000;
        display: block;
        font-size: 120%;
        font-weight: 500;
        margin-bottom: 3%; }
    #crosstalk_210521 .info_box .bookshelf {
      margin: 0 auto;
      padding: 3% 0 0 0;
      width: 90%;
      display: flex;
      align-items: center;
      justify-content: space-between; }
      #crosstalk_210521 .info_box .bookshelf .book {
        padding: 1% 1%;
        display: flex;
        flex-flow: column; }
        #crosstalk_210521 .info_box .bookshelf .book img {
          width: 50%;
          display: block;
          margin: 0 auto 2%;
          border: 1px solid #8b8b8b; }
        #crosstalk_210521 .info_box .bookshelf .book .book__title {
          display: block;
          margin: 0 auto;
          text-align: center; }
    @media all and (max-width: 640px) {
      #crosstalk_210521 .info_box {
        width: 75%;
        margin: 0 auto 3%;
        border: 0.2em solid #d9d9d9;
        padding: 3%; }
        #crosstalk_210521 .info_box .inner {
          margin: 0% auto 3%;
          padding-bottom: 3%;
          border-bottom: 0.2em dotted #d9d9d9; }
        #crosstalk_210521 .info_box img {
          width: 50%;
          display: block;
          margin: 0 auto 5%;
          float: none; }
        #crosstalk_210521 .info_box p {
          width: 100%;
          font-size: 80%;
          color: #000;
          float: none;
          text-align: left; }
          #crosstalk_210521 .info_box p .name {
            color: #000;
            font-size: 120%;
            text-align: left; }
        #crosstalk_210521 .info_box .bookshelf {
          margin: 0 auto;
          padding: 3% 0 0 0;
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: space-between; }
          #crosstalk_210521 .info_box .bookshelf .book {
            padding: 1% 1%;
            display: flex;
            flex-flow: column;
            align-items: flex-start; }
            #crosstalk_210521 .info_box .bookshelf .book img {
              width: 70%;
              display: block;
              margin: 0 auto 5%;
              border: 1px solid #8b8b8b; }
            #crosstalk_210521 .info_box .bookshelf .book .book__title {
              display: block;
              margin: 0 auto;
              text-align: center; } }
  #crosstalk_210521 .btnbox {
    width: 50%;
    margin: 4% auto;
    float: right; }
    #crosstalk_210521 .btnbox ul {
      width: 100%;
      margin: 0 auto;
      text-align: center; }
      #crosstalk_210521 .btnbox ul li {
        width: 100%;
        padding: 3% 0%;
        background-color: #fff;
        border: 0.1em solid #004591;
        margin: 0 2%; }
      #crosstalk_210521 .btnbox ul a {
        display: block;
        color: #004591;
        font-size: 1.4rem;
        font-family: "Noto Sans Japanese";
        transform: rotate(0.001deg);
        font-weight: 900; }
    @media all and (max-width: 1024px) {
      #crosstalk_210521 .btnbox ul {
        width: 80%;
        margin: 0 auto;
        text-align: center; }
        #crosstalk_210521 .btnbox ul li {
          margin: 5px auto; } }
    @media all and (max-width: 640px) {
      #crosstalk_210521 .btnbox {
        width: 90%;
        margin: 0 auto;
        float: none; }
        #crosstalk_210521 .btnbox ul {
          width: 100%;
          margin: 0 auto; }
          #crosstalk_210521 .btnbox ul li {
            width: 100%; }
          #crosstalk_210521 .btnbox ul a {
            padding: 8px 0;
            display: block;
            font-size: 1.4rem; } }

/*# sourceMappingURL=crosstalk_210521.css.map */