/*
 *
 */

body, html {
    background-color:white;
    padding:0;
    margin:0;
    color:/*#4d4d4d*/#444;
    /*font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;*/
    font-family:"Noto Sans JP", Meiryo,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN",Helvetica,Arial,sans-serif;
    font-size:/*11pt*/10.5pt;
}

img {
    /*width:100%;*/
}

a {
    color:#546cd4;
    &:visited {
        color: #548c54;
    }
}
/*
h1 {
    margin-top:7.2em;
    padding:.5em 0;
    font-size:166%;
    /*border-bottom:solid 1pt #c0c0c0;* /
    font-weight:normal;
}
*/
h3 {
    margin-top:1.67em;
    padding:0 .5em;
    font-size:122%;
    border-left:solid 2.4pt #c0c0c0;
    font-weight:normal;
}

h4 {
    margin-top:1.67em;
    padding:0 .5em;
    font-size:108%;
    border-left:solid 2pt #d4d4d4;
    font-weight:normal;
}

hr {
    margin:1.67em 0;
    border:none;
    border-top:solid 1px #d4d4d4;
}

/*
 *
 */
#_topBanner_ {
    /*margin-bottom:-8em;*/
    margin:0;
    font-size:11pt;
    position:fixed;
    border-bottom:2px #d4d4d4 solid;
    /*padding:.33em;*/
    width:100%;
    /*max-width:1960px;*/
    /*height:/*9em* /11em;*/
    display:grid;
    /*grid-template-columns: repeat(5, 1fr);*/
    grid-template-columns: repeat(2, 1fr);
    background-color:white;
    z-index: /*2*/4;
    top:0;
    opacity:94%;
    line-height:180%;
}
/*topBanner */div#_L_ {
    /*grid-column: 1 / 5; /* PC */
    grid-column: 1 / 2; /* PC */
    padding:1em;
    background-color:/*#f8f8f8;*/#f4f4f4;
    /*background:-webkit-linear-gradient(top, #f0f0f0, white);*/
    border-bottom:solid 1px #d4d4d4;
}
/*topBanner */div#_L_ dl {
    border-left: solid 4px #328cd4/*#e8b880*/;
    padding-left:.8em;
    /*background-color:yellow;*/
    grid-column:1 / 2;
    width:/*auto*/12em;
/*
    &::before {
      position:absolute;
      height:0;
      content:"";
      border-top:solid 1.8em transparent;
      border-bottom:solid 1.8em transparent;
      border-left:solid 1.8em #d0d0d0;
      width:2em;
      margin-right:2em;
      padding-right:2em;
    }
*/
}
/*topBanner */div#_L_ dl > dt {
   font-size:120%;
   margin:0;
   /*padding:4px 0;*/
}
/*topBanner */div#_L_ dl > dd {
    margin:0;
    /*padding:4px 0;*/
}
/*topBanner */div#_L_ a {/* 左上の「国立大学法人 188bet体育_188bet赌场-【平台官网】総合研究センター」部分の属性?*/
    display:block;
    width:12em;
    text-decoration: none;
    /*border:solid 1px;*/
    color:#555;
    /*padding*/margin:.33em 0;
    /*text-shadow: 1px 1px 0 #d0d0d0;*/
    &:hover {
        color:/*#4488a0* /#2650a2*/#444;
        text-shadow:0px 5px 0 rgba(0,0,0,10%);
        background-color:#eaeaea;
    }
    -webkit-transition-duration:250ms;
}

/*
 *
 */
/*topBanner */div#_R_ {
    /*grid-column: 5/6;*/
    grid-column: 2/3;
    padding:1em 1.33em;
    background-color:#f4f4f4;
    /*background:-webkit-linear-gradient(top, #f0f0f0, white);*/
    text-align:right;
    border-bottom:solid 1px #d4d4d4;
}

/*topBanner */div#_R_ > p {
    /*border:solid 1px;*/
    line-height:1em;
}
/*topBanner */div#_R_ a {
    text-decoration: none;
    /*border:solid 1px #e0e0e0;*/
    padding:0;
}
/*topBanner */div#_R_ img {
    width:28px;
    height:28px;
    vertical-align:middle;
    border-radius:3px;
    /*background-color:#f4f4f4;*/
    margin:16px 4px;
    padding:3px;

    &:hover {
      /*cursor:pointer;*/
      background-color:#d4d4d4;
    }

    -webkit-transition-duration:500ms;
}



/*
 * メニュー(1)用パネル
 */
