<!DOCTYPE html>
<html ⚡>
  <head>
    <meta charset="utf-8">
    <link rel="canonical" href="<%= config.url %><%= config.root %><%= post.path %>" >
    <title><%= post.title %> - <%= config.title %></title>
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    
    <meta property="og:title" content="<%= post.title %>">
	<meta property="og:type" content="article">
	<meta property="og:url" content="<%= config.url %><%= config.root %><%= post.path %>">
	<% if (post.titleImageForAmp){ %>
		<meta property="og:image" content="<%= post.titleImageForAmp %>">
	<% } %>
	<meta property="og:site_name" content="<%= config.title %>">
	<% if (post.description){ %>
		<meta property="og:description" content="<%= post.description %>">
	<% } else if (post.excerpt){ %>
		<meta property="og:description" content="<%= post.excerpt %>">
	<% } %>
	<meta name="twitter:card" content="summary_large_image" />
	<meta name="twitter:site" content="<%= config.title %>">
	<meta name="twitter:url" content="<%= config.url %><%= config.root %><%= post.path %>">
	<meta name="twitter:title" content="<%= post.title %> - <%= config.title %>">
	<% if (post.description){ %>
		<meta name="twitter:description" content="<%= post.description %>">
	<% } else if (post.excerpt){ %>
		<meta name="twitter:description" content="<%= post.excerpt %>">
	<% } %>
    <% if (post.titleImageForAmp){ %>
    	<meta name="twitter:image" content="<%= post.titleImageForAmp %>">
	<% } %>
	<% if (config.generator_amp.theme && config.generator_amp.theme.facebook_admins){ %>
		<meta property="fb:admins" content="<%- config.generator_amp.theme.facebook_admins %>">
	<% } %>
	<% if (config.generator_amp.theme && config.generator_amp.theme.facebook_app_id){ %>
		<meta property="fb:app_id" content="<%- config.generator_amp.theme.facebook_app_id %>">
	<% } %>
    
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style>
    <noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
    <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
    <!--
  	<script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
    -->
    <% if (isVimeoContain){ %>
    <script async custom-element="amp-vimeo" src="https://cdn.ampproject.org/v0/amp-vimeo-0.1.js"></script>
    <% } %>
    <% if (isVideoContain){ %>
    <script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.js"></script>
    <% } %>
    <% if (isYoutubeContain){ %>
    <script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>
    <% } %>
    <% if (isTwitterContain){ %>
    <script async custom-element="amp-twitter" src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>
    <% } %>
    <% if (isInstagramContain){ %>
    <script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>
    <% } %>
    <% if (isSoundCloudContain){ %>
    <script async custom-element="amp-soundcloud" src="https://cdn.ampproject.org/v0/amp-soundcloud-0.1.js"></script>
    <% } %>
    <% if (isIframeContain){ %>
    <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
	<% } %>
    <% if (isFormulaContain){ %>
      <script async custom-element="amp-mathml" src="https://cdn.ampproject.org/v0/amp-mathml-0.1.js"></script>
    <% } %>
    <% if (config.generator_amp.substituteGoogle_adsense || isElseAdContain){ %>
    <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
    <% } %>
    <% if (config.generator_amp.google_analytics){ %>
    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
    <% } %>
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <script type="application/ld+json">
		{
			"@context": "http://schema.org",
			"@type": "BlogPosting",
			"headline": "<%= post.title %>",
			<% if (post.description){ %>
			"description": "<%= post.description %>",
			<% } else if (post.excerpt){ %>
			"description": "<%= post.excerpt %>",
			<% } %>
			"mainEntityOfPage":{
			    "@type":"WebPage",
			    "@id":"<%= config.url %><%= config.root %><%= post.path %>"
			},
			"datePublished": "<%= post.date.toISOString() %>",
			"dateModified": "<%= post.updated.toISOString() %>",
			<% if (post.eyeCatchImage && post.eyeCatchImage != "" && post.eyeCatchImageProperty && post.eyeCatchImageProperty.width && post.eyeCatchImageProperty.height){ %>
			"image": {
				"@type": "ImageObject",
				"url": "<%= post.titleImageForAmp %>",
				"width" : "<%= post.eyeCatchImageProperty.width %>",
				"height" : "<%= post.eyeCatchImageProperty.height %>"
			},
			<% } %>
			"author": {
			    "@type": "Person",
			    "name": "<%= config.author %>"
			},
			"publisher": {
			    "@type": "Organization",
			    "name": "<%= config.title %>"
			    <% if (config.generator_amp.logo.height && config.generator_amp.logo.width && config.generator_amp.logo.height){ %>
			    ,
			    "logo": {
			      "@type": "ImageObject",
			      "url": "<%= logoPathForAmp %>",
			      "width": <%= config.generator_amp.logo.width %>,
			      "height": <%= config.generator_amp.logo.height %>
			    }
			    <% } %>
			}
		}
	</script>
	<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
	<% if (cssTxt != ""){ %>
	<style amp-custom>
		<%- cssTxt %>
	</style>
	<% } %>
  </head>
  <body>
  	
  	
  	<!-- google analytics -->
  	<% if (config.generator_amp.google_analytics){ %>
  	<amp-analytics type="googleanalytics" id="google-analytics">
		<script type="application/json">
		{
		  "vars": {
		    "account": "<%- config.generator_amp.google_analytics %>"
		  },
		  "triggers": {
		    "trackPageview": {
		      "on": "visible",
		      "request": "pageview"
		    }
		  }
		}
		</script>
	</amp-analytics>
	<% } %>
  	
  	
  	<!-- menu -->
  	<header>
  		<div class="nav-container">
	  		<div class="left-nav">
	  			<div class="header-title">
	  				<a href="<%- config.root %>"><%= config.title %></a>
	  			</div>
	  		</div>
	  		<% if( config.generator_amp && config.generator_amp.theme && config.generator_amp.theme.menu ){ %>
		  		<div class="right alt">
		  			<button on='tap:sidebar.toggle' class="tab hamburger"></button>
		  		</div>
	  		<% } %>
	  	</div>
    </header>
  	
  	
  	<!-- sidebar -->
  	<% if( config.generator_amp && config.generator_amp.theme && config.generator_amp.theme.menu ){ %>
  	<amp-sidebar id='sidebar' layout="nodisplay" side="left">
      <ul>
      	<!--
      		To use the menu, add the menu option of _config.yml.
      		
      		generator_amp:
      		  theme:
			    menu:
			      diary: /categories/diary/
			      gallery: /categories/archive-gallery
			      archives: /archives
      	-->
			<% for (var i in config.generator_amp.theme.menu){ %>
				<li><a href="<%- config.generator_amp.theme.menu[i] %>"><%= i %></a></li>
			<% } %>
      </ul>
    </amp-sidebar>
  	<% } %>
  	
  	<!-- container -->
  	<div id="container">
	  	<div id="main">
		    <article id="<%= post.layout %>-<%= post.slug %>" class="post">
		    
		   		<!-- categories and bread crumb -->
		    	<% if ( (post.categories && post.categories.length) ){ %>
				<div class="categories-header">
					<div class="categories">
						<div class="breadcrumb inline-icon">
							<ol itemscope itemtype="http://schema.org/BreadcrumbList">
							  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
							    <a itemprop="item" href="<%- config.root %>">
							    	<span class="sns-icon home-icon"></span>
							        <span itemprop="name"><span class="fa fa-fw fa-home"></span></span>
							    </a>
							    <meta itemprop="position" content="1" />
							  </li>

								<% for(var ci=0; ci < post.categories.data.length; ci++ ){ %>
						    		<li itemprop="itemListElement" itemscope
									      itemtype="http://schema.org/ListItem">
									    <a itemprop="item" href="<%= config.root %><%- post.categories.data[ci].path %>">
									      <% if (ci == 0){ %>
									      	<span class="sns-icon folder-icon"></span>
									      <% } %>
									      <span itemprop="name"><%- post.categories.data[ci].name %></span>
									    </a>
									    <meta itemprop="position" content="<%- ci + 2 %>" />
									</li>
								<% } %>
							</ol>
						</div>
					</div>
				</div>
				<% } %>
		    
		    	<!-- entry title -->
				<div class="title-cover">
					<div class="entry-header">
						
						<% if (post.eyeCatchImage && post.eyeCatchImage != "" && post.eyeCatchImageProperty && post.eyeCatchImageProperty.width && post.eyeCatchImageProperty.height){ %>
						<%
			          		var rW = ( Number(post.eyeCatchImageProperty.width) > Number(post.eyeCatchImageProperty.height) ) ? Math.floor(post.eyeCatchImageProperty.width * 100 / post.eyeCatchImageProperty.height) : 100;
			          		
			          		var rH = ( Number(post.eyeCatchImageProperty.width) > Number(post.eyeCatchImageProperty.height) ) ? 100 : Math.floor(post.eyeCatchImageProperty.height * 100 / post.eyeCatchImageProperty.width);
			          	%>
			          	<div class="header-thumb flx">
			          		<div class="thumbImg-w circle">
			          			<amp-img class="thumbImg" layout="fixed" width="<%- rW %>" height="<%- rH %>" src="<%- post.titleImageForAmp %>">
			          			</amp-img>
			          		</div>
			          	</div>
			            <% } %>
			            
			            <div class="header-cap flx">
							<% if (post.link){ %>
							  <h1 itemprop="name" class="entry-title">
							    <a class="article-title" href="<%- post.link %>" target="_blank" itemprop="url"><%= post.title %></a>
							  </h1>
							<% } else if (post.title){ %>
							  <h1 class="article-title entry-title" itemprop="name">
							    <a href="<%- config.url %><%= config.root %><%- post.path %>" target="_blank" itemprop="url"><%= post.title %></a>
							  </h1>
							<% } %>
						</div>
					</div>
					
					<!-- datePublished -->
					<div class="entry-meta-header">
						<span class="meta-elements date">
							<span class="fa fa-fw fa-clock-o"></span>
							<time datetime="<%= datePublished %>" itemprop="datePublished"><%= post.date.toISOString().replace(/T.*/g , "").replace(/\-/g , ".") %></time>
						</span>
					</div>
				</div>
				
				
				
				<!-- entry content -->
			    <div class="entry-content ecp">
			    	<!-- social share button -->
			    	
			    	<% if( config.generator_amp.theme && config.generator_amp.theme.share_button ){ %>
			    	<div class="social-share">
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.twitter ){ %>
			    			<a class="sbtn tw" rel="nofollow" target="_blank" href="http://twitter.com/intent/tweet?url=<%= encodeURIComponent(config.url + config.root + post.path) %>&text=<%= encodeURIComponent(post.title) %>&tw_p=tweetbutton"><span class="fa fa-fw fa-twitter"></span></a>
			    		<% } %>

			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.facebook ){ %>
			    		<a class="sbtn fb" rel="nofollow" target="_blank" href="http://www.facebook.com/sharer.php?u=<%= encodeURIComponent(config.url + config.root + post.path) %>&t=<%= encodeURIComponent(post.title) %>"><span class="fa fa-fw fa-facebook"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.google ){ %>
			    		<a class="sbtn gp" rel="nofollow" target="_blank" href="https://plus.google.com/share?url=<%= encodeURIComponent(config.url + config.root + post.path) %>"><span class="fa fa-fw fa-google-plus"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.hatena ){ %>
			    		<a class="sbtn ht" rel="nofollow" target="_blank" href="https://b.hatena.ne.jp/entry/<%= encodeURIComponent(config.url + config.root + post.path) %>"><span class="icon-hatena"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.tumblr ){ %>
			    		<a class="sbtn tb" rel="nofollow" target="_blank" href="http://www.tumblr.com/share/link?url=<%= encodeURIComponent(config.url + config.root + post.path) %>&name=<%= encodeURIComponent(post.title) %>"><span class="fa fa-fw fa-tumblr"></span></a>
			    		<% } %>
			    		
			    	</div>
			    	<% } %>
			    	
                    <!-- google Adsense Matched content -->
                    <% if (config.generator_amp.substituteGoogle_adsense && config.generator_amp.substituteGoogle_adsense.data_ad_client && config.generator_amp.substituteGoogle_adsense.data_ad_slot_matched && ( config.generator_amp.substituteGoogle_adsense.width_matched || config.generator_amp.substituteGoogle_adsense.height_matched) ){ %>
                    <div class="ad-footer">
                        <amp-ad layout="<%- config.generator_amp.substituteGoogle_adsense.layout_matched || 'responsive' %>"<% if(config.generator_amp.substituteGoogle_adsense.width_matched){ %> width="<%- config.generator_amp.substituteGoogle_adsense.width_matched %>"<% } %><% if(config.generator_amp.substituteGoogle_adsense.height_matched){ %> height="<%- Math.floor(Number(config.generator_amp.substituteGoogle_adsense.height_matched)*0.5) %>"<% } %> type="adsense" data-ad-client="<%- config.generator_amp.substituteGoogle_adsense.data_ad_client %>" data-ad-slot="<%- config.generator_amp.substituteGoogle_adsense.data_ad_slot_matched %>">
                    </div>
                    <% } %>
                    
			    	<!-- content -->
			  		<%- content %>
			  		
			  		<!-- google Adsense -->
			  		<% if (config.generator_amp.substituteGoogle_adsense && config.generator_amp.substituteGoogle_adsense.data_ad_client && config.generator_amp.substituteGoogle_adsense.data_ad_slot && ( config.generator_amp.substituteGoogle_adsense.width || config.generator_amp.substituteGoogle_adsense.height) ){ %>
			  		<div class="ad-footer">
                        <% if(config.generator_amp.substituteGoogle_adsense.layout != 'responsive'){ %>
			  			    <amp-ad layout="<%- config.generator_amp.substituteGoogle_adsense.layout || 'responsive' %>"<% if(config.generator_amp.substituteGoogle_adsense.width){ %> width="<%- config.generator_amp.substituteGoogle_adsense.width %>"<% } %><% if(config.generator_amp.substituteGoogle_adsense.height){ %> height="<%- config.generator_amp.substituteGoogle_adsense.height %>"<% } %> type="adsense" data-ad-client="<%- config.generator_amp.substituteGoogle_adsense.data_ad_client %>" data-ad-slot="<%- config.generator_amp.substituteGoogle_adsense.data_ad_slot %>">
						    </amp-ad>
                        <% }else{ %>
                            <amp-ad width="100vw" height=320 type="adsense" data-ad-client="<%- config.generator_amp.substituteGoogle_adsense.data_ad_client %>" data-ad-slot="<%- config.generator_amp.substituteGoogle_adsense.data_ad_slot %>" data-auto-format="rspv" data-full-width><div overflow></div>
                            </amp-ad>
                        <% } %>
					</div>
					<% } %>
					
					
					
					<% if( config.generator_amp.theme && config.generator_amp.theme.share_button ){ %>
			    	<div class="social-share">
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.twitter ){ %>
			    			<a class="sbtn tw" rel="nofollow" target="_blank" href="http://twitter.com/intent/tweet?url=<%= encodeURIComponent(config.url + config.root + post.path) %>&text=<%= encodeURIComponent(post.title) %>&tw_p=tweetbutton"><span class="fa fa-fw fa-twitter"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.facebook ){ %>
			    		<a class="sbtn fb" rel="nofollow" target="_blank" href="http://www.facebook.com/sharer.php?u=<%= encodeURIComponent(config.url + config.root + post.path) %>&t=<%= encodeURIComponent(post.title) %>"><span class="fa fa-fw fa-facebook"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.google ){ %>
			    		<a class="sbtn gp" rel="nofollow" target="_blank" href="https://plus.google.com/share?url=<%= encodeURIComponent(config.url + config.root + post.path) %>"><span class="fa fa-fw fa-google-plus"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.hatena ){ %>
			    		<a class="sbtn ht" rel="nofollow" target="_blank" href="https://b.hatena.ne.jp/entry/<%= encodeURIComponent(config.url + config.root + post.path) %>"><span class="icon-hatena"></span></a>
			    		<% } %>
			    		
			    		<% if( config.generator_amp.theme && config.generator_amp.theme.share_button && config.generator_amp.theme.share_button.tumblr ){ %>
			    		<a class="sbtn tb" rel="nofollow" target="_blank" href="http://www.tumblr.com/share/link?url=<%= encodeURIComponent(config.url + config.root + post.path) %>&name=<%= encodeURIComponent(post.title) %>"><span class="fa fa-fw fa-tumblr"></span></a>
			    		<% } %>
			    		
			    	</div>
			    	<% } %>
			    	
					
					<!-- google Adsense Matched content -->
			  		<% if (config.generator_amp.substituteGoogle_adsense && config.generator_amp.substituteGoogle_adsense.data_ad_client && config.generator_amp.substituteGoogle_adsense.data_ad_slot_matched && ( config.generator_amp.substituteGoogle_adsense.width_matched || config.generator_amp.substituteGoogle_adsense.height_matched) ){ %>
			  		<div class="ad-footer">
						<amp-ad layout="<%- config.generator_amp.substituteGoogle_adsense.layout_matched || 'responsive' %>"<% if(config.generator_amp.substituteGoogle_adsense.width_matched){ %> width="<%- config.generator_amp.substituteGoogle_adsense.width_matched %>"<% } %><% if(config.generator_amp.substituteGoogle_adsense.height_matched){ %> height="<%- config.generator_amp.substituteGoogle_adsense.height_matched %>"<% } %> type="adsense" data-ad-client="<%- config.generator_amp.substituteGoogle_adsense.data_ad_client %>" data-ad-slot="<%- config.generator_amp.substituteGoogle_adsense.data_ad_slot_matched %>">
					</div>
					<% } %>
			  	</div>
				
		  	</article>
		  	
		  	
		  	<!-- TAGS -->
		  	<% if ( post.tags && post.tags.length ){ %>
		  	<div class="meta-content">
				<% if (post.tags && post.tags.length){ %>
				<div class="widget">
				  	<h6 class="tag"><span class="fa fa-fw fa-tag"></span>TAGS</h6>
				  	<div class="article-tag">
						<ul class="article-tag-list">
							<% post.tags.data.forEach(function(item){ %>
					    		<li class="article-tag-list-item">
					    			<a class="article-tag-list-link" href="<%= config.root %><%- item.path %>">
					    				<%- item.name %>
					    			</a>
					    		</li>
							<% }); %>
						</ul>
					</div>
				</div>
				<% } %>
			</div>
		  	<% } %>
		  	
		  	<!-- Categories posts -->
		  	<% if (config.generator_amp.theme && config.generator_amp.theme.category_posts && posts.length && post.categories && post.categories.length){ %>
		  	
			  	<%
			      	var posts_d = posts.sort('date', -1);
			      	var posts_cat = [];
			      	posts_d.each(function(p){
			      		if(p.categories && p.categories.length && p.categories.data[0].name == post.categories.data[0].name ){
			      			posts_cat.push(p);
			      		}
			      	});
		      	%>
		  	
			  	<% if( posts_cat.length > 0){ %>
				  	<div class="meta-content">
					  <div class="widget">
					  	<div class="widget-h">
					  		<h6><span class="fa fa-fw fa-folder-open-o"></span>&nbsp;<%- post.categories.data[0].name %></h6>
					    </div>
					    <div class="widget-content">
					    	<div class="posts-list">
						      <ul>
						      	
						      	<% for( var i=0; (i < posts_cat.length && i < (config.generator_amp.theme.list_limts || 5)); i++ ){ %>
						          <li>
						          	<%
						          		var rW = ( Number(posts_cat[i].eyeCatchImageProperty.width) > Number(posts_cat[i].eyeCatchImageProperty.height) ) ? Math.floor(posts_cat[i].eyeCatchImageProperty.width * 100 / posts_cat[i].eyeCatchImageProperty.height) : 100;
						          		
						          		var rH = ( Number(posts_cat[i].eyeCatchImageProperty.width) > Number(posts_cat[i].eyeCatchImageProperty.height) ) ? 100 : Math.floor(posts_cat[i].eyeCatchImageProperty.height * 100 / posts_cat[i].eyeCatchImageProperty.width);
						          	%>
						          	<div class="posts-list-thumb flx">
							          	<div class="thumbImg-w">
							          		<div class="thumbImg">
							          			<a href="<%- config.root %><%- posts_cat[i].path %>">
								          			<amp-img class="thumbImg" layout="fixed" width="<%- rW %>" height="<%- rH %>" src="<%- posts_cat[i].eyeCatchImage %>">
								          			</amp-img>
								          		</a>
							          		</div>
							          	</div>
							        </div>
						          	<div class="posts-list-link flx">
						            	<a href="<%- config.root %><%- posts_cat[i].path %>"><%= posts_cat[i].title || '(no title)' %></a>
						            	<div class="posts-list-meta">
						            		<span class="fa fa-fw fa-clock-o"></span>
						            		<%= posts_cat[i].date.toISOString().replace(/T.*/g , "").replace(/\-/g , ".") %>
						            	</div>
						            </div>
						          </li>
						        <% } %>
						      </ul>
						    </div>
					    </div>
					  </div>
					</div>
				<% } %>
			<% } %>
		  	
		  	
		  	<!-- Detailed categories  posts -->
		  	<% if (config.generator_amp.theme && config.generator_amp.theme.category_posts_detailed && posts.length && post.categories && post.categories.length){ %>
			  	<%
			      	var posts_d = posts.sort('date', -1);
			      	var posts_cat = [];
			      	posts_d.each(function(p){
			      		if(p.categories && p.categories.length && p.categories.data[0].name == post.categories.data[0].name ){
			      			if(p.categories.length == post.categories.length){
			      				var isMatchedCategories = true;
			      				for(var i=0; i<p.categories.length; i++){
			      					if(p.categories.data[i].name != post.categories.data[i].name ){
			      						isMatchedCategories = false;
			      					}
			      				}
			      				if(isMatchedCategories){
			      					posts_cat.push(p);
			      				}
			      			}
			      		}
			      	});
		      	%>
		      	
		      	<% if( posts_cat.length > 0){ %>
				  	<div class="meta-content">
					  <div class="widget">
					  	<div class="widget-h">
					  		<h6><span class="fa fa-fw fa-folder-open-o"></span>&nbsp;<%- post.categories.data[post.categories.length - 1].name %></h6>
					    </div>
					    <div class="widget-content">
					    	<div class="posts-list">
						      <ul>
						      	
						      	<% for( var i=0; (i < posts_cat.length && i < (config.generator_amp.theme.list_limts || 5)); i++ ){ %>
						          <li>
						          	<%
						          		var rW = ( Number(posts_cat[i].eyeCatchImageProperty.width) > Number(posts_cat[i].eyeCatchImageProperty.height) ) ? Math.floor(posts_cat[i].eyeCatchImageProperty.width * 100 / posts_cat[i].eyeCatchImageProperty.height) : 100;
						          		
						          		var rH = ( Number(posts_cat[i].eyeCatchImageProperty.width) > Number(posts_cat[i].eyeCatchImageProperty.height) ) ? 100 : Math.floor(posts_cat[i].eyeCatchImageProperty.height * 100 / posts_cat[i].eyeCatchImageProperty.width);
						          	%>
						          	<div class="posts-list-thumb flx">
							          	<div class="thumbImg-w">
							          		<div class="thumbImg">
							          			<a href="<%- config.root %><%- posts_cat[i].path %>">
								          			<amp-img class="thumbImg" layout="fixed" width="<%- rW %>" height="<%- rH %>" src="<%- posts_cat[i].eyeCatchImage %>">
								          			</amp-img>
								          		</a>
							          		</div>
							          	</div>
							        </div>
						          	<div class="posts-list-link flx">
						            	<a href="<%- config.root %><%- posts_cat[i].path %>"><%= posts_cat[i].title || '(no title)' %></a>
						            	<div class="posts-list-meta">
						            		<span class="fa fa-fw fa-clock-o"></span>
						            		<%= posts_cat[i].date.toISOString().replace(/T.*/g , "").replace(/\-/g , ".") %>
						            	</div>
						            </div>
						          </li>
						        <% } %>
						      </ul>
						    </div>
					    </div>
					  </div>
					</div>
				<% } %>
			<% } %>
		  	
		  	
		  	<!-- Latests -->
		  	<% if (config.generator_amp.theme && config.generator_amp.theme.latests && posts.length > 1){ %>
		  	<div class="meta-content">
			  	<div class="widget">
			  		<div class="widget-h">
			  			<h6><span class="fa fa-fw fa-file-text-o"></span>&nbsp;LATESTS</h6>
			  		</div>
				    <div class="widget-content">
				    	<div class="posts-list">
					      <ul>
					        <% posts.sort('date', -1).limit((config.generator_amp.theme.list_limts || 5)).each(function(p){ %>
					          <li>
					          	<%
					          		var rW = ( Number(p.eyeCatchImageProperty.width) > Number(p.eyeCatchImageProperty.height) ) ? Math.floor(p.eyeCatchImageProperty.width * 100 / p.eyeCatchImageProperty.height) : 100;
					          		
					          		var rH = ( Number(p.eyeCatchImageProperty.width) > Number(p.eyeCatchImageProperty.height) ) ? 100 : Math.floor(p.eyeCatchImageProperty.height * 100 / p.eyeCatchImageProperty.width);
					          	%>
					            
					            <div class="posts-list-thumb flx">
						            <div class="thumbImg-w">
						          		<div class="thumbImg">
						          			<a href="<%- config.root %><%- p.path %>">
						          				<amp-img class="thumbImg" layout="fixed" width="<%- rW %>" height="<%- rH %>" src="<%- p.eyeCatchImage %>">
						          				</amp-img>
						          			</a>
						          		</div>
						          	</div>
						        </div>
					          	<div class="posts-list-link flx">
					            	<a href="<%- config.root %><%- p.path %>"><%= p.title || '(no title)' %></a>
					            	<div class="posts-list-meta">
					            		<span class="fa fa-fw fa-clock-o"></span>
					            		<%= p.date.toISOString().replace(/T.*/g , "").replace(/\-/g , ".") %>
					            	</div>
					            </div>
					            
					          </li>
					        <% }) %>
					      </ul>
					    </div>
				    </div>
				</div>
			  </div>
			</div>
			<% } %>
			
		</div>
		
		
		<footer id="footer">
		
			<% if (config.author && config.authorDetail ){ %>
			<div class="site-author-info">
				<h6>Profile</h6>
				<div class="site-author-info-wrapper">
				
					<% if (config.authorDetail && config.authorDetail.avatar && config.authorDetail.avatar.path && config.authorDetail.avatar.width && config.authorDetail.avatar.height ){ %>
					<div class="gravatar-wrapper flx">
						<div class="gravatar-area">
							<amp-img alt="gravatar" layout="fixed" class="circle responsive-img" src="<%= avatarPath %>" width="<%= config.authorDetail.avatar.width %>" height="<%= config.authorDetail.avatar.height %>"></amp-img>
						</div>
					</div>
					<% } %>
					
					<% if (config.author ){ %>
					<div class="authorCap-wrapper flx">
						<div class="authorCap"><%= config.author %>&nbsp;
							<% if (config.authorDetail && config.authorDetail.authorReading){ %>
							<span class="authorReading">(<%= config.authorDetail.authorReading %>)</span>
							<% } %>
						</div>
						<% if (config.authorDetail && config.authorDetail.description){ %>
						<p class="site-author-desc">
							<%= config.authorDetail.description %>
						</p>
						<% } %>
						<% if( config.generator_amp && config.generator_amp.theme && config.generator_amp.theme.authorLink ){ %>
						<div class="sns-link">
							<% if( config.generator_amp.theme.authorLink.twitter_id ){ %>
							<a href="https://twitter.com/<%= config.generator_amp.theme.authorLink.twitter_id %>" target="_blank">
								<i class="fa fa-twitter"></i>
							</a>
							<% } %>
							<% if( config.generator_amp.theme.authorLink.instagram_id ){ %>
							<a href="https://www.instagram.com/<%= config.generator_amp.theme.authorLink.instagram_id %>/" target="_blank">
								<i class="fa fa-instagram"></i>
							</a>
							<% } %>
							<% if( config.generator_amp.theme.authorLink.facebook_id ){ %>
							<a href="https://www.facebook.com/<%= config.generator_amp.theme.authorLink.facebook_id %>" target="_blank">
								<i class="fa fa-facebook"></i>
							</a>
							<% } %>
							<% if( config.generator_amp.theme.authorLink.youtube_channel ){ %>
                                                        <a href="https://www.youtube.com/channel/<%= config.generator_amp.theme.authorLink.youtube_channel %>" target="_blank">
                                                                <i class="fa fa-youtube-play"></i>
                                                        </a>
                                                        <% } %>
							<% if( config.generator_amp.theme.authorLink.github_id ){ %>
							<a href="https://github.com/<%= config.generator_amp.theme.authorLink.github_id %>" target="_blank">
								<i class="fa fa-github"></i>
							</a>
							<% } %>
							<% if( config.generator_amp.theme.authorLink.mail_url ){ %>
							<a href="<%= config.generator_amp.theme.authorLink.mail_url %>" target="_blank">
								<i class="fa fa-envelope"></i>
							</a>
							<% } %>
						</div>
						<% } %>
					</div>
					<% } %>
					
				</div>
			</div>
			<% } %>
			
			<% if( config.generator_amp && config.generator_amp.theme && config.generator_amp.theme.menu ){ %>
			<div class="footer-menu">
				<ul>
					<% for (var i in config.generator_amp.theme.menu){ %>
						<li><a href="<%- config.generator_amp.theme.menu[i] %>"><%= i %></a></li>
					<% } %>
				</ul>
			</div>
			<% } %>
			
			<div class="copyright-tool">
				
				<% if (config.copyright_notice){ %>
				<div class="copyright-notice">
					<p>
						<%= config.copyright_notice %>
					</p>
				</div>
				<% } %>
				
				<div class="copyright-title">
					<span>
					&copy; <%= copyrightDate %>&nbsp;<%= config.title %>
					</span>
				</div>
				
				<div class="copyright-license">
					<aside>
						Powered by <a href="https://hexo.io/">Hexo</a>. <a href="https://github.com/tea3/hexo-generator-amp">AMP-Theme</a> designed by <a href="https://github.com/tea3/">tea</a>.
					</aside>
				</div>
			</div>
			
		</footer>


  	<div id="totop"><a href="#"></a></div>


  </body>
</html>
