@font-face {font-family:'Noto Serif JP';src: local('Noto Serif JP'),url('../_alt/NotoSerifJP.woff2') format('woff2'),url('../_alt/NotoSerifJP.woff') format('woff');}
@font-face {font-family:'boku2';src:url('../_alt/Boku2.woff2') format('woff2'),url('../_alt/Boku2.woff') format('woff'),url('../_alt/boku2.eot') format('eot');}

body {scrollbar-width:none;-ms-overflow-style: none;color:white;}
body::-webkit-scrollbar {display:none;} /* スクロールバー消す(Firefoxだと2重に表示されるから) スクロールは可能 */
body {overflow-y: auto;overflow-x: hidden;width:640px;height:100%;margin-top:9px;margin-left:5px;background: rgba(25,20,15,1);}
a {text-decoration: none;}
a.underline:hover {text-decoration: underline;}
b {font-weight: bold;}
small {font-size:14px;color:#444;line-height:0.6em;
}
.l3 small {font-size:14px;color:#444;line-height:1.6em;
}

small a:link {color:#777;
} 
small a:visited {color:#744;
}
small a:hover {color:#F00;
}
pre {font-family:'boku2','Noto Serif JP', serif;margin-top:-13px;margin-left:15px;font-size:16px;line-height:1.1em;}
h1 {font-size:24px;}
dt,dd,h2,h3,h4 { display: inline;font-size:16px; }
i {font-style:oblique;}
.doubleline {background-image:url("../_img/doubleLine_orange.png");background-repeat:repeat-x;background-position: center;}/* 二重取り消し線 */
.border img {position:fixed;top:503px;left:-6px;z-index:23;}
form {margin-bottom:0;}

/*
//4 .btn2 blue / btn3 skill / btn4 tab
*/
button {font-size:20px;margin-top:5px;border-radius:15px;padding: 6px;font-family: 'Noto Serif JP','boku2', serif;cursor: pointer!important;}
button.btn {line-height:inherit;}
button.btn:hover {font-size:36px;color:#FFF;
}

button.btn2,
input.btn2 {
background-color:#06c;
border-color:#06c;
color:#fff;
font-size:16px;
height:auto;width:auto;
border-radius: 0.5rem;
box-shadow: 0px 0px 15px -1px #5583b4;
outline:none;
user-select:none;
display:inline-flex;
align-items:center;
justify-content:center;
font-family:inherit;
line-height:inherit;
text-decoration:none;
cursor:pointer;
margin-top:12px;
padding:6px;
}

.btn2 a:link {color:#fff;
}
.btn2 a:visited {color:#fff;
}
.btn2:hover {
color:#F46;
box-shadow:
10px 10px 30px transparent,
-5px -5px 30px transparent,
inset 10px 10px 30px rgba(5,51,100, 0.3),
inset -5px -5px 30px rgba(85,131,180, 0.8);
}

.btn2disabled {
background-color:#444;
border-color:#444;
color:#888;
font-size:16px;
height:auto;
width:auto;
border-radius: 0.5rem;
box-shadow: 0px 0px 15px -1px #555;
outline:none;
user-select:none;
display:inline-flex;
align-items:center;
justify-content:center;
font-family:inherit;
line-height:inherit;
text-decoration:none;
cursor:inherit;
margin-top:11px;
padding:6px;
}

a.btn2 {
    background-color: #06c;
    border: 1px solid #06c;
    color: #fff;
    font-size: 16px;
    height: auto;
    width: auto;
    border-radius: 0.5rem;
    box-shadow: 0px 0px 15px -1px #5583b4;
    outline: none;
    user-select: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: inherit;
    line-height: inherit;
    text-decoration: none;
    cursor: pointer;
    margin-top: 12px;
    padding: 6px;
}

a.btn2:link {color:#ffffff!important;
}
a.btn2:visited {color:#ffffff!important;
}
a.btn2:hover {
    color: #F46;
    box-shadow:
    10px 10px 30px transparent,
    -5px -5px 30px transparent,
    inset 10px 10px 30px rgba(5, 51, 100, 0.3),
    inset -5px -5px 30px rgba(85, 131, 180, 0.8);
}

a.btn2:disabled,
a.btn2.disabled {
    background-color: #444;
    border: 1px solid #444;
    color: #888!important;
    box-shadow: 0px 0px 15px -1px #555;
    cursor: not-allowed!important;
    padding: 7px;
}

a.btn2:disabled l,
a.btn2.disabled l {
    cursor: not-allowed!important;
    color: #888!important;
}
.btn2r {
background-color:#06c;
border-color:#06c;
color:#fff;
font-size:18px;
height:auto;width:auto;
border-radius: 0.5rem;
box-shadow: 0px 0px 15px -1px #5583b4;
outline:none;
user-select:none;
text-decoration:none;
cursor:pointer;
padding:6px;
cursor:pointer; position: absolute;top: 5px;right: 5px;
}

a.btn3 {
  width:130px; height:34px;
  font-size:18px;
  color:#000!important;
  border-width:1px;
  display: inline-block;
  padding: 5px;
  cursor: pointer;
  text-align: center;
  border-radius: 40px;
  line-height:1.7em;
  background-color:#999;
}

a.btn3:disabled,
a.btn3.disabled,
a.btn3:disabled l,
a.btn3.disabled l {
    cursor: not-allowed!important;
    color: #000!important;
}
a.btn3:hover {
    box-shadow:
    10px 10px 30px transparent,
    -5px -5px 30px transparent,
    inset 10px 10px 30px rgba(225, 51, 100, 0.3),
    inset -5px -5px 30px rgba(85, 131, 180, 0.8);
}

a.btn4,input.btn4 {
    padding: 10px 20px;
    background-color: #007bff;
    border: none;
    border-radius: 25px;
    color: white;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
	font-weight: bold;
	margin-right:4px;
}

a.btn4.small,input.btn4.small {
    padding: 5px 15px;
    font-size: 14px;
}

a.btn4:disabled, input.btn4:disabled {
    background-color: #6c757d;
    color: #ced4da;
    cursor: not-allowed;
}

a.btn4.follow, input.btn4.follow {
    background-color: #343a40;
    color: white;
}

a.btn4:hover:not(:disabled), input.btn4:hover:not(:disabled) {
    opacity: 0.70!important;
}

a.btn4.follow:hover:not(:disabled), input.btn4.follow:hover:not(:disabled) {
    background-color: #23272b;
}

a.btn4.small:hover:not(:disabled), input.btn4.small:hover:not(:disabled) {
    background-color: #0056b3;
    color: white;
}


.weparm td {color:#FFFFFF!important;text-align: center!important;
}

.bac {background: rgba(50,30,90,0.4);}
.del2id {margin-top:5px;width:20px;height:20px;}


#fav-table table {border-collapse: collapse;width: 612px;}
#fav-table th, #fav-table td {font-size:15px;}

