/*******************************
teacher
*******************************/
#pageTeacher #container {
  padding-top: 4em;
  background: url("/assets/img/bg01.png") no-repeat 0 0 #fff;
  background-size: cover; }
  @media screen and (max-width: 599px) {
    #pageTeacher #container {
      padding-top: 2.5em; } }
#pageTeacher .wrap01 {
  display: flex;
  flex-wrap: wrap; }
  @media screen and (max-width: 599px) {
    #pageTeacher .wrap01 {
      display: block; } }
  #pageTeacher .wrap01 .subject {
    width: 48%; }
    @media screen and (max-width: 599px) {
      #pageTeacher .wrap01 .subject {
        width: 100%; } }
    #pageTeacher .wrap01 .subject:nth-child(odd) {
      margin-right: 4%; }
    #pageTeacher .wrap01 .subject .list .each {
      width: 100%; }
      #pageTeacher .wrap01 .subject .list .each:nth-child(odd) {
        margin-right: 0; }
#pageTeacher .subject {
  display: flex;
  justify-content: space-between;
  margin-bottom: 2em; }
  #pageTeacher .subject.cl01 h3 {
    color: #006eae;
    border-right: 1px solid #006eae;
    border-left: 1px solid #006eae; }
  #pageTeacher .subject.cl01 .list .each h4 {
    color: #006eae; }
  #pageTeacher .subject.cl02 h3 {
    color: #007d95;
    border-right: 1px solid #007d95;
    border-left: 1px solid #007d95; }
  #pageTeacher .subject.cl02 .list .each h4 {
    color: #007d95; }
  #pageTeacher .subject.cl03 h3 {
    color: #008e78;
    border-right: 1px solid #008e78;
    border-left: 1px solid #008e78; }
  #pageTeacher .subject.cl03 .list .each h4 {
    color: #008e78; }
  #pageTeacher .subject.cl04 h3 {
    color: #009e5c;
    border-right: 1px solid #009e5c;
    border-left: 1px solid #009e5c; }
  #pageTeacher .subject.cl04 .list .each h4 {
    color: #009e5c; }
  #pageTeacher .subject.cl05 h3 {
    color: #2fa83f;
    border-right: 1px solid #2fa83f;
    border-left: 1px solid #2fa83f; }
  #pageTeacher .subject.cl05 .list .each h4 {
    color: #2fa83f; }
  #pageTeacher .subject.cl06 h3 {
    color: #83ab24;
    border-right: 1px solid #83ab24;
    border-left: 1px solid #83ab24; }
  #pageTeacher .subject.cl06 .list .each h4 {
    color: #83ab24; }
  #pageTeacher .subject h3 {
    color: #006eae;
    text-align: center;
    font-size: 6em;
    width: 0.95em;
    line-height: 1.1;
    padding: 0.25em 0;
    border-right: 1px solid #006eae;
    border-left: 1px solid #006eae;
    display: flex;
    justify-content: center; }
    @media screen and (max-width: 599px) {
      #pageTeacher .subject h3 {
        font-size: 3em; } }
  #pageTeacher .subject .list {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 8em); }
    @media screen and (max-width: 599px) {
      #pageTeacher .subject .list {
        display: block;
        width: calc(100% - 4em); } }
    #pageTeacher .subject .list .each {
      width: 48%;
      margin-bottom: 2em; }
      @media screen and (max-width: 599px) {
        #pageTeacher .subject .list .each {
          width: 100%; } }
      #pageTeacher .subject .list .each:nth-child(odd) {
        margin-right: 4%; }
      #pageTeacher .subject .list .each h4 {
        font-size: 1.5em;
        color: #006eae; }
      #pageTeacher .subject .list .each .wrap {
        display: flex;
        align-items: flex-start;
        justify-content: space-between; }
      #pageTeacher .subject .list .each .txt {
        width: calc(100% - 9em); }
        @media screen and (max-width: 599px) {
          #pageTeacher .subject .list .each .txt {
            width: 68%;
            font-size: 87.5%; } }
        #pageTeacher .subject .list .each .txt.noimage {
          width: 100%; }
        #pageTeacher .subject .list .each .txt .txt01 {
          font-size: 87.5%; }
      #pageTeacher .subject .list .each .img {
        width: 8em; }
        @media screen and (max-width: 599px) {
          #pageTeacher .subject .list .each .img {
            width: 30%; } }