@charset "utf-8";

/***************************************
基本レイアウト
***************************************/
#bigbox					{}
#header					{width:100%; height:auto;}
#header h1				{width:100%; text-align:center;}
#header img				{width:300px; height:60px;}
#contentbody			{width:100%; background-image:none;}
#maincontent			{width:auto; padding:10px;}
#footer					{}

/***************************************
トップページのアイキャッチ
***************************************/
#eyecatch				{width:100%; height:auto;}
#eyecatch h1			{width:100%; height:auto; margin:0 auto;}
#eyecatch img			{width:100%; height:auto; margin:0 auto;}

/***************************************
グローバルメニュー
***************************************/
#gmenu					{padding:0px;}
#gmenu div				{width:100%; margin:0 auto;}
#gmenu a				{font-weight:bold; text-decoration:none; font-size:12px; padding:20px 3px 20px 3px;}
#gmenu a:link			{}
#gmenu a:visited		{}
#gmenu a:hover			{}
#gmenu a:active			{}


/***************************************
ヘッダーメニュー
***************************************/
/*
#header-menu			{display:flex; justify-content:space-between; align-items:center; padding:0 20px; background:#fff;}
*/
.logo-img				{width:240px;}

/***************************************
ハンバーガーメニュー
***************************************/
.drawer-list			{list-style-type:none;}
.drawer-hidden			{display:none;}		/* チェックボックスを非表示に */

/*PCのみのスタイルを一旦リセット*/
.drawer-list			{width:auto; height:auto; margin:auto;}
.drawer-item a			{float:none; margin:auto; padding:auto; font-size:medium; font-weight:normal;}

/* ハンバーガーアイコン */
.drawer-open				{display:flex; height:60px; width:60px; justify-content:center; align-items:center; position:relative; z-index:1000; cursor:pointer;}
.drawer-open span,
.drawer-open span:before,
.drawer-open span:after		{content:''; display: block; width:30px; height:4px; border-radius:4px; background:#000000; transition:0.5s; position:absolute;}
.drawer-open span:before	{bottom:10px;}	/* 三本線の上位置 */
.drawer-open span:after		{top:10px;}		/* 三本線の下位置 */

/* ハンバーガーアイコンがタップされたら */
#drawer-check:checked ~ .drawer-open span			{background:rgba(255, 255, 255, 0);}	/* 真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span::before	{transform:rotate(45deg); bottom:0;}	/* アイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::after	{transform:rotate(-45deg); top:0;}
  
/* メニュー（left:100%;で画面外に飛ばしておいて、タップされたらleft:20%;やleft:0;で画面内に入れる）*/
.drawer-content								{width:80%; height:100%; z-index:999; background-color:#ffffff; transition:0.5s; position:fixed; top:0; left:100%;}
#drawer-check:checked ~ .drawer-content		{left:20%;}
.drawer-close								{width:100%; height:100%; z-index:999; background-color:#ffffff; opacity:0.5; transition:0.5s; position:fixed; top:0; left:100%;}
#drawer-check:checked ~ .drawer-close		{left:0;}

/* メニュー項目 */
.drawer-item a			{display:block; padding:8px; text-decoration:none; font-size:16px; font-weight:bold; border-bottom:1px solid #666666; background-color:#ffffff;}
.drawer-item a:before	{content:'  ';}
.drawer-item a:link		{color:#000000;}
.drawer-item a:visited	{color:#000000;}
.drawer-item a:hover	{color:#000000;}
.drawer-item a:active	{color:#000000;}


/***************************************
メインメニュー
***************************************/
#menulist				{width:100%;}

/***************************************
入力フォーム
***************************************/
#input_form				{width:95%; margin:0; padding:0;}
#input_table th			{padding:5px; white-space:normal; font-size:90%;}
#input_table td			{padding:5px;}

/***************************************
データテーブル
***************************************/
table.dataTable			{}
table.dataTable th		{}
table.dataTable td		{}

/***************************************
結果表示
***************************************/
.result_text			{}
.result_text img		{max-width:320px;}

/**************************************
よく使うclass（ボックススタイル）
***************************************/
.godetailpage			{font-size:80%; padding:20px; text-align:center;}

.bora					{width:90%; margin:10px auto; padding:10px;}

.fltimg					{width:320px; margin:0px auto 10px auto; display:block; float:none;}
.fltdiv					{width:50%;}
.fltdiv img				{width:160px;}

.illust					{float:none; text-align:center; margin:1em 0 1em 0;}

.afbnr					{margin-top:20px;}
.afbnr div				{float:left; zoom:57%;}

.af_bottom				{width:300px; margin:20px auto;}
.af_bottom a			{}

/***************************************
フッターメニュー
***************************************/
.footmenu-list			{width:90%;}
.footmenu-item a		{}