@charset "utf-8";

@font-face {
  font-family: "Myfont";
  src: url(../fonts/roundedML.eot) format("eot"), url(../fonts/roundedML.woff) format("woff");
}

html, body{
  font-size: 16px;
  font-family: "Myfont", sans-serif;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body{
  margin: 0;
  padding: 0;
  width: 100%;
  transform: rotate(0.001deg);
}

a{
  text-decoration: none;
  word-break: break-all;
}

ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
}


/*　基本のdiv　*/

.container{
  margin: 0 auto;
  max-width: 1000px;
  padding: 0 5px;
}
@media screen and (min-width: 768px) {
  .container{
    padding-left: 10px;
    padding-right: 10px;
  }
}

/*　リンクカラー　*/

a:link{
  color: #6bb30d;
}

a:visited{
  color: #6bb30d;
}

a:active{
  color: #6bb30d;
}

a:hover{
  color: #6bb30d;
  text-decoration: underline;
}


/*　表のスタイル　*/

.hyou1{
  border-spacing: 0 10px;
} 

.hyou1 th{
  font-weight: normal;
  text-align: center;
  padding: 0 10px;
  border-right: solid 3px #ff8d07;
  border-left: solid 3px #ff8d07;
}

.hyou1 td{
  padding-left: 10px;
}

.hyou3{
  border-spacing: 3px 3px;
  border: solid 1px gray;
  width: 100%;
}

.hyou3 th{
  font-weight: normal;
  padding: 10px 10px;
  background-color: #ffb76a;
  border: solid 1px gray;
}

.hyou3 td{
  padding: 10px 15px;
  border: solid 1px gray;
}

@media only screen and (max-width: 768px) {
  .hyou3 th{
    display: block;
  }
  .hyou3 td{
    display: block;
    margin: 5px 0;
  }
}


/*　フレックスコマンド　*/

.yoko{
  display: flex;
  flex-flow: column;
  align-items: center;
}

@media only screen and (min-width: 768px){
  .yoko{
    flex-flow: row;
  }
  .yoko li{
    margin-right: 20px;
  }
}

.yoko li li{
  margin: 0;
}

.yoko .list1 ul {
  margin-top: 0;
  padding-top: 0;
}

.yoko2 {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.yoko2 li{
  margin: 0;
  margin-top: 10px;
}

@media only screen and (min-width: 768px){
  .yoko2{
    flex-flow: row;
    align-items: flex-end;
  }
  .yoko2 li{
    margin: 10px 10px;
  }
}

.yoko3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

@media only screen and (max-width: 768px){
  .yoko3 {
    justify-content: center;
  }
}

.yoko3 li {
  margin: 8px 8px;
}


/*　ＰＣで表示・携帯で非表示（最下端に置くこと！）　*/

@media only screen and (max-width: 768px) {
  .rp{
    display: none;
  }
}

/*　ＰＣで非表示・携帯で表示（最下端に置くこと！）　*/

@media only screen and (min-width: 768px) {
  .rp2{
    display: none;
  }
}