.mainview {width:638px;height:440px;left:6px;	top:88px;position:fixed;z-index:10;}
.mainview2 {width:638px;height:755px;left:6px;	top:10px;position:fixed;border-radius: 12px;z-index:21;font-family: 'boku2','Noto Serif JP', serif;}
.mainview3 {width:620px;			left:6px;	top:10px;position:absolute;border-radius: 12px;z-index:22;background: rgba(25,20,15,0);color:#CCC;font-family: 'boku2','Noto Serif JP', serif;}
.mainview4 {width:590px;			left:24px;	top:24px;position:absolute;border-radius: 12px;z-index:22;background: rgba(25,20,15,0);color:#CCC;font-family: 'boku2','Noto Serif JP', serif;color: #FFF;}
.mainviewH {width:100px;height:60px;margin-left:530px;margin-top:400px;margin-bottom:0;cursor:pointer;position:absolute;z-index:14;opacity:0.7;}
.mainviewS {left:585px;top:100px;cursor:pointer;position:fixed;z-index:15;}
.mainviewBI {width:636px;height:440px;left:0px;	top:88px;position:fixed;object-fit: cover;object-position: 50% 70%;border-radius: 12px;z-index:9;}
.mainviewMN {font-family: 'boku2','Noto Serif JP', serif;font-size:20px;left:0px;top:88px;
position:fixed;	border-radius: 12px 0 12px 0;
padding:3px 0px 8px 9px;
z-index:13;background: rgba(130,130,255,0.8);}
.mainviewMAP {font-family: 'boku2','Noto Serif JP', serif;font-size:16px;left:2px;top:135px;position:fixed;width:610px;border-radius: 12px;padding:10px;display:none;z-index:513;background: rgba(250,190,160,0.95);color:#333;}
.mainviewMN2 {font-family: 'boku2','Noto Serif JP', serif;font-size:16px;border-radius: 12px;margin-top:394px;margin-right:4px;margin-left:6px;padding:6px;position:absolute;z-index:13;background: rgba(130,130,255,0.8);}
#infochange {color:#DDD;z-index:12;}
.奉公画像 {position:absolute;height:370px;margin-left:0;margin-top:70px;margin-bottom:0;z-index:11;}
.奉公セリフ {position:relative;top:310px;left:170px;width:430px;padding:10px;
font-family: 'boku2','Noto Serif JP', serif;font-size:16px;color:#161412;
border-radius: 12px;z-index:13;
background: rgba(150,150,255,0.8);
box-shadow: 3px 2px 0px 0px #7070FF;
height:auto;transform: perspective(1000px) rotateX(20deg);}
.奉公セリフ:before {position: absolute;bottom: 99%;left: 30px;transform: skew(40deg);height: 9px;width: 8px;background-color: #9696ff;border-right: 3px solid #7070FF;content:"";}
.奉公セリフ a:link {color:#161412;
} 
.奉公セリフ a:visited {color:#161412;
}
.奉公セリフ a:hover {color:#F46;
}
.mainviewHR {position:relative;top:-14px;left:-11px;margin-bottom:-2px;z-index:18;}

.mainviewPL {
font-family: 'Noto Serif JP', serif;
font-size:16px;
color:#FFF;
margin-top:10px;margin-left:8px;padding:6px;
height:715px;
width:600px;
position:absolute;
overflow-y: scroll;
overflow-x: hidden;
z-index:13;background: rgba(50,30,90,0.6);border-radius: 12px;
}
.mainviewPL a:link {color:#FFF;
} 
.mainviewPL a:visited {color:#FFF;
}
.mainviewPL a:hover {color:#FF0;background: rgba(50,30,90,0.9);
}
.mainview3 a:link {color:#996;
} 
.mainview3 a:visited {color:#9C6;
}
.ml {margin-left: 13px !important;}

.down {
width:632px;height:260px;
left:1px;top:525px;position:fixed;
border: 1px solid #666;
border-radius: 12px;
background-image: url("../_img/aum-back_4.gif");
position:absolute;
z-index:12;
font-family:'boku2','Noto Serif JP', serif;font-size:16px;
}
.down td {color:#222222;
}
.down a:link {color:#909060;
}
.down a:visited {color:#90C060;
}
.down a:hover {color:#c000e0;
}
.down p {margin-top: 14px;margin-left: 10px;line-height:1.3em;font-size:16px;color:#000;width:100%;z-index:10;
}
p {margin-top: 5px;margin-left: 6px;line-height:1.3em;font-size:16px;color:#000;
}


#mainText,#my_parameter {font-size:16px;width:630px;padding:4px;padding-top:2px;margin-top:-19px;margin-left:6px;color:#222222;}
#mainText a:link {color:#222222;}
#mainText a:visited {color:#000000;}
#mainText a:hover {color:#c000e0;}
#my_parameter a:link {color:#909060;} 
#my_parameter a:visited {color:#90C060;}
#my_parameter a:hover {color:#c000e0;}

.downchat {margin-top:-1px;font-family: 'boku2','Noto Serif JP', serif;font-size:16px;color:#DDD;position:absolute;z-index:21;
}
.downchat a:link {color:#909060;
} 
.downchat a:visited {color:#90C060;
}
.downchat a:hover {color:#c000e0;
}

.downchatlink {
font-family: 'boku2','Noto Serif JP', serif;
font-size:18px;
z-index:30;
position: fixed;
left: 390px;
bottom: 30px;
white-space: nowrap;
}

.g_navi2 {
position:fixed;
top:10px;left:500px;
z-index:30;
}
.g_navi2b {
position:fixed;
bottom:25px;left:500px;
z-index:100001;
}
.g_navi3 {
position:fixed;
top:40px;left:600px;
z-index:30;
}

#downchat 
{
    position: fixed;
    display: inline-block;
    top: 1px;
    height: 98vh;
    width: 1060px;
    padding: 4px;
    margin-left: 637px;
    background: rgba(25,20,15,0.8) !important;
/*    background: rgba(22,24,36,0.5); */

    border-radius: 14px;
    transition: .15s ease-in-out;
    z-index:21;
    word-wrap: break-word;
}
@media screen and (max-width: 1470px) {
#downchat 
{
    position: fixed;
    display: inline-block;
    top: 790px;
    margin-left:-2px;
    width: 624px;
    padding: 4px;
    height: 98vh;
    background: rgba(22,24,36);
    border-radius: 14px;
    z-index:21;
    word-wrap: break-word;
    }
}
#downchat2 
{
    position: fixed;
    display: inline-block;
    top: 6px;
    height: 98vh;
    width: 1260px;
    padding: 4px;
    margin-left: 637px;
    background: rgba(22,24,36,0.5);
    border-radius: 14px;
    transition: .15s ease-in-out;
    color:#CDCDCD;
    z-index:21;
    word-wrap: break-word;
}
@media screen and (max-width: 1470px) {
#downchat2 
{
    position: fixed;
    display: inline-block;
    top: 0px;
    margin-left:-3px;
    width: 632px;
    padding: 4px;
    height: 98vh;
    background: rgba(22,24,36);
    border-radius: 11px;
    color:#CDCDCD;
    z-index:21;
    word-wrap: break-word;
    }
}

#my_parameter { color:#000; }
#my_parameter a:link { color:#000; }
#my_parameter a:visited { color:#000; }
#my_parameter a:hover { color:purple; }

.f30,f30 {font-size:30px!important;}
.f28,f28 {font-size:28px!important;}
.f26,f26 {font-size:26px!important;}
.f24,f24 {font-size:24px!important;}
.f22,f22 {font-size:22px!important;}
.f20,f20 {font-size:20px!important;}
.f18,f18 {font-size:18px!important;}l
.f16,f16 {font-size:16px!important;}
.f14,f14 {font-size:14px!important;}
.f12,f12 {font-size:12px!important;}
.f10,f10 {font-size:10px!important;}
.f8,f8 {font-size:8px!important;}

.noselect {
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer */
-khtml-user-select: none; /* KHTML browsers (e.g. Konqueror) */
-webkit-user-select: none; /* Chrome, Safari, and Opera */
-webkit-touch-callout: none; /* Disable Android and iOS callouts */
}

.non {
font-family:'boku2','Noto Serif JP', serif;
font-size:16px;color:#000000;line-height:1.2em;
display:none;
position:fixed;
top:50px;left:8px;width:598px;z-index:17;
margin-top:3px;
padding: 6px;
border: 1px solid #555;
-webkit-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0px 1px 10px #488a9e;
box-shadow: 0px 1px 10px #488a9e;
border: solid #4eb4c2 1px;
background: #B7CACA;
}
/*
//4 .cen
*/

.right {text-align: right;}
.cen {text-align: center;margin-right:auto;margin-left:auto;}
.left {text-align: left;}

/*
//4 色
*/
white,.white {color:#eee!important;
}
.white a:link {color:#eee!important;
} 
.white a:visited {color:#eee!important;
}
.white a:hover { color:#FAF!important; 
}
/*text-decoration: underline;*/



black,.black {color:#000!important;
}
black a:link {color:#000!important;
}
black a:visited {color:#000!important;
}
.black a:link {color:#000!important;
}
.black a:visited {color:#000!important;
}
.black a:hover { color:#F00!important;
}

gray,g,.g,.gray {color:#778;
}
red,r,.red,.ア,r0 {color:#f00;
}/*メガ*/
aqua,.aqua,.デ {color:aqua;}/*近*/
lime,.lime,.タ {color:lime;}/*中*/
yellow,.yellow,.ス,y,.y {color:#ff0;
}/*遠*/
b0{color:#00F;
}
y0{color:#BB0;
}
blue,.blue {color:#00f;
}
skyblue,.skyblue {color:skyblue;}
green,.green {color:green;}
purple,.purple {color:purple;}
pink,.pink {color:pink;}

xc,xc0,xc1,xc2,xc3,xc4 {color:#fff;
}
xc5,xc6 {color:aqua;}
xc7,xc8,xc9 {color:#C6F;
}
xc10,xc11,xc12,xc13 {color:pink;}
xc14,xc15,xc16,xc17,xc18,xc19 {color:red;}
xc20 {color:#0A0;
}

.vs_red {background-color:red!important;color:#FFFFFF!important;
}
.vs_pink {background-color:pink!important;color:#000000!important;
}
.vs_yellow {background-color:yellow!important;color:#000000!important;
}
.vs_gray {background-color:#666666!important;color:#FFFFFF!important;
}
.vs_blue {background-color:blue!important;color:#FFFFFF!important;
}
.vs_aqua {background-color:aqua!important;color:#000000!important;
}
.vs_orange {background-color:orange!important;color:#000000!important;
}
.blo {width:22px;height:22px;right:2px;float:right;} 

span[guide]:before {
	content: attr(guide)"";
    position: absolute;
    top: -1px;
    right: -4px;
    z-index: 26;;
    font-size: 11px;
    width: 13px;height: 13px;
    padding: 2px;
    text-align: center;
    display: inline-block;
    color: #fff;
    background-color: #f00;
    border: 1px solid #fff;
    border-radius: 50%;
    box-shadow: 0px 0px 2px #999;
    line-height: 1;
    min-width: 1em;
	}


/*
//4 金銀ボタン
*/
*,*:before,*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}
.btn {z-index:25;}
.btn,a.btn,button.btn {
  width:121px; height:36px;
  border-width:1px;
  display: inline-block;
  padding: 1px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color:#212529;
  border-radius: 0.5rem;
}
.btn-border-gradient-wrap {
  display: inline-block;
  padding: 0.12rem;
  border-radius: 0.5rem;
  position: relative;
}
.btn-border-gradient {
  font-size:1.23rem;
  background: #000;
}
.btn-border-gradient-wrap--gold,
.btn-border-gradient-wrap--gold l {
  background-image: -webkit-linear-gradient(
    315deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
  background-image: linear-gradient(
    135deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
}
.btn-border-gradient-wrap--gold:hover a.btn {
  text-shadow: 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5), 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5);
}
.btn-text-gradient--gold,
.btn-text-gradient--gold l {
  font-family: "ＭＳ Ｐ明朝",  serif;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#ffffdb),
    to(#a16422)
  );
  background: -webkit-linear-gradient(bottom, #ffffdb, #a16422);
  background: linear-gradient(to top, #ffffdb, #a16422);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent;
}
.btn-text-gradient--silver,
.btn-text-gradient--silver l {
  font-family: "ＭＳ Ｐ明朝",  serif;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#ffffdb),
    to(#a16422)
  );
  background: -webkit-linear-gradient(bottom, #ffffdb, #a16422);
  background: linear-gradient(to top, #ffffdb, #a16422);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent;
}
.btn-border-gradient-wrap--silver,
.btn-border-gradient-wrap--silver l {
  background-image: -webkit-linear-gradient(
    315deg,
    #333 0%,
    #868888 20%,
    #d8dcdc 34%,
    #999a9c 35%,
    #cccdce 43%,
    white 53%,
    #d1d6d7 68%,
    #9b9d9f 84%,
    #666 100%
  );
  background-image: linear-gradient(
    135deg,
    #333 0%,
    #868888 20%,
    #d8dcdc 34%,
    #999a9c 35%,
    #cccdce 43%,
    white 53%,
    #d1d6d7 68%,
    #9b9d9f 84%,
    #666 100%
  );
}
.btn-text-gradient--silver {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#fff),
    to(#999)
  );
  background: -webkit-linear-gradient(bottom, #fff, #999);
  background: linear-gradient(to top, #fff, #999);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent;
}
.btn-border-gradient-wrap--silver:hover a.btn {
  text-shadow: 0 0 15px rgba(209, 214, 215, 0.5),
    0 0 15px rgba(209, 214, 215, 0.5), 0 0 15px rgba(209, 214, 215, 0.5),
    0 0 15px rgba(209, 214, 215, 0.5);
}
.btn-text-gradient--pink,.btn-text-gradient--pink l {
  font-family: "ＭＳ Ｐ明朝",  serif;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#EE44CC),
    to(#E040C0)
  );
  background: -webkit-linear-gradient(bottom, #EE44CC, #E040C0);
  background: linear-gradient(to top, #EE44CC, #E040C0);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent;
}
.btn-text-gradient--blue,.btn-text-gradient--blue l {
  font-family: "ＭＳ Ｐ明朝",  serif;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#90B0F0),
    to(#9DB8FC)
  );
  background: -webkit-linear-gradient(bottom, #90B0F0, #9DB8FC);
  background: linear-gradient(to top, #90B0F0, #9DB8FC);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent;
}

/*
//4 lity 
*/
.lity{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;white-space:nowrap;background:rgba(60, 60, 60,0.6);outline:none ;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;}
.lity.lity-opened{opacity:1;}
.lity.lity-closed{opacity:0;}
.lity *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.lity-wrap{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;text-align:center;outline:none;}
.lity-wrap:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em;}
.lity-loader{z-index:9991;position:absolute;top:50%;margin-top:-0.8em;width:100%;text-align:center;font-size:14px;font-family:Arial,Helvetica,sans-serif;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;color:#fff;
}
.lity-loading .lity-loader{opacity:1}
.lity-container{z-index:9992;position:relative;text-align:left;vertical-align:middle;display:inline-block;white-space:normal;max-width:100%;max-height:100%;outline:none;}
.lity-content{z-index:9993;width:100%;-webkit-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;-o-transition:-o-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease, -o-transform .3s ease;}
.lity-loading .lity-content,.lity-closed .lity-content{-webkit-transform:scale(.8);-ms-transform:scale(.8);-o-transform:scale(.8);transform:scale(.8);}
.lity-content:after{content:'';position:absolute;left:0;top:0;bottom:0;display:block;right:0;width:auto;height:auto;z-index:-1;}
.lity-close{z-index:9994;width:50px;height:50px;position:fixed;right:10px;top:0;-webkit-appearance:none;cursor:pointer;text-decoration:none;text-align:center;padding:0;font-style:normal;font-size:50px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(0,0,0);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none;color:#fff;
}
.lity-close::-moz-focus-inner{border:0;padding:0}
.lity-close:hover,.lity-close:focus,.lity-close:active,.lity-close:visited{text-decoration:none;text-align:center;padding:0;font-style:normal;font-size:50px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(250,0,0);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none;color:#fff;
}
.lity-close:active{top:1px;}
.lity-image img{max-width:100%;display:block;line-height:0;border:0;}
.lity-iframe .lity-container,.lity-youtube .lity-container,.lity-vimeo .lity-container,.lity-facebookvideo .lity-container,.lity-googlemaps .lity-container{width:100%;max-width:100%;}

.lity-iframe-container{width:643px;height:92vh;overflow-y: auto;overflow-x: hidden;pointer-events:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch;}
.lity-iframe-container2{width:100%;height:60vh;overflow:auto;pointer-events:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch}
.lity-iframe-container iframe{position:absolute;display:block;top:0;left:0;width:643px;height:92vh;-webkit-box-shadow:0 0 8px rgba(0,0,0);box-shadow:0 0 8px rgba(0,0,0);background:#000;
}
.lity-hide{display:none;}
.lity-pu2 .lity-container {width: auto;height: 50%;}
.lity-pu3 .lity-container {width: 400px;height: 400px;}
.lity-pu4 .lity-container {width: 200px;height: 600px;}


.notb td {border:0px !important;color :#fff;
}
.testtd td {border:1px solid #600 !important;color :#fff;
}
/*
//4 tablesorter / td
*/
.tablesorter-default th,
.tablesorter-default thead td {border-bottom:#000 5px solid;padding:0;
}

.tablesorter-default .header,
.tablesorter-default .tablesorter-header {background-image:url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
 background-position:center right;background-repeat:no-repeat;cursor:pointer;white-space:normal;padding:4px 20px 4px 4px}

.tablesorter-default thead .headerSortUp,.tablesorter-default thead .tablesorter-headerAsc,.tablesorter-default thead .tablesorter-headerSortUp
{background-image:url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);border-bottom:#f00 5px solid;opacity:0.8;
}

.tablesorter-default thead .headerSortDown,.tablesorter-default thead .tablesorter-headerDesc,.tablesorter-default thead .tablesorter-headerSortDown
{background-image:url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);border-bottom:#7fff7f 5px solid;opacity:0.8;
}

.tablesorter td {border-right-style: none;border-left-style: none;color:#DDD;background: rgba(25,20,15,1);
}
.tablesorter a {text-decoration: none;color:#DD9;
}

table.tablesorter {margin-left:-7px;border-collapse: collapse;width: 615px!important;}
thead th {border: 1px solid #ccc;padding: 4px;text-align: left;color:#449;
}
tbody td {border: 1px solid #ccc;text-align: left;color:#449;
}
th.sortable-header {background-color: #c0e3fc;cursor: pointer;position: relative;
}

#PCwin td {color:#eee;}
/*
//4 img 画像表示用
*/
img.r10 {border-radius:10%;}
.img  {border-radius:20px;margin:4px;max-width:440px;box-shadow: 7px 3px 15px -3px #5583b4;
}
.img29  {width:32px;height:32px;margin-left:1px;margin-right:3px;margin-bottom:-12px;}
.img50  {object-fit: cover;object-position: 50% 25%;width:50px;height:50px;border-radius:50%;z-index:30;}
.img50v  {object-fit: cover;object-position: 50% 25%;width:50px;height:50px;border-radius:50%;z-index:30;margin-top:-7px;margin-bottom:-14px;}

.img77  {width:60px;height:60px;margin-bottom:2px;margin-right:4px;margin-left:4px;border-radius:15%;z-index:31;border: 2px dotted #565;cursor: pointer;
}/* 未建設 */
.img77c {width:62px;height:62px;margin-bottom:2px;margin-right:4px;margin-left:4px;border-radius:15%;z-index:31;cursor: pointer; background: repeating-linear-gradient(-45deg, #aa9, #998 5px, #aab 5px, #aab 10px);border: 1px dotted #565;
}/* 未開放 */
.img77b {width:60px;height:60px;margin-bottom:2px;margin-right:4px;border-radius:15%;z-index:31;background: repeating-linear-gradient(-45deg, #aa9, #a99 5px, #aab 5px, #aab 10px);border: 1px solid #565;
}/* 地区限界 */
.img77o {object-fit: cover;object-position: 50% 50%;width:70px;height:70px;border-radius:15%;z-index:31;margin-left:2px;margin-right:3px;cursor: pointer;}/* 施設 */

.img80  {object-fit: cover;object-position: 50% 25%;width:80px;height:80px;border-radius:50%;z-index:31;filter: brightness(80%);margin:0;}/* 丸80 */
.img80:hover {transition: filter 0.3s ease;filter: brightness(110%);}
.img92  {object-fit: cover;object-position: 50% 20%;width:92px;height:92px;border-radius:15%;z-index:31;margin-right:3px;}/* 四角92 */
.sp92 {width:92px;height:92px;margin-right:-92px;position: absolute;z-index:32;margin-right:3px;}
.img98  {object-fit: cover;object-position: 50% 25%;width:98px;height:98px;border-radius:50%;z-index:30;}/* 丸98 50-25 */
.img98x  {object-fit: cover;object-position: 50% 50%;width:98px;height:98px;border-radius:50%;z-index:30;}/* 丸98 50 */
.img120 {object-fit: cover;object-position: 50% 25%;width:120px;height:120px;border-radius:50%;z-index:30;filter: brightness(80%);}
.img120:hover {transition: filter 0.3s ease;filter: brightness(110%);}
.img140 {object-fit: cover;object-position: 50% 25%;width:140px;height:140px;border-radius:50%;z-index:30;filter: brightness(80%);}
.img140:hover {transition: filter 0.3s ease;filter: brightness(110%);}
.img200 {object-fit: cover;object-position: 50% 25%;width:200px;height:200px;border-radius:50%;z-index:30;}
.img60 {object-fit: cover;width:60px;height:60px;overflow: hidden;border-radius:50%;z-index:30;}
.img60b {object-fit: cover;width:60px;height:60px;overflow: hidden;border-radius:6px;float:right;margin-left:2px;}
img.mainviewBI {pointer-events:none;}
img.奉公画像 {pointer-events:none;}
img.gray {filter: grayscale(100%) brightness(50%);}
img.RS {margin: -4px;border: 3px solid #F0D;
}
img.RA {margin: -4px;border: 3px solid #00F;
}
img.RB {margin: -4px;border: 3px solid #959;
}
img.RC {margin: -4px;border: 3px solid #999;
}
img.RD {margin: -4px;border: 3px solid #333;
}
img.jumptop {max-width:400px;max-height:270px;object-fit: cover;}
img.jumptop2 {max-width:400px;max-height:370px;object-fit: cover;}
img.onlinefriend {width:24px;height:24px;position:absolute;margin-left:1px;margin-top:0px;z-index:31;}
.img155  {object-fit: cover;object-position: 50% 40%;width:155px;height:155px;border-radius:15%;z-index:31;}
.img155o {object-fit: cover;object-position: 50% 25%;width:155px;height:155px;border-radius:50%;z-index:31;}
.sp155 {width:155px;height:155px;margin-right:-155px;position: absolute;z-index:32;}
.heart {color:red;position:relative;top:-158px;left:77px;margin-bottom:-32px;z-index:33;}
.box {position: relative;display: inline-block;}
.box p {position: absolute;top: 0;left: 0;font-size:14px;color:#FF0000;
}

/*
//4 ★★★☆ 編成と戦闘 
*/
tp {width:105px;margin-left:-20px;font-size:16px;font-family: 'Noto Serif JP', serif;display:inline-block;transform:scale(0.6,1.2);}
tp1 {color:lime;}
tp0 {color:red;}
.img-98-122 {
  cursor: pointer;object-fit: cover;
  display: inline-block;
  width:98px;height:122px;
  line-height:1em;
  position: relative;
}
.xxx0  { position: relative;height:18px;padding:0;margin-top:-2px;margin-bottom:3px;display: inline-block; font-size:26px; }
.xxx1  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xxx1b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xxx1c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xxx2  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: 5px; left: 0.6em; z-index: 255; 
}
.xxx2b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: 5px; left: 0.6em; z-index: 255; 
}
.xxx2c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: 5px; left: 0.6em; z-index: 255; 
}
.xxx3  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: 10px; left: 1.2em; z-index: 254; 
}
.xxx3b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: 10px; left: 1.2em; z-index: 254; 
}
.xxx3c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: 10px; left: 1.2em; z-index: 254; 
}
.xxx4  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: 10px; left: 1.9em; z-index: 253; 
}
.xxx4b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: 10px; left: 1.9em; z-index: 253; 
}
.xxx4c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: 10px; left: 1.9em; z-index: 253; 
}
.xxx5  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: 5px; left: 2.5em; z-index: 252; 
}
.xxx5b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: 5px; left: 2.5em; z-index: 252; 
}
.xxx5c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: 5px; left: 2.5em; z-index: 252; 
}
.xxx6  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 3.1em; z-index: 251; 
}
.xxx6b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 3.1em; z-index: 251; 
}
.xxx6c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 3.1em; z-index: 251; 
}

