@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------*/
/* ========= RESET ========= */

/* == BASE == */
html { overflow-x: hidden; scrollbar-width: none; }
html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0;	border: 0; outline: 0; font-size: 100%; line-height: 1em; font-weight: normal; text-size-adjust:100%;	-webkit-text-size-adjust:100%; /* background: transparent; */ }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
*, *:before, *:after { box-sizing: border-box; }*, *::before, *::after { margin: 0; padding: 0; }
button, input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 0; font-size: 100%; line-height: 100%; border: none; outline: none; background: transparent; cursor: pointer; }
/* == LISTING == */
ol, ul, li { list-style: none; }
ul { margin: 1em 0; padding: 0 0 0 2em; } li { line-height: 1.3em; margin: 0 0 .5em; }

/* == ANCHER & HOVER == */
a           { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
a:hover     { opacity: .7; text-decoration: none; }

/* == MEDIA == */
img { max-width: 100%; height: auto; display: block; }

/*--------------------------------------------*/
/* ========= Font Family Def ========= */
@font-face {
  font-family: "Web437_IBM_DOS_ISO9";
  src: url("./fonts/Web437_IBM_DOS_ISO9.woff") format("woff");
  font-weight: normal; font-style: normal; font-display: swap;
}

/* ========= Master Variables ========= */
:root {
/* Color Variables */
--color__primary_green: #0F0;
--color__gray:          #555;
--color__fff:           #fff;
--color__000:           #000;

/* Font Variables */
--fontlang_ja: "DotGothic16", "游ゴシック", "Yu Gothic", "游ゴシック体", system-ui, "Hiragino Kaku Gothic ProN", "Hiragino Mincho Pro", "Meiryo", "メイリオ", "ＭＳ Ｐゴシック Pro W3", "Hiragino Sans", "Hiragino Kaku Gothic Pro", "ヒラギノ 角ゴシック", "MS PGothic", "MS Gothic", "MS Mincho", "MS PMincho", "MS UI Gothic", "MS UI Mincho", "Segoe UI", "Tahoma", "Arial Unicode MS", "Arial", sans-serif;
--fontlang_en: "Web437_IBM_DOS_ISO9", "Helvetica", "Arial Unicode MS", "Arial", "sans-serif";
}

/* ELEMENTS /////////////////////////////////////*/
.fontlang__ja { font-family: var(--fontlang_ja); }
.fontlang__en { font-family: var(--fontlang_en); }

/*--------------------------------------------*/
/* ========= BODY ========= */
body { background-color: var(--color__000); color: var(--color__primary_green); font-family: var(--fontlang_en); }
textarea { font-family: var(--fontlang_ja); }

div#globalContainer { display: block; clear: both; margin: 0 auto; max-width: 1920px; width: 100%; padding: 145px 200px; }
#content { border: 5px solid var(--color__primary_green); padding: 50px; }
.inner { display: block; clear: both; padding: 0px; margin-left: auto; margin-right: auto;	width: 1000px; position: relative; font-feature-settings:"palt"; text-align: justify; word-break: break-all; }

/*--------------------------------------------*/
/* ========= HEADER ========= */
header { display: flex; align-items: center; justify-content: space-between; }

header h1 img { max-width: max-content; pointer-events: none; -webkit-user-drag: none; user-drag: none; -webkit-touch-callout: none; user-select: none; }

div.TOD__wrapper {display: flex;align-items: center;color: var(--color__fff);border: 3px solid var(--color__fff);padding: 50px 50px 45px 50px; max-width: 689px; width: 100%; }
div.TOD__wrapper p:nth-of-type(1)  { font-size: 6em; line-height: 0; }
.TOD__wrapper p:first-child::after {content: "";width: 3px;height: 50px;display: inline-block;background: var(--color__fff);margin-inline: 12px 20px;}
div.TOD__wrapper p:nth-of-type(2)  { font-size: 2em; }
/* == 1st == */ div.TOD__wrapper p span:nth-child(1) { }
/* == 2nd == */ div.TOD__wrapper p span:nth-child(2) { }
/* = colon = */ div.TOD__wrapper p span:nth-child(3) { }
/* == 4th == */ div.TOD__wrapper p span:nth-child(4) { }
/* == 5th == */ div.TOD__wrapper p span:nth-child(5) { }
/* == 6th == */ div.TOD__wrapper p span:nth-child(6) { }
/* == 6th == */ div.TOD__wrapper p span:nth-child(6)::before { content: "("; }
/* == 6th == */ div.TOD__wrapper p span:nth-child(6)::after { content: ")"; }

/*--------------------------------------------*/
/* ========= MAIN COMMON ========= */
h2 { display: flex; align-items: center; column-gap: 10px; color: var(--color__fff); margin: 20px 0 14px 0; font-size: 22px; }
h2::before { content: "•"; display: inline-block; color: var(--color__fff); font-size: 26px; line-height: 1; }

div#columnWrapper { display: flex; justify-content: space-between; }

div.column_right { max-width: 689px; width: 100%; }

/*--------------------------------------------*/
/* ========= SECTION - FORM ========= */
.FORM form { margin: 0 0 16px 0; }
.FORM .FORM__input { width: 100%; background-color: var(--color__fff); color: var(--color__000); border: 3px solid #ccc; padding: 18px 20px; font-size: 28px; line-height: 1.6; }
.FORM .FORM__input::placeholder { color: var(--color__000); opacity: .6; }
.FORM .FORM__actions { display: flex; gap: 20px; justify-content: flex-end; }
.FORM p.btn a { display: inline-block; background-color: var(--color__gray); font-size: 20px; border: 1px solid var(--color__fff); padding: 10px 10px 7px 10px; color: var(--color__fff); text-decoration: none; line-height: 1; }

/*--------------------------------------------*/
/* ========= SECTION - LOG ========= */
.LOG div   { width: 660px; height: 308px; overflow-y: scroll; border: 4px solid var(--color__fff); padding: 14px; }
.LOG div p { margin-bottom: 10px; font-size: 20px; }
.LOG div:not:last-of-type { margin-bottom: 0px; }
/*--------------------------------------------*/
/* ========= SECTION - NOTE ========= */

.NOTE           { height: 510px; }
.NOTE textarea  { resize: none; width: 100%; height: 100%; overflow-y: scroll; border: 4px solid var(--color__fff); font-size: 2em; }

/*--------------------------------------------*/
/* ========= FOOTER ========= */
footer { display: block; clear: both; margin: 0 auto; max-width: 1920px; width: 100%; position: relative; padding: 50px; }
footer p { text-align: center; }

/*--------------------------------------------*/
/* ELEMENTS ///////////////////////////////////*/
/* ========= Fullscreen Notice ========= */
.fsNotice { position: fixed; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; background-color: rgba(17, 17, 17, .96); border-top: 3px solid var(--color__primary_green); color: var(--color__fff); z-index: 1000; }
.fsNotice__text { font-size: 16px; line-height: 1.4; margin: 0; }
.fsNotice__actions { display: flex; align-items: center; gap: 10px; }
.btn_fs { display: inline-block; padding: 10px 14px 8px 14px; border: 1px solid var(--color__fff); color: var(--color__000); background-color: var(--color__fff); font-size: 14px; line-height: 1; text-decoration: none; }
.btn_fs__ghost { background-color: transparent; color: var(--color__fff); border-color: var(--color__fff); }
.fsNotice.is-hidden { display: none; }

/*--------------------------------------------*/
/* ========= RESPONSIVE ========= */

@media screen and (max-width:1280px) {
}

@media (max-width:768px) {
  .sp { display:inline-block; }
  .pc { display:none; }
}