<!DOCTYPE html>
<html lang="ja">
<head prefix="og: https://ogp.me/ns#">
<meta charset="UTF-8">
<title>{val page/title} | {val common/site_title}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="{val page/contents}">
<meta name="keyword" content="{val common/site_keyword}">
<meta property="og:url" content="{val page_url}">
<meta property="og:type" content="article">
<meta property="og:title" content="{val page/title}">
<!--{def common/site_image}-->
<meta property="og:image" content="{val common/site_image}">
<!--{/def}-->
<meta property="og:site_name" content="{val common/site_title}">
<meta property="og:description" content="{val page/contents}">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/style_maru.css">
<link rel="stylesheet" href="css/style_kiji.css">
<link rel="stylesheet" href="css/github-markdown.css">
<link rel="stylesheet" href="css/q19cms-markdown.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.css"/>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.js"></script>
<style>
#mainimg {
	background: var(--base-color) url("{val common/mainimage_file}") no-repeat center center / cover;
	width: 100%;
	padding-top: 150%;	/*アスペクト比2:3（3÷2=1.5）*/
	position: relative;
	overflow: hidden;
}
/*画面420px以上の追加指定*/
@media screen and (min-width:420px) {
	#mainimg {
		background: var(--base-color) url("{val common/mainimage_file}") no-repeat center center / cover;
		padding-top: 56.25%;	/*アスペクト比16:9（9÷16=0.5624）*/
	}
}/*追加指定ここまで*/
</style>
{rval common/head_tag}
{rval head_tag}
</head>

<body class="biz63">

<div id="container">

{include header.tpl}

<div id="mainimg">
<div>

<div class="text">
<p>{val common/catch}</p>
</div>

<div class="btn">
<p><a href="{val common/banner1_link}">{val common/banner1_name}</a></p>
<p><a href="{val common/banner2_link}">{val common/banner2_name}</a></p>
</div>

</div>
</div>

<main>

{rval contents}

</main>

{include footer.tpl}

</div>
<!--/#container-->

{include menu.tpl}

<!--ローディング-->
<div id="loading">
<img src="{val common/site_logo_file}" alt="Loading">
<div class="progress-container">
<div class="progress-bar"></div>
</div>
</div>

<!--jQueryの読み込み-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<!--パララックス（inview）-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/protonet-jquery.inview/1.1.2/jquery.inview.min.js"></script>
<script src="js/jquery.inview_set.js"></script>

<!--このテンプレート専用のスクリプト-->
<script src="js/main.js"></script>

{rval common/body_tag}
{rval body_tag}
</body>
</html>
