/**
 * style.css .
 * Copyright (c)2014-2025 MONO Inc. All rights reserved.
 *
 * @since   2014-02-01
 * @version 1.0
 */

/*
 * Layout
 */
body 						{ margin:0; padding:0; line-height:1.5rem; }

ul							{ margin:0; padding:0; }

body > main					{ margin:0; padding:0; z-index:1; }

section						{ display:block; margin:8px 0; padding:8px; }
section						{ min-height:100vh; }
section > header			{ display:flex; justify-content:center; align-items:center; }
section > header			{ margin:32px 0 0px; padding-top:8px; }
section > header h2			{ margin:0; padding:0; }
section > article.view		{ display:flex; justify-content:center; align-items:center; }
section > article.view		{ min-height:calc(100vh - 136px); }
section > footer			{ text-align:right; }
section > footer a 			{ display:inline-block; margin-right:16px; padding:4px 10px; }

#header						{ display:flex; justify-content:space-between; align-items:center; }
#header 					{ position:sticky; top:0; left:0; right:0; z-index:100; }
#header						{ height:36px; margin:0; padding:1px 8px; box-sizing:border-box; }
#header h1					{ display:inline-block; margin:0; padding:0; }
#header .globalmenu_button	{ display:inline-block; padding:4px; }

#footer						{ padding:16px; }

#globalmenu					{ position:absolute; top:36px; right:0; width:160px; padding:8px 16px; }

#section1 p					{ display:inline-block; max-width:70%; padding:32px; }
#section2 .view				{ min-width:360px; margin:auto; }
#section2 .view th			{ padding:4px 8px; text-align:right; }
#section4 .view 			{ display:block; max-width:80%; margin:16px auto; padding:16px; }
#section4 > article.view	{ min-height:calc(100vh - 200px);  }

#message_window				{ position:fixed; top:36px; left:0; right:0; z-index:100;  }
#message_window 			{ width:100%; height:40px; padding:2px 8px; }

/*
 * Style
 */
body						{ font-size:11pt; font-family:sans-serif; }
section > footer a 			{ font-size:20px; text-decoration:none; }

#header						{ background:#000000; }
#header h1 					{ font-size:14px; }
#header .globalmenu_button	{ font-size:24px; text-decoration:none; }

#footer						{ font-size:0.9em; text-align:center; }

#globalmenu					{ font-size:1.2em; text-align:right; line-height:2.5em; }
#globalmenu ul 				{ list-style-type:none; }
#globalmenu a 				{ text-decoration:none; }

#section1 					{ min-height:calc(100vh - 40px); }
#section1 p					{ font-size:1.1em; line-height:2em; }
#section2 .view th			{ padding:4px 8px; text-align:right; }
#section4 .view 			{  }
#section4 .view input,
#section4 .view textarea	{ width:calc(100% - 64px); margin:16px; padding:8px 16px; border-radius:8px; font-size:1.1em; }
#section4 .view .group		{ text-align:center; }
#section4 .view button 		{ margin:16px auto; padding:8px 16px; font-size:1.1em; cursor:pointer; }

/*
 * Color & Background
 */
body						{ color:#ffffff; background:#000000; }

section > footer a 			{ color:#909090; background:rgba(0,0,0,0.5); border-radius:8px; }

#header h1 					{ color:#808080; }
#header .globalmenu_button	{ color:#c0c0c0; }

#footer						{ color:#c0c0c0; }

#globalmenu 				{ background:rgba(0,0,0,0.9); }
#globalmenu a 				{ color:#e0e0e0; }

#section1					{ background-image:url('../image/bg001.jpg'); background-size:cover; background-position:center; }
#section1 p					{ background:rgba(0,0,0,0.85); }
#section2					{ background-image:url('../image/bg002.jpg'); background-color:rgba(0,0,0,0.2); background-blend-mode:darken; background-size:cover; background-position:center; }
#section3					{ background-image:url('../image/bg003.jpg'); background-color:rgba(0,0,0,0.2); background-blend-mode:darken; background-size:cover; background-position:center; }
#section4 .view				{ background:rgba(255,255,255,0.15); border-radius:8px; }
#section4 .view button		{ color:#ffffff; background:#c00040; border:none; border-radius:8px; }

#message_window 			{ color:#ffffff; background:rgba(0,0,0,0.8); }

/*
 * Bevarior
 */

[data-on="0"]				{ display:none; }
[data-on="1"]				{ display:block; }


/* vim: ts=4 */
