@charset "UTF-8";

html        {font-size: 0; scroll-behavior: smooth;}
body        {margin: 0; overflow-y: scroll; font-family: "Noto Sans Japanese", "メイリオ", sans-serif; visibility: hidden; -webkit-text-size-adjust: 100%;}
a           {text-decoration: underline; color: #0022aa;}
a:hover     {text-decoration: underline;}
h1          {color: #000000; font-weight: 700; font-size: 24px; border-bottom: solid 4px #67b107; margin: 40px 0px 20px 0px; padding-bottom: 2px;}
h2          {color: #000000; font-weight: 700; font-size: 20px; border-bottom: solid 4px #67b107; margin: 20px 0px 10px 0px; display: inline-block;}
h3          {color: #000000; font-weight: 700; font-size: 16px; line-height: 17px; border-left: solid 4px #67b107; margin: 20px 0px 10px 0px; padding-left: 3px;}
h4          {color: #000000; font-weight: 700; font-size: 16px; margin: 0;}
p           {margin: 0px 0px 30px 0px; padding: 0;}
strong      {color: #ff0000; font-weight: 500;}
i           {margin: 0px 4px 0px 2px;}
i.pdf       {color: #cc0000;}
i.word      {color: #0000cc;}
i.excel     {color: #009900;}
i.map       {color: #cc0000;}
div.mctl-ar {text-align: right; margin-right: 15px;}
ul.honbun   {margin: 0px 0px 0px 20px; padding: 0; list-style-type: disc;}
ol.honbunll {margin: 0px 0px 0px 20px; padding: 0; list-style-type: lower-latin;}
ol.honbunnu {margin: 0px 0px 0px 20px; padding: 0; list-style-type: number;}

table.rs    {table-layout: fixed; border-collapse: collapse; width: 732px; margin-bottom: 15px;}
table.rs caption {font-weight: 500; font-size: 16px; text-align: left;}
table.rs th {font-weight: 500; font-size: 16px; line-height: 1.8em; width: 270px; margin: 0; padding: 5px 3px; border: solid 2px #999999; border-width: 2px 0px; background-color: #eeeeee; text-align: left;}
table.rs td {font-weight: 300; font-size: 16px; line-height: 1.8em; width: 450px; margin: 0; padding: 5px 3px; border: solid 2px #999999; border-width: 2px 0px;}
img.ma      {vertical-align: middle; padding: 0px 0px 4px 1px;}

.tt-rap     {width: 100%; background-color: #ffffff;}
.tt-cnt     {width: 960px; height: 50px; margin: auto; background-color: #ffffff; position: relative;}
a#ttl       {color: #000000; text-decoration: none;}
a#ttl:hover {color: #000000; text-decoration: none;}
.tm         {float: left; width: 44px; height: 44px; margin: 3px 3px 3px 1px;}
.tt-logo    {width: 232px; height: 50px; display: inline-block; vertical-align: top;}
.tt-dv1     {font-size: 16px; height: 16px; margin: 0px 2px 3px 0px; font-weight: 700;}
.tt-dv2     {font-size: 20px; height: 20px; margin: 0px 2px 0px 0px; font-weight: 700;}
.tt-srch    {width: 680px; display: inline-block; vertical-align: top; text-align: right; position: absolute; right: -110px;}

.gm-rap     {width: 100%; min-width: 960px; padding: 0;}
.gm-cnt     {width: 960px; margin: auto; font-weight: 500; font-size: 16px;}
.gm-cnt ul  {font-size: 0; padding: 0; display: inline-block;}
.gm-cnt a   {text-decoration: none;}
.gm-cnt li  {font-size: 16px; list-style: none; color: #000000; background-color: #ffffff; display: inline-block; text-align: center; width: 116px; height: 25px; margin: 0px 4px 0px 0px; padding: 1px 0px; border: solid 2px #67b107; border-bottom: none; border-radius: 4px 4px 0px 0px;}
.gm-cnt li:hover {color: #ffffff; background-color: #0022aa; text-decoration: underline;}
.gm-cnt img {vertical-align: bottom;}
.gm-ul      {width: 100%; min-width: 960px; height: 2px; padding: 0; background-color: #67b107;}

.cm-rap     {width: 100%; min-width: 960px; background-color: #eeeeee;}
.cm-cnt     {width: 960px; margin: auto; background-color: #eeeeee; font-weight: 300;}
.cm-bas     {background-color: #999999; display: inline-block; vertical-align: top; width: 184px; margin: 4px 2px; padding: 0px 2px; border-radius: 0px 0px 3px 3px;}
.cm-basc    {font-size: 15px; background-color: #eeeeee; display: block; margin: 2px 0px; padding: 0px 2px;}
.cm-bas ul  {font-size: 0; padding: 0;}
.cm-bas a   {text-decoration: none;}
.cm-bas li  {font-size: 14px; list-style: none; color: #000000; background-color: #ffffff; display: block; text-align: left; overflow: hidden; width: 180px; height: 21px; margin: 2px 0px; padding: 0px 2px; border-radius: 3px;}
.cm-bas li:hover {color: #ffffff; background-color: #0022aa; text-decoration: underline;}

#mc-rap     {width: 100%; background-color: #ffffff;}
.mc-cnt     {width: 960px; min-height: 500px; margin: auto; padding: 15px 0px 30px 0px; background-color: #ffffff; font-weight: 300;}
.mc-ctl     {width: 732px; margin: 0; padding: 0px 8px 0px 0px; display: inline-block; vertical-align: top; line-height: 1.8em; font-size: 16px;}
.mc-ctr     {width: 220px; margin: 0; padding: 0; display: inline-block; vertical-align: top; font-size: 16px;}

.mcr-bas    {background-color: #999999; display: inline-block; vertical-align: top; width: 216px; margin: 0px 0px 20px 0px; padding: 0px 2px; border-radius: 0px 0px 3px 3px;}
.mcr-basc   {font-size: 15px; background-color: #eeeeee; display: block; margin: 2px 0px; padding: 0px 2px;}
.mcr-bas ul {font-size: 0; padding: 0; margin: 0;}
.mcr-bas a  {text-decoration: none;}
.mcr-bas li {font-size: 14px; list-style: none; color: #000000; background-color: #ffffff; display: block; text-align: left; overflow: hidden; height: 21px; margin: 2px 0px; padding: 0px 2px; border-radius: 3px;}
.mcr-bas li:hover {color: #ffffff; background-color: #0022aa; text-decoration: underline;}

.ft-rap     {width: 100%; background-color: #eeeeee;}
.ft-cnt     {width: 960px; margin: auto; background-color: #eeeeee; font-weight: 300; font-size: 16px; padding: 15px 1px 8px 1px;}
.ft-dv1     {font-weight: 500; font-size: 18px; margin:  5px 0px 10px 0px;}
.ft-dv2     {font-weight: 300; font-size: 14px; margin: 10px 0px 10px 0px;}
.ft-dv3     {font-weight: 300; font-size: 14px; margin: 10px 0px 10px 0px;}
.ft-im1     {vertical-align: bottom; padding: 0px 0px 1px 1px;}
.ft-dv4     {font-weight: 300; font-size: 14px; margin: 10px 0px 10px 0px;}
.ft-dv4 ul  {font-size: 0; padding: 0;}
.ft-dv4 li  {font-size: 14px; list-style: none; display: inline-block; margin: 0px 20px 0px 0px;}
.ft-cpr-rap {width: 100%; background-color: #dddddd;}
.ft-cpr-cnt {width: 960px; margin: auto; background-color: #dddddd; font-weight: 300; font-size: 14px; padding: 2px 1px;}
.channel {
    text-align: left;
    letter-spacing: 1px;
    box-sizing: border-box;
    width: 256px;
    height: 42px;
    padding: 0px 0px;
    border: none;
    margin-top: 4px;
    margin-left: auto;
}

.channel-inner {
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    width: 220px;
    height: 42px;
    line-height: 19px;
    margin: 0;
    padding-left: 8px;
    text-align: left;
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;
    list-style: none;
    text-decoration: none;
    border-top: 2px #000000 solid;
    border-bottom: 2px #000000 solid;
    background-color: #405d9b;
}

.shine-button {
    background: url(./on.png);
    background-size: cover;
    margin: 4px 4px 4px 1px;
    text-align: center;
    display: block;
    width: 256px;
    cursor: pointer;
    /*position: relative;*/
    overflow: hidden;
    background-repeat: no-repeat;
    height: 42px;
    position: absolute;
    }
/* ボタン内のリンクのスタイル （リンク自体でボタンを作る場合には不要） */
.shine-button a {
    display: block; /* 形状はblock */
    width: 100%; /* 外側のボックスに対して横幅いっぱいに*/
    padding: 1em; /* 上下左右1文字分の余白 */
    color: white; /* 文字色は白 */
    text-decoration:none; /* 下線など文字装飾は無し */
    }
/* リンク自体でボタンを作る場合の追加のスタイル （ボックス＋その中にリンクのあるボタンの場合には不要）*/
a.shine-button {
    padding: 1em; /* 上下左右に1文字分の余白を設ける */
    color: white; /* 文字色を白色に指定*/
    text-decoration: none; /* リンクの下線は非表示 */
    }
/* ------------------------------------ ボタンの外側にボックス作成 （疑似要素「before」を使う） ------------------------------------*/
.shine-button::before {
    content: ""; /* 文字は表示しないので中身無しを指定 */
    position: absolute; /* ボタンの位置を基準に絶対値指定する */
    display: block; /* 形式はblock */
    background: linear-gradient(to right,rgba(255,255,255,0), rgba(255,255,255,0.9)); /* 背景色は透明から白になるグラデーション */
    width: 50px; /* 横幅 */
    height: 50px; /* 縦幅 */
    top: -60px; /* ボタン左上を基準に上へ60pxの位置 */
    left: -60px; /* ボタン左上を基準に左へ60pxの位置 */
    /* アニメーションの動作指定 */
    animation-name:shine-run; /* アニメーション名の指定 */
    animation-delay:0s; /* アニメーションの開始時間指定 */
    animation-duration: 3s; /* アニメーション動作時間の指定 */
    animation-timing-function: ease-in; /* アニメーションの動き指定（徐々に早く）*/
    animation-iteration-count: infinite; /* アニメーションの無限繰り返しの指定 */
    }
/* ------------------------------------ アニメーションのタイミングとボックスの
拡大率、角度、透過率の指定 ------------------------------------*/
@keyframes shine-run {
      0% {
        transform: scale(0) rotate(50deg); /* アニメ開始時は大きさ0、50度の傾き */
        opacity: 0; /* アニメ開始時は全透過 */
      }
      40% {
        transform: scale(1) rotate(50deg); /* 40%まで進む間に大きさを等倍に。傾きは50度のまま*/
        opacity: 1; /* 透過しない（しっかり表示される）ように1を設定 */
      }
      100% {
        transform: scale(125) rotate(50deg); /* 最後は元の大きさの250倍になるようにする。傾きは50度のまま*/
        opacity: 0; /* 全透過になるようにして、徐々に消えるような変化を付ける */
      }
    }

.sns_list {
  display: flex;
  position: absolute;
  right: 107px;
  margin: 4px 4px 4px 1px;
  gap: 4px;
}

.sns_list a{
  text-decoration: none;
}

.sns_link {
  width: 100px;
  height: 42px;
  border-radius: 5px;
  line-height: 16px;
  color: #ffffff;
}

.sns_link p {
  display: flex;
  font-size: 14px;
  height: 42px;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.sns_youtube {
  background-color: #ff0000;
}

.sns_x {
  background-color: #000000;
}

.sns_instagram {
  background-color: #ff0a60;
}

.fss {
  font-size: 13.5px!important;
  letter-spacing: -0.1em;
}