@charset "UTF-8";
/*****************************************************************************/
/* ブラウザ互換用設定*/
/*****************************************************************************/
html,body,h1,h2,h3,h4,ul,ol,dl,li,dt,dd,p,pre,div,span,img,a,table,tr,th,td{
    margin:0;
    padding:0;
    border:0;
    font-weight:normal;
    font-size:100%;
    vertical-align:baseline;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
article,header,footer,aside,figure,figcaption,nav,section{
    display:block;
}
ol,ul{
    /* list-style:none; */
    /* list-style-type:none; */
    margin:1em 0em 1em 0em;
    padding-left:2em;
}
body{
    line-height:1;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    background-color:#FAFAFA;
    font-size:12px;
    font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
    color:#1A1A1A;
}
dl{
    margin:1em 0em 1em 0em;
    padding-left:2em;
}
li{
    margin:15px 0px 15px 0px;
}
dt{
    margin:0px;
}
dd{
    padding-left:0px;
}
/*****************************************************************************/
/*IE対策*/
/*****************************************************************************/
.ieOnly{
    display:none;
}
@media all and (-ms-high-contrast: none){
.ieOnly{
    display:block;
    font-size:1.5em;
    background-color:#F7C7AC;
    margin:20px;
    padding:20px;
    text-align:center;
}
}
/*****************************************************************************/
/*標準設定*/
/*****************************************************************************/
blockquote{
    margin:1em;
    padding:0.5em;
    background-color:#EEEEEE;
    border:1px dotted #DDDDDD;
}
table{
    word-break:break-all;
    overflow-wrap:break-word;
    table-layout:fixed;
}
hr{
    border-width:1px 0px 0px 0px;
    border-style:solid;
    border-color:#000000;
    height:1px;
}
img{
    border:none;
    vertical-align:bottom;
}
p{
    margin-top:10px;
    margin-bottom:10px;
    text-indent:0;
    letter-spacing:0.07em;
    line-height:1.7em;
}
pre{
    margin:0px;
    padding:0px;
    font-family:'BIZ UDゴシック','ＭＳ ゴシック',monospace;
    white-space:pre-wrap;
    word-break:break-all;
    overflow:auto;
}
svg{
    display:block;
}
/*****************************************************************************/
/*テーマ
*/
/*****************************************************************************/
.PS-colorGreen{
    --bgColor-dark:#666666;
    --fontColor-dark:#FFFFFF;
    --bgColor-bright:#FFFFFF;
    --fontColor-bright:#2C2C2C;
    --borderColor:#D0D0D0;
    --accentColor:#7CCF0C;
    --panel-bgColor:#E4FBC6;
    --panel-fontColor:var(--fontColor-bright);
    --panel-title-fontColor:#327326;
    --panelNotice-bgColor:#535353;
    --panelIllustration-bgColor:#F9F9F9;
    --panelIllustration-hover-bgColor:#C5C5C5;
    --panelColumn-bgColor:#E6DFAE;
    --panelSupplement-bgColor:#FFF3DA;
    --panelTempSupplement-bgColor:#00215E;
    --panelTempQuestion-bgColor:#440651;
    --panelTempAnswer-bgColor:#450727;
    --list-odd-bgColor:#F6F6F6;
    --list-even-bgColor:#FFFFFF;
}
.PS-cornerSquare{
    --border-radius:0px;
}
.PS-cornerRound{
    --border-radius:6px;
}
/*****************************************************************************/
/*ページ構成*/
/*****************************************************************************/
.page{
    margin:0px auto 10px auto;
    width:100%;
    max-width:840px;
    padding:0px;
    /* border-right:3px solid #DDDDDD; */
    /* border-bottom:3px solid #DDDDDD; */
}
    /*ヘッダ*/
    .page > .header{
        /* width:840px; */
        font-size:16px;
        /* font-weight:bold; */
        padding:20px 40px  0px 40px;
        line-height:normal;
        background-color:var(--bgColor-bright);
        color:var(--fontColor-bright);
        text-align:right;
    }
    /*センター*/
    .page .center{
        /* width:840px; */
        background-color:var(--bgColor-bright);
        color:var(--fontColor-bright);
    }
        /*コンテンツ*/
        .page .center .contents{
            /* float:right; */
            /* width:840px; */
            padding:20px 40px 20px 40px;
            text-align:left;
            font-size:15px;
            background-color:#FFFFFF;
            line-height:1.6em;
            letter-spacing:0;
        }
            .page .center .contents > *:first-child{
                margin-top:0px;
            }
            .page .center .contents > *:last-child{
                margin-bottom:0px;
            }
    /*フッター*/
    .page .footer{
        clear:both;
        /* width:840px; */
        font-size:12px;
        padding:5px;
        background-color:#292929;
        color:var(--fontColor-dark);
        border-top:2px solid #000000;
    }
@media print {
  .page{
    width:1000px;
  }
  .page .center .contents{
    padding:20px 40px 0px 40px;
  }
  .page .center .contents .linkList{
    display:none;
  }
  body{background-color:#FFFFFF;}
}
/*****************************************************************************/
/*パネル*/
/*****************************************************************************/
.panel{
    margin:16px 0 16px 0;
    padding:10px;
    background-color:var(--panel-bgColor);
    color:var(--panel-fontColor);
    page-break-inside:avoid;
    border-radius:var(--border-radius);
    text-decoration:none;
}
    .panel > *:first-child{
        margin-top:0px;
    }
    .panel > *:last-child{
        margin-bottom:0px;
    }
    .panel h4{
        margin:0px;
        color:var(--panel-title-fontColor);
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel p{
        margin:0px 0 10px 0;
    }
/*枠外タイトル*/
.panelTitle{
    font-weight:bold;
    margin:10px 0 0 0;
    font-size:1.3em;
    color:var(--panel-title-fontColor);
}
.panelTitle+.panel{
    margin-top:0px;
}
/*URLパネル*/
.panel.url{
    border-left:5px solid var(--accentColor);
}
    .panel.url h4,.panel.url span{
        margin-top:0px;
        margin-bottom:0px;
        font-weight:bold;
        font-size:16px;
        text-indent:0em;
        color:var(--panel-title-fontColor);
    }
    .panel.url p{
        margin-top:0px;
        padding:5px 0px 5px 5px;
        word-break:break-all;
    }
/*注意書き*/
.panel.notice{
    background-color:var(--panelNotice-bgColor);
    color:var(--fontColor-dark);
}
    .panel.notice > *:first-child{
        margin-top:0px;
    }
    .panel.notice > *:last-child{
        margin-bottom:0px;
    }
    .panel.notice h4{
        margin:0px;
        color:var(--fontColor-dark);
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.notice p{
        margin:10px 0 10px 0;
    }
/*説明*/
.panel.illustration{
    background-color:var(--panelIllustration-bgColor);
}
    .panel.illustration > *:first-child{
        margin-top:0px;
    }
    .panel.illustration > *:last-child{
        margin-bottom:0px;
    }
    .panel.illustration *{
        text-decoration:none;
    }
    .panel.illustration h4{
        margin:0px;
        color:#000000;
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.illustration p{
        margin:10px 0 10px 0;
    }
.panel.illustration.hover:hover{
    background:var(--panelIllustration-hover-bgColor);
}
/*コラム*/
.panel.column{
    background-color:var(--panelColumn-bgColor);
}
    .panel.column > *:first-child{
        margin-top:0px;
    }
    .panel.column > *:last-child{
        margin-bottom:0px;
    }
    .panel.column h4{
        margin:0px;
        color:#303030;
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.column p{
        margin:10px 0 10px 0;
    }
/*補足*/
.panel.supplement{
    background-color:var(--panelSupplement-bgColor);
}
    .panel.supplement > *:first-child{
        margin-top:0px;
    }
    .panel.supplement > *:last-child{
        margin-bottom:0px;
    }
    .panel.supplement h4{
        margin:0px;
        color:#303030;
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.supplement p{
        margin:10px 0 10px 0;
    }
/*校正用補足*/
.panel.temp_supplement{
    background-color:var(--panelTempSupplement-bgColor);
    color:var(--fontColor-dark);
}
    .panel.temp_supplement h4{
        margin:0px;
        color:var(--fontColor-dark);
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.temp_supplement p{
        margin:10px 0 10px 0;
    }
/*校正用質問*/
.panel.temp_question{
    background-color:var(--panelTempQuestion-bgColor);
    color:var(--fontColor-dark);
}
    .panel.temp_question h4{
        margin:0px;
        color:var(--fontColor-dark);
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.temp_question p{
        margin:10px 0 10px 0;
    }
/*校正用回答*/
.panel.temp_answer{
    background-color:var(--panelTempAnswer-bgColor);
    color:var(--fontColor-dark);
}
    .panel.temp_answer h4{
        margin:0px;
        color:var(--fontColor-dark);
        font-size:1.2em;
        font-weight:bold ;
    }
    .panel.temp_answer p{
        margin:10px 0 10px 0;
    }
/*アピールポイント(テーマカラー)*/
.panel.appeal{
    background:var(--accentColor);
    border-radius:var(--border-radius);
    margin:0px 0px 10px 0px;
    color:#FFFFFF;
    text-align:center;
    padding:10px 5px 10px 5px;
    font-size:1.5em;
    display:flex;
    align-items:center;
    text-decoration:none;
}
    .panel.appeal span{
        text-align:center;
        width:100%;
    }
/*サブメニュータイトル*/
.panel.subMenuTitle{
    border-radius:5px;
    width:100%;
    color:#FFFFFF;
    text-align:center;
    padding:8px 0 8px 0;
    font-size:14px;
    background:linear-gradient(to bottom, #45484d 0%,#000000 100%);
    display:block;
    text-decoration:none;
    margin:8px 0 8px 0;
}
/*サブメニュー
*/
.panel.subMenu{
    border-radius:5px;
    width:100%;
    color:#FFFFFF;
    text-align:center;
    padding:8px 0 8px 0;
    margin:0;
    font-size:14px;
    background-size:4px 4px;
    background-color:#919191;
    background-image:linear-gradient(#464646 2px, transparent 8px, transparent) ;
    border:2px solid #ABABAB;
    display:block;
    text-decoration:none;
}
/*ボタン*/
.panel.button{
    background:rgb(69,72,77);
    background:linear-gradient(to bottom, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%);
    border-radius:5px;
    margin:0px 0px 10px 0px;
    color:#FFFFFF;
    text-align:center;
    padding:8px 10px 8px 10px;
    display:flex;
    align-items:center;
    text-decoration:none;
    border:1px solid #000000;
}
    .panel.button span{
        text-align:center;
        width:100%;
    }
.panel.button.hover:hover{
    background:#6D6D6D;
    border:1px solid #000000;
}
/*****************************************************************************/
/*タイトル*/
/*****************************************************************************/
/* ページタイトル -----------------------------------------------*/
.pageTitle{
    margin:var(--pageTitle-margin);
    padding:var(--pageTitle-padding);
    color:var(--pageTitle-color);
    background-color:var(--pageTitle-background-color);
    border-radius:var(--pageTitle-border-radius);
    font-size:var(--pageTitle-font-size);
    font-weight:var(--pageTitle-font-weight);
    line-height:var(--pageTitle-line-height);
    text-align:var(--pageTitle-text-align);
}
.PS-pageTitleBasic,.PS-Basic{
    --pageTitle-margin:0px 0px 30px 0px ;
    --pageTitle-padding:12px 20px 10px 20px;
    --pageTitle-color:var(--fontColor-dark);
    --pageTitle-background-color:#292929;
    --pageTitle-border-radius:5px;
    --pageTitle-font-size:24px;
    --pageTitle-font-weight:initial;
    --pageTitle-line-height:1.3em;
    --pageTitle-text-align:initial;
}
.PS-pageTitleSimple{
    --pageTitle-margin:0px 0px 30px 0px ;
    --pageTitle-padding:12px 20px 10px 20px;
    --pageTitle-color:initial;
    --pageTitle-background-color:initial;
    --pageTitle-border-radius:initial;
    --pageTitle-font-size:28px;
    --pageTitle-font-weight:initial;
    --pageTitle-line-height:1.3em;
    --pageTitle-text-align:center;
}
/* セクションタイトル -----------------------------------------------------*/
.PS-sectionTitleBasic,.PS-Basic{
    --sectionTitle-margin:10px 0px 20px 0px ;
    --sectionTitle-padding:10px 0px 10px 10px;
    --sectionTitle-color:var(--fontColor-bright);
    --sectionTitle-background-image:repeating-linear-gradient(-45deg, #F9F7F5, #F9F7F5 10px, #F6F0EA 0, #F6F0EA 15px);
    --sectionTitle-font-size:26px;
    --sectionTitle-border-left:10px solid var(--accentColor);
    --sectionTitle-line-height:1.1em;
}
.sectionTitle{
    margin:var(--sectionTitle-margin);
    padding:var(--sectionTitle-padding);
    color:var(--sectionTitle-color);
    background-image:var(--sectionTitle-background-image);
    font-size:var(--sectionTitle-font-size);
    border-left:var(--sectionTitle-border-left);
    line-height:var(--sectionTitle-line-height);
}
    .sectionTitle div{
        color:var(--accentColor);
        font-family:"Arial Black";
    }
/* 大タイトル ---------------------------------------------------*/
.bigTitle{
    margin:var(--bigTitle-margin);
    padding:var(--bigTitle-padding);
    color:var(--bigTitle-color);
    font-size:var(--bigTitle-font-size);
    border-left:var(--bigTitle-border-left);
    line-height:var(--bigTitle-line-height);
}
    .bigTitle div{
        color:var(--accentColor);
        font-family:"Arial Black";
    }
.bigTitle:first-child{
    margin-top:0px;
}
.bigTitle:last-child{
    margin-bottom:0px;
}
.PS-bigTitleBasic,.PS-Basic{
    --bigTitle-padding:10px 0px 10px 10px;
    --bigTitle-color:var(--fontColor-bright);
    --bigTitle-font-size:24px;
    --bigTitle-margin:20px 0px 20px 0px ;
    --bigTitle-border-left:10px solid var(--accentColor);
    --bigTitle-line-height:24px;
}
/* タイトル -----------------------------------------------------*/
.title{
    margin:var(--title-margin);
    padding:var(--title-padding);
    color:var(--title-color);
    background:var(--title-background);
    font-size:var(--title-font-size);
    font-weight:var(--title-font-weight);
    border-bottom:var(--title-border-bottom);
    border-radius:var(--title-border-radius);
}
    .title *{
        font-weight:bold;
    }
.PS-titleBasic,.PS-Basic{
    --title-margin:20px 0px 20px 0px ;
    --title-padding:2px 0px 4px 0px;
    --title-color:var(--fontColor-bright);
    --title-background:initial;
    --title-font-size:1.3em;
    --title-font-weight:bold;
    --title-border-bottom:3px dashed var(--accentColor);
    --title-border-radius:initial;
}
.PS-titleImpact{
    --title-margin:20px 0px 20px 0px ;
    --title-padding:8px 10px 6px 10px;
    --title-color:var(--fontColor-dark);
    --title-background:var(--accentColor);
    --title-font-size:16px;
    --title-font-weight:initial;
    --title-border-bottom:initial;
    --title-border-radius:var(--border-radius);
}
/* 小タイトル -----------------------------------------------------*/
.smallTitle{
    font-size:1.2em;
    margin:20px 0px 20px 0px ;
    color:#2C2C2C;
    font-weight:bold;
}
    /*アンカー対応*/
    .smallTitle *{
        font-weight:bold;
    }
/*ミニタイトル -----------------------------------------------------*/
.miniTitle{
    width:auto;
    color:var(--fontColor-dark);
    padding:2px 8px 0px 8px;
    /* font-size:0.8em; */
    background:var(--accentColor);
    display:block;
    text-decoration:none;
    word-wrap:break-word;
    display:table-cell;
}
/*タイトルと記事 -----------------------------------------------------*/
.titleArticle{
    border:var(--titleArticle-border);
    margin-bottom:var(--titleArticle-margin-bottom);
    border-radius:var(--titleArticle-border-radius);
}
    .titleArticle > *:nth-child(1){
        padding:var(--titleArticleChild1-padding);
        font-size:var(--titleArticleChild1-font-size);
        color:var(--titleArticleChild1-color);
        background:var(--titleArticleChild1-background);
    }
    .titleArticle > *:nth-child(2){
        padding:var(--titleArticleChild2-padding);
        margin-top:var(--titleArticleChild2-margin-top);
    }
.PS-titleArticleBasic,.PS-Basic{
    --titleArticle-border:2px solid var(--accentColor);
    --titleArticle-margin-bottom:20px;
    --titleArticle-border-radius:var(--border-radius);
    --titleArticleChild1-padding:8px 10px 6px 10px;
    --titleArticleChild1-font-size:16px;
    --titleArticleChild1-color:var(--fontColor-dark);
    --titleArticleChild1-background:var(--accentColor);
    --titleArticleChild2-padding:0 10px 0 10px;
    --titleArticleChild2-margin-top:0;
}
/*リンクボタン -----------------------------------------------------*/
.linkBotton{
    /* border-radius:5px; */
    width:auto;
    color:var(--fontColor-dark);
    /* text-align:center; */
    padding:2px 8px 2px 8px;
    /* font-size:0.8em; */
    background:var(--accentColor);
    display:block;
    text-decoration:none;
    word-wrap:break-word;
    display:table-cell;
}
.linkBotton:hover{
    background:#9AF125;
}
.linkBotton:visited{
    color:var(--fontColor-dark);
}
/*****************************************************************************/
/*レイアウト*/
/*****************************************************************************/
section{
    margin-bottom:50px;
}
    section > *:first-child{
        margin-top:0px;
    }
    section > *:last-child{
        margin-bottom:0px;
    }
/*ブロック -----------------------------------------------------------------*/
.block{
    margin-bottom:30px;
}
    .block > *:first-child{
        margin-top:0px;
    }
    .block > *:last-child{
        margin-bottom:0px;
    }
/* インデント ---------------------------------------------------------------*/
.blockIndent1{
    margin-left:1em;
}
    .blockIndent1 > *:first-child{
        margin-top:0px;
    }
    .blockIndent1 > *:last-child{
        margin-bottom:0px;
    }
.blockIndent2{
    margin-left:2em;
}
    .blockIndent2 > *:first-child{
        margin-top:0px;
    }
    .blockIndent2 > *:last-child{
        margin-bottom:0px;
    }
.blockIndent3{
    margin-left:3em;
}
    .blockIndent3 > *:first-child{
        margin-top:0px;
    }
    .blockIndent3 > *:last-child{
        margin-bottom:0px;
    }
.blockIndent{
    margin-left:10px;
}
    .blockIndent > *:first-child{
        margin-top:0px;
    }
    .blockIndent > *:last-child{
        margin-bottom:0px;
    }
.blockIndentL{
    margin-left:20px;
}
    .blockIndentL > *:first-child{
        margin-top:0px;
    }
    .blockIndentL > *:last-child{
        margin-bottom:0px;
    }
.blockIndentLL{
    margin-left:40px;
}
    .blockIndentLL > *:first-child{
        margin-top:0px;
    }
    .blockIndentLL > *:last-child{
        margin-bottom:0px;
    }
/*****************************************************************************/
/*タイル・段組*/
/*****************************************************************************/
.tile{
    display:flex;
    flex-direction:row;
    align-items:center;
    flex-wrap:wrap;
    justify-content:space-between;
    margin-bottom:20px;
}
.tile.top{
    align-items:flex-start;
}
.tile.bottom{
    align-items:flex-end;
}
.tile.tileLeft{
    justify-content:flex-start;
}
.tile.tileRight{
    justify-content:flex-end;
}
.tile.tileCenter{
    justify-content:center;
}
.tile.row{
    flex-direction:column;
    justify-content:flex-start;
}
    .tile.row > *{
    }
.columWrap{
    justify-content:flex-start;
}
    .columWrap > *{
        margin:5px;
    }
.column1{
}
    .column1 > *:first-child{
        margin-top:0px;
    }
    .column1 > *:last-child{
        margin-bottom:0px;
    }
.column1.width100per{
}
    .column1.width100per > *{
        width:100%;
    }
.column2{
}
    .column2 > *{
        width:calc((100% - 10px) / 2);
    }
        .column2 > * > *:first-child{
            margin-top:0px;
        }
        .column2 > * > *:last-child{
            margin-bottom:0px;
        }
.column2.equalDiv{
}
    .column2.equalDiv > *:nth-child(1){
        width:calc((100% - 10px) / var(--colum2-divisor));
    }
    .column2.equalDiv > *:nth-child(2){
        width:calc(((100% - 10px) / var(--colum2-divisor)) * var(--colum2-multiplier)) ;
    }
.column2.equalDiv.r1to1{
    --colum2-divisor:2;
    --colum2-multiplier:1;
}
.column2.equalDiv.r1to2{
    --colum2-divisor:3;
    --colum2-multiplier:2;
}
.column2.equalDiv.r1to3{
    --colum2-divisor:4;
    --colum2-multiplier:3;
}
.column2.equalDiv.r1to4{
    --colum2-divisor:5;
    --colum2-multiplier:4;
}
.column2.auto{
    flex-wrap:nowrap;
}
    .column2.auto > *:nth-child(1){
        width:auto;
        margin-right:10px;
    }
    .column2.auto > *:nth-child(2){
        width:100%;
    }
.column2.autoRL{
}
    .column2.autoRL > *:nth-child(1){
        width:auto;
        margin-right:10px;
    }
    .column2.autoRL > *:nth-child(2){
        width:auto;
    }
.column2.fix{
}
    .column2.fix > *:nth-child(1){
        width:var(--colum2-fixWidth);
        margin-right:10px;
    }
    .column2.fix > *:nth-child(2){
        width:calc(100% - 10px - var(--colum2-fixWidth));
    }
.column2.fix.width70{
    --colum2-fixWidth:70px;
}
.column2.fix.width100{
    --colum2-fixWidth:100px;
}
.column2.fix.width150{
    --colum2-fixWidth:150px;
}
.column2.fix.width200{
    --colum2-fixWidth:200px;
}
.column3{
}
    .column3 > *{
        width:calc((100% - 20px) / 3);
    }
        .column3 > * > *:first-child{
            margin-top:0px;
        }
        .column3 > * > *:last-child{
            margin-bottom:0px;
        }
.line2{
}
    .line2 > *{
        height:3em;
    }
.alignStrech{
    align-items:stretch;
}
/*アイコン
*/
.iconStyle{
    background-color:#F2F2F2;
    padding:10px;
    line-height:1;
    width:90px;
    height:90px;
}
/*罫線*/
.rule1{
}
    .rule1 > *{
        border-bottom:solid #E6E6E6 1px;
        margin-bottom:5px;
    }
        .rule1 > * > *{
            border-right:solid #E6E6E6 1px;
            margin-bottom:5px;
        }
        .rule1 > * > *:last-child{
            border-right:0px;
        }
    .rule1 > *:last-child{
        border-bottom:0px;
        margin-bottom:0;
    }
/* アンカー -----------------------------------------------------*/
a{
    color:#292929;
}
a:visited{
    color:#292929;
}
/*****************************************************************************/
/*テーブル*/
/*****************************************************************************/
/*テーブルデザイン(Design1) ----------*/
.tableDesign1{
    border:1px #CDCDCD solid;
    border-collapse:collapse;
    border-spacing:0;
    margin-top:16px;
    margin-bottom:16px;
}
    .tableDesign1 th{
        padding:5px;
        vertical-align:top;
        background-color:#E5E5E5;
        border:1px #CDCDCD solid;
        border-width:0 0 1px 1px;
        text-align:left;
        font-weight:normal;
    }
        .tableDesign1 th > *:first-child{
            margin-top:0px;
        }
        .tableDesign1 th > *:last-child{
            margin-bottom:0px;
        }
    .tableDesign1 th.textRight{
        text-align:right;
    }
    .tableDesign1 td{
        padding:5px;
        vertical-align:top;
        background-color:#FFFFFF;
        border:1px #CDCDCD solid;
        border-width:0 0 1px 1px;
    }
        .tableDesign1 td > *:first-child{
            margin-top:0px;
        }
        .tableDesign1 td > *:last-child{
            margin-bottom:0px;
        }
/*テーブルデザイン(Design) ----------*/
.tableDesign2{
    border:0;
    border-collapse:collapse;
    border-spacing:0;
    margin-top:16px;
    margin-bottom:16px;
}
    .tableDesign2 th{
        padding:5px;
        text-align:left;
        font-weight:normal;
        vertical-align:top;
        background-color:#98D8FA;
        border:1px #012032 solid;
        border-width:1px 0 1px 0;
        color:#272727;
    }
        .tableDesign2 th > *:first-child{
            margin-top:0px;
        }
        .tableDesign2 th > *:last-child{
            margin-bottom:0px;
        }
    .tableDesign2 th.textRight{
        text-align:right;
    }
    .tableDesign2 td{
        padding:5px;
        vertical-align:top;
        background-color:#FFFFFF;
        border:1px #012032 solid;
        border-width:1px 0 1px 0;
    }
        .tableDesign2 td > *:first-child{
            margin-top:0px;
        }
        .tableDesign2 td > *:last-child{
            margin-bottom:0px;
        }
    .tableDesign2 tr:nth-child(odd){
    }
        .tableDesign2 tr:nth-child(odd) td{
            background-color:#EEF8FF;
        }
    .tableDesign2 tr:nth-child(even){
    }
        .tableDesign2 tr:nth-child(even) td{
            background-color:#DEF0FE;
        }
/* 小見出しと文章 -----------------------------------------------*/
.article{
    margin-bottom:10px;
    padding:0px 5px 0px 10px;
    /* padding:0px 5px 5px 10px; */
    /* background-color:#EEEEEE; */
}
    .article p{
        margin-top:0px;
        margin-bottom:0px;
        margin-left:10px;
        text-indent:0em;
    }
/* 引用とタイトル -----------------------------------------------*/
.blockquote{
}
    .blockquote p{
        margin-top:0px;
        margin-bottom:0px;
        margin-left:1em;
        font-weight:bold;
        font-size:12px;
        text-indent:0em;
    }
    .blockquote blockquote{
        font-family:'ＭＳ ゴシック';
        margin-top:0px;
        border:1px solid #DDDDDD;
        border-left:5px solid #CCCCCC;
        padding-left:10px;
    }
/*はみ出した部分の表示方法 -----------------------------------------------*/
.overflowAuto{
    overflow:auto;
}
/*挿絵(image) -------------------------------------------------------------*/
.artwork{
    margin-bottom:20px;
    margin-top:20px;
    text-align:center;
    position:relative;
}
/* 文字色 -------------------------------------------------------------------*/
/*aタグに.colorAを指定しても:visitedだと適用されないという問題が起こるので、:definedを付けると全ての状態の要素に適用される。*/
.colorA:defined{
    color:#C30000;
}
.colorB:defined{
    color:#002EC2;
}
.colorC:defined{
    color:#7A3A00;
}
/* 文字装飾 -----------------------------------------------------------------*/
.ornamentA{
    border:2px dotted #C30000;
    padding:3px 10px 3px 10px;
    color:#C30000;
    line-height:42px;
}
.ornamentAs{
    border:2px dotted #C30000;
    padding:3px 3px 3px 3px;
    color:#C30000;
    line-height:42px;
}
.ornamentB{
    padding:3px 10px 3px 10px;
    color:#000000;
    background-color:#FFAE00;
    line-height:42px;
}
.ornamentBs{
    padding:3px 3px 3px 3px;
    color:#000000;
    background-color:#FFAE00;
    line-height:42px;
}
/* 定義リスト ---------------------------------------------------------------*/
dl.horizon4{
}
    dl.horizon4 dd{
        margin-left:4em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon6{
}
    dl.horizon6 dd{
        margin-left:6em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon8{
}
    dl.horizon8 dd{
        margin-left:8em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon10{
}
    dl.horizon10 dd{
        margin-left:10em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon12{
}
    dl.horizon12 dd{
        margin-left:12em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon14{
}
    dl.horizon14 dd{
        margin-left:14em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
dl.horizon16{
}
    dl.horizon16 dd{
        margin-left:14em;
        margin-top:-1.5em;
        margin-bottom:0.5em;
    }
/*例 + 連番 -----------------------------------------------------------------*/
.exampleNumber{
    counter-reset:example-number;
}
    .exampleNumber > *{
        margin-bottom:30px;
        page-break-inside:avoid;
    }
    .exampleNumber > *:first-child{
        margin-top:0px;
    }
    .exampleNumber > *:last-child{
        margin-bottom:0px;
    }
    .exampleNumber > *:before{
        counter-increment:example-number;
        content:"例" counter(example-number);
        font-size:16px;
        color:#2C2C2C;
        font-weight:bold;
    }
/* フォント -----------------------------------------------------------------*/
.fixedFont{
    font-family:'ＭＳ ゴシック';
}
/* リスト(ポチなし) ---------------------------------------------------------*/
.listStyleNone{
}
    .listStyleNone li{
        list-style:none outside;
    }
/* リスト(チェックボックス) ---------------------------------------------------------
属性セレクタでcheckedの場合にチェック状態のチェックボックスを表示する*/
.listStyleCheckBox{
}
    .listStyleCheckBox li{
        background:url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNDhweCIgaGVpZ2h0PSI0OHB4IiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjU2IDI1NiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSIjMkMyQzJDIiBkPSJNMjQzLDI0MUgxNVYxM2gyMjhWMjQxeiBNMzcsMjE5aDE4NFYzNUgzN1YyMTl6Ii8+DQo8L3N2Zz4NCg==") no-repeat;
        list-style-type:none;
        padding:2px 10px 0px 32px;
        line-height:24px;
    }
    .listStyleCheckBox li[checked]{
        background:url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNDhweCIgaGVpZ2h0PSI0OHB4IiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjU2IDI1NiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSIjMkMyQzJDIiBkPSJNMjQzLDI0MUgxNVYxM2gyMjhWMjQxeiBNMzcsMjE5aDE4NFYzNUgzN1YyMTl6Ii8+DQo8cG9seWdvbiBmaWxsPSIjMkMyQzJDIiBwb2ludHM9IjExNS4wMTQsMTk2LjcwNiA1Mi40MzgsMTM1Ljc5NSA2OC40MDQsMTE5LjM4MSAxMTIuNjc4LDE2Mi40NzIgMTg3LjgyNyw2Ni4xNjMgMjA1Ljg3NCw4MC4yNDkgIi8+DQo8L3N2Zz4NCg==") no-repeat;
        list-style-type:none;
        padding:2px 10px 0px 32px;
    }
/*矢印 ------------------------------------*/
.upwardArrow:before{
    position:absolute;
    content:'';
    border:16px solid transparent;
    border-bottom-color:#7CCF0C;
    top:-20px;
    left:-36px;
    width:0;
    height:0;
}
.upwardArrow{
    position:relative;
    margin:10px 0 10px 36px;
}
.upwardArrow:after{
    position:absolute;
    content:'';
    top:8px;
    left:-28px;
    width:16px;
    height:16px;
    background:#7CCF0C;
}
.downwardArrow:before{
    position:absolute;
    content:'';
    border:16px solid transparent;
    border-top-color:#7CCF0C;
    top:12px;
    left:-36px;
    width:0;
    height:0;
}
.downwardArrow{
    position:relative;
    margin:10px 0 10px 36px;
}
.downwardArrow:after{
    position:absolute;
    content:'';
    top:0px;
    left:-28px;
    width:16px;
    height:16px;
    background:#7CCF0C;
}
.rightArrowRightText:before{
    position:absolute;
    content:'';
    border:16px solid transparent;
    border-left-color:#7CCF0C;
    top:-4px;
    left:-20px;
    width:0;
    height:0;
}
.rightArrowRightText{
    position:relative;
    margin:10px 0 10px 36px;
}
.rightArrowRightText:After{
    position:absolute;
    content:'';
    top:4px;
    left:-36px;
    width:16px;
    height:16px;
    background:#7CCF0C;
}
.rightArrow:before{
    position:absolute;
    content:'';
    border:16px solid transparent;
    border-left-color:#7CCF0C;
    top:-36px;
    left:16px;
    width:0;
    height:0;
}
.rightArrow{
    position:relative;
    margin:32px 10px 0px 10px;
}
    .rightArrow *{
        margin-bottom:0;
    }
.rightArrow:after{
    position:absolute;
    content:'';
    top:-28px;
    left:0px;
    width:16px;
    height:16px;
    background:#7CCF0C;
}
.leftArrow:before{
    position:absolute;
    content:'';
    border:16px solid transparent;
    border-right-color:#7CCF0C;
    top:-36px;
    left:-16px;
    width:0;
    height:0;
}
.leftArrow{
    position:relative;
    margin:32px 10px 0px 10px;
}
    .leftArrow *{
        margin-bottom:0;
    }
.leftArrow:after{
    position:absolute;
    content:'';
    top:-28px;
    left:16px;
    width:16px;
    height:16px;
    background:#7CCF0C;
}
/*****************************************************************************/
/*フォルダ構成*/
/*****************************************************************************/
.treeIcon{
    width:20px;
    height:20px;
    display:inline;
    margin-left:-28px;
    margin-right:6px;
    min-width:20px;
}
.fileSystem{
    width:100%;
}
    .fileSystem > *{
        margin-left:0px;
    }
    .fileSystem .fileSystemList{
        margin:0 0 0 -8px;
        padding:0px;
        line-height:20px;
        clear:both;
    }
        .fileSystem .fileSystemList > li{
            margin:0px;
            padding:0 0 0 28px;
            list-style:none;
            line-height:20px;
            overflow:hidden;
        }
            .fileSystem .fileSystemList > li > div:nth-child(1){
                width:calc(100% - 380px);
                word-break:break-all;
                border-top:1px solid #E9E9E9;
                float:left;
                display:flex;
            }
            .fileSystem .fileSystemList > li > div:nth-child(2){
                width:380px;
                word-break:break-all;
                border-top:1px solid #E9E9E9;
                padding-left:10px;
                float:right;
            }
.settingTree{
}
    .settingTree .fileSystemList{
    }
        .settingTree .fileSystemList li{
        }
            .settingTree .fileSystemList li > div:nth-child(1){
                width:100%;
                border-top:0px;
            }
@media screen and (max-width: 800px) {
.fileSystem{
}
    .fileSystem .fileSystemList{
    }
        .fileSystem .fileSystemList > li{
        }
            .fileSystem .fileSystemList > li div:nth-child(1){
                width:calc(100% - 250px);
            }
            .fileSystem .fileSystemList > li div:nth-child(2){
                width:250px;
            }
.settingTree{
}
    .settingTree .fileSystemList{
    }
        .settingTree .fileSystemList li{
        }
            .settingTree .fileSystemList li > div:nth-child(1){
                width:100%;
            }
}
@media screen and (max-width: 600px) {
.fileSystem{
}
    .fileSystem .fileSystemList{
    }
        .fileSystem .fileSystemList > li{
        }
            .fileSystem .fileSystemList > li div:nth-child(1){
                width:calc(100% - 200px);
            }
            .fileSystem .fileSystemList > li div:nth-child(2){
                width:200px;
            }
.settingTree{
}
    .settingTree .fileSystemList{
    }
        .settingTree .fileSystemList li{
        }
            .settingTree .fileSystemList li > div:nth-child(1){
                width:100%;
            }
}
@media screen and (max-width: 480px) {
.fileSystem{
}
    .fileSystem .fileSystemList{
    }
        .fileSystem .fileSystemList > li{
        }
            .fileSystem .fileSystemList > li div:nth-child(1){
                width:calc(100% - 150px);
            }
            .fileSystem .fileSystemList > li div:nth-child(2){
                width:150px;
            }
.settingTree{
}
    .settingTree .fileSystemList{
    }
        .settingTree .fileSystemList li{
        }
            .settingTree .fileSystemList li > div:nth-child(1){
                width:100%;
            }
}
/* float --------------------------------------------------------------------
*/
.right{
    float:right;
}
.left{
    float:left;
}
.clear{
    clear:both;
}
.floatLeftMargin{
    float:left;
    margin-left:0px;
    margin-right:10px;
    margin-bottom:10px;
}
.floatRightMargin{
    float:right;
    margin-left:10px;
    margin-right:0px;
    margin-bottom:10px;
}
.clearFix{
    overflow:hidden;
}
/*Image位置 ----------------------------------------------------------------*/
.imgCenter{
    display:block;
    margin:auto;
}
/* Text位置 -----------------------------------------------------------------*/
.textCenter{
    text-align:center;
}
.textRight{
    text-align:right;
}
.textLeft{
    text-align:left;
}
/* フォントサイズ -----------------------------------------------------------*/
.fontSS{
    font-size:0.5em;
}
.fontS{
    font-size:0.8em;
}
.fontL{
    font-size:1.2em;
}
.fontLL{
    font-size:1.5em;
}
.fontLLL{
    font-size:1.8em;
}
/* フォント太さ -----------------------------------------------------------*/
.fontBold{
    font-weight:bold;
}
/* テキストインデント -------------------------------------------------------*/
.textIndent1{
    text-indent:1em;
}
.textIndent0{
    text-indent:0em;
}
.textIndent-1{
    text-indent:-1em;
}
/* 行の高さ -----------------------------------------------------------------*/
.lineHeight100{
    line-height:100%;
}
.lineHeight150{
    line-height:150%;
}
.lineHeight200{
    line-height:200%;
}
/* 文字の折り返し -----------------------------------------------------------*/
.breakWord{
    word-wrap:break-word;
}
.breakAll{
    word-break:break-all;
}
/* 枠線 ---------------------------------------------------------------------*/
.border{
    border:solid 1px #000000;
}
.dotted{
    border-style:dotted;
    border-color:#555555;
}
/*印刷制御 ------------------------------------------------------------------*/
.pageBreak{
    page-break-after:always;
}
.avoid{
    page-break-inside:avoid;
}
/*角丸 ------------------------------------------------------------------*/
.radiusTopLeft{
    border-top-left-radius:5px;
}
.radiusTopRight{
    border-top-right-radius:5px;
}
.radiusBottomLeft{
    border-bottom-left-radius:5px;
}
.radiusBottomRight{
    border-bottom-right-radius:5px;
}
/*****************************************************************************/
/*イラスト*/
/*****************************************************************************/
.rule{
    width:100px;
    height:100px;
    float:left;
    margin:0px;
    position:relative;
}
.rule50{
    width:50px;
    height:50px;
    float:left;
    margin:0px;
    position:relative;
}
.ruleW50{
    width:50px;
    height:100px;
    float:left;
    margin:0px;
    position:relative;
}
.ruleH50{
    width:100px;
    height:50px;
    float:left;
    margin:0px;
    position:relative;
}
.ruleWH50{
    width:50px;
    height:50px;
    float:left;
    margin:0px;
    position:relative;
}
.ruleManyCommentsW{
    width:120px;
    height:60px;
    float:left;
    margin:0px;
    position:relative;
}
.ruleManyCommentsWH{
    width:120px;
    height:180px;
    float:left;
    margin:0px;
    position:relative;
}
.rotate90{
    transform:rotate(90deg);
}
.rotate180{
    transform:rotate(180deg);
}
.rotate270{
    transform:rotate(270deg);
}
.reverseX{
    transform:scaleX(-1);
}
.reverseY{
    transform:scaleY(-1);
}
.reverseXY{
    transform:scale(-1,-1);
}
.overlayillust{
    position:relative;
}
    .overlayillust > svg{
        position:absolute;
    }
.illustList{
    background-color:rgba(220,220,220,0.5);
    border-radius:6px;
    padding:10px;
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    flex-wrap:wrap;
}
    .illustList > div{
        display:flex;
        flex-direction:row;
        /* align-items:center; */
        justify-content:flex-start;
        width:100%;
        z-index:2;
    }
        .illustList > div > .illust{
            width:100%;
            max-width:100px;
            min-height:100px;
            padding:0px;
            display:flex;
            flex-direction:column;
            /* width:calc(100% / 5); */
            align-items:flex-start;
            align-items:stretch;
            margin:2px;
        }
            .illustList > div > .illust > .illustArea{
                max-height:70px;
                width:100%;
                position:relative;
                display:flex;
                align-items:stretch;
                flex-direction:column;
                padding:3px;
            }
            .illustList > div > .illust > .nameArea{
                text-align:center;
                font-size:10px;
                line-height:10px;
                width:100%;
                word-break:break-all;
            }
            .illustList > div > .illust > .textUp{
                margin-top:-5%;
            }
            .illustList > div > .illust > .textUpM{
                margin-top:-20%;
            }
            .illustList > div > .illust > .textUpL{
                margin-top:-30%;
            }
        /*吹き出し・枠の背景色*/
        .illustList > div > .illust.bg_colorA{
            background-color:#F7D2D2;
        }
        /*吹き出しの矢印
*/
        .illustList > div .illust.leftArrowInBubble{
            position:relative;
        }
        .illustList > div .illust.leftArrowInBubble:after{
            content:"";
            position:absolute;
            right:0;
            bottom:70%;
            left:-110%;
            margin:auto;
            width:0;
            height:0;
            border-style:solid;
            border-width:10px 17.3px 10px 0;
            border-color:transparent #F7D2D2 transparent transparent;
        }
        .illustList > div .illust.rightArrowInBubble{
            position:relative;
        }
        .illustList > div .illust.rightArrowInBubble:after{
            content:"";
            position:absolute;
            right:0;
            bottom:70%;
            left:96%;
            margin:auto;
            width:0;
            height:0;
            border-style:solid;
            border-width:10px 0 10px 17.3px;
            border-color:transparent transparent transparent #F7D2D2;
        }
        /*吹き出し・枠の左ボーダー
*/
        .illustList > div .illust.leftMarginBgColorA{
            position:relative;
        }
        .illustList > div .illust.leftMarginBgColorA:After{
            content:"";
            position:absolute;
            right:0;
            bottom:0;
            left:-5px;
            margin:auto;
            width:100%;
            height:100%;
            border-left:solid 5px #F7D2D2;
        }
        .illustList > div .illust.rightMarginBgColorA{
            position:relative;
        }
        .illustList > div .illust.rightMarginBgColorA:After{
            content:"";
            position:absolute;
            right:0;
            bottom:0;
            right:-5px;
            margin:auto;
            width:100%;
            height:100%;
            border-right:solid 5px #F7D2D2;
        }
        /*吹き出し・枠の左ボーダー上(5px飛び出し)
*/
        .illustList > div .illust.leftMarginBgColorAH105{
            position:relative;
        }
        .illustList > div .illust.leftMarginBgColorAH105:After{
            content:"";
            position:absolute;
            right:0;
            bottom:0;
            left:-5px;
            margin:auto;
            width:100%;
            height:calc(100% + 5px);
            border-left:solid 5px #F7D2D2;
        }
        .illustList > div .illust.rightMarginBgColorAH105{
            position:relative;
        }
        .illustList > div .illust.rightMarginBgColorAH105:After{
            content:"";
            position:absolute;
            right:0;
            bottom:0;
            right:-5px;
            margin:auto;
            width:100%;
            height:calc(100% + 5px);
            border-right:solid 5px #F7D2D2;
        }
        /*吹き出し・枠の下ボーダー
*/
        .illustList > div .illust.bottomMarginBgColorA{
            position:relative;
        }
        .illustList > div .illust.bottomMarginBgColorA:before{
            content:"";
            position:absolute;
            right:0;
            bottom:-5px;
            left:0;
            margin:auto;
            width:100%;
            height:100%;
            border-bottom:solid 5px #F7D2D2;
        }
        /*イラスト高さ120*/
        .illustList > div > .illust.illustH120{
            height:120px;
        }
            .illustList > div > .illust.illustH120 > .illustArea{
                max-height:90px;
            }
            .illustList > div > .illust.illustH120 > .nameArea{
                font-size:12px;
                line-height:12px;
            }
        /*イラスト高さ160*/
        .illustList > div > .illust.illustH160{
            height:160px;
        }
            .illustList > div > .illust.illustH160 > .illustArea{
                max-height:130px;
            }
            .illustList > div > .illust.illustH160 > .nameArea{
                font-size:16px;
                line-height:16px;
            }
        /*イラスト高さ200*/
        .illustList > div > .illust.illustH200{
            height:200px;
        }
            .illustList > div > .illust.illustH200 > .illustArea{
                max-height:170px;
            }
            .illustList > div > .illust.illustH200 > .nameArea{
                font-size:20px;
                line-height:20px;
            }
        /*横2ブロック(5列用)*/
        .illustList > div > .illust.illustMC2block{
            width:calc((100% / 5) * 2);
            max-width:220px;
        }
            .illustList > div > .illust.illustMC2block .illustArea{
                width:100%;
                position:relative;
            }
        .illustList > div .rule{
            /* max-width:100px; */
            width:calc(100% / 5);
            height:100px;
            display:flex;
            flex-direction:column;
            margin:0px;
            position:relative;
            align-items:flex-start;
            align-items:stretch;
        }
        .illustList > div .rule50{
            /* max-width:50px; */
            width:calc(100% / 10);
            height:50px;
            display:flex;
            flex-direction:column;
            margin:0px;
            position:relative;
            align-items:flex-start;
            align-items:stretch;
        }
        .illustList > div .ruleW50{
            /* max-width:50px; */
            width:calc(100% / 10);
            height:100px;
            display:flex;
            flex-direction:column;
            margin:0px;
            position:relative;
            align-items:flex-start;
            align-items:stretch;
        }
        .illustList > div .ruleH50{
            /* max-width:100px; */
            width:calc(100% / 5);
            height:50px;
            display:flex;
            flex-direction:column;
            margin:0px;
            position:relative;
            align-items:flex-start;
            align-items:stretch;
        }
.illustList.margin0{
}
    .illustList.margin0 div{
    }
        .illustList.margin0 div .illust{
            margin:0;
        }
/*吹き出し・枠のレイヤー(イラストのレイヤーの下なので-1と名づけている)*/
.illustList.layer-1{
    position:absolute;
    z-index:1;
    left:0px;
    top:0px;
    background-color:transparent;
}
/*イラスト高さ120*/
.illustList.illustH120{
}
    .illustList.illustH120 > div{
    }
        .illustList.illustH120 > div > .illust{
            height:120px;
        }
            .illustList.illustH120 > div > .illust > .illustArea{
                max-height:90px;
            }
            .illustList.illustH120 > div > .illust > .nameArea{
                font-size:12px;
                line-height:12px;
            }
/*イラスト高さ160*/
.illustList.illustH160{
}
    .illustList.illustH160 > div{
    }
        .illustList.illustH160 > div > .illust{
            height:160px;
        }
            .illustList.illustH160 > div > .illust > .illustArea{
                max-height:130px;
            }
            .illustList.illustH160 > div > .illust > .nameArea{
                font-size:16px;
                line-height:16px;
            }
/*イラスト高さ200*/
.illustList.illustH200{
}
    .illustList.illustH200 > div{
    }
        .illustList.illustH200 > div > .illust{
            height:200px;
        }
            .illustList.illustH200 > div > .illust > .illustArea{
                max-height:170px;
            }
            .illustList.illustH200 > div > .illust > .nameArea{
                font-size:20px;
                line-height:20px;
            }
/*イラストリスト2列*/
.illustList.colmun2{
}
    .illustList.colmun2 div{
    }
        .illustList.colmun2 div .illust{
            width:calc(100% / 2);
            max-width:calc(100% / 2);
        }
        .illustList.colmun2 div > .illust.illustMC2block{
            width:calc((100% / 2) * 2);
            max-width:220px;
        }
        .illustList.colmun2 div > .rule,.illustList.colmun2 div > .ruleH50{
            width:calc(100% / 2);
        }
        .illustList.colmun2 div > .rule50,.illustList.colmun2 div > .ruleW50{
            width:calc(100% / 4);
        }
/*イラストリスト3列*/
.illustList.colmun3{
}
    .illustList.colmun3 div{
    }
        .illustList.colmun3 div .illust{
            width:calc(100% / 3);
            max-width:calc(100% / 3);
        }
        .illustList.colmun3 div > .illust.illustMC2block{
            width:calc((100% / 3) * 2);
            max-width:220px;
        }
        .illustList.colmun3 div > .rule,.illustList.colmun3 div > .ruleH50{
            width:calc(100% / 3);
        }
        .illustList.colmun3 div > .rule50,.illustList.colmun3 div > .ruleW50{
            width:calc(100% / 6);
        }
/*イラストリスト4列*/
.illustList.colmun4{
}
    .illustList.colmun4 div{
    }
        .illustList.colmun4 div .illust{
            width:calc(100% / 4);
            max-width:calc(100% / 4);
        }
        .illustList.colmun4 div > .illust.illustMC2block{
            width:calc((100% / 4) * 2);
            max-width:220px;
        }
        .illustList.colmun4 div > .rule,.illustList.colmun4 div > .ruleH50{
            width:calc(100% / 4);
        }
        .illustList.colmun4 div > .rule50,.illustList.colmun4 div > .ruleW50{
            width:calc(100% / 8);
        }
/*イラストリスト5列*/
.illustList.colmun5{
}
    .illustList.colmun5 div{
    }
        .illustList.colmun5 div .illust{
            width:calc(100% / 5);
            max-width:calc(100% / 5);
        }
        .illustList.colmun5 div > .illust.illustMC2block{
            width:calc((100% / 5) * 2);
            max-width:220px;
        }
        .illustList.colmun5 div > .rule,.illustList.colmun5 div > .ruleH50{
            width:calc(100% / 5);
        }
        .illustList.colmun5 div > .rule50,.illustList.colmun5 div > .ruleW50{
            width:calc(100% / 10);
        }
/*イラストリスト6列*/
.illustList.colmun6{
}
    .illustList.colmun6 div{
    }
        .illustList.colmun6 div .illust{
            width:calc(100% / 6);
            max-width:calc(100% / 6);
        }
        .illustList.colmun6 div > .illust.illustMC2block{
            width:calc((100% / 6) * 2);
            max-width:220px;
        }
        .illustList.colmun6 div > .rule,.illustList.colmun6 div > .ruleH50{
            width:calc(100% / 6);
        }
        .illustList.colmun6 div > .rule50,.illustList.colmun6 div > .ruleW50{
            width:calc(100% / 12);
        }
/*イラストリスト7列*/
.illustList.colmun7{
}
    .illustList.colmun7 div{
    }
        .illustList.colmun7 div .illust{
            width:calc(100% / 7);
            max-width:calc(100% / 7);
        }
        .illustList.colmun7 div > .illust.illustMC2block{
            width:calc((100% / 7) * 2);
            max-width:220px;
        }
        .illustList.colmun7 div > .rule,.illustList.colmun7 div > .ruleH50{
            width:calc(100% / 7);
        }
        .illustList.colmun7 div > .rule50,.illustList.colmun7 div > .ruleW50{
            width:calc(100% / 14);
        }
/*****************************************************************************/
/*階層構造疑似テーブル*/
/*****************************************************************************/
.treeTable.width100{
    --treeTable-col1-width:100px;
    --treeTable-col2-width:100px;
    --treeTable-col3-width:100px;
    --treeTable-col4-width:100px;
    --treeTable-col5-width:100px;
    --treeTable-col6-width:100px;
}
.treeTable.width150{
    --treeTable-col1-width:150px;
    --treeTable-col2-width:150px;
    --treeTable-col3-width:150px;
    --treeTable-col4-width:150px;
    --treeTable-col5-width:150px;
    --treeTable-col6-width:150px;
}
.treeTable.width200{
    --treeTable-col1-width:200px;
    --treeTable-col2-width:200px;
    --treeTable-col3-width:200px;
    --treeTable-col4-width:200px;
    --treeTable-col5-width:200px;
    --treeTable-col6-width:200px;
}
.treeTable{
    display:flex;
    flex-direction:row;
    align-items:center;
    flex-wrap:wrap;
    align-items:stretch;
    width:100%;
    border-right:1px solid;
    border-bottom:1px solid;
    border-color:#AFAFAF;
}
    .treeTable .treeTableHeader{
        background-color:var(--accentColor);
    }
    .treeTable > *{
        display:flex;
        flex-direction:row;
        align-items:center;
        flex-wrap:wrap;
        align-items:stretch;
        width:100%;
    }
        .treeTable > * > *:first-child{
            padding:4px 4px 4px 6px;
            width:var(--treeTable-col1-width);
            border-top:1px solid;
            border-left:1px solid;
            border-color:#AFAFAF;
        }
        .treeTable > * > *:only-child{
            width:100%;
        }
        .treeTable > * > *:nth-child(n+2){
            width:calc(100% - var(--treeTable-col1-width));
            display:flex;
            flex-direction:row;
            align-items:center;
            flex-wrap:wrap;
            align-items:stretch;
        }
            .treeTable > * > *:nth-child(n+2) > *{
                display:flex;
                flex-direction:row;
                align-items:center;
                flex-wrap:wrap;
                align-items:stretch;
                width:100%;
            }
                .treeTable > * > *:nth-child(n+2) > * > *:first-child{
                    padding:4px 4px 0px 6px;
                    width:var(--treeTable-col2-width);
                    border-top:1px solid;
                    border-left:1px solid;
                    border-color:#AFAFAF;
                }
                .treeTable > * > *:nth-child(n+2) > * > *:only-child{
                    width:100%;
                }
                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2){
                    width:calc(100% - var(--treeTable-col2-width));
                    display:flex;
                    flex-direction:row;
                    align-items:center;
                    flex-wrap:wrap;
                    align-items:stretch;
                }
                    .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > *{
                        display:flex;
                        flex-direction:row;
                        align-items:center;
                        flex-wrap:wrap;
                        align-items:stretch;
                        width:100%;
                    }
                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:first-child{
                            padding:4px 4px 0px 6px;
                            width:var(--treeTable-col3-width);
                            border-top:1px solid;
                            border-left:1px solid;
                            border-color:#AFAFAF;
                        }
                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:only-child{
                            width:100%;
                        }
                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2){
                            width:calc(100% - var(--treeTable-col3-width));
                            display:flex;
                            flex-direction:row;
                            align-items:center;
                            flex-wrap:wrap;
                            align-items:stretch;
                        }
                            .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > *{
                                display:flex;
                                flex-direction:row;
                                align-items:center;
                                flex-wrap:wrap;
                                align-items:stretch;
                                width:100%;
                            }
                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:first-child{
                                    padding:4px 4px 0px 6px;
                                    width:var(--treeTable-col4-width);
                                    border-top:1px solid;
                                    border-left:1px solid;
                                    border-color:#AFAFAF;
                                }
                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:only-child{
                                    width:100%;
                                }
                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2){
                                    width:calc(100% - var(--treeTable-col4-width));
                                    display:flex;
                                    flex-direction:row;
                                    align-items:center;
                                    flex-wrap:wrap;
                                    align-items:stretch;
                                }
                                    .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > *{
                                        display:flex;
                                        flex-direction:row;
                                        align-items:center;
                                        flex-wrap:wrap;
                                        align-items:stretch;
                                        width:100%;
                                    }
                                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:first-child{
                                            padding:4px 4px 0px 6px;
                                            width:var(--treeTable-col5-width);
                                            border-top:1px solid;
                                            border-left:1px solid;
                                            border-color:#AFAFAF;
                                        }
                                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:only-child{
                                            width:100%;
                                        }
                                        .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2){
                                            width:calc(100% - var(--treeTable-col5-width));
                                            display:flex;
                                            flex-direction:row;
                                            align-items:center;
                                            flex-wrap:wrap;
                                            align-items:stretch;
                                        }
                                            .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > *{
                                                display:flex;
                                                flex-direction:row;
                                                align-items:center;
                                                flex-wrap:wrap;
                                                align-items:stretch;
                                                width:100%;
                                            }
                                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:first-child{
                                                    padding:4px 4px 0px 6px;
                                                    width:var(--treeTable-col6-width);
                                                    border-top:1px solid;
                                                    border-left:1px solid;
                                                    border-color:#AFAFAF;
                                                }
                                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:only-child{
                                                    width:100%;
                                                }
                                                .treeTable > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2) > * > *:nth-child(n+2){
                                                    width:calc(100% - var(--treeTable-col6-width));
                                                    display:flex;
                                                    flex-direction:row;
                                                    align-items:center;
                                                    flex-wrap:wrap;
                                                    align-items:stretch;
                                                }
/*****************************************************************************/
/*折り返す一覧表
*/
/*****************************************************************************/
.flexList{
    --flexList-col1-width:100px;
    --flexList-col2-width:100px;
    --flexList-col3-width:100px;
    --flexList-col4-width:100px;
    --flexList-col5-width:100px;
    flex-direction:row;
    align-items:center;
    flex-wrap:wrap;
    align-items:stretch;
    width:100%;
    background-color:#C0C0C0;
    border-bottom:1px solid #C0C0C0;
    border-right:1px solid #C0C0C0;
}
    .flexList > .flexListHeader{
    }
        .flexList > .flexListHeader > *:first-child{
        }
            .flexList > .flexListHeader > *:first-child > *{
                background-color:var(--accentColor);
            }
        .flexList > .flexListHeader > *:nth-child(n+2){
        }
            .flexList > .flexListHeader > *:nth-child(n+2) > *{
                background-color:var(--accentColor);
            }
    /*行*/
    .flexList > *{
        display:flex;
        flex-direction:row;
        align-items:center;
        flex-wrap:wrap;
        align-items:stretch;
        width:100%;
    }
        /*1番目の列*/
        .flexList > * > *:first-child{
            width:var(--flexList-col1-width);
        }
            .flexList > * > *:first-child > *{
                margin:1px 0 0 1px;
                background-color:#FFFFFF;
                height:calc(100% - 1px);
                padding:2px;
            }
        .flexList > * > *:only-child{
            width:100%;
        }
        /*2番目以降の列*/
        .flexList > * > *:nth-child(n+2){
            width:calc(100% - var(--flexList-col1-width));
            display:flex;
            flex-direction:row;
            align-items:center;
            flex-wrap:wrap;
            align-items:stretch;
            min-width:var(--flexList-col-miniWidth);
        }
            .flexList > * > *:nth-child(n+2) > .flexListMultiLine{
                display:flex;
                flex-direction:column;
                background-color:transparent;
                padding:0;
            }
                .flexList > * > *:nth-child(n+2) > .flexListMultiLine > *{
                    /* margin:0 0 1px 0; */
                    background-color:#FFFFFF;
                    border-bottom:1px dotted #C0C0C0;
                    padding:2px;
                }
                .flexList > * > *:nth-child(n+2) > .flexListMultiLine > *:last-child{
                    border-bottom:0px;
                }
            .flexList > * > *:nth-child(n+2) > *{
                min-width:100px;
                margin:1px 0 0 1px;
                background-color:#FFFFFF;
                padding:2px;
            }
            .flexList > * > *:nth-child(n+2) > *:only-child{
                width:100%;
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(2){
                width:var(--flexList-col2-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(2)~*{
                width:calc(100% - var(--flexList-col2-width) - 2px);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(3){
                width:var(--flexList-col2-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(3)~*:nth-of-type(2){
                width:var(--flexList-col3-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(3)~*:nth-of-type(3){
                width:calc(100% - var(--flexList-col2-width) - var(--flexList-col3-width) - 3px);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(4){
                width:var(--flexList-col2-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(4)~*:nth-of-type(2){
                width:var(--flexList-col3-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(4)~*:nth-of-type(3){
                width:var(--flexList-col4-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(4)~*:nth-of-type(4){
                width:calc(100% - var(--flexList-col2-width) - var(--flexList-col3-width) - var(--flexList-col4-width) - 4px);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(5){
                width:var(--flexList-col2-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(5)~*:nth-of-type(2){
                width:var(--flexList-col3-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(5)~*:nth-of-type(3){
                width:var(--flexList-col4-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(5)~*:nth-of-type(4){
                width:var(--flexList-col5-width);
            }
            .flexList > * > *:nth-child(n+2) > *:first-child:nth-last-child(5)~*:nth-of-type(5){
                width:calc(100% - var(--flexList-col2-width) - var(--flexList-col3-width) - var(--flexList-col4-width) - var(--flexList-col5-width) - 5px);
            }
    .flexList > *:nth-child(n+2):hover{
        background-color:#55B7FF;
    }
        .flexList > *:nth-child(n+2):hover > *:first-child{
        }
            .flexList > *:nth-child(n+2):hover > *:first-child > *{
                background-color:transparent;
            }
        .flexList > *:nth-child(n+2):hover > *:nth-child(n+2){
        }
            .flexList > *:nth-child(n+2):hover > *:nth-child(n+2) > .flexListMultiLine{
                background-color:transparent;
            }
                .flexList > *:nth-child(n+2):hover > *:nth-child(n+2) > .flexListMultiLine > *{
                    background-color:transparent;
                }
            .flexList > *:nth-child(n+2):hover > *:nth-child(n+2) > *{
                background-color:transparent;
            }
/*折り返す一覧表2
*/
.flexList2{
    /* width:100%; */
    border-left:1px solid var(--borderColor);
    border-top:1px solid var(--borderColor);
}
    .flexList2 .listTitle{
        background-color:var(--accentColor);
    }
    .flexList2 .multiLine{
        padding:0;
    }
        .flexList2 .multiLine > *{
            border-bottom:1px solid var(--borderColor);
            padding:5px;
        }
        .flexList2 .multiLine > *:last-child{
            border-bottom:0px;
        }
    .flexList2 > *:nth-child(n+2):nth-child(odd){
        background-color:var(--list-odd-bgColor);
    }
    .flexList2 > *:nth-child(even){
        background-color:var(--list-even-bgColor);
    }
    .flexList2 > *{
        display:flex;
        flex-wrap:wrap;
    }
        .flexList2 > * > *{
            flex:1 1 100px;
            padding:5px;
            border-right:1px solid var(--borderColor);
            border-bottom:1px solid var(--borderColor);
        }
/*end*/
