body {
    background-color: whitesmoke;
    margin-left: 15px;
    margin-right: 15px;
    font-family: "DejaVu Sans", "Arial", "Consolas", sans-serif, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic";
    line-height: 1.6;
}

body.bgImg {
    background-image: url("../jpg/bgimg_pale.jpg");
    background-position: center top;
//    background-repeat: no-repeat;
    -moz-background-size: contain;
    background-size: contain;    
}

/* a { */
/*     color: teal; */
/*     text-decoration: underline dotted red; */
/* } */

strong.color {
    color: crimson;
}

strong.bigger {
    font-size: large;
}

em.color {
    color: crimson;
}

p:lang(ja) {
    text-indent: 1em;
}

p.fl::first-letter {
    color: red;
    font-size: xx-large;
}

h1 {
    color: #e6e68f;
    background-color: midnightblue;
    text-align: center;
    font-size: xx-large;
    line-height: 2;
    font-weight: bold;
    padding: 15px 0;
}

header.num {
    counter-reset: chapter;
}

/* h1 { */
/*     background: url(../jpg/h1_bgimg_80.jpg) no-repeat center center; */
/*     color: floralwhite; */
/*     background-size: cover; */
/*     padding: 50px; */
/*     text-align: center; */
/*     font-size: xx-large; */
/*     font-weight: bold; */
/* } */

h2 {
    /* color: #ffff7f; */
    /* background-color: navy; */
    color: navy;
    font-size: x-large;
    /* line-height: 2; */
}

h2.num {
    counter-reset: section;
}

h3 {
    color: #ffff74;
    background-color: darkblue;
    font-size: large;
    padding-left: 0.5em;
    padding-right: 0.5em;
    line-height: 2;
}

h3.num {
    counter-reset: subsection;
}

h4 {
    color: #ffff32;
    background-color: mediumblue;
}

h2.num::before {
    counter-increment: chapter;
    content: counter(chapter) ".\a0";
}

h3.num::before {
    counter-increment: section;
    content: counter(chapter) "-" counter(section) ".\a0";
}

h4.num::before {
    counter-increment: subsection;
    content: counter(chapter) "-" counter(section) "-" counter(subsection) ".\a0";
}

* {
  box-sizing: border-box;
}

.left {
  background-color: #e5e5e5;
  float: left;
  width: 20%;
  text-align: center;
  padding: 10px;
}

.left a {
  background-color: #333333;
  color: #f2f2f2;  
  padding: 8px;
  margin-top: 5px;
  display: block;
  width: 100%;
  text-decoration: none;
}

.left a:hover {
  background-color: #dddddd;
  color: black;
}

.main {
  float: left;
  width: 60%;
  padding: 15px;
}

.right {
  background-color: #e5e5e5;
  float: left;
  width: 20%;
  padding: 10px;
  margin-top: 5px;
  text-align: center;
}

@media only screen and (max-width: 620px) {
  /* For mobile phones: */
  .left, .main, .right {
    width: 100%;
  }
}

/* TeX logo 関連（ここから）*/
/* .tex sub, .latex sub, .xetex sub, .latex sup { */
/*   text-transform: uppercase; */
/* } */

/* .tex sub, .xetex sub { */
/*   vertical-align: -0.5ex; */
/*   margin-left: -0.1667em; */
/*   margin-right: -0.125em; */
/* } */

/* .latex sub { */
/*     vertical-align: -0.1ex; */
/*     margin-left: -0.1667em; */
/*     margin-right: -0.025em; */
/* } */

/* .tex, .xetex, .tex sub, .xetex sub { */
/*   font-size: 1em; */
/* } */

/* .latex sup { */
/*   font-size: 0.85em; */
/*   vertical-align: 0.15em; */
/*   margin-left: -0.36em; */
/*   margin-right: -0.15em; */
/* } */
.tex sub, .latex sub, .latex sup {
    text-transform: uppercase;
}

.tex sub {
    vertical-align : -0.1ex;
    margin-left: -0.1667em;
    margin-right: -0.125em;
}

.tex, .latex, .tex sub, .latex sub {
  font-size: 1em;
}

.latex sub {
  vertical-align: -0.1ex;
  margin-left: -0.1667em;
  margin-right: -0.025em;
}

.xetex sub {
  vertical-align: -0.1ex;
  margin-left: -0.1667em;
  margin-right: -0.125em;
}

