templates/pages/life/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}三重の暮らし体験 |【公式】「とこワク」は三重県のワーケーションポータルサイト{% endblock %}
  4. {% block meta_og_title %}三重の暮らし体験 |【公式】「とこワク」は三重県のワーケーションポータルサイト{% endblock %}
  5. {% block meta_twitter_title %}三重の暮らし体験 |【公式】「とこワク」は三重県のワーケーションポータルサイト{% endblock %}
  6. {% block meta_description %}
  7. {{ parent() }}
  8. これからの時代、あなたに合った、あなたらしい暮らしを三重県で始めてみませんか？魅力あふれる三重での暮らしをご紹介します。
  9. {% endblock %}
  10. {% block meta_og_description %}
  11. {{ parent() }}
  12. これからの時代、あなたに合った、あなたらしい暮らしを三重県で始めてみませんか？魅力あふれる三重での暮らしをご紹介します。
  13. {% endblock %}
  16. {% block body %}
  17. <main id="life">
  18.   <div class="MieMainImg">
  19.     <img src="{{asset('build/images/life/new_life_in_mie2.png')}}" alt="イメージ">
  20.   </div>
  21.   <div class="MieSpImg">
  22.     <img src="{{asset('build/images/life/spMainImg.png')}}" alt="イメージ">
  23.   </div>
  24.   <div class="ImgText">
  25.     <p>{{ 'life.ImgText.text1'|trans|raw }}</p>
  26.     <p>{{ 'life.ImgText.text2'|trans|raw }}</p>
  27.     <p>{{ 'life.ImgText.text3'|trans|raw }}</p>
  28.   </div>
  29.   <div class="wrapper">
  30.     <nav class="nav">
  31.       <ol class="nav-BreadcrumbTrail nav-lifeBreadcumbTrail">
  32.         <li><a href="/">{{ 'common.top'|trans|raw }}</a></li>
  33.         <li>{{ 'life.breadcrumbsHead'|trans|raw }}</li>
  34.       </ol>
  35.     </nav>
  36.     <div class="contents1">
  37.       <div class="contents1-inner">
  38.         <div class="contenst1-inner__text" id="pcText">
  39.           <img src="{{asset('build/images/life/MieLife/MieLogo.png')}}" alt="ロゴ">
  40.           <h3>{{ 'life.contents1.title'|trans|raw }}</h3>
  41.           <p>{{ 'life.contents1.text1'|trans|raw }}</p>
  42.         </div>
  43.       </div>
  44.       <div class="contenst1-box ">
  45.         <div class="contents1-img">
  46.           <img class="contenst1-img__pc" src="{{asset('build/images/life/MieLife/01.jpg')}}" alt="イメージ">
  47.           <img class="contenst1-img__pc" src="{{asset('build/images/life/MieLife/02.jpg')}}" alt="イメージ">
  48.           <img class="contenst1-img__pc" src="{{asset('build/images/life/MieLife/03.jpg')}}" alt="イメージ">
  49.           <img class="contents1-img__sp" src="{{asset('build/images/life/MieLife/sp.jpg')}}" alt="イメージ">
  50.         </div>
  52.         <div class="contents1-inner" id="spText">
  53.           <div class="contenst1-inner__text">
  54.             <img src="{{asset('build/images/life/MieLife/MieLogo.png')}}" alt="ロゴ">
  55.             <h3>{{ 'life.contents1.title'|trans|raw }}</h3>
  56.             <p>{{ 'life.contents1.text1'|trans|raw }}</p>
  57.           </div>
  58.         </div>
  59.         <div class="contents1-inner__contact">
  60.           <div class="text">
  61.             <p>{{ 'life.contents1.text2'|trans|raw }}</p>
  62.             <div class="text-btnBox">
  63.               <a class="text-btnBox__blackBtn" href="https://www.ijyu.pref.mie.lg.jp/" target="_blank">{{ 'life.contents1.btn'|trans|raw }}</a>
  64.             </div>
  65.           </div>
  66.         </div>
  67.       </div>
  68.     </div>
  69.   </div>
  70.   <div class="MieFooter">
  71.     <div class="MieFooter-inner">
  72.       <div>
  73.         <h4>{{ 'life.MieFooter.title1'|trans|raw }}</h4>
  74.         <p>{{ 'life.MieFooter.phone1'|trans|raw }}</p>
  75.         <p>{{ 'life.MieFooter.mailAdress1'|trans|raw }}</p>
  76.       </div>
  77.       <div class="MieFooter-inner__border"></div>
  78.       <div>
  79.         <h4>{{ 'life.MieFooter.title2'|trans|raw }}</h4>
  80.         <P>{{ 'life.MieFooter.phone2'|trans|raw }}</P>
  81.         <P>{{ 'life.MieFooter.fax'|trans|raw }}</P>
  82.         <P>{{ 'life.MieFooter.mailAdress2'|trans|raw }}</P>
  83.         <!-- <p>{{ 'life.MieFooter.address2'|trans|raw }}</p> -->
  84.       </div>
  85.     </div>
  86.   </div>
  87.   <div class="wrapper MieExperience">
  88.     <h3>{{ 'life.MieExperience.title'|trans|raw }}</h3>
  89.     <div class="MieExperience-inner">
  90.       <img src="{{asset('build/images/life/mieExperience/map.png')}}" alt="三重県マップ">
  91.       <div class="MieExperience-inner__img">
  92.         <p>{{ 'life.MieExperience.text'|trans|raw }}</p>
  93.         <div class="searchInfoContainerFilter__button">
  94.           <div>
  95.             {% for item in experience %}
  96.             <label class="radio">
  97.               <input
  98.                 type="radio"
  99.                 name="area_radio"
  100.                 class="js_radio-toggle__trigger"
  101.                 data-radio-toggle-target="#area_{{ item.area.areaGroup }}"
  102.                 {% if loop.first %} checked{% endif %}>
  103.               <span class="headColor">{{ item.area.getLocaleAreaName(app.request.locale) }}</span>
  104.             </label>
  105.             {% endfor %}
  106.           </div>
  107.         </div>
  108.         {% for item in experience %}
  109.         <div
  110.           class="js_radio-toggle__content"
  111.           id="area_{{ item.area.areaGroup }}"
  112.           {% if not loop.first %} style="display:none"{% endif %}
  113.         >
  114.           {% for entry in item.entries %}
  115.             {% include "components/entry/life/_list.html.twig" with {
  116.               item: entry
  117.             } %}
  118.           {% endfor %}
  119.         </div>
  120.         {% endfor %}
  122.       </div>
  123.     </div>
  124.   </div>
  125.   <div class="news">
  126.     <div class="newsContainer">
  127.       <div class="news-inner">
  128.         <h3>{{'life.MieExperience.news-inner.title' |trans|raw }}</h3>
  129.         <div class="js-cms-headline" data-endpoint="{{ path('news_headline', {
  130.           limit: 3,
  131.           add_life: 1,
  132.           view: "life"
  133.         }) }}"></div>
  134.       </div>
  135.     </div>
  136.     <div class="news-inner2" id="pcNewsImg">
  137.       {# <img src="{{asset('build/images/life/waht`sNews/newsInnerMainImg.png')}}" alt="イメージ"> #}
  138.     </div>
  139.     <div class="news-inner2" id="spNewsImg">
  140.       {# <img src="{{asset('build/images/life/waht`sNews/newsInnerMainImgSp.png')}}" alt="イメージ"> #}
  141.     </div>
  142.   </div>
  143.   <div class="Introduction wrapper">
  144.     <div class="Introduction-text">
  145.       <h3>{{'life.MieExperience.introduction.title' |trans|raw }}</h3>
  146.       <p>{{'life.MieExperience.introduction.text' |trans|raw }}</p>
  147.     </div>
  148.     <div
  149.       class="Introduction-inner js-cms-headline"
  150.       data-endpoint="{{ path('life_movie') }}"
  151.     >
  152. {#
  153.       <div class="Introduction-inner__box">
  154.         <img src="{{asset('build/images/life/introduction/Introduction-1.png')}}" alt="動画">
  155.         <div class="IntroducitonFlex">
  156.           <p class="number">01</p>
  157.           <div class="description">
  158.             <div class="description-nameIcon">
  159.               <p class="description-nameIcon__name">{{'life.MieExperience.introduction.content.name1' |trans|raw }}</p>
  160.               <div class="description-nameIcon__icon">
  161.                 <a href="">
  162.                   <img src="{{asset('build/images/life/introduction/Icon awesome-twitter.png')}}" alt="ツイッター">
  163.                 </a>
  164.                 <a href="">
  165.                   <img src="{{asset('build/images/life/introduction/Icon awesome-instagram.png')}}" alt="インスタ">
  166.                 </a>
  167.               </div>
  168.             </div>
  169.             <p>{{'life.MieExperience.introduction.content.text1' |trans|raw }}</p>
  170.             <p class="IntroducitonFlex-taki">#{{'life.MieExperience.introduction.content.city1' |trans|raw }}</p>
  171.           </div>
  172.         </div>
  173.       </div>
  174.       <div class="Introduction-inner__box">
  175.         <img src="{{asset('build/images/life/introduction/Introduction-2.png')}}" alt="動画">
  176.         <div class="IntroducitonFlex">
  177.           <p class="number">02</p>
  178.           <div class="description">
  179.             <div class="description-nameIcon">
  180.               <p class="description-nameIcon__name">{{'life.MieExperience.introduction.content.name2' |trans|raw }}</p>
  181.               <div class="description-nameIcon__icon">
  182.                 <a href="">
  183.                   <img src="{{asset('build/images/life/introduction/Icon awesome-twitter.png')}}" alt="ツイッター">
  184.                 </a>
  185.                 <a href="">
  186.                   <img src="{{asset('build/images/life/introduction/Icon awesome-instagram.png')}}" alt="インスタ">
  187.                 </a>
  188.               </div>
  189.             </div>
  190.             <p>{{'life.MieExperience.introduction.content.text2' |trans|raw }}</p>
  191.             <p>#{{'life.MieExperience.introduction.content.city2' |trans|raw }}</p>
  192.           </div>
  193.         </div>
  194.       </div>
  195.       <div class="Introduction-inner__box">
  196.         <img src="{{asset('build/images/life/introduction/Introduction-3.png')}}" alt="動画">
  197.         <div class="IntroducitonFlex">
  198.           <p class="number">03</p>
  199.           <div class="description">
  200.             <div class="description-nameIcon">
  201.               <p class="description-nameIcon__name">{{'life.MieExperience.introduction.content.name3' |trans|raw }}</p>
  202.               <div class="description-nameIcon__icon">
  203.                <a href="">
  204.                   <img src="{{asset('build/images/life/introduction/Icon awesome-twitter.png')}}" alt="ツイッター">
  205.                 </a>
  206.                 <a href="">
  207.                   <img src="{{asset('build/images/life/introduction/Icon awesome-instagram.png')}}" alt="インスタ">
  208.                 </a>
  209.               </div>
  210.             </div>
  211.             <p>{{'life.MieExperience.introduction.content.text3' |trans|raw }}</p>
  212.             <p>#{{'life.MieExperience.introduction.content.city3' |trans|raw }}</p>
  213.           </div>
  214.         </div>
  215.       </div>
  216.       <div class="Introduction-inner__box">
  217.         <img src="{{asset('build/images/life/introduction/Introduction-4.png')}}" alt="動画">
  218.         <div class="IntroducitonFlex">
  219.           <p class="number">04</p>
  220.           <div class="description">
  221.             <div class="description-nameIcon">
  222.               <p class="description-nameIcon__name">{{'life.MieExperience.introduction.content.name4' |trans|raw }}</p>
  223.               <div class="description-nameIcon__icon">
  224.                 <a href="">
  225.                   <img src="{{asset('build/images/life/introduction/Icon awesome-twitter.png')}}" alt="ツイッター">
  226.                 </a>
  227.                 <a href="">
  228.                   <img src="{{asset('build/images/life/introduction/Icon awesome-instagram.png')}}" alt="インスタ">
  229.                 </a>
  230.               </div>
  231.             </div>
  232.             <p>{{'life.MieExperience.introduction.content.text4' |trans|raw }}</p>
  233.             <p>#{{'life.MieExperience.introduction.content.city4' |trans|raw }}</p>
  234.           </div>
  235.         </div>
  236.       </div> #}
  237.     </div>
  238.   </div>
  239.   <div class="sns">
  240.     <div class="sns-inner ">
  242.       <div class="facebook">
  243.         <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fja-jp.facebook.com%2Fijyu.pref.mie&tabs=timeline&width=354&height=400&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="354" height="400" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowfullscreen="true" allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>
  244.       </div>
  245.       <div class="facebook2">
  246.         <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fja-jp.facebook.com%2Fijyu.pref.mie&tabs=timeline&width=500&height=630&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="500" height="630" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowfullscreen="true" allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>
  247.       </div>
  249.       <div id="pcTwitter">
  250.         <a class="twitter-timeline" data-width="500" data-height="630" data-theme="light" href="https://twitter.com/chiiki64969680?ref_src=twsrc%5Etfw">Tweets by chiiki64969680</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  251.       </div>
  252.       <div id="spTwitter">
  253.         <a class="twitter-timeline "  data-width="354" data-height="400" data-theme="light" href="https://twitter.com/chiiki64969680?ref_src=twsrc%5Etfw">Tweets by chiiki64969680</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  254.       </div>
  255.     </div>
  256.     <div class="buttonContainer">
  257.       <a href="javascript:history.back()" class="buttonContainer__back">
  258.         <span></span>
  259.         {{ 'common.return'|trans }}
  260.       </a>
  261.     </div>
  262.   </div>
  263. </main>
  264. {% endblock %}