@charset "utf-8";

div#HEADER div ol li a.WORKS::before	{ border-color:#000; }

/* ---------- overwrite style.css ---------- */
div.OBJ span.GIMG				{ margin-right:10px; }
ol.PAGENAVI				{ display:none; }

/* ---------- WORKS INDEX ---------- */
ol#WORKS_INDEX				{ display:inline-block; height:auto; margin:0 auto; padding:0; text-align:left; }
ol#WORKS_INDEX li				{ position:relative; display:inline-block; width:calc(30vh + 0); max-width:calc(50vw - 20px); height:auto; margin:0 5px 5px 0; padding:0; }
ol#WORKS_INDEX li a				{ position:relative; display:inline-block; width:30vh; max-width:100%; height:50vh; max-height:100%; margin:0; padding:0; }
ol#WORKS_INDEX li a:link			{ color:#fff; }
ol#WORKS_INDEX li a:visited			{ color:#fff; }
ol#WORKS_INDEX li a:hover			{ color:#fff; }
ol#WORKS_INDEX li a:active			{ color:#fff; }
ol#WORKS_INDEX li a span.GIMG			{ height:100%; max-height:50vh; overflow:hidden; margin:0 0 0 0; padding:0 0 0 0; background:transparent; }
ol#WORKS_INDEX li a span.GIMG span		{ transition:0.8s all; transform:scale(1.00); }
ol#WORKS_INDEX li a:hover span.GIMG span	{ filter:brightness(50%); transform:scale(1.02); }
ol#WORKS_INDEX li a span.GIMG img		{ margin:0; }
ol#WORKS_INDEX li a span.TITLE		{ position:absolute; z-index:2; top:0; left:0; display:inline-block; width:100%; height:100%; margin:0; padding:15px 15px 0 15px; overflow:hidden; background:rgba(0,0,0,0) 50% 50% no-repeat; filter:opacity(0.2); }
ol#WORKS_INDEX li a span.TITLE		{ transition:filter 0.4s ease-in-out 0s; }
ol#WORKS_INDEX li a:hover span.TITLE		{ filter:opacity(1); } 
ol#WORKS_INDEX li a span.TITLE strong		{ display:inline-block; width:100%; height:auto; margin:0 0 10px 0; padding:0; font-size:18px; line-height:1.5; letter-spacing:0; }
ol#WORKS_INDEX li a span.TITLE span		{ display:inline-block; width:100%; height:auto; margin:0 0 10px 0; padding:0; font-size:14px; line-height:1.5; }
ol#WORKS_INDEX li.NOENTRIES			{ width:400px; max-width:none; height:200px; }
ol#WORKS_INDEX li.NOENTRIES strong		{ font-size:18px; }
ol#WORKS_INDEX li.NOENTRIES a			{ width:auto; height:auto; }
ol#WORKS_INDEX li.NOENTRIES a:link		{ color:#a00; }
ol#WORKS_INDEX li.NOENTRIES a:visited		{ color:#a00; }
ol#WORKS_INDEX li.NOENTRIES a:hover		{ color:#f00; }
ol#WORKS_INDEX li.NOENTRIES a:active		{ color:#f00; }