.xx0  { position: relative;height:20px;padding:0;margin-top:-2px;margin-bottom:3px;display: inline-block; font-size:22px; }
.xx1  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xx1b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xx1c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 0; z-index: 256; 
}
.xx2  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 0.5em; z-index: 255; 
}
.xx2b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 0.5em; z-index: 255; 
}
.xx2c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 0.5em; z-index: 255; 
}
.xx3  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 1.0em; z-index: 254; 
}
.xx3b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 1.0em; z-index: 254; 
}
.xx3c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 1.0em; z-index: 254; 
}
.xx4  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 1.5em; z-index: 253; 
}
.xx4b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 1.5em; z-index: 253; 
}
.xx4c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 1.5em; z-index: 253; 
}
.xx5  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 2em; z-index: 252; 
}
.xx5b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 2em; z-index: 252; 
}
.xx5c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 2em; z-index: 252; 
}
.xx6  { animation: color-change 2s linear infinite;  color: #ff0; position: absolute; top: -2px; left: 2.5em; z-index: 251; 
}
.xx6b { animation: color-change2 2s linear infinite; color: #666; position: absolute; top: -2px; left: 2.5em; z-index: 251; 
}
.xx6c { animation: color-change3 2s linear infinite; color: #fde; position: absolute; top: -2px; left: 2.5em; z-index: 251; 
}


