@charset "utf-8";

body{
    color:#000;
    width:100%;
    height:100%;
    font-family: arial,helvetica,"繝偵Λ繧ｮ繝手ｧ偵ざ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"繝｡繧､繝ｪ繧ｪ",Meiryo,"MS P繧ｴ繧ｷ繝・け",clean,sans-serif;
    background: #000000 ;
    text-align: center;
}

div, span, form, h1, h2, h3, h4, ul, ol { margin: 0; padding: 0}



A                { color: #999999; text-decoration: none; background: none;}
A:link           { color: #999999; text-decoration: none; background: none;}
A:link:hover     { color: #ffffff; text-decoration: none; background: none;}
A:link:active    { color: #000000; text-decoration: none; background: none;}
A:visited        { color: #cccccc; text-decoration: none; background: none;}
A:visited:hover  { color: #ffffff; text-decoration: none; background: none;}
A:visited:active { color: #000000; text-decoration: none; background: none;}

h1, h2, h3 {
margin: 0px;
padding: 0px;
font-weight: normal;
}

.menu table,
.menu th,
.menu td,
#wikibody table,
#wikibody th,
#wikibody td{
    border-collapse:collapse;
    border:1px solid #06c;
}
.menu th,
.menu td,
#wikibody th,
#wikibody td{
    padding:3px;
}


#container {
    width: 1080px;
    margin: 30px auto 0px;
    background-color: #333333;
    border-bottom: 1px solid #999999;
    border-left: 1px solid #999999;
    border-right: 1px solid #999999;
}


#wrapper{
    line-height: 140%;
    text-align: left;
    padding: 0px;
}

#head_editmenu,#foot_edit_menu{
    text-align:right;
    background-color:#ffffff;
}

#top{
    width:0;
    height:0;
}
#atwiki-jp-bg1{
    padding-top:20px;
}
#atwiki-jp-bg2{
    padding-top: 1px;
}


#header{
    margin-left:40px;
    margin-right:40px;
    vertical-align: middle;
    text-align:left;
    margin-top:0px;
    padding-top:10px;
}

#header h1 {
    margin-top:30px;
    padding: 5px 0 3px 10px;
    font-size:25px;
    margin-bottom:5px;
    border-left: none;
}
.pagename{
    font-size:20px;
}



#contents {
    color:#fff;
    overflow:hidden;
    word-break:break-all;
    background-color:#ffffff;
    padding:10px;
}



#menubar {
    float: left;
    width: 180px;
    overflow: hidden;
    margin: 5px;
}

#menubar2 {
    float: right;
    width: 180px;
    overflow: hidden;
    margin: 5px;
}

#center {
    float: left;

    width: 460px;
}


.menu{
    overflow:visible;
    word-break:break-all;
    color:#fff;
    background:#000000;
    color
    text-align:left;
    margin:0 8px 0 8px;
    margin-top:10px;
/*  border:solid 1px #cccccc
*/
}


.pageinfo {
    text-align:right;
    margin-right:15px;
    height:20px;

}

#contents{
    background-color:#000000;
}

#attach{
    margin-left:20px;
    margin-right:20px;

    clear:both;
}
#footnote{
    margin-left:20px;
    margin-right:20px;

    float:both;
}

#footer,#ad{
    text-align:center;
}

#footer{
    clear:both;

}
#foot_editmenu{
    clear:both;
    margin-left:10px;
    margin-right:10px;
    margin-bottom:7px;
    text-align:center;
}



.menu h2{
    text-align:center;
    border-left:none;
    padding:0;
    margin:.5em 0;
    color:#fff;
    border-bottom:solid 1px #990000;
    border-top:solid 1px #990000;
    border-left:solid 7px #990000;
    border-right:solid 7px #990000;
}

.menu h3{
    text-align:center;
    border-left:none;
    border-bottom:dotted 2px #666666;
    padding:0;
    margin:.5em 0;
}

