﻿/* CSS layout */

/************************************************/
/*	マスタヘッド定義									*/
/************************************************/
#masthead {
	margin: auto auto auto auto;*/
	width: 1210px; 
	height: 100px;
/*	background-color: #CC3300;
	background-image: url('img/JN064_350A-min.jpg');*/
	text-align : center;
}

/************************************************/
/*	ボディ定義										*/
/************************************************/
body {
  /* 画像ファイルの指定 */
  background-image: url(img/JN064_350A-min.jpg);
   
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #464646;
}

/************************************************/
/*	トップナビメニュー定義								*/
/************************************************/
.top_nav {
/*	background-image: url('img/JN064_350A-min.jpg');*/
/*	background-color:#000248;*/
	text-align : center;
}
/************************************************/
/*	会長挨拶用:ボックス定義							*/
/************************************************/
/* 会長挨拶用:パッキングボックス */
/*.box_packing2 {*/
.contents_box {
	display: flex;
	overflow: hidden;
    width:100%;
	text-align : center;
}

/************************************************/
/*	左側用:ボックス定義								*/
/************************************************/
.left_box1 {
/*	float: left;*/
	width: 210px;
/*	background-image: url('img/JN064_350A-min.jpg');
	background-color: #008080;*/
}

/************************************************/
/*	センター用:ボックス定義							*/
/************************************************/
/* indexページ用 */
.center_box1 {
	text-align:	center;
	width:		auto;
/*	width:		650px;*/
	margin:		10px auto;*/
/*	background-image: url('img/JN064_350A-min.jpg');*/

}

/* テキストページ用 */
.center_box2 {
	text-align:	left;
	width:		auto;
/*	width:		650px;*/
	margin:		10px auto;*/

}

/************************************************/
/*	右側用:ボックス定義								*/
/************************************************/
/* 右側ボックス */
.right_box1 {
	width: 320px;
/*	background-color: #008080;*/
	text-align: center;
}

/* 右側ボタンボックス */
.right_box2 {
	width: 230px;
/*	background-color: #008080;*/
	text-align: center;
}

/* 右側ボタンボックス */
.right_box3 {
	width: 150px;
/*	background-color: ##FFFFFF;*/
	text-align: center;
}

/************************************************/
/* フッター定義										*/
/************************************************/
#footer {
	clear: both;
	text-align: center ;
}

/*---------------------------------------------------------------------------------------------*/
/************************************************/
/* ボタン トップナビゲーションメニュー定義					*/
/************************************************/
button.button_topmenu {
	font: inherit;
	font-size: 18px;
	padding: 10px 10px;

/*	background-color: #000248;	*/
	background-color: #006400;

	color: #ffffff;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	width: auto;
	height: 60px;

}

button.button_topmenu:hover {
    background-color: #cccccc;
    color: #000000;
    
}

/************************************************/
/* ボタン サイドナビゲーションメニュー定義					*/
/************************************************/
/* サイドメニューボタン				*/
button.button_sidemenu {
	font: inherit;
	font-size: 18px;
	padding: 10px;
	background-color: #008080;
	color: #ffffff;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 600;
/*	width: 200px;*/
	width: 180px;
	height: 60px;

/* ボーダーをなくす */
	border-style: none;
/* ボタンの影の指定,影の横幅を2px,縦長を2px,ぼかしを3px,広がりを1px,色を#666（グレー）に指定*/
	box-shadow: 2px 2px 3px 1px #666;
	moz-box-shadow: 2px 2px 3px 1px #666;
	webkit-box-shadow: 2px 2px 3px 1px #666;
/* テキストの影の指定*/
	text-shadow: 1px 1px 2px #000;
/* グラデーションの指定 */
/*	background: moz-linear-gradient(bottom, #36d, #248 50%, #36d);*/
/*	background: webkit-gradient(linear, left bottom, left top, from(#36d), color-stop(0.5, #248), to(#36d));*/
/* 角丸の指定 */
    moz-border-radius: 5px;
	webkit-border-radius: 5px;
	border-radius: 7px;
}

/* サイドメニューボタン・オンマウス反転	*/
button.button_sidemenu:hover {
	background-color: #00CC99;
	color: #000000;
}

/************************************************/
/* ボタン リンク先用イエロー定義							*/
/************************************************/
/* リンクボタン				*/
button.button_Link {
	font: inherit;
	font-size: 30px;
	padding: 20px;
	background-color: #ffff99;
	color: #000000;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 800;
	width: 300px;
	height: 120px;

    moz-border-radius: 5px;
	webkit-border-radius: 5px;
	border-radius: 7px;

}

button.button_Link2 {
	font: inherit;
	font-size: 20px;
	padding: 10px;
	background-color: #ffff99;
	color: #000000;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 800;
	width: 400px;
	height: 70px;

    moz-border-radius: 5px;
	webkit-border-radius: 5px;
	border-radius: 7px;

}

/* オープンリンクボタン				*/
button.button_OpenLink {
	font: inherit;
	font-size: 18px;
	padding: 10px;
	background-color: #008000;
	color: #006600;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 800;
	width: 200px;
	height: 70px;
	
	background: url(img/Lown_001.png) left top no-repeat;
	
	moz-border-radius: 5px;
	webkit-border-radius: 5px;
	border-radius: 7px;

}

button.button_OpenLink:hover {
	background: url(img/RedCray3.png) left top no-repeat;
    background-color: #cccccc;
    color: #ffffff;
    
}