@keyframes color-change {/* ★色 一般 */
  0%,100% {color:#444;
}
  25% {color:#dd0;
}
  50% {color:#7f0;
}
  75% {color:#09E;
}
}
@keyframes color-change2 {/* ☆色 兵や装備による錬成 */
  0%,100% {color:#332;
}
  25% {color:#039;
}
  50% {color:#00F;
}
  75% {color:#05E;
}
}
@keyframes color-change3 {/* ★6色 限界突破済み */
  0%,100% {color:#f19;
}
  25% {color:#F56;
}
  50% {color:#90a;
}
  75% {color:#51d;
}
}
/* 射程 */
div span[guide98]:before {
	content: attr(guide98)"";
    position: absolute;top:74px;left:92px;z-index:49;
    font-size: 16px;font-weight: bold;
    text-align: center;
    display: inline-block;
    width: 18px;height: 18px;
    padding: 2px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 50%;
    line-height: 1.3;
    min-width: 1em;
	}
/*低空/航空/霊体/機械/悪魔など特殊属性*/
div span[guide98T]:before {
	content: attr(guide98T)"";
    position: absolute;top:3px;left:2px;z-index:50;
    font-size: 15px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    width: auto;height: 18px;
    padding: 2px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1.4;
    min-width: 1em;
	}