div#_commonMenuPanel1_ {
    grid-column : 1 / 6;
    box-sizing:border-box;
    display:/*grid*/none;
    line-height:160%;
    padding:1em;
    /*grid-template-columns : repeat(4, 1fr);*/
    /*border-bottom:solid 8px #c0c0c0;*/
    width:100%;
    background-color:/*#4d4d4d*/rgba(77,77,77,86%);
    color:/*#c0c0c0*/#d4d4d4;
    /*opacity:/ *94%* /86%;*/
    /*font-size:94%;*/
    box-shadow:2px 2px 12px rgba(0,0,0,20%);
    position:/*absolute*/fixed;
    /*left:0;
    top:0;*/
    border-radius:8px;
    z-index:/*2* /3* /5* /8*/15;
    /*height:0;*
    -webkit-transition-property:opacity,height;
    -webkit-transition-duration:600ms;
    *-webkit-transition-delay:600ms;*/
    border-top:solid 1px rgba(255,255,255,.25);
    border-right:solid 2px rgba(32,32,32,.25);
    border-bottom:solid 2px rgba(32,32,32,.25);
    border-left:solid 1px rgba(255,255,255,.25);
}
div#_commonMenuPanel1_  ul {
    margin:0;
    padding:0;
}
div#_commonMenuPanel1_ li {
    margin:0;
    padding:3px;
    list-style:none;
    ::before {
        content:'?';
        padding:3px /*10px*/6px;
    }
}
div#_commonMenuPanel1_ a {
    display:block;
    border-radius:3px;
    text-decoration:none;
    color:white;
    &:hover {
        background-color:#d4d4d4;
        background:-webkit-linear-gradient(top left, #d4d4d4 50%, #eeeeee);
        color:black;
    }
    /*
    -webkit-transition-property:color;
    -webkit-transition-duration:300ms;
    */
}


ul#_commonMenuBar2_ {/*デフォルトでは出力せず*/
    display:none;
}

/*
 * タイトルエリア？のデフォルト
 */
#_titleArea_ {
    position:relative;
    width:100%;
    color:white;
    padding: 1.8em 0;
    margin-bottom:3em;
    margin-top:7.5em;
    line-height:/*144%*/100%;
    /*  background:-webkit-radial-gradient(top left, #62a288 12%, #328cd4, #6cb6f4);*/
    background:-webkit-radial-gradient(top left, #86d 12%, #328cd4, #6cb6f4);
}
#_titleArea_ div {
    width:/*86%*/92%;
    max-width:/*1170px*/1280px;
    margin:0 auto;
    padding:0;
    /*border:solid 1px;*/
}

#_titleArea_ h1 {
    line-height:100%;
    padding:/*.2em*/0 .5em;
    margin:/*.5em*/.88em 0;
    font-size:1.8em;
    font-weight:normal;
    text-shadow:1px 8px 0px rgba(0,0,0,5%);
    border-left:solid 3px rgba(255,255,255,.67);
}


/*
 *  メインコンテンツ用ブロック部分
 */
#_mainContents_ {
  position:relative;
  /*margin-top:7.5em;*/
  padding:0 1em;
}

/*
 *に接続 最下部
 */
#_bottomBanner_ {
    background-color:/*white*/#f8f8f8;
    border-top:solid 1px #c0c0c0;
    /*padding-bottom:5em;*/
}

#_bottomBanner_ div {
    display:grid;
    grid-template-columns:1fr;
    padding:1em;
    width:/*86%*/92%;
    max-width:/*1170px*/1280px;
    font-size:/*86*/94%;
    margin:0 auto;
    /*color:red;*/
}
#_bottomBanner_ dt {
    /*font-size:86%;*/
    margin:.8em 0;
    padding:0 .5em;
    /*border-left: solid 2px #328cd4/* #e8b880*/;
}
#_bottomBanner_ dd {
    line-height:160%;
    font-size:94%;
    /*&:nth-child(2n+0) {*/
    &:nth-of-type(1) {
      font-weight:bold;
      margin-left:1.5em;
    }
    /*&:nth-child(2n+1) {*/
     margin-left:3em;
    /*}*/
}