.latex sub, .latex sup, .xetex sub {
  font-size: 0.9em;
  text-transform:uppercase;

}
.latex sup {
  font-size: 0.85em;
  vertical-align: -0.2em;
  margin-left: -0.26em;
  margin-right: -0.05em;
}
/* TeX logo 関連（ここまで）*/

/* for XeTeX Logo */
.revcap {
display: inline-block;
text-transform: uppercase;
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
transform: rotateY(180deg);
}

/* ここから上部にある「ナビゲーション」用の設定 */
.topnav {
  overflow: hidden;
  background-color: #333333;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #dddddd;
  color: black;
}

.active {
  background-color: darkblue;
  color: white;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 620px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 620px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
/* 「ナビゲーション」用の設定ここまで */

.pkna {
    -moz-font-feature-settings: "pkna";
    -webkit-font-feature-settings: "pkna";
     font-feature-settings: "pkna";
}

.palt {
    -moz-font-feature-settings: "palt";
    -webkit-font-feature-settings: "palt";
     font-feature-settings: "palt";
}

.tategaki {
    -webkit-writing-mode: vertical-rl;
    -moz-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    display: inline-block;
    height: 15em;
    text-align: left;
}

.tbox {
    text-align: right; /* right, left */
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table caption {
    font-size: large;
    padding: 10px 0;
}

table th {
    color: white;
    background: #165e83;
    padding: 8px 15px;
    border: 1px solid midnightblue;
}

table td {
    padding: 8px 15px;
    border: 1px solid midnightblue;
}

table td.number {
    text-align: right;
}

/* pseudo class DE */
table:lang(de), table td:lang(de) {
    border: 1px solid forestgreen;
}

table th:lang(de) {
    color: white;
    background: seagreen;
    padding: 8px 15px;
    border: 1px solid darkseagreen;
}

table caption:lang(de) {
    color: green;
    font-weight: bold;
}

table caption:lang(de)::before {
    content: "\1f1e9\1f1ea\a0";
}

/* adjacent sibling selector DE */
table tr:lang(de)+tr:nth-child(2n+1) {
    background: lightgreen;
}

/* pseudo class JA */
table:lang(ja2), table td:lang(ja2) {
    border: 1px solid dodgerblue;
}

table th:lang(ja2) {
    color: white;
    background: cornflowerblue;
    padding: 8px 15px;
    border: 1px solid deepskyblue;
}

table caption:lang(ja2) {
    color: blue;
    font-weight: bold;
}

table caption:lang(ja2)::before {
    content: "\1f1ef\1f1f5\a0";
}

/* adjacent sibling selector JA */
table tr:lang(ja2)+tr:nth-child(2n+1) {
    background: lightskyblue;
}

/* pseudo class FR */
table:lang(fr), table td:lang(fr) {
    border: 1px solid deeppink;
}

table th:lang(fr) {
    color: white;
    background: hotpink;
    padding: 8px 15px;
    border: 1px solid deeppink;
}

table caption:lang(fr) {
    color: deeppink;
    font-weight: bold;
}

table caption:lang(fr)::before {
    content: "\1f1eb\1f1f7\a0";
}

/* adjacent sibling selector FR */
table tr:lang(fr)+tr:nth-child(2n+1) {
    background: pink;
}

/* pseudo class EN */
table:lang(en), table td:lang(en) {
    border: 1px solid orange;
}

table th:lang(en) {
    color: white;
    background: sandybrown;
    padding: 8px 15px;
    border: 1px solid darkorange;
}

table caption:lang(en) {
    color: chocolate;
    font-weight: bold;
}

table caption:lang(en)::before {
    content: "\1f1ec\1f1e7\a0";
}

/* adjacent sibling selector EN */
table tr:lang(en)+tr:nth-child(2n+1) {
    background: peachpuff;
}

table.noborder td {
    border: none;
}

.copyleft {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    display: inline-block;
}

.ol_var {
  background: #f1f8ff;
  box-shadow: 0px 0px 0px 10px #f1f8ff;/*線の外側*/
  border: dashed 2px #668ad8;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  padding: 0.5em 0.5em 0.5em 3em;
}

.ol_var li {
  line-height: 1.2;
  padding: 0.5em 0;
}

.ol_var3 {
  box-shadow: 0px 0px 3px #ff938b;
  padding: 0.5em 1em 0.5em 2.3em;
  background: #fffaf1;
}

.ol_var3 li {
  line-height: 1.2;
  padding: 0.5em 0;
}

.ol_var2 {
  background: #fffaf1;
  box-shadow: 0px 0px 0px 10px #fffaf1;/*線の外側*/
  border: dashed 2px #ff938b;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  padding: 0.5em 0.5em 0.5em 3em;
}

.ol_var2 li {
  line-height: 1.2;
  padding: 0.5em 0;
}

.ul_var {
  box-shadow :0px 0px 3px #ff938b;
  /* border: solid 2px #ff938b; */
  padding: 0.5em 1em 0.5em 2.3em;
  background: #fffaf1;
}

.ul_var li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none;
}

.ul_var li::before {
  content: "\1f631\a0";
  left: 5em; /*左端からのアイコンまで*/
}

.ul_var2 {
  list-style: none;
  background: #f1f8ff;
  box-shadow: 0px 0px 0px 10px #f1f8ff;/*線の外側*/
  border: dashed 2px #668ad8;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  //padding: 0.5em 0.5em 0.5em 3em;
  padding: 0.5em 0.5em 0.5em 3em;
}

.ul_var2 li {
  position: relative;
  line-height: 1.2;
  //padding: 0.5em 0;
  padding: 0.5em 1em;
}

.ul_var2 li::before {
  content: "\1f4d6\a0";
  position: absolute;
  left: -1em; /*左端からのアイコンまで*/
}

.ul_var3 {
  list-style: none;
  background: #fffaf1;
  box-shadow: 0px 0px 0px 10px #fffaf1;/*線の外側*/
  border: dashed 2px #ff938b;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  //padding: 0.5em 0.5em 0.5em 3em;
  padding: 0.5em 0.5em 0.5em 3em;
}

.ul_var3 li {
  position: relative;
  line-height: 1.2;
  //padding: 0.5em 0;
  padding: 0.5em 1em;
}

.ul_var3 li::before {
  content: "\1f4da\a0";
  position: absolute;
  left: -1em; /*左端からのアイコンまで*/
}

.ul_var4 {
  list-style: none;
  background: #f1f8ff;
  box-shadow: 0px 0px 0px 10px #f1f8ff;/*線の外側*/
  border: dashed 2px #668ad8;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  //padding: 0.5em 0.5em 0.5em 3em;
  padding: 0.5em 0.5em 0.5em 3em;
}

.ul_var4 li {
  position: relative;
  line-height: 1.2;
  //padding: 0.5em 0;
  padding: 0.5em 1em;
}

.ul_var4 li::before {
  content: "\2714\a0";
  position: absolute;
  left: -1em; /*左端からのアイコンまで*/
}

.ul_var5 {
  list-style: none;
  background: #fffaf1;
  box-shadow: 0px 0px 0px 10px #fffaf1;/*線の外側*/
  border: dashed 2px #ff938b;/*破線*/
  border-radius: 9px;/*四隅の面取り*/
  margin-left: 10px;/*はみ出ないように調整*/
  margin-right: 10px;/*はみ出ないように調整*/
  //padding: 0.5em 0.5em 0.5em 3em;
  padding: 0.5em 0.5em 0.5em 3em;
}

.ul_var5 li {
  position: relative;
  line-height: 1.2;
  //padding: 0.5em 0;
  padding: 0.5em 1em;
}

.ul_var5 li::before {
  content: "\2714\a0";
  position: absolute;
  left: -1em; /*左端からのアイコンまで*/
}

.fine {
    display: inline-block;
    width: 0.125em;
}

p.boustrophedonZ:nth-child(2n) {
    color: crimson;
    display: inline-block;
    transform: rotateZ(180deg);
}

p.boustrophedonY:nth-child(2n) {
    color: crimson;
    display: inline-block;
    transform: rotateY(180deg);
}

p.boustrophedonY,p.boustrophedonZ {
    margin: 0 auto;
}

.submit_button {
    border: solid 2px #ff938b;
    padding: 10px 20px;
    font-size: 150%;
    font-weight: bold;
    background-color: mistyrose;
    color: navy;
}

span.inner {
	color: gray;
}

span.outer{
	color: red;
	text-decoration: line-through;
}

table.classes {
    border-collapse: collapse;
    border-spacing: 0;
}

table.classes caption {
    font-size: large;
    padding: 10px 0;
}

table.classes th {
    color: #dddddd;
    background: #666666;
    padding: 8px 15px;
    border: 1px solid #f2f2f2;
}

table.classes td {
    padding: 8px 15px;
    border: 1px solid #dddddd;
}

table.classes td.number {
    text-align: right;
}

table.classes a:hover {
  background-color: #dddddd;
  color: black;
  text-decoration: none;
}

footer {
    background-color: #e5e5e5;;
    text-align: center;
    font-size: x-small;
    padding: 10px;
}