<article <?php post_class() ?>>

  <h1 class="d-md-none entry-title"><?php echo get_the_title(); ?></h1>

  <div class="sp-meta d-md-none en">
    <?php echo get_the_date('Y.m.d'); ?> |
    <?php
    if ($terms = get_the_terms($post->ID, 'works_cat')) {
      foreach ($terms as $term) {
        echo $term->name;
      }
    }
    ?>
  </div>

  <?php if (has_post_thumbnail()) : ?>
    <div class="single-thumbnail">
      <img class="img-fluid" src="<?php the_post_thumbnail_url('full'); ?>">
    </div>
  <?php endif; ?>
  <div class="justify-content-between mt-3 d-none d-md-flex">
    <div class="date en">
      <?php echo get_the_date('Y.m.d'); ?>
    </div>
    <?php
    if ($terms = get_the_terms($post->ID, 'works_cat')) {
      foreach ($terms as $term) {
        echo '<span class="cat-' . $term->slug . ' en">' . $term->name . '</span>';
      }
    }
    ?>
  </div>
  <h1 class="d-none d-md-block entry-title"><?php echo get_the_title(); ?></h1>

  <div class="sp-bg">
    <div class="entry-content">
      <?php the_content() ?>
    </div>

    <div class="d-flex pb-5 single-contact">
      <a class="btn-gra" href="/contact">お問い合わせ</a>
      <a class="btn-white ml-3" href="/request">資料ダウンロード <svg xmlns="http://www.w3.org/2000/svg" width="9.5" height="9.5" viewBox="0 0 9.5 9.5">
          <g transform="translate(-4 -4)">
            <path d="M11.273,17.563H6.227A2.229,2.229,0,0,1,4,15.336v-.891a.445.445,0,0,1,.891,0v.891a1.338,1.338,0,0,0,1.336,1.336h5.047a1.338,1.338,0,0,0,1.336-1.336v-.891a.445.445,0,0,1,.891,0v.891A2.23,2.23,0,0,1,11.273,17.563Z" transform="translate(0 -4.063)" />
            <path d="M11.7,10.531a.445.445,0,0,1-.445-.445V4.445a.445.445,0,0,1,.891,0v5.641A.445.445,0,0,1,11.7,10.531Z" transform="translate(-2.945)" />
            <path d="M10.375,12.969a.448.448,0,0,1-.327-.142l-1.93-2.079a.445.445,0,0,1,.653-.606l1.6,1.726,1.6-1.726a.445.445,0,1,1,.653.606L10.7,12.827A.448.448,0,0,1,10.375,12.969Z" transform="translate(-1.625 -2.438)" />
          </g>
        </svg></a>
    </div>
  </div>

</article>

<!-- 関連するPR実績 -->
<?php
$posts = get_field('works_pickup');
if ($posts) :
?>
  <div class="for-client-works pt-3 py-md-5 mb-3">
    <div class="for-client-works-inner pt-md-5">
      <div class="page-title-unit mb-5">
        <h3>関連するPR実績</h3>
        <h4 class="en">Related Works</h4>
      </div>

      <div class="works-list-wrap mb-5 px-0">
        <ul class="works-list d-md-flex flex-wrap">

          <?php foreach ($posts as $val) : ?>
            <li>
              <?php $url = get_field('works_url', $val);
              if ($url) : ?>
                <a href="<?php echo $url; ?>" target="_blank">

                  <div class="works-list-image">
                    <div class="works-list-link-info">
                      <div class="works-list-link-info__inner">
                        動画を再生
                        <svg class="works-list-link-info__arrow-rotate" version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" xml:space="preserve">
                          <g>
                            <polygon class="st0" points="243.253,0 202.714,40.539 389.5,227.335 12.736,227.335 12.736,284.665 389.5,284.665
                  202.714,471.461 243.253,512 499.264,256" fill="currentColor"></polygon>
                          </g>
                        </svg>
                      </div>
                    </div>
                  <?php else: ?>
                    <a href="<?php echo get_the_permalink($val->ID); ?>">
                      <div class="works-list-image">
                        <div class="works-list-link-info">
                          <div class="works-list-link-info__inner">
                            記事詳細
                            <svg class="works-list-link-info__arrow" version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" xml:space="preserve">
                              <g>
                                <polygon class="st0" points="243.253,0 202.714,40.539 389.5,227.335 12.736,227.335 12.736,284.665 389.5,284.665
                  202.714,471.461 243.253,512 499.264,256" fill="currentColor"></polygon>
                              </g>
                            </svg>
                          </div>
                        </div>

                      <?php endif; ?>
                      <?php if (has_post_thumbnail($val->ID)) : ?>
                        <img data-src="<?php echo get_the_post_thumbnail_url($val->ID); ?>" class="lazyload img-transform">
                      <?php else: ?>
                        <img data-src="<?= App\asset_path('images/no-image.jpg'); ?>" class="lazyload img-transform">
                      <?php endif; ?>
                      </div>
                      <div class="works-list-text">
                        <div class="works-list-meta">
                          <div>
                            <?php
                            if ($terms = get_the_terms($val->ID, 'works_cat')) {
                              foreach ($terms as $term) {
                                echo '<span class="cat-' . $term->slug . ' en">' . $term->name . '</span>';
                              }
                            }
                            ?>
                          </div>
                          <?php $name = get_field('works_client_name', $val);
                          if ($name) : ?>
                            <p class="client-name"><?php echo $name; ?></p>
                          <?php endif; ?>

                        </div>
                        <h3><?php echo get_the_title($val->ID); ?></h3>
                      </div>
                    </a>
            </li>
          <?php endforeach; ?>
        </ul>

      </div>


    </div><!-- /forclientworks-inner -->
  </div>
<?php endif;
wp_reset_postdata(); ?>

<div class="btn-transparent mx-auto pb-5 mb-5 d-md-none">
  <a href="/works/">一覧に戻る</a>
</div>