/****************************************/
#_bottomBanner_ p.pageTopPanel { /* "PAGE TOP"ボタンを置く行部分 */
    text-align:right;
    padding:1.5em 0;
    border-top:solid 1px #d4d4d4;
    /***
    position:fixed;
    bottom:0em;
    right:2em;
    opacity:84%;
    ***/
}
#_bottomBanner_ p.pageTopPanel a/*#_pageTop_*/ { /* TO TOP ボタン */
    /*position:fixed;*/
    font-size:110%;
    padding:.88em 1.33em;
    border-radius:/*8px*/6px;
    color:white;
    text-decoration:none;
    /*background:-webkit-linear-gradient(top left ,#325cd4 60%, #6ca4dc);*/
    background:-webkit-linear-gradient(top left ,#328cd4 40%, #6cb4f2);
    /*******
    border-top:solid 1px rgba(255,255,255,0.25);
    border-right:solid 1px rgba(128,128,128,.25);
    border-bottom:solid 1px rgba(128,128,128,.25);
    border-left:solid 1px rgba(255,255,255,0.25);
    ********/
    &::after {
      content:url('/src/assets/images/up_delta_%23fff.svg');
    }
    &:hover {
      background:-webkit-linear-gradient(top left, #328860 40%, #5cd4aa);
    }
}

/*********************************

div.pageTopPanel2 { /* "PAGE TOP"ボタンを置く行部分 * /
    text-align:right;
    padding:1.5em 0;
    /*border-top:solid 1px #d4d4d4;* /
    position:fixed;
    bottom:0;
    right:0;
    /*width:92%;
    max-width:1280px;
    margin:0 auto;
    /*display:none;* /
}

div.pageTopPanel2 a/*#_pageTop_* / { /* TO TOP ボタン * /
    /*font-size:110%;* /
    margin-right:2px;
    padding:1.33em /*.25em* /1.33em* /;
    color:white;
    text-decoration:none;
    /*background:-webkit-linear-gradient(top left ,#325cd4 60%, #6ca4dc);* /
    background:-webkit-linear-gradient(top left ,#328cd4 40%, #6cb4f2);
    border-radius:8px;
    opacity:40%;
    &::after {
        position:relative;
        bottom:2px;
        content:url('/src/assets/images/up_delta_%23fff.svg');
    }
    /****
    &:hover {
      margin-right:2px;
      padding:1.67em;
      border-radius:/*8px* /6px* /;
      /*background:-webkit-linear-gradient(top left ,#328860 40%, #5cd4aa);* /
      opacity:90%;
    }
    *** /

}
*********************/

/*
 *
 */
.new {
    padding:.25em .5em;
    background-color:#e49250;
    color:white;
    /*font-weight:bold;*/
    border-radius:4px;
    font-size:80%;
}

/* ------------------------------------------------------------- */

/*
 *  幅:640px以上のスクリーンおよびプリンター
 */
@media screen and (min-width:640px), print {

    #topBanner {
      grid-template-columns: repeat(5, 1fr);
    }
    /*#topBanner */div#_L_ {
      grid-column: 1 / 5; /* PC */
    }
    /*topBanner */div#_R_ {
      grid-column: 5/6;
    }
    /*
     *  「総合案内」...とかのメニューバー部分
     */
    ul#_commonMenuBar2_ {
        line-height:100%;
        padding:0em 0;
        grid-column:1 / 6;
        margin:0 auto;
        width:100%;
        max-width:/*1170px*/1280px;
        position:relative;
        display:grid;
        grid-template-columns: repeat(4, 1fr);
        list-style:none;
        background-color:/*white;/*#eee;* /#fcfcfc*/transparent;
        /*background:-webkit-linear-gradient(top, #ffffff, #fcfcfc 2%, #fcfcfc 96%, #f0f0f0 96%);*/
        /*border:solid 1px /*#ffffff* /#d4d4d4;*/
        /*border-right:solid 1px rgb(224,224,224);
        border-bottom:solid 1px rgb(224,224,224);*/
        border-left:solid 1px #ffffff;
        text-align:center;
        font-size:86%;
    }
    ul#_commonMenuBar2_ > li {
        margin:0;
        padding: /*1em*/.8em;
        min-width:10em;
        border-radius:4px;
        background:none;
        color:/*#2276a2 / *#6498cf*/#666;
        &::after {
          padding: 14px 4px;
          content:url('/src/assets/images/down_delta_%23888.svg');
        }
        &:hover {
          /*border-bottom:solid 4px/* #ffd480* /#d4dcfc;*/
          /*background-color:#0040f0;*/
          /*background: -webkit-linear-gradient(left top, #328cd4, /*#2276a2* /#2678bd);*/
          background: -webkit-linear-gradient(left top, #40a0e4, #328cd4);
          color: white;
          cursor:pointer;
          &::after {
            padding: 14px 4px;
            content:url('/src/assets/images/down_delta_%23fff.svg');
          }
          -webkit-transition-property:background-color, color/*, background-image, background*/;
          -webkit-transition-duration:500ms;
        }
    }
    /*
    ul#commonMenu a {
        padding:.33em 1em;
      text-decoration:none;
      color:#666;
      border-bottom:solid 4px transparent;
    }
      * /
    ul#commonMenu li:hover {
        /*border-bottom:solid 4px/* #ffd480* /#d4dcfc;* /
        background-color:#d4dcfc;
        cursor:pointer;
    }*/

    /*
 * 新着情報の所
 */
