/*まずはお決まりのボックスサイズ算出をborer-boxに */
*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

/* RESET */
a,article,body,dd,div,dl,dt,em,form,footer,header,h1,h2,h3,h4,h5,h6,html,i,iframe,img,label,legend,li,nav,ol,p,section,main,span,table,tbody,tfoot,thead,time,tr,th,td,ul,video{ 
  font-family:inherit;
  font-size:100%;
  font-weight:inherit;
  font-style:inherit;
  vertical-align:baseline;
  white-space:normal;
  margin:0;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  line-height:1.6;
  text-align:left;
}

ol,ul{
	list-style:none;
}

html {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 62.5%; /*rem算出をしやすくするために*/
}

body {
	font-size: 15px;
	line-height: 1.6em;
	font-family:  "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	font-weight: 500;
	color: #535761;
        background: #cadffa;

	-webkit-text-size-adjust: 100%;
	/* スクロールの出る画面と出ない画面でずれるのを防止するため出しっ放しにする */
	/*  overflow-y: scroll; */
	padding-right: 0px !important;
	/*  width: calc(100vw - 15px); */ /* 追加 */
}

/*日付設定*/
dl {
/*	padding-left: 15px; */
/*	padding-right: 15px; */
	clear: both;
	font-size: 100%;
	padding: 4px 15px;	
	margin-bottom: 15px;
}

dt time{
	font-weight: bold; 	/*太字にする設定。*/
	float: left;
	width: 100%; /* 年月日と記事の間（確定） */
}
dd {
	box-sizing: border-box;
	display: inline-blck;
	margin-left: 1em;
}

span{
	font-weight: bold; 	/*太字にする設定。*/
}

h2 {
	clear: both;
	margin-bottom: 25px;
	font-size: 110%;
	color: #FFF;
        background: linear-gradient(#663399,#33ccff);
	padding: 5px 10px;
	border-radius: 8px;
        position: -webkit-sticky;
        position: sticky;
        top: 15px;
	margin-top: 15px;
}

h3 {
	clear: both;
	font-size: 100%;
	padding: 4px 15px;	
	margin-bottom: 15px;
}

p {
	clear: both;
	font-size: 100%;
	padding: 4px 15px;	
	margin-bottom: 15px;
}

a {
	font-size: 100%;
/*        font-size: 1.6rem; */
        outline:none;
        color: darkblue;
        font-weight: bold;
/* text-decoration: none; */
}

a:hover {
	font-size: 100%;
/*        font-size: 1.6rem; */
        color: red;
        text-decoration: none;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
}

.flex-box {
        display: inline-flex;		/* フレックスボックス */
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: space-around;
        align-items:stretch;	/* 縦の位置指定 */

	color:var(--color-text-p);
	font-size:1rem;
	line-break:strict;
	line-height:200%;
	overflow-wrap:anywhere;
	word-break:normal

}

.flex-box a{
/*	color:var(--color-text-a); */
/*	text-decoration:none */
}

.flex-box a:visited{
/*	color:var(--color-text-a-visited) */
}

.flex-box a[target=_blank]:after{
	background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MCA0MCI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiMxOTc2ZDJ9PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTI0LjU1IDB2M2gxMC4zM0wxNC40NCAyMy40NGwyLjEyIDIuMTJMMzcgNS4xMnYxMC4zNGgzVjB6IiBjbGFzcz0iY2xzLTEiLz48cGF0aCBkPSJNMzAgMzdIM1YxMGgxMVY3SDB2MzNoMzNWMjZoLTN6IiBjbGFzcz0iY2xzLTEiLz48L3N2Zz4=);
	background-repeat:no-repeat;content:"";
	display:inline-block;
	height:1.0rem;
	margin:0 .25rem;
	width:1.0rem
}

.flex-item:nth-child(1) {
        height: 400px;
/*        flex-basis: 500px; */
}

.flex-item {
        height: auto;
        overflow: auto;
        font-size: 1.5rem;
        font-weight: 500;
        line-height: 150%;
        position: relative;
        padding: 0 2rem;
        color: #00066;
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
        margin-right: 10px;
        border-radius: 1.5rem;
        width: 500px;	/* 幅指定 */
        background: linear-gradient(#99c1f3,#cadffa);
        transition: all 0.3s;
}

.flex-item:hover {
        background: linear-gradient(#00ff66,#ccff33);
}

#main table {
/*        width:100%; */
        border-collapse:collapse;
}
#main table th {
        padding:6px;
        font-size:14px;
/*        text-align:left; */
        text-align:center;
        border:1px solid #aaa;
/*        background: linear-gradient(#86ece2,#0066f4); */
        background:#afeeee;
/*        background:#f0f7fc; */
}

#main table tr:first-child td:first-child {
  border-radius: 10px 0 0 0; /* 左上の角だけ10px */
}
#main table tr:first-child td:last-child {
  border-radius: 0 10px 0 0; /* 右上の角だけ10px */
}
#main table tr:last-child td:last-child {
  border-radius: 0 0 10px 0; /* 右下の角だけ10px */
}
#main table tr:last-child td:first-child {
  border-radius: 0 0 0 10px; /* 左下の角だけ10px */
}

#main table td {
        padding:6px;
        font-size:14px;
        text-align:left;
	vertical-align: middle;
        border:1px solid #aaa;
/*        width:50px; */
        background:#fff;
}

/* 奇数行のスタイル */
#main table tr:nth-child(odd) td{
  background-color: #f0f8ff;
/*  background-color: #f0f0f0; */
/*  background:#e6f2ff; */
}
 
/* 偶数行のスタイル */
#main table tr:nth-child(even){
  background-color: white;
}

@media screen and (max-width: 768px) {
      body {
	 font-size: 90%;
      }

     .flex-box {
         align-items:flex-start;	/* 縦の位置指定 */
         display: block;
         padding-left: 10px;
         padding-right: 10px;
     }

     .flex-box .flex-item {
         height: auto;
         width: 100%;
         margin: 10px auto;
     }

     .flex-item:nth-child(1) {
         height: 450px;
     }

}

@media print, screen and ( min-width : 769px ) {
}