h1{
    font-size:24px;
    border-bottom:solid 2px #cccccc;
    border-left:solid 10px #cccccc;
    padding:3px;
    margin:.5em 0;
    margin-left:5px;
}
h2{
    font-size:20px;
    padding:5px;
    margin:.5em 0;
    margin-left:0px;

    border-left:solid 7px #990000;
    border-bottom:solid 2px #990000;
}
h3{
    border-left:solid 3px #990000;
    border-bottom:dotted 1px #990000;
    margin:.5em 0;
    font-size:18px;
    padding:5px;
    margin-left:12px;
}
h4{
    border-bottom:dotted 1px #cccccc;
    margin:.5em 0;
    font-size:16px;
    padding:5px;
    margin-left:15px;
}
h5{
    border-bottom:dotted 1px #cccccc;
    margin:.5em 0;
    font-size:14px;
    padding:5px;
    margin-left:20px;
}
h6{
    margin:.5em 0;
    font-size:12px;
    padding:5px;
    margin-left:20px
}

img {
    border: none;
    vertical-align: middle;
}



hr{
    margin: 5px;
}

ul,ol{
    padding:0;
    margin:0;
    margin-left: 10px;
}
ul li {
    margin: 0 0px 0 10px;
    padding: 0;
    line-height: 150%;
}

ol li {
    margin: 0 0px 0 10px;
    padding: 0;
    line-height: 150%;
}

dt {
    font-weight: bold;
    margin-top: 1em;
    margin-left: 1em;
}

#contents table{
    padding:0px;
    border:0px;
    text-align:left;
    color:inherit;
    background-color:#ccd5dd;
    border: 1px solid #CCCCCC;
}


#contents th
{
    padding:5px;
    margin:1px;
    text-align:center;
    color:inherit;
    background-color:#666666;
    border: 1px solid #CCCCCC;
}
#contents td
{
    font-size:12px;
    padding:5px;
    margin:1px;
    color:inherit;
    background-color:#333333;
    border: 1px solid #CCCCCC;
}
pre {
    border: #cccccc 1px solid;
    padding: 5px;
    margin: 5px 0px 5px 5px;
    white-space: pre;
    color: #666;
}

blockquote {
    margin: 5px 0px 5px 5px;
    padding: 5px;
    border: #cccccc 1px dotted;
    color:#666;
}

em {
    font-style:italic;
}

strong {
    font-weight:bold;
}

address {
    font-style:normal;
}


.warning,
span.warning{
    color: #FCC;
}
.hidden{
    display: none;
}

span.diff_add{
    color: red;
    background-color:#FFF;
}

span.diff_del{
    color: blue;
    background-color:#FFF;
}

