<html <?php echo get_language_attributes(); ?>>
  <?php echo $__env->make('partials.head', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
  <body <?php body_class() ?>><?php wp_body_open(); ?>

    <div class="header-wrap">
      <?php do_action('get_header') ?>
      <?php echo $__env->make('partials.header', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
    </div>

    <div class="breadcrumb-wrap">
      <ol class="breadcrumb font-small" itemscope itemtype="https://schema.org/BreadcrumbList">
        <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
          <a class="home" itemprop="item" href="<?php echo e(home_url('/')); ?>">
            <span itemprop="name">HOME</span>
          </a>
          <meta itemprop="position" content="1">
        </li>
        <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
          <!-- <a itemprop="item" href="#"> -->
            <span itemprop="name"><?php $cat = get_the_category(); $cat = $cat[0]; { echo $cat->cat_name; } ?></span>
          <!-- </a> -->
          <meta itemprop="position" content="2">
        </li>
        <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
          <span class="ellipsis" itemprop="name"><?php echo get_the_title(); ?></span>
          <meta itemprop="position" content="3">
        </li>
      </ol>
    </div>

    <div class="wrapper bg-white">
      <div class="post-container">

        <div class="post-share d-none d-sm-flex align-items-center justify-content-between" data-aos="fade-up">
          <p class="cat"><?php the_category(' '); ?></p>
          <div class="d-flex align-items-center">
            <p class="mr-2">SNSでシェアする：</p>
            <ul class="d-flex align-items-center">
              <li><a class="twitter icon-twitter" href="//twitter.com/intent/tweet?text=<?php echo urlencode(the_title("","",0)); ?>&<?php echo urlencode(get_permalink()); ?>&url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="Twitterでシェアする"><img src="<?= App\asset_path('images/circle-btn-tw-black.svg'); ?>"></a></li>
              <li><a class="facebook icon-facebook" href="//www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink()); ?>&t=<?php echo urlencode(the_title("","",0)); ?>" target="_blank" title="facebookでシェアする"><img src="<?= App\asset_path('images/circle-btn-fb-black.svg'); ?>"></a></li>
              <li><a class="line icon-line" href="//timeline.line.me/social-plugin/share?url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="LINEでシェアする"><img src="<?= App\asset_path('images/circle-btn-line-black.svg'); ?>"></a></li>
            </ul>
          </div>
        </div>

        <div class="d-flex d-sm-none justify-content-between info" data-aos="fade-up">
          <p class="cat"><?php the_category(' '); ?></p>
          <time class="date"><?php echo e(get_the_date()); ?></time>
        </div>

        <?php while(have_posts()): ?> <?php the_post() ?>
        <article class="article" <?php post_class() ?>>
          <header data-aos="fade-up">
            <h1 class="entry-title"><?php echo get_the_title(); ?></h1>

            <div class="d-flex justify-content-between">
              <p class="client"><?php $txt = get_field('企業名'); if($txt){?><?php echo $txt; }?></p>
              <time class="updated en d-none d-sm-block" datetime="<?php echo e(get_post_time('c', true)); ?>"><?php echo e(get_the_date('Y/m/d')); ?></time>
            </div>
          </header>
          <div class="entry-content" data-aos="fade-up">
            <div class="img-wrap">
              <div class="thumb-wrap">
                <a href="https://www.youtube.com/watch?v=<?php $txt = get_field('youtubeid'); if($txt){?><?php echo $txt; }?>" target="_blank">
                  <img src="https://i.ytimg.com/vi/<?php $txt = get_field('youtubeid'); if($txt){?><?php echo $txt; }?>/maxresdefault.jpg" class="img-responsive">
                  <svg class="play-btn" x="0" y="0" width="36px" height="36px" viewBox="0 0 36 36">
                    <use class="play-btn-style" fill="#fff" x="0px" y="0" width="36px" height="36px" xlink:href="#play-btn"></use>
                  </svg>
                </a>
              </div>
            </div>
            <div data-aos="fade-up"><?php the_content() ?></div>
          </div>

          <!-- sns share pc -->
          <div class="post-share d-none d-md-flex align-items-center" data-aos="fade-up">
            <p class="mr-2">SNSでシェアする：</p>
            <ul class="d-flex align-items-center">
              <li><a class="twitter icon-twitter" href="//twitter.com/intent/tweet?text=<?php echo urlencode(the_title("","",0)); ?>&<?php echo urlencode(get_permalink()); ?>&url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="Twitterでシェアする"><img src="<?= App\asset_path('images/circle-btn-tw-black.svg'); ?>"></a></li>
              <li><a class="facebook icon-facebook" href="//www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink()); ?>&t=<?php echo urlencode(the_title("","",0)); ?>" target="_blank" title="facebookでシェアする"><img src="<?= App\asset_path('images/circle-btn-fb-black.svg'); ?>"></a></li>
              <li><a class="line icon-line" href="//timeline.line.me/social-plugin/share?url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="LINEでシェアする"><img src="<?= App\asset_path('images/circle-btn-line-black.svg'); ?>"></a></li>
            </ul>
          </div>
        </article>
        <?php endwhile; ?>

        <!-- sns share sp -->
        <div class="post-share-sp d-md-none" data-aos="fade-up">
          <p>SNSでシェアする</p>
          <ul class="d-flex align-items-center justify-content-center">
            <li><a class="twitter icon-twitter" href="//twitter.com/intent/tweet?text=<?php echo urlencode(the_title("","",0)); ?>&<?php echo urlencode(get_permalink()); ?>&url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="Twitterでシェアする"><img src="<?= App\asset_path('images/circle-btn-tw-black.svg'); ?>"></a></li>
              <li><a class="facebook icon-facebook" href="//www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink()); ?>&t=<?php echo urlencode(the_title("","",0)); ?>" target="_blank" title="facebookでシェアする"><img src="<?= App\asset_path('images/circle-btn-fb-black.svg'); ?>"></a></li>
              <li><a class="line icon-line" href="//timeline.line.me/social-plugin/share?url=<?php echo urlencode(get_permalink()); ?>" target="_blank" title="LINEでシェアする"><img src="<?= App\asset_path('images/circle-btn-line-black.svg'); ?>"></a></li>
          </ul>
        </div>


          <div class="pager-wrap" data-aos="fade-up">


            <?php if (get_previous_post()):?>
              <div class="btn-pager">
                <?php previous_post_link('%link', '前の記事へ'); ?>
              </div>
            <?php else: ?>
              <div class="btn-pager disabled">
                前の記事へ
              </div>
            <?php endif; ?>

            <?php if (get_next_post()):?>
              <div class="btn-pager">
                <?php next_post_link('%link', '次の記事へ'); ?>
              </div>
            <?php else: ?>
              <div class="btn-pager disabled">
                次の記事へ
              </div>
            <?php endif; ?>


          </div>

      </div><!-- /post-container -->
    </div><!-- wrapper -->

    <div class="back-to-top-wrap d-sm-none">
      <a class="back-to-top" href="#">BACK TO TOP <img src="<?= App\asset_path('images/back-to-top-btn.svg'); ?>"></a>
    </div>

    <div class="wrapper bg-gray" data-aos="fade-up">
      <div class="container">
        <!-- RECOMMEND VIDEO -->
        <div class="recommend-video">
          <div class="title-unit2">
            <h2>LATEST VIDEO</h2>
            <p>最新の動画</p>
          </div>

          <ul class="video-list2">
            <?php $args = array(
              'posts_per_page'   => 3, //5件表示する
              'meta_key' => 'recommend', //カスタムフィールドのキー
              'meta_value' => 1, //カスタムフィールドの値
              );
              $my_query = new WP_Query($args);
            if ($my_query->have_posts()) : while ($my_query->have_posts()) : $my_query->the_post();
            ?>

            <li data-aos="fade-up">
              <div class="img-wrap">
                <div class="thumb-wrap">
                  <a href="<?php echo e(get_permalink()); ?>">
                    <img src="https://i.ytimg.com/vi/<?php $txt = get_field('youtubeid'); if($txt){?><?php echo $txt; }?>/maxresdefault.jpg" class="img-responsive">
                    <svg class="play-btn" x="0" y="0" width="36px" height="36px" viewBox="0 0 36 36">
                      <use class="play-btn-style" fill="#fff" x="0px" y="0" width="36px" height="36px" xlink:href="#play-btn"></use>
                    </svg>
                  </a>
                </div>
              </div>
              <div class="text-wrap">
                <div class="info">
                  <?php
                    $cat = get_the_category();
                    $catname = $cat[0]->cat_name;
                    $catslug = $cat[0]->slug;
                  ?>
                  <p ><a href="<?php echo esc_url( home_url( '/' ) ).'category/'.$catslug; ?>" class="cat"><?php echo $catname; ?></a></p>
                  <time class="date"><?php echo e(get_the_date()); ?></time>
                </div>
                <a href="<?php echo e(get_permalink()); ?>">
                  <h2 class="title"><?php the_title(); ?></a></h2>
                  <p class="client"><?php $txt = get_field('企業名'); if($txt){?><?php echo $txt; }?></p>
                </a>
              </div>
            </li>
            <?php endwhile; endif; wp_reset_postdata(); ?>

          </ul>

          <!-- <a class="btn-more mx-auto mx-sm-0" href="#">View More</a> -->

        </div>
      </div><!-- container -->
    </div><!-- wrapper -->

    <?php do_action('get_footer') ?>
    <?php echo $__env->make('partials.footer', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
    <?php wp_footer() ?>
  </body>
</html>