/* オープンリンクボタン				*/
button.button_Link3 {
	font: inherit;
	font-size: 15px;
	padding: 10px;
	background-color: #ffff99;
	color: #000000;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 800;
	width: 200px;
	height: 70px;
}


/************************************************/
/* ボタン 大会結果用ネイビー 定義						*/
/************************************************/
/* リンクボタン				*/

button.button_result_N {
	font: inherit;
	font-size: 15px;
	padding: 10px;
	background-color: #000080;
	color: #ffffff;
	font-family: HG丸ｺﾞｼｯｸM-PRO;
	font-weight: 800;
	width: 200px;
	height: 70px;
}

/************************************************/
/*	点滅定義										*/
/************************************************/
/* 点滅テキスト */
.blinking{
	-webkit-animation:blink 0.7s ease-in-out infinite alternate;
	-moz-animation:blink 0.7s ease-in-out infinite alternate;
	animation:blink 0.7s ease-in-out infinite alternate;
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: x-large;
	font-style: italic; 
	color: #FFFFFF;
}

@-webkit-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@-moz-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

/* スロー点滅テキスト(ホワイト) */
.blinking_slow{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
	-moz-animation:blink 1.5s ease-in-out infinite alternate;
	animation:blink 1.5s ease-in-out infinite alternate;
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: x-large;
	font-style: italic; 
	color: #FFFFFF;
}

@-webkit-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@-moz-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

/* スロー点滅テキスト(ブラック) */
.blinking_slow2{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
	-moz-animation:blink 1.5s ease-in-out infinite alternate;
	animation:blink 1.5s ease-in-out infinite alternate;
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: x-large;
	font-style: italic; 
	color: #000000;
}

@-webkit-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@-moz-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

@keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

/************************************************/
/*	ブロックボックスとしてレンダリング						*/
/************************************************/
/* ブロック定義 */

article,aside,canvas,details,figcaption,figure,
header,footer,main,menu,nav,section,summary {

	display: block;

}

/************************************************/
/*	スタイルシート定義								*/
/************************************************/
/*フォント*/
p.MSGothic		{font-family: "ＭＳ ゴシック",sans-serif; }
p.MSmincho		{font-family: "ＭＳ 明朝",serif; }
p.impact		{font-family: Impact,Charcoal; }
/*サイズ*/
span.12px		{font-size: 12px; }
span.12em		{font-size: 12em; }
span.12ex		{font-size: 12ex; }
span.80pri		{font-size: 80%; }
span.100pri		{font-size: 100%; }
span.120pri		{font-size: 120%; }
span.xx-small	{font-size: xx-small; }
span.x-small	{font-size: x-small; }
span.small		{font-size: small; }
span.medium		{font-size: medium; }
span.large		{font-size: large; }
span.x-large	{font-size: x-large; }
span.xx-large	{font-size: xx-large; }

/*特定文字フォント／カラー指定*/
span.large300	{font-size: large;font-weight: 300;}
span.large400	{font-size: large;font-weight: 400;}
span.large600	{font-size: large;font-weight: 600;}
span.x-large400	{font-size: x-large;font-weight: 400;}

span.x400-green-MSGothic	{
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight: 400;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}

span.xx400-green-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}


span.x500-green-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 500;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}

span.x600-green-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 600;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}

span.x800-green-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 800;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}

span.xxl-green-MSGothic	{
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight: 400;
	font-size: xx-large;
	font-style: italic; 
	color: #008000;
}

span.x400-white-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: x-large;
	font-style: italic; 
	color: #FFFFFF;
}

span.xx60-navy-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size:	60px;
	font-style: italic; 
	color: #330099;
}

span.xx60-white-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size:	60px;
	font-style: italic; 
	color: #FFFFFF;
}

span.x400-green-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: x-large;
	font-style: italic; 
	color: #006600;
}

/*タイトル特定文字フォント／カラー指定*/
span.xx8-white-impact	{
	font-family: "impact",sans-serif;
	font-weight: 400;
/*	font-size: 8px;*/
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #ffffff;
}

span.xx40-white-HSGothicMPRO	{
	font-family: "HG丸ｺﾞｼｯｸM-PRO",sans-serif;
	font-weight: 400;
	font-size: 40px;
	font-style: italic; 
	color: #FFFFFF;
}

span.xx40-green-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 40px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #008000;
}

span.
	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 40px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #ffffff;
}

span.xx40-navy-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 40px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #330099;
}

span.xx60-green-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 60px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #008000;
}

span.xx60-white-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 60px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #ffffff;
}

span.xx60-navy-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 60px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #330099;
}

span.xx80-white-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 80px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #ffffff;
}

span.xx80-navy-impact	{
	font-family: impact,sans-serif;
	font-weight: 400;
	font-size: 80px;
/*	font-size: xx-large;*/
	font-style: italic; 
	color: #330099;
}
/* SVG*/
<style type="text/css">
.Svg-Impact-Gr01 text {
  font-weight       : bold;
  font-size         : 80px;
  font-family       : Impact;
  stroke            : #336600;
  fill              : #ffffff;
  letter-spacing    : 3px;
  text-anchor       : middle;
  dominant-baseline : alphabetic;
}
.Svg-Impact-Gr01 > svg > use:nth-of-type(1) {
  stroke-width      : 7px;
  paint-order       : stroke;
  stroke-linejoin   : round ;
}
.Svg-Impact-Gr01 > svg > use:nth-of-type(2) {
  stroke-width      : 0;
}
</style>