/*ul#Info*/dl#_topics_ {
    border: solid 1px #d4d4d4;
    padding:.67em;
    overflow:auto;
    background-color:#f4f4f4;
    margin-bottom:1.33em;
    /*max-height:16em;*/
}
dl#_topics_ > dt {
    margin:1.33em 0 .67em;
    padding:.2em;
    /*background:-webkit-linear-gradient(top, #548c88, #6a88a4);*/
    color:#244484;
    border-bottom:solid 1px #d4d4d4;
    /*font-size:106%;*/
    &:first-of-type {
        margin-top:.33em;
    }
}
dl#_topics_ > dt span.date {
    color:gray/*#62a288*/; 
    &::after {
        position:relative;
        top:2px;
        /*content:'／'*/;
        content:url('/src/assets/images/3dot_%23a0a0a0.svg?b1c');*/
    }
}

dl#_topics_ > dd {
    margin-left:1em;
    font-size:94%;
}

dl#_topics_ dt {
    &::before {
        position:relative;
        top:2px;
        /*padding-top:14px;*/
        content:url('/src/assets/images/gt_%23c0c0c0.svg?a');
        /*border:solid 1px;*/
        /*height:16px;*/
    }
}


    div#_commonMenuPanel1_ {
        grid-template-columns : repeat(4, 1fr);
        z-index:8;
        position:fixed;
    }
   /*
    * メニュー(B)用ボックス
    */
   div#_commonMenuPanel2_ {
      font-size:86%;
      background-color:/*#f0f0f0*/rgba(240,240,240,86%);
      position:absolute/*relative*/;
      width:24em;
      /*max-width:1000px;*/
      margin:0 auto;
      grid-column: 1 / 11;
      /*opacity:94%;*/
      line-height:2em;
      border-radius:4px;
      padding: 1.33em;
      display:none;
      border:solid 1px /*#d4d4d4*/rgba(255,255,255,0.8);
      box-shadow: 1px 2px 8px rgba(160,160,160,20%);
   }
   /* メニュー(B)用ボックス */
   div#_commonMenuPanel2_  ul {
     margin:0;
     padding:0;
   }
   div#_commonMenuPanel2_ li {
     list-style:none;
     padding:0em;
     margin:0;
     /*border:solid;*/ 
   }
   div#_commonMenuPanel2_  a {
      padding:.33em 1em;
      display:block;
      color:/*#4d4d4d* /#328cd4* /#6498cf*/ #666;
      background: -webkit-linear-gradient(left , transparent, transparent);
      border-radius:4pt;
      &:visited {
        color:#505050;
      }
      &:hover {
        /*background-color:blue;*/
        /*background: -webkit-linear-gradient(left top, #328cd4, #2276a2);*/
        background: -webkit-linear-gradient(left top, #40a0e4, #328cd4);
        color: white; 
        &::before{
          /*content:'*' ;*/
        }
        /*-webkit-transition-property:color,background-color;*/
        -webkit-transition-duration:400ms;
        /*-webkit-transition-delay:600ms;*/
      } 
   }

        /*#T {padding-top:4em;}*/
     #_titleArea_ {
        margin-top:/*10em*/10.4em;
     }

   #_mainContents_ {
      max-width:/*1170px*/1280px;
      width:/*90%/ *86%*/92%;
      margin:/*10em*/0 auto 0 auto;
      line-height:160%;
   }
/*
   h4 {
    margin-top:1.67em;
    padding:0 .5em;
    font-size:120%;
    border-left:solid 2pt #c0c0c0;
   }
*/
  img {
      width:auto;
  }
  #_bottomBanner_ div {
      grid-template-columns:1fr 1fr;
      vertical-align:bottom;
  }
  #_bottomBanner_ div p.copyrightPanel {
      margin-top:/*11em*/8em;
  }
  #_bottomBanner_ div p.pageTopPanel {
      grid-column: 1 / 3;
  }

  #_bottomBanner_ p.pageTopPanel a/*#_pageTop_*/ { /* TO TOP ボタン */
    font-size:100%;
    padding:.67em 1.33em;
  }

}

