@charset "UTF-8";
/* *{padding: 0; margin: 0;}*/

main{
  padding-bottom: 30px;
}

/*<style>*/
/*main {*/
  /*background: #DDFFFF;*//*#f0e68c;*/
/*  font-family: Mairyo;*/

/*}*/

/*
div {
  background: #ffffff;
  width: 500px;
  padding: 10px;
  text-align: center;
  border: 1px solid #cccccc;
  margin: 30px auto;
  font-size: 25px;
}

div#block {
  background: #ffffff;
  width: 300px;
  padding: 10px;
  text-align: center;
  border: 1px solid #cccccc;
  margin: 30px auto;
  font-size: 40px;
}*/

h1 {
  background: #ffffff;
  width: 100%;
  padding: 10px;
  text-align: center;
  /*border: 1px solid #cccccc;*/
  margin: 0 auto;
  font-size: 50px;
}

h1 a {
  text-decoration: none;
}
/*
h2 {
  text-align: center;
}*/

div#number {
  background: #ffffff;
  width: 700px;
  padding: 10px;
  text-align: center;
  border: 1px solid #cccccc;
  margin: 30px auto;
  font-size: 50px;
}

.footer{ /*copyright*/
  padding: 15px 10px;
  background: #A4C6FF;
  line-height: 3rem;
}

.copy{
  text-align: center;
  display: block;
  margin-top: 10px;
/*
  display: block;

  width: 200px;
  border: 2px solid;
*/
}

.subject{
    text-align: center;
    width: 100%;
    background: #DDFFFF;
    border-style: none;
}

.category{ /*物理，化学，数学のクリック枠を作る*/
  display: inline-block;
/*  vertical-align: middle;*/
  width: 500px;
  /*border: 1px solid #000;*/
  border-radius: 5px;
  margin: 25px 50px 25px; /*marginはborderの外*/
  padding: 13px 10px 13px; /*paddingはborderの内*/
  text-decoration: none;
  font-size: 50px;
  /*position: relative;
  top: 0px;
  left: 0px;*/
  /*color: #444444;*/ /*#005FFF;*/
  background-color: #FFFFFF;
  /*font-weight: bold;*/
  font-family: 'ヒラギノ角ゴシック';
  /*background-image: url(../image/1.jpg);*/
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
}




.category:hover{
    /*background-color: #CCFFFF;*/
    /*color: #0000CD;*//*#2C7CFF;*/
/*    font-family: 'Impact';*/
  font-weight: bold;
  background-color: #FFFFFF;
  /*border: 5px solid red;*/
}

.category img{　/*それぞれの名前の横にアイコン的なものを作りたい*/
  width: 75px;
  text-align: left;
  position: relative;
  top: 10px;
  border-radius: 5px;
  border: 1px solid black;
  /*vertical-align: middle;*/
}

/*</style>*/

.globalnav {
  position: relative;
  /*padding: 0 0px;*/
/*  -webkit-transform: translate(0,50%);
  transform: translate(0, 50%);*/
}

.globalnav li {
  display: table-cell; /*子要素（各項目）をtable-cell形式にする*/
  text-align: center;
}

.globalnav li:not(:first-child){
  border-left: 1px solid #FFF;
}

.globalnav li a {
  font-size: 2.0rem;
  display: block;
  background: #005FFF;
  color: white;
  text-decoration: none;
  padding: 15px 0;
}

.globalnav li a:hover {
  opacity: 1;
/*  background-color: #CCFFFF;*/
  /*color: black;*/
  font-weight: bold;
  /*border: 1px solid #000;*/
}

.globalnav-list {
  width: 100%;
/*  max-width: 100%;*/
  margin: 0 0;
  display: table;　/*親要素（リストをまとめているところ）はtable形式にする*/
  table-layout: fixed;
  /*border: 1px solid #000;*/
  /*padding: 100px;*/ /*これでpaddingを行うと，全体のリストをpaddingしてしまう*/
}


/*パンくずリスト*/
.breadcrumb{
  margin: 0;
  padding: 0.2em;
  list-style: none;
  background: #51a8ff;
  overflow: hidden;
  font-family: 'ヒラギノ角ゴシック';
}

.breadcrumb li{
  display: inline; /*横に並ぶように*/
  list-style: none;
  /*font-weight: bold;*/
}

.breadcrumb li:after{
  content: '>';
  padding: 0 0.2em;
  color: rgba(255, 255, 255, 0.4);
}


.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
  text-decoration: none;
  color: rgba(255, 255, 255, 0.9);
}


.breadcrumb li a:hover{
  text-decoration: underline;
}

/*各項目タイトル*/
.group4{
  display: block;
  max-width: 970px;
  font-size: 3rem;
  margin: 30px auto 10px; /*autoで中央寄せにしている*/
  padding: 15px 20px;
  /*border-bottom: 1px solid #FFF;*/
  border-left: 15px solid #51a8ff;
  background-color: #EEE;
  text-align: left;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
}

/*メインのところの背景*/
main{
  padding: 50px 10vw;
  background-color: #DDFFFF;
}

/*文章の間隔と文字の大きさ，背景*/
.text{
   background-color: white;
   padding: 10px 50px 50px;
   font-size: 1.5rem;
   line-height: 3rem; /*改行できるように*/
}


/*全体のタイトル*/
.title{
  background-color: #f0f8ff; /*#cde4ff;*/
  border-top: solid 6px #5989cf;
  border-bottom: solid 6px #5989cf;
  padding: 15px 50px 15px;
  margin: 10px 10px 10px;
  line-height: 6rem;
}


.footer_text{
  border-bottom: 1px solid #EEE;
  text-align: center;
}