span.word1{ color: black; background-color: #ffff66; }
span.word2{ color: black; background-color: #a0ffff; }
span.word3{ color: black; background-color: #99ff99; }
span.word4{ color: black; background-color: #ff9999; }
span.word5{ color: black; background-color: #ff66ff; }
span.word6{ color: white; background-color: #880000; }
span.word7{ color: white; background-color: #00aa00; }
span.word8{ color: white; background-color: #886800; }
span.word9{ color: white; background-color: #004699; }
span.word10{ color: white; background-color: #990099; }

/*ads*/

#contents .gafc_on{
    background-color:#ECECEC;
}
#contents a.gafc_domain{
    color:green;
}

/*ads*/
.gafc_on{
    background-color:#ECECEC;
}
a.gafc_domain{
    color:green;
}



#tarea_wiki{
    width:97%;
}


textarea {  
    resize: none;  
}  


/*----画像下の説明欄のcss記述です----*/
.setumei { 
    line-height: 12px;
    color: #e8e8e8;
    font-size: 70%; 
}



/*----ランクページのテーブルデザインです----*/

#rank table{
    padding:0px;
    border:0px;
    text-align:left;
    color:inherit;
    background-color:#000000;
    border: 1px solid #CCCCCC;
}


#rank th
{
    text-align:left;
    padding:5px;
    margin:1px;
    color:inherit;
    background-color:#330000;
    border: 1px solid #CCCCCC;
}
#rank td
{
    font-size:12px;
    padding:5px;
    margin:1px;
    color:inherit;
    background-color:#000000;
    border: 1px solid #CCCCCC;
}



/*----テーブルの斜線----*/
.slashtable{
    background-image: linear-gradient(to right top, transparent calc(50% - 0.5px), #fff 50%, #fff calc(50% + 0.5px), transparent calc(50% + 1px));
}



/*技個別ページへの移動ボタン*/
.button {
  padding: 8px 20px;
  font-size: 16px;
  font-weight: 600;
  border: 2px solid #E5E5E5;
  color: #E5E5E5;
  background-color: transparent;
  cursor: pointer;
  border-radius: 10px;
  text-transform: uppercase;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
}

.button:hover {
  color: red;
  border-color: #970007;
  box-shadow: 0 0 20px rgba(255, 0, 0, 0.8);
}

.button:active {
  box-shadow: 0 0 10px rgba(255, 0, 0, 0.4);
}


/*ペン辞典ギャラリー*/
/*画像ビューアー*/

.thumbnail {
  cursor: pointer; /* マウスカーソルを指マークに変更 */
  background-color: rgba(51, 51, 51, 1.0); /* rgbaで背景色を指定 */
  transition: background-color 0.3s; /* 不透明度の変化にトランジションを追加 */
  margin: 1px 3.5px; /* 上下に0px、左右に10pxのマージンを追加 */
  width: 60px; /* 幅を60pxに設定 */
  height: 60px; /* 高さを60pxに設定 */
}

.thumbnail:hover {
  opacity: 0.8; /* マウスオーバー時の不透明度 */
}

.thumbnail:first-child {
  margin-left: 10px; /* 最初のサムネイルの左側に10pxのマージン */
}

.thumbnail:last-child {
  margin-right: 10px; /* 最後のサムネイルの右側に8pxのマージン */
}

.viewer {
  position: relative;
  width: 320px;
  height: 240px;
  overflow: hidden;
  background-color: #333333; /* 背景色を指定しておく */
}

.main-image {
  cursor: pointer; /* メイン画像にカーソルを指マークに変更 */
}

.viewer.no-pointer .main-image {
  cursor: default; /* 指マークが出ないビューアー */
}

.main-image, .demo {
  position: absolute;
  top: 0;
  left: 0;
  width: 320px;
  height: 240px;
  will-change: opacity;  /* アニメーション前に変化を予告 */
  transition: opacity 0.3s ease-in-out;
  z-index: 1; /* メイン画像は常に前面 */
}

.demo {
  z-index: 2; /* 新しい画像がフェードイン中は前面に */
  opacity: 0;  /* 初期状態は透明 */
}

/*lightbox風表示*/
.lightbox {
  display: none; /* 初期状態では非表示 */
  position: fixed; /* 画面全体を覆う */
  z-index: 1000; /* 他の要素の上に表示 */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8); /* 半透明の背景 */
  justify-content: center; /* 中央に配置 */
  align-items: center; /* 中央に配置 */
  opacity: 0; /* 初期状態の不透明度 */
  transition: opacity 0.3s; /* フェード効果のトランジション */
}

.lightbox-content {
  max-width: 90%; /* 画面の90%までの幅 */
  max-height: 90%; /* 画面の90%までの高さ */
}

.close {
  position: absolute; /* 閉じるボタンを上に */
  top: 20px;
  right: 30px;
  color: white;
  font-size: 40px;
  cursor: pointer; /* カーソルを指マークに */
}

.main-image-g {
  cursor: pointer; /* メイン画像にカーソルを指マークに変更 */
}

/*lightbox表示のバグ対策(atwikiそのもののcss上書き)*/
body#atwiki-jp {
  container-type: normal !important; /* コンテナ機能を無効化 */
}



/* Hides from IE-mac \*/
 * html #source___Frame{ width:97% !important;}
 /* End hide from IE-mac */