div span[guide98T2]:before {
	content: attr(guide98T2)"";
    position: absolute;top:30px;left:2px;z-index:51;
    font-size: 15px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    width: auto;height: 18px;
    padding: 2px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1.4;
    min-width: 1em;
	}

div span[guide155]:before {
	content: attr(guide155)"";
    position: absolute;
    font-size: 16px;font-weight: bold;
    text-align: center;
    display: inline-block;
    padding: 3px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1.3;
    min-width: 1em;
    top:114px;left:122px;z-index:49;
	}
div span[guide155T]:before {
	content: attr(guide155T)"";
    position: absolute;
    font-size: 18px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    width: auto;height: 22px;
    padding: 3px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1;
    min-width: 1em;
    top:10px;left:8px;z-index:50;
	}
div span[guide155T2]:before {
	content: attr(guide155T2)"";
    position: absolute;
    font-size: 18px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    width: auto;height: 22px;
    padding: 3px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1;
    min-width: 1em;
    top:44px;left:8px;z-index:51;
	}

.td120 {
  cursor: pointer;
  width:120px;height:152px;
  line-height:1em;
  position: relative;
  vertical-align: top;
}

.td140 {
  cursor: pointer;
  width:140px;height:140px;
  line-height:1em;
  position: relative;
  vertical-align: top;
}

