@charset "UTF-8";


/* 要素リセット */
body{
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 75%;
	font-family: 'メイリオ' ,Meiryo, 'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;
	color: #000000; /* 標準文字色 */
	min-width: 900px;
	background-color:#fff;
}

.wrapper{
	width: 950px;
	font-family: 'メイリオ' ,Meiryo, 'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;
	background-repeat : repeat;
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;

}

/* Safari用ハック 文字サイズ調整 */
/*\*/
html:first-child body{
    font-size: 70%;
}
/* end */

img{
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
}



/*--------------------------------------------------------
  レイアウト設定
--------------------------------------------------------*/

ysb-inner{
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	clear: both;
}
ysb-main {
    width: 596px;
    text-align: left;
    padding-bottom: 30px;
}
/*--------------------------------------------------------
  共通パーツデザイン設定
--------------------------------------------------------*/


hr {
  background-color: #1E90FF;
  height: 20px;
}

@media screen and (max-width: 480px) {
header{
display: table;
margin: 0 auto;
padding: 0;
width: 375px;
text-align: center;
}
}


/*--------------------------------------------------------
  トップページデザイン設定
--------------------------------------------------------*/

/* title */

h1 {
  position: static;
}


/* menu */

ul{
display: table;
margin: 0 auto;
padding: 0;
width: 900px;
text-align: center;
}

ul li{
display: table-cell;
min-width: 50px;
}


ul li a{
display: block;
width: 100%;
padding: 10px 0;
text-decoration: none;
color: #555;
font-weight: bold;
}


ul li.current{
background-color: #DEEBF7;
}


ul li.current a{
color: #555;
}


ul li:hover{
background-color: #87CEEB;
}


@media screen and (max-width: 480px) {
ul{
display: table;
margin: 0 auto;
padding: 0;
width: 375px;
text-align: center;
box-sizing: border-box;
}

ul li{
display: table-cell;
min-width: 50px;
}


ul li a{
display: block;
width: 100%;
text-decoration: none;
color: #555;
font-weight: bold;
}


ul li.current{
background-color: #DEEBF7;
}


ul li.current a{
color: #555;
}


ul li:hover{
background-color: #87CEEB;
}
}


h2 {
  border-bottom: solid 3px #cce4ff;
  position: relative;
  min-width: 30px;
}

h2:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #5472cd;
  bottom: -3px;
  width: 20%;
}

@media screen and (max-width: 480px) {
h2 {
  box-sizing: border-box;
  border-bottom: solid 3px #cce4ff;
  position: relative;
  min-width: 30px;
}

h2:after {
  box-sizing: border-box;
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #5472cd;
  bottom: -3px;
  width: 20%;
}
}




pagetop {
    margin-top: 30px;
    margin-right: 0;
    margin-bottom: 30px;
    margin-left: 0;
    text-align: right;
    width: 122px;
    height: 22px;
}

/*--------------------------------------------------------
  子ページデザイン設定
--------------------------------------------------------*/

/* group */


.table_group {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  max-width: 700px;
  border-radius: 10px;
  overflow: hidden;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
  margin-bottom: 50px;

}
.table_group tr {
  background-color: #e6f1f6;
}
.table_group tr:nth-child(even) {
  background-color: #fff;
}
.table_group th, .table_group td {
  padding: 2em;
}
.table_group thead th {
  background-color: #4682B4;
  color: #fff;
  text-align: center;
}
.table_group tbody th {
}

@media screen and (max-width: 787px) {
  .table_group {
    border-radius: 0;
    text-align: left;
  }
  .table_group thead {
    display:none;
  }
  .table_group tr {
    background-color: unset;
  }
  .table_group th, .table_group td {
    display: block;
    border: 0;
    border-bottom: 1px solid #4d9bc1;
  }
  .table_group tbody th{
    background: #4682B4;
    color:#fff;
    text-align: center;
  }
  .table_group td::before{
    content: attr(data-label);
    background-color: #e6f1f6;
    display: inline-block;
    width: 20%;
    min-width: 4em;
    text-align: center;
    margin-right: 0.5em;
    padding: 4px;
    border-radius: 100vh;
  }
}

@media screen and (max-width: 480px) {
  .table_group {
    border-radius: 0;
    text-align: left;
    max-width: 375px;
  }
  .table_group thead {
    display:none;
  }
  .table_group tr {
    background-color: unset;
  }
  .table_group th, .table_group td {
    display: block;
    border: 0;
    border-bottom: 1px solid #4d9bc1;
  }
  .table_group tbody th{
    background: #4682B4;
    color:#fff;
    text-align: center;
  }
  .table_group td::before{
    content: attr(data-label);
    background-color: #e6f1f6;
    display: inline-block;
    width: 10%;
    min-width: 4em;
    text-align: center;
    margin-right: 0.5em;
    padding: 4px;
    border-radius: 100vh;
  }
}



/* profile */


profile{
    width: 400px;
}

@media screen and (max-width: 480px) {
profile{
    width: 300px;
}
h2:img{
    width: 120px;
}
}