/*
 * 新着情報の所
 */
/*ul#Info*/dl#_topics_ {
    border: solid 1px #d4d4d4;
    padding:.67em;
    overflow:auto;
    background-color:#f4f4f4;
    margin-bottom:1.33em;
    /*max-height:16em;*/
}
dl#_topics_ > dt {
    margin:.67em 0 .33em;
    padding:.67em .2em 0;
    /*background:-webkit-linear-gradient(top, #548c88, #6a88a4);*/
    color:#244484;
    border-top:solid 1px #d4d4d4;
    border-bottom:solid 1px transparent/*#d4d4d4*/;
    /*font-size:106%;*/
    &:first-of-type {
        margin-top:.33em;
        border-top:none;
    }
}
dl#_topics_ > dt span.date {
    color:gray/*#62a288*/; 
    &::after {
        position:relative;
        top:2px;
        /*content:'／'*/;
        content:url('/src/assets/images/3dot_%23a0a0a0.svg?b1c');*/
    }
}

dl#_topics_ > dd {
    margin-left:/*1em*/2.5em;
    font-size:94%;
}

dl#_topics_ dt {
    &::before {
        position:relative;
        top:2px;
        /*padding-top:14px;*/
        content:url('/src/assets/images/gt_%23c0c0c0.svg?a');
        /*border:solid 1px;*/
        /*height:16px;*/
    }
}

/*
 *  「左右にスワイプ」文字列用属性
 */
.LR {
    display:none;
}

@media screen and (hover:none)/* and (max-width:1400px)*/ {/* タッチ対応デバイスのみ */

    @keyframes _fadeOut_ {
          0% { opacity:70%; }
         80% { opacity:70%; }
        100% { opacity:0%; }
    }

    .LR {
        display:block;
        background-color:transparent;
        width:100%;
        max-width:1280px;
        position: absolute/*fixed*/;
        left:0;
        z-index:2;
        text-align:center;
        opacity:0;
        padding:1em 0;
/*
        animation-duration: 2500ms;
        animation-name: _fadeOut_;
        */
    }
    .LR span {
        padding:8px;
        border-radius:16px;
        background-color:#303030;
        color:white;
    }
} /*@media*/



/*
 *  :hoverが使えるデバイス用(実質PCのみ)
 */
@media (hover: hover) {
  div.pageTopPanel2 a/*#_pageTop_*/ { /* TO TOP ボタン */
      border-top-left-radius:/*8px*/6px;
      border-bottom-left-radius:/*8px*/6px;
      border-top-right-radius:0;
      border-bottom-right-radius:0;
      padding:.88em .5em;
      &:hover {
          padding:.88em 1.67em;
          border-top-left-radius:/*8px*/6px;
          opacity:90%;
      }
      -webkit-transition-duration:100ms;
  }
}



div.gotoTopPanel { /* "PAGE TOP"ボタンを置く行部分 */
    text-align:right;
    padding:/*1.5em*/1em 0;
    position:fixed;
    bottom:2px;
    right:0;
    z-index:10;
}

div.gotoTopPanel a/*#_pageTop_*/ { /* TO TOP ボタン */

    /*padding:.88em .5em /*.25em* /1.33em*/;

    padding:1.33em .33em;
    border-radius:0;
    border-top-left-radius:8px;
    border-bottom-left-radius:8px;
    /*font-size:110%;*/
    margin-right:2px;
    color:white;
    text-decoration:none;
    /*background:-webkit-linear-gradient(top left ,#325cd4 60%, #6ca4dc);*/
    background:-webkit-linear-gradient(top left ,#328cd4 40%, #6cb4f2);
    /*border-radius:8px;}*/
    opacity:25%;
    -webkit-transition-duration:250ms;
    &::after {
        position:relative;
        bottom:3px;
        content:url('/src/assets/images/up_delta_%23fff.svg');
    }
    @media (hover: none) { /* touchデバイス？ */
       padding:1.33em .33em;
       /*border-radius:8px;*/
    }

    @media (hover: hover) { /*PC？*/
       padding:.88em .33em;
       &:hover {
          padding:.88em 1.67em;
          /*border-radius:/*8px * /6px;*/
          opacity:80%;
      }
  }
}