.cen155 {
width:190px;
padding:5px;
position: relative;
}

/*
//4 レベルアップ
*/
.status-table {
    width: 380px;
    color: #FFF;
    padding: 0px;
    border: none !important;
    z-index:60;
    position: relative;
}

.status-header {
    color: #FFF;
    padding: 0px;
    border: none !important;
}

.status-row {
    color: #FFF;
    padding: 0px;
    padding-top: 2px;
    border: none !important;
}

.status-footer {
    padding-top: 2px;
    border: none !important;
}

.status-submit {
    text-align: center !important;
	margin-top:-4px;
}

.bn {border: none !important;}
/*
//4 microchat / downchat
*/
.microchat {
  position: fixed;
  display: inline-block;
  top: 0;
  width:98%;
  height:100vh;
  z-index:9101;
  font-size:16px;
}

.microchat:not(:target) {
  transition: .4s;
  opacity: 0;
  visibility: hidden;
  z-index:9102;
}

.microchat:target {
  transition: .4s;
  opacity: 1;
  visibility: visible;
  z-index:9102;
}

.microchat_overlay a {
  display: block;
  position: absolute;
  top: 0;
  width:99%;
  height:100vh;
  opacity: 0.85;
  z-index:9102;
}

.microchat_box {
  position: absolute;
  bottom: 5%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 20px;
  padding: 15px;
  width:580px;
  height:auto;
  background: rgba(60,70,100,0.7);
  z-index:9102;
}

.microchat_close {
  font-weight: bold;
  font-size:1.23rem;
  font-family: "ＭＳ Ｐ明朝",  serif;
  width:121px; height:30px;
  border-radius: 0.5rem;
  cursor: pointer;
  padding: 1px;
  display: inline-block;
  text-align: center;
  color:#212529;
  z-index:9102;
}

/*
//4 PC用 2画面表示
*/
#downchat small {font-size:14px;}
#downchat {overflow-y: auto;font-family:'boku2','Noto Serif JP', serif;z-index:21;}
#downchat2 small {font-size:14px;}
#downchat2 {overflow-y: auto;font-size:16px;font-family:'boku2','Noto Serif JP', serif;z-index:21;}



hr.style18 { 
  height:30px; 
  border-style: solid; 
  border-color:#8c8b8b; 
  border-width:1px 0 0 0; 
  border-radius: 20px; 
} 
hr.style18:before { 
  display: block; 
  content: ""; 
  height:30px; 
  margin-top: -31px; 
  border-style: solid; 
  border-color:#8c8b8b; 
  border-width:0 0 1px 0; 
  border-radius: 20px; 
}

/*
//4 LINE 風のやつ
*/
.line枠 {
  width:590px;
  margin-top:6px;
  line-height:1.2em;
  vertical-align: middle;
  display: inline-block;
}
.line枠右寄せ {
  text-align:right;
}
.line枠 img {
  margin: 2px 25px 1px 2px;
  object-fit: cover;object-position: 50% 25%;width:50px;height:50px;border-radius:50%;
  position: absolute;
  margin-top: 0;
}
.line時刻 {
  font-size:11px!important;
  padding: 5px;
  color:#CDCDCD!important;
  display: inline-block;
  line-height:1em;
  margin-bottom:-100px;
}
.line既読 {
  line-height:1em;
  font-size:11px!important;
  padding: 8px;
  color:#CDCDCD!important;
  display: inline-block;
}
.line名前 {
  margin: 1px 1px 1px 62px;
  color:#DEDEDE;
  position: absolute;
  font-size:14px;
}
.line名前:before {
  position: absolute;
  bottom: -20px;
  left: -5px;
  transform: skew(55deg);
  height: 6px;
  width: 11px;
  background-color: rgba(25,20,15,1);
  content: "";
}
.line文 {
  margin: 20px 1px 1px 62px;
  border-radius:15px;
  padding: 11px;
  background-color: rgba(25,20,15,1);
  color:#DEDEDE;
  display: inline-block;
  max-width:394px;
}
.line文自分 {
  border-radius:15px;
  padding: 10px;
  background-color: rgba(30,255,120,1);
  color:#151515;
  display: inline-block;
  max-width:454px;
}
.line文自分:after {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  background-color: rgba(19,6,7,1);
  color:#DEDEDE;
}


/*
//4 レフトバー(リンク)
*/
.leftbar {
  display:inline-block;
  position:fixed;
  top:200px;left:-1px;z-index:100;
  border-style: solid; 
  border-color:#634; 
  border-width: 0px 1px 1px 0;
  border-radius: 0 15px 15px 0; 
  background-color:#423;
  opacity: 0.7;
  padding: 5px;
  padding-top: 15px;
  padding-bottom: 15px;
  color:#fff;
  font-size:23px;
  line-height:2em;
  font-family: 'boku2','Noto Serif JP', serif;
}
.leftbar a {color:#fff;
}

@media screen and (min-width: 750px) {
.rightbar {
  display:inline-block;
  position:fixed;
  top:200px;right:-1px;z-index:100;
  border-style: solid; 
  border-color:#634; 
  border-width: 0px 1px 1px 0;
  border-radius: 15px 0 0 15px; 
  background-color:#423;
  opacity: 0.7;
  padding: 5px;
  padding-top: 15px;
  padding-bottom: 15px;
  color:#fff;
  font-size:23px;
  line-height:2em;
  font-family: 'boku2','Noto Serif JP', serif;
}
.rightbar a {color:#fff;
}
}
@media screen and (max-width: 750px) {
.rightbar {display:none;}
}
/* 物語 b1=Clear b2=name 図鑑 b3=調達価格 */
img.gray2 {filter: grayscale(50%) brightness(65%);}
img.gray3 {filter: grayscale(100%) brightness(65%);}
.imgrelative {position:relative;}
.imgrelative img {border-radius: 10px;}

.b1 {
  position:absolute;
  bottom:2px;left:-3px;z-index:10;
  border-radius: 0 0 0 10px; 
  background-color:#423;
  opacity: 0.6;
  padding: 3px 12px;
  color:#ff0;
  font-size:20px;
  font-family: 'boku2','Noto Serif JP', serif;
}
.b2 {
  position:absolute;
  bottom:2px;right:0px;z-index:10;
  border-radius: 0 0 8px 0; 
  background-color:#423;
  opacity: 0.6;
  padding: 2px 12px;
  color:lime;
  font-size:16px;
  font-family: 'boku2','Noto Serif JP', serif;
}
.b3 {
  text-align: center;
  position:absolute;
  top:-105px;left:0;right:0;z-index:10;
  border-radius:10px 10px 0 0; 
  padding: 0;
  font-size:14px;
  font-family: 'Noto Serif JP', serif;
  color:#000;
}

