@charset "utf-8"; 
@font-face
{
font-family: ロゴたいぷゴシック;
src: url('https://cdn.leafscape.be/logotype/logotype_web.woff2')
     format("woff2");
}


*{background:transparent;　font-style:inherit;
font-variant:inherit;　font-weight:inherit;
font-size:100%;　line-height:120%;
font-family:inherit;　text-decoration:inherit;
text-align:center;　vertical-align:baseline;
border:none;　outline:none;　list-style:none;
margin:0px;　padding:0px;
}

body{font-family: ロゴたいぷゴシック, "Times New Roman", Times, serif;
font-style:normal;
font-variant:normal;
font-weight:normal;
text-decoration:none;
}
div,p,table,dl,ol,ul{margin:0px auto;}

table,caption,thead,tbody,tfoot,tr,th,td,dl,dt,dd,img{
vertical-align:middle;}
h1,h2,h3,h4,h5,h6,dt,th{font-weight:bold;}


body{background-color:#000000; 
font-size:5px;
font-family:"メイリオ",Meiryo UI,Verdana,Osaka,MS P Gothic;
color:#000000;
padding:0px;
}

table{
background-image:url('./img/commu.png') ;
background-repeat:no-repeat;
table-layout:fixed; background-color:#fef251;
    
width:800px;
padding:90px 0px 10px 0px;
}


td{font-family: ロゴたいぷゴシック, "Times New Roman", Times, serif;
font-size:20px;padding:0px 0px 0px 0px;text-align:left;
}


thead td{color:#696969;
padding:5px 10px 5px 15px;
font-size:15px;
text-align:left;
font-weight:bold;
   }

tbody td{background-image:url('img/back.png') ;
background-repeat:repeat;table-layout:fixed;padding:10px 5px 5px 10px;
font-size:15px;text-align:left;color:#203744;}

tfoot th{
background-image:url('../img/next.jpg') ;
table-layout:fixed;
background-repeat:no-repeat;
color:#32d40b;
font-size:25px;
padding:0px 0px 0px 45px;

}
tfoot td{
background-image:url('../img/skill.png') ;
table-layout:fixed;
padding:5px ;

}
h1{
position: relative;
padding: 0.25em 1em;
border-top: solid 2px #149dca;
border-bottom: solid 2px #149dca;
}
h1:before, h1:after{
content: '';
position: absolute;
top: -7px;
width: 2px;
  height: -webkit-calc(100% + 14px);
height: calc(100% + 14px);
background-color: #149dca;
}
h1:before {left: 7px;}
h1:after {right: 7px;}


.arcana {/*親div*/
  position: relative;width:100px;  }

.arcana p {  position: absolute;
  color: #ffffff;    background: rgba(0,0,0,.6);
  font-weight:normal; /*太字に*/  font-size:14px;
  font-family: ロゴたいぷゴシック, sans-serif;
  top:80%;  left: 45%;  margin:0;  padding:5px;
  }

.arcana img {
  width: 100%;
  }


.rank{  width:100px;color:#149dca;
    font-family: 'Cherry Cream Soda', cursive;
}

.rank:first-letter {
    font-size: 3em;
    line-height: 1;
    float: left;
    margin: 0 .2em 0 0;
    padding: .1em 0;
}

.box1 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #149dca;
    border-radius: 8px;
}
.box1 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0px 5px;
    line-height: 1;
    font-size: 19px;
    background: #fef251;
    color: #149dca;
    font-weight: bold;
}
.box1 p {
    margin: 0; 
    padding: 0;
}