@charset "UTF-8";
/* CSS Document */

body {
	margin:  70px 0px 100px 0px ;
	padding: 0px;
	font-size: 25px;
	font-weight: bold;
	color: #05041e;
	text-align: center;
}

body {
  background-image: url("00000");
  background-size: cover;
}



.tac {
  text-align: center;
}


/*本文*/
h1 {
	color : black;
	font-size: 25px;
	font-weight: normal;
}


/*下に白線の見出し*/
h2 {
	color : #FF0461;
	font-size: 25px;
	font-weight: bold;
	position: relative;
  display: inline-block;
  margin-bottom: 1em;
}

h2:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 60px;
  height: 5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #FF0461;
  border-radius: 2px;
}



/*社名*/
h3 {
	color : black;
	font-size: 0.7em;
	font-weight: normal;
}


/*細ウェイト大文字*/
h4 {
	margin:  -10px;
	font-size: 25px;
	font-weight: normal;
}


/*キャラ名大文字*/
h5 {
	margin:  -10px;
	font-size: 1.7em;
	font-weight: bold;
}

p {
	
	line-height: 1.7;
}


.under {
  background: linear-gradient(transparent 70%, mistyrose 0);
}

.under2 {
  background: linear-gradient(transparent 0%, #FFFF99 0%);
}


.under3 {
  background: linear-gradient(transparent 70%, #FF282A 0%);
}


#page {
	margin:  0 auto;
	width: 700px;
}

table ,td {
	border: 1px;
	border-collapse: collapse;
	vertical-align: top;
	text-align:  left;
}
td {
	padding: 10px 20px 30px 40px;
	
}

.line {  width:  3px;
	     padding:  0;
	     background-color: #000000;
}
th {
	background: #f0e6cc;
}
.even {
	background: #fbf8f0;
}
.odd {
	background: #fefcf9;
}

table tr td.info01 {
	padding: 10px 25px 20px 25px;
	border: 4px #000000 solid;
	text-align: center;
	font-size:  1.1em;
}


.vertical {
  animation: vertical_7410 2.44s ease infinite;
  transform-origin: 50% 50%;
}

@keyframes vertical_7410 {
  0% { transform:translate(0,-3px) }
  3.27869% { transform:translate(0,3px) }
  6.55738% { transform:translate(0,-3px) }
  9.83606% { transform:translate(0,3px) }
  13.11475% { transform:translate(0,-3px) }
  16.39344% { transform:translate(0,3px) }
  18.03279% { transform:translate(0,0) }
  100% { transform:translate(0,0) }
}


/*丸付き数字*/
.btn-circle-flat {
  display: inline-block;
  text-decoration: none;
  background: #F29C9F;
  color: #ffffff;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  border: solid 2px #ffffff;
  text-align: center;
}

/*箇条書きリスト*/
ul, ol {
  background: 000;
  border-radius :8px;/*角の丸み*/
  padding: 0.5em 0.5em 0.5em 2em;
	list-style-type: none;
}
ul li, ol li {
	font-size:  .9em;
  line-height: 1.5;
  padding: 0.5em 0;
	list-style-type: none;
}

/*フェードイン*/
.fade-in {
    animation-name: fadein;
    animation-duration: 2.3s;
}
@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/*グラデスライドショー*/
 /*=== 画像の表示エリア ================================= */
.slide {
  position   : center;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width : "" ;
  height : "700" ;
     /* サンプルは中央寄せの背景：白 */
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : 700;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 10s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 3s }
.slide img:nth-of-type(3) { animation-delay: 6s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   5% { opacity: 1 }
  33% { opacity: 1 }
  38% { opacity: 0 }
 100% { opacity: 0 }
}


/*メニューバー*/

ul.topnav {
	overflow: hidden;
	margin: 0 auto;
	padding-top:135%;
	list-style-type: none;
	background-color: 000;
	font-size: 20px;
}
ul.topnav li {
	float: left;
	width: 20%;
}
ul.topnav li a {
	display: block;
	padding: 14px 16px;
	text-align: center;
	text-decoration: none;
	color: #C0C0C0;
}
ul.topnav li a:hover:not(.active) {
	background-color: 000;
	transition: all 1s ease 0s;
	border-radius: 25px;
	border: solid 1px #FF0461;
	color: #FF0461;
}
ul.topnav li a.active {
	background-color: #FF0461;
}
ul.topnav li.right {
	float: right;
}
@media screen and (max-width: 480px) {
	ul.topnav li.right, ul.topnav li {
		float: none;
	}
}


/*背景*/
html {
  height:100%;
}



body{
	background-color: #FFFAFA;
	background-image:
	 radial-gradient(closest-side,
		 transparent 99.9%, #FFF5EE 100%),
	 radial-gradient(closest-side,
		 transparent 99.9%, #FFF5EE 100%);
	background-position: 0 0, 60px 60px;
	background-size: 120px 120px;
}


b---ody {
  background: 
    radial-gradient(#FF9999 2px, transparent 4px),
    radial-gradient(#FF9999 2px, transparent 4px),
    linear-gradient(#fff 5px, transparent 0),
    linear-gradient(45deg, transparent 74px, transparent 75px, #FFDBC9 75px, #FFDBC9 76px, transparent 77px, transparent 109px),
    linear-gradient(-45deg, transparent 75px, transparent 76px, #FFDBC9 76px, #FFDBC9 77px, transparent 78px, transparent 109px),
  #fff;
  background-size: 109px 109px, 109px 109px,100% 6px, 109px 109px, 109px 109px;
  background-position: 54px 55px, 0px 0px, 0px 0px, 0px 0px, 0px 0px;
}




h1 {
  font-family:"游ゴシック体", YuGothic, "YuGothic M", sans-serif;
}

@keyframes slide {
  0% {
    transform:translateX(-25%);
  }
  100% {
    transform:translateX(25%);
  }
}



 /*ニュース*/

.msr_newslist01 {
  width: 90%;
}
.msr_newslist01 li {
  border-bottom: 1px solid #C0C0C0;
  font-size: 20px;
	font-weight: normal;
}
.msr_newslist01 li a {
  box-sizing: border-box;
  color: #000000;
  display: table;
  padding: 10px;
  text-decoration: none;
  transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
  width: 100%;
}

.msr_newslist01 li div {
  display: table-cell;
  width: 60px;
}
.msr_newslist01 li p {
  display: table-cell;
  padding-left: 20px;
  vertical-align: middle;
}

/* 時間の設定 */
.msr_newslist01 li time {
  display: table-cell;
  vertical-align: top;
  width: 90px;
  font-weight: normal;
}

/* カテゴリの設定 */
.msr_newslist01 li .cat01,
.msr_newslist01 li .cat02 {
  background-color: #fff;
  border-radius: 5px;
  color: #ff4e66;
  font-size: 9px;
  padding: 0 2px;
  text-align: center;
  width: 50px;
}
.msr_newslist01 li .cat02 {
  background-color: #FFD5EC;
}

/*ページ内リンク調整*/

a.anchor{
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}


/*画像横並び*/
.top-banner{
	display: flex;
	flex-wrap:wrap;
}
.top-banner li {
	width: calc(100%/3);/*←画像を横に4つ並べる場合*/
	padding:-30px;/*←画像の左右に5pxの余白を入れる場合*/
	box-sizing:border-box;
}
.top-banner li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
}



/*スムーズスクロール*/
html{
  scroll-behavior: smooth;
}



/*トップに戻る*/
#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: #ff4e66;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #fff;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #888888;
}

/* サイト全体のフォント指定 */
body {
font-family: "游ゴシック体", YuGothic, "YuGothic M", sans-serif;}



/*------------------------------
マウスオーバーで画像を白くする
------------------------------*/
a:hover img.hoverwhite{
opacity:0.5;
filter:alpha(opacity=50);
-ms-filter: “alpha( opacity=50 )”;
}