.b3S {background: rgba(166,154,189,0.7);}
.b3A {background: rgba(244,179,194,0.7);}
.b3B {background: rgba(30,160,210,0.7);}
.b3C {background: rgba(169,158,147,0.7);}
.b3D {background: rgba(210,160,90,0.7);}

.ggx {
position: fixed;
top: 10px;left: 228px;
width: 362px;
font-size:18px;color:#ff0;
padding: 11px 11px 11px 20px;
border: 2px solid #ff0;
border-radius: 12px;
}
.ggx2 {
position: fixed;
bottom: 10px;left: 10px;
width: 615px;
font-size:16px;
color:#ff0;
border: 1px solid #ff0;
border-radius: 12px;
z-index:2;
}

.ggx3 {
position: fixed;
top: 640px;
left: 520px;
}

.ggx4 {
position: fixed;
top: 35px;
left: 520px;
}

.ggx5 {
position: fixed;
top: 40px;
left: 255px;
}

.ggx6 {
position: fixed;
top: 52px;
left: 165px;
}

.back19140F {
display:inline-block;
width: auto;height:auto;
padding:8px;margin:3px 3px 3px -6px;
background: rgba(25,20,15,0.7);
border-radius: 12px;
line-height:1.3em;color:#eee;
}

.右上 {position: absolute;top:25px;left:230px;z-index:250;}
.右上2 {
position:fixed;
left:240px;
top:130px;
z-index:251;
}


.btn5,
a.btn5,
button.btn5 {
  font-size: 1.4rem;
  font-weight: 700;
  width: 220px;
  line-height: 1.1;
  position: relative;
  display: inline-block;
  padding: 11px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
}
a.btn5-flat {
  overflow: hidden;
  padding: 11px;
  color: #fff;
  border-radius: 30px;
  background-color:rgba(0,0,250,0.1);
}
a.btn5-flat span {
  position: relative;
}
a.btn5-flat:before {
  position: absolute;
  top: 0;
  left: 180px;
  width: 150%;
  height: 180%;
  content: '';
  -webkit-transition: all .1s ease-in-out;
  transition: all .1s ease-in-out;
  -webkit-transform: translateX(-98%) translateY(-70%) rotate(135deg);
  transform: translateX(-98%) translateY(-70%) rotate(135deg);
}
a.btn5-flatY:before {
  background: #00b7ee;
}
a.btn5-flatB:before {
  background: #9f3100;
}
a.btn5-flatY:hover:before {
  -webkit-transform: translateX(-9%) translateY(-125%) rotate(125deg);
  transform: translateX(-9%) translateY(-125%) rotate(125deg);
}
a.btn5-flatB:hover:before {
  -webkit-transform: translateX(-9%) translateY(-95%) rotate(131deg);
  transform: translateX(-9%) translateY(-95%) rotate(131deg);
}
a.btn5-flatY:hover {
  color: #f23010;
}
a.btn5-flatB:hover {
  color: #f23010;
}

.table-no-vertical-border {
    border-collapse: collapse;
    border-spacing: 0;
}

/*
//4 丸式オンオフ切替ボタン
*/
.オンフフトグル-行枠 {
  display: flex;
  align-items: center;
  width: 325px;
  height: 42px;
}
.オンフフトグル-項目解説 {  position: relative;display:grid;padding-right: 35px;width: 245px;height: 30px;align-items: center;text-align:right;}
.オンフフトグル {  position: relative;display: inline-block;width: 64px;height: 30px;}
.オンフフトグル input {display: none;}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .slider {background-color: #2196F3;
}
input:checked + .slider:before {
  -webkit-transform: translateX(34px);
  -ms-transform: translateX(34px);
  transform: translateX(34px);
}
.slider.round {border-radius: 30px;}
.slider.round:before {border-radius: 50%;}

/*
//4 リンク式タブ
*/
.tab2枠 {display:flex;align-items:flex-end;margin:0 0 1px 0;padding:0;vertical-align:bottom;}
.tab2a {display: inline-block;height:38px;font-size:16px;margin:10px 12px 0 0;	padding: 25px 9px 0 6px;border-radius:15px 15px 0 0;background: rgba(25,20,15,1);
box-shadow: 0px -5px 15px -1px #5583b4;color:#DD0;
}
.tab2  {display: inline-block;height:35px;font-size:16px;margin: 0 12px 0 0;	padding: 15px 9px 0 6px;border-radius:15px 15px 0 0;background: rgba(25,20,15,1);
box-shadow: 0px 0px 15px -1px #5583b4;color:#fff;
}

/*
//4 ユーザープロフィール
*/

.文字背景 {
  display: inline-block;
  width: auto;
  height: auto;
  padding: 8px;
  margin: 3px 3px 3px -6px;
  line-height: 1.4em;
  color: #eee;
  word-wrap: break-word;
  padding:4px;
  max-width: 600px;
  z-index: 250;
}
.ひとこと {
  position: absolute;
  top: 296px;
  left: 31px;
  font-size:26px;
}
.プロフィール {
  position: absolute;
  top: 356px;
  left: 33px;
  font-size:20px;
}
.ステータス {
  color: rgb(150, 20, 115);
}
.ステータス画面幅 {
  position: absolute;
  top: 260px;
  left: 0px;
  width: 638px;
  text-align: right;
}
.画面幅 {
  width: 580px;
  text-align: right;
  display:inline-block;
}
.なまえ {
  position: absolute;
  top: 80px;
  left: 20px;
  text-align: center;
  width: 175px;
  font-size:20px;
}
.ユーザー画像 {
  object-fit: cover;
  object-position: 50% 25%;
  width: 155px;
  height: 155px;
  border-radius: 50%;
  position: fixed;
  top: 123px;
  left: 30px;
}
/*  z-index: 270; */
.リンク画像1 {
}
.リンク画像2 {
}
.リンク画面幅 {
  font-size:14px;
  position: absolute;
  top: 140px;
  left: 0px;
  width: 638px;
  text-align: right;
  z-index: 250;
}
.リンク画面幅2 {
  font-size:14px;
  position: absolute;
  top: 164px;
  left: 0px;
  width: 638px;
  text-align: right;
  z-index: 250;
}
.ggx4 {
  position: fixed;
  top: 12px;
  left: 510px;
}
.ggx4B {
  position: fixed;
  top: 73px;
  left: 596px;
}
.ggx5 {
  position: fixed;
  top: 207px;
  left: 455px;
}
.ggx5my {
  position: fixed;
  top: 207px;
  left: 455px;
}
.btn5, a.btn5 {
  font-size: 1.1rem;
  font-weight: 700;
  width: 165px;
  line-height: 0.4;
}
a.btn5-flat::before {
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
.btn5-flat 
.btn5-flatY 
.btn5-flatB 

.background-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 643px;
  z-index: -1;
  transition: background-image 1.5s ease-in-out; 
  background-size: cover;
  height: 200px;
  background-position: 50% 40%;
  background-repeat: no-repeat;
  opacity: 0.25;
}

/*
//4 切替タブ
*/
.tab-2 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 580px;
}