/* ---------- TXT ---------- */
div#JSS div.OBJ div.TXT		{ width:600px; max-width:calc(100vw - 30px); height:auto; overflow-y:auto; margin:0 auto; padding:25px 15px 25px 15px; background:#fafafa;  }
div#JSS div.OBJ div.TXT h2		{ margin-top:0; }
dl.WORKS_DATA			{ margin:25px auto 50px auto; padding:25px 0 0 0; color:rgba(0,0,0,0.6); border-top:1px solid #ddd; font-size:14px; line-height:18px; letter-spacing:0.05em; text-align:left;  }
dl.WORKS_DATA dt			{ display:inline-block; width:auto; color:#000; padding:0; text-align:right; font-size:13px; line-height:20px; letter-spacing:0; text-align:left; vertical-align:middle; }
dl.WORKS_DATA dd			{ display:inline; width:auto; padding:0; margin-left:15px; vertical-align:middle; }
dl.WORKS_DATA dd::after		{ content:""; display:inline-block; width:100%; height:3px; margin:0; }


/* ---------- JSS ---------- */
div#JSS				{ position:relative; display:block; width:calc(100% - 30px); max-width:960px; overflow:visible; }
div#JSS div.OBJ			{ position:relative; display:block; overflow:visible; }



/* ------------------------------- JSS FACTORS ------------------------------- */
div.JSS_BOX				{ position:absolute; display:block; bottom:0; right:0; width:25px; height:25px; margin:0 0 0 0; padding:0 0 0 0; background:transparent 50% 50% repeat scroll; font-size:9px; line-height:10px; }
div.JSS_BOX::before				{ content:""; display:inline-block; width:1px; height:25px; margin:0 0 0 -1px; vertical-align:middle; }
div.JSS_BOX::after				{ content:""; display:inline-block; width:100%; height:1px; margin:0; background:#ddd; vertical-align:middle;}
div.JSS_BAR				{ position:absolute; z-index:50; bottom:0; left:auto; width:25px; height:25px; margin:0; padding:0; background-color:transparent; font-size:9px; line-height:10px; }
div.JSS_BAR::before				{ content:""; display:inline-block; width:1px; height:25px; margin:0 0 0 -1px; vertical-align:middle; }
div.JSS_BAR::after				{ content:""; display:inline-block; width:100%; height:3px; margin:0; background:#000; vertical-align:middle; border-radius:2px; }
a.JSS_UP					{ position:absolute; bottom:0; right:25px; display:block; width:25px; height:25px; margin:0 0 0 0; text-indent:-9999px; background:transparent url(/com/img/symbol.svg) 50% 25% no-repeat; background-size:25px 525px; }
a.JSS_UP					{ transition:filter 0.4s ease-in-out 0s; }
a.JSS_UP:link				{ filter:invert(0.8); }
a.JSS_UP:visited				{ filter:invert(0.8); }
a.JSS_UP:hover				{ filter:invert(0.0); }
a.JSS_UP:active				{ filter:invert(0.0); }
a.JSS_DN					{ position:absolute; bottom:0; right:0; display:block; width:25px; height:25px; margin:0 0 0 0; text-indent:-9999px; background:transparent url(/com/img/symbol.svg) 50% 20% scroll no-repeat; background-size:25px 525px; }
a.JSS_DN					{ transition:filter 0.4s ease-in-out 0s; }
a.JSS_DN:link				{ filter:invert(0.8); }
a.JSS_DN:visited				{ filter:invert(0.8); }
a.JSS_DN:hover				{ filter:invert(0.0); }
a.JSS_DN:active				{ filter:invert(0.0); }
div#JSS div.OBJ div.JSS_PAGETOP		{ display:inline-block; width:30vh; min-width:300px; height:100%; margin:0 -50px 0 0; padding:0 0 0 0; text-align:left; }
div#JSS div.OBJ div.JSS_PAGETOP::before		{ content:""; display:inline-block; width:1px; height:100%; margin:0 0 0 -1px; vertical-align:middle; }
div#JSS div.OBJ div.JSS_PAGETOP a		{ display:inline-block; width:75px; height:50px; margin:0 auto 0 0; padding:0; background:url(/com/img/symbol.svg) 0% 25% no-repeat scroll; background-size:50px 1050px; color:#000; font-size:16px; letter-spacing:0; text-align:left; text-indent:-9999em; }
div#JSS div.OBJ div.JSS_PAGETOP a		{ transition:filter 0.4s ease-in-out 0s, color 0.4s ease-in-out 0s; }
div#JSS div.OBJ div.JSS_PAGETOP a::before	{ content:""; display:inline-block; width:1px; height:100%; margin:0 -1px 0 0; vertical-align:middle; }
div#JSS div.OBJ div.JSS_PAGETOP a:link		{ filter:invert(0.8); }
div#JSS div.OBJ div.JSS_PAGETOP a:visited	{ filter:invert(0.8); }
div#JSS div.OBJ div.JSS_PAGETOP a:hover		{ filter:invert(0.0); }
div#JSS div.OBJ div.JSS_PAGETOP a:active	{ filter:invert(0.0); }

div#JSS div.OBJ div.JSS_PAGETOP a.NEXT		{ position:absolute; top:50%; right:0; display:inline-block; width:auto; max-width:200px; height:50px; margin:-23px auto 0 0; padding:0 0 0 0; background:transparent; color:#000; font-size:12px; font-weight:bold; line-height:15px; letter-spacing:0; text-align:right; text-indent:0; }
div#JSS div.OBJ div.JSS_PAGETOP a.NEXT::after	{ content:""; position:static; display:inline-block; width:50px; height:50px; margin:-2px 0 0 2px; padding:0 0 0 0; background:url(/com/img/symbol.svg) 100% 0% no-repeat scroll; background-size:50px 1050px; vertical-align:middle; }
div#JSS div.OBJ div.JSS_PAGETOP a.NEXT:link	{ color:#eee; filter:invert(0); }
div#JSS div.OBJ div.JSS_PAGETOP a.NEXT:visited	{ color:#eee; filter:invert(0); }
div#JSS div.OBJ div.JSS_PAGETOP a.NEXT:hover	{ color:#000; filter:invert(0); }
div#JSS div.OBJ div.JSS_PAGETOP a.NEXT:active	{ color:#000; filter:invert(0); }