.tab-2 > label {
    flex: 1 1;
    order: -1;
    opacity: .5;
    min-width: 70px;
    padding: .6em 1em;
    border-radius: 5px 5px 0 0;
    background-color: #C0E3FC;
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
.tab-2 > label:hover {opacity: .8;}
.tab-2 input {display: none;}
.tab-2 > div {
    display: none;
    width: 100%;
    padding: 20px;
    background: rgba(25,20,15,1);
    border-radius:0 0 15px 15px;
    border: 2px solid #C0E3FC;
}
.tab-2 label:has(:checked) {opacity: 1;}
.tab-2 label:has(:checked) + div {display: block;}


.explanation-dialog {
position: fixed;
bottom: 80px;
left: 5px;
z-index: 9101;
background-color: rgba(255, 255, 90, 0.85);
padding: 8px 10px;
border-radius: 20px;
margin-right: 7px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.7);
font-size: 16px;
  color:#000000;
white-space: normal;
line-break: strict;
max-width:600px;
}
.explanation-dialog::after {
content: 'Help';position: absolute;top: -15px;left: 15px;z-index: 9003;font-size: 18px;color:#08F;font-weight:bold;font-family:'boku2','Noto Serif JP', serif;white-space: nowrap;
}

.l2 {
  position: fixed;
  bottom: 12px;
  left: 12px;
  z-index: 9100;
}
.l2::after {
  content: 'Log';position: absolute;top: -38px;left: 7px;z-index: 9102;font-size: 22px;font-weight:bold;font-family:'boku2','Noto Serif JP', serif;white-space: nowrap;
  color:#0080F0;
}
.l3 {
  display: inline-block;
  background-color: rgba(255, 255, 90, 0.85);
  box-shadow: 0 4px 6px rgba(150, 150, 60, 0.7);
  padding: 4px 16px 0px 10px;
  border-radius: 50% 20% / 10% 40%;
  font-size: 16px;
  line-height:1.35em;
  color:#000000;
  white-space: normal;
  line-break: strict;
  max-width:590px;
  display: none;
  height: 66px;
  position: fixed;
  bottom: 12px;
  left: 12px;
  z-index: 9501
}
.hide-after::after { display: none; }

/*
//4 etc
*/

.読込ステータス {
bottom:20px;right:20px;position:fixed;
font-size:16px;color:#000;padding:6px;
background: rgba(255,255,100,1);
border-radius: 12px;
height:700px;
display:none;
z-index:9401;
}
.下部矢印 {
position:fixed;
bottom:20px;left:1630px;
z-index:10006;
}
.読込ステータス矢印 {
position: absolute;bottom:20px;
font-size:20px;padding:4px;line-height:1em;color:#000;
background: rgba(200,200,200,1);border-radius: 50%;
}
.ステータステーブル td {
border: 1px solid #666 !important;
font-size:15px;padding: 0px;color:#000!important;
}
.ステータステーブル td a {
color:#000!important;
}

#読込ステータス3 a {color:#000;}

.現在時刻 {
top:11px;left:1350px;position:fixed;white-space: nowrap;z-index:900;
font-size:26px;color:#FFFFFF;
}
.現在時刻 a:link,.現在時刻 a:visited,.現在時刻 a:hover {color:#FFFFFF;
}

.隊長 {border: 2px solid lime;}
.星01 {
    font-size: 40px;font-weight: bold;
    font-family: 'Noto Serif JP', serif;
    position: absolute;top:6px;left:111px;z-index:48; color: #332;
}
.星234 {
    font-size: 40px;font-weight: bold;
    font-family: 'Noto Serif JP', serif;
    position: absolute;top:6px;left:111px;z-index:48;
    animation: color-change 5s linear infinite;  color: #ff0;
}
.星56 {
    font-size: 40px;font-weight: bold;
    font-family: 'Noto Serif JP', serif;
    position: absolute;top:6px;left:111px;z-index:48;
    animation: color-change3 5s linear infinite;  color: #fde;
}
div span[guide140星]:before {
	content: attr(guide140星)"";
    position: absolute;top:10px;left:126px;z-index:49;
    font-size: 16px;font-weight: bold;color:#000;
    font-family: 'Noto Serif JP', serif;
	}
div span[guide140射程とスタイル]:before {
	content: attr(guide140射程とスタイル)"";
    position: absolute;top:104px;left:104px;z-index:49;
    font-size: 20px;
    width: 30px;height: 30px;
    padding-bottom: 3px;
    background: rgba(0,0,0,0.6);
    border: 3px solid #339;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
	}
/*低空/航空/霊体/機械/悪魔など特殊属性*/
div span[guide140特性]:before {
	content: attr(guide140特性)"";
    position: absolute;top:3px;left:6px;z-index:50;
    font-size: 16px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    padding: 2px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1.4;
    min-width: 1em;
	}
div span[guide140特性2]:before {
	content: attr(guide140特性2)"";
    position: absolute;top:34px;left:6px;z-index:51;
    font-size: 16px;font-weight: bold;color:pink;
    text-align: center;
    display: inline-block;
    padding: 2px;
    background: rgba(0,0,0,0.6);
    border: 2px solid #339;
    border-radius: 0.5em;
    line-height: 1.4;
    min-width: 1em;
	}

.閉じるボタン {
position: absolute;top: -8px;right: -4px;
width:24px;height:24px;font-size:26px;color:#000;line-height:0.1em;padding:4px;
background: rgba(200,200,200,1);border-radius: 50%;border: none;
}

.tab2back編成  {width:630px;height:24px;position: absolute;margin-top:-4px;margin-left:-10px;background: rgba(25,20,15,1);}

.tab2back  {
width:700px;height:14px;position: absolute;margin-top:-4px;margin-left:-10px;margin-bottom:100px;
background: #171619;
z-index:21;border:none;
}
.x3 {border: 2px dashed #393;
}
.x2 {border: 2px dashed #993;
}

.vslv {
position:relative;
top:0px;left:0px;
width:200px;height:30px;
}
.vslv input[type="radio"] {display:none;}
.vslv label {
  display        : block;
  position       : absolute;
  top            : 0;
  bottom         : 0;
  left           : 0;
  right          : 0;
  text-align     : center;
  line-height    : 25px;
  font-size      : 16pt;
  border         : 1px solid #666;
}
.vslv #Lv1 + label { border-radius:6px 0 0 6px; background: #444; color:#cc0; border-right: none;}
.vslv #Lv1:checked +label {  					background: linear-gradient(180deg, #40a0ff, #006699, #40a0ff); color:#fff; text-shadow: 1px 1px 1px #333;}
.vslv #Lv2 + label { border-radius:0;			background: #444; color:#cc0; border-left:none;}
.vslv #Lv2:checked +label { 					background: linear-gradient(180deg, #00b359, #006633, #00b359);color:#fff; text-shadow: 1px 1px 1px #333;}
.vslv #Lv3 + label { border-radius:0 6px 6px 0; background: #444; color:#cc0; border-left: none;}
.vslv #Lv3:checked +label {						background: linear-gradient(175deg, #c00, #933, #c00); color:#fff; text-shadow: 1px 1px 1px #333;}