.inline_block {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

.table_cell {
  display: table-cell;
  *display: inline;
  *zoom: 1;
  vertical-align: middle; }

/* clearfix */
.clearfix, #header {
  position: relative;
  *zoom: 1; }
  .clearfix:after, #header:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden; }

[data-fixed] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 0;
  padding: 0 15px; }

.sp_item {
  display: block !important; }

.pc_item {
  display: none !important; }

.nodisp {
  display: none !important; }

.tC {
  text-align: left; }

body.fixed {
  position: fixed;
  width: 100%;
  height: 100%; }

.contents {
  width: 100%;
  min-width: 0;
  padding: 0 5%; }

hr {
  margin: 20px 0; }

select {
  font-size: 16px;
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8); }

/*----------------------------------------------------
	contents
----------------------------------------------------*/
body {
  min-width: 0;
  padding-top: 64px; }
  @media (min-width: 0px) and (max-width: 320px) {
    body {
      font-size: 85%; } }

#contents {
  min-width: 100%; }

section {
  min-width: 100%; }
  @media (min-width: 0px) and (max-width: 1420px) {
    section {
      padding: 0 4.6875%; } }
  section .inr {
    padding-left: 4.6875%;
    padding-right: 4.6875%; }
  section#title_area {
    width: 100%;
    background: -moz-linear-gradient(left, #0458c4 0%, #009fe5 100%) !important;
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #0458c4 0%, #009fe5 100%) !important;
    /* Chrome10-25,Safari5.1-6 */
    text-align: center;
    height: 180px; }
    section#title_area #bradcrumbs {
      display: none; }
    section#title_area h1 {
      font-size: 216%;
      height: 100%;
      line-height: 1.2; }
      section#title_area h1 span {
        padding: 0;
        text-align: center; }
        section#title_area h1 span:after {
          content: '';
          display: block;
          width: 40px;
          height: 4px;
          background: #ffd600;
          margin: 10px auto 0; }
  section.col_w {
    background: #FFF;
    padding: 18.75% 0; }
  section.col_g {
    background: #f2f2f2;
    padding: 18.75% 0; }

.ttl_h1 {
  color: #00a6ff;
  font-size: 262%;
  text-align: center; }
  .ttl_h1_s {
    font-size: 177%; }

.ttl_h2 {
  font-size: 162%; }
  .ttl_h2_s {
    font-size: 108%; }
  .ttl_h2_pdf {
    background: url("../images/pdf.png") no-repeat center left;
    background-size: 16px;
    padding-left: 20px;
    line-height: 16px; }

.lead {
  font-size: 93%;
  margin-bottom: 6.25%; }

ul.list {
  margin-bottom: 6.25%; }
  ul.list li {
    margin-bottom: 4.6875%; }
    ul.list li .img {
      width: 100%;
      display: block; }
    ul.list li .txt {
      width: 100%;
      display: block;
      padding: 9.375%; }

.btn_more {
  margin: 0 auto;
  min-width: 0; }

.btn_blu {
  width: auto;
  max-width: auto;
  padding: 10px 36px; }
  .btn_blu:after {
    right: 15px; }

.w_80 {
  width: 100%; }

/*----------------------------------------------------
	header
----------------------------------------------------*/
#header {
  width: 100%;
  min-width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  z-index: 400;
  height: auto;
  border: none;
  background: #FFF; }
  #header-logo {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    padding: 17px 4.6875%;
    border-bottom: 1px solid #dfdfdf;
    height: 64px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #header-logo img {
      display: inline-block;
      vertical-align: middle;
      width: 90px;
      margin-bottom: 0; }
    #header-logo .logo {
      padding-right: 10px;
      margin-right: 5px;
      display: inline-block;
      border-right: 1px solid #eaeaea; }
    #header-logo .note {
      display: inline-block;
      line-height: 1.2;
      vertical-align: middle;
      margin-left: 1.5625%; }
      #header-logo .note br {
        display: block; }
    #header-logo.header-lang {
      top: 0; }
  #header #open {
    display: table;
    position: absolute;
    top: 14px;
    right: 4.6875%;
    width: 30px;
    height: 100%;
    cursor: pointer; }
    #header #open span {
      width: 30px;
      height: 30px;
      text-indent: -999px;
      overflow: hidden;
      white-space: nowrap;
      position: relative;
      background: url("../images/open.png") no-repeat center left;
      background-size: contain;
      vertical-align: middle;
      display: inline-block; }
    #header #open.close span {
      background: url("../images/close.png") no-repeat center left;
      background-size: contain; }
  #header-navi {
    position: static;
    height: auto;
    top: 0;
    right: 0;
    width: 100%; }
  #header-list {
    display: none; }
    #header-list.on {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-content: flex-start;
      -ms-flex-line-pack: start;
      align-content: flex-start;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 100%;
      padding: 0 3.125%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      overflow-y: auto; }
      #header-list.on > li {
        width: 100%;
        vertical-align: top; }
        #header-list.on > li.header-list_01 {
          -webkit-box-ordinal-group: 2;
          -ms-flex-order: 2;
          -webkit-order: 2;
          order: 2; }
        #header-list.on > li.header-list_02 {
          -webkit-box-ordinal-group: 1;
          -ms-flex-order: 1;
          -webkit-order: 1;
          order: 1; }
          #header-list.on > li.header-list_02.type02 {
            position: static;
            -webkit-transform: none;
            -ms-transform: none;
            transform: none; }
            #header-list.on > li.header-list_02.type02 li.login {
              position: static;
              -webkit-transform: none;
              -ms-transform: none;
              transform: none;
              margin-left: 0; }
  #header-navi_01 {
    border-top: 1px solid #dfdfdf;
    width: 100%;
    height: auto;
    padding-left: 0; }
    #header-navi_01.ja li, #header-navi_01.pulldown li {
      width: 100%; }
      #header-navi_01.ja li.home a, #header-navi_01.pulldown li.home a {
        width: 100%; }
    #header-navi_01 li {
      display: block;
      vertical-align: middle;
      height: auto;
      padding: 0;
      border-bottom: 1px solid #dfdfdf;
      font-size: 124%; }
      #header-navi_01 li.forteachers .down > a, #header-navi_01 li.classpadnet .down > a {
        pointer-events: none; }
      #header-navi_01 li a, #header-navi_01 li span {
        display: table;
        position: relative;
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        height: auto;
        border-bottom: none !important;
        padding: 4.6875% 1.5625%; }
        #header-navi_01 li a > span, #header-navi_01 li span > span {
          vertical-align: middle;
          display: inline-block;
          padding: 0;
          position: relative; }
          #header-navi_01 li a > span:before, #header-navi_01 li a > span:after, #header-navi_01 li span > span:before, #header-navi_01 li span > span:after {
            display: none !important; }
        #header-navi_01 li a:after, #header-navi_01 li span:after {
          content: '';
          display: inline-block;
          vertical-align: baseline;
          background: url("../images/link_right.png") no-repeat center left;
          background-size: contain;
          width: 9px;
          height: 14px;
          position: absolute;
          right: 1.5625%;
          top: 50%;
          margin-top: -7px; }
        #header-navi_01 li a.active, #header-navi_01 li a:hover, #header-navi_01 li span.active, #header-navi_01 li span:hover {
          border-bottom: none !important; }
        #header-navi_01 li a.active > a, #header-navi_01 li span.active > a {
          color: #0c70cc; }
        #header-navi_01 li a.nolink, #header-navi_01 li span.nolink {
          color: #BBBBBB;
          cursor: default; }
          #header-navi_01 li a.nolink:after, #header-navi_01 li span.nolink:after {
            display: none; }
      #header-navi_01 li .down {
        display: block;
        padding: 0; }
        #header-navi_01 li .down:after {
          display: none; }
        #header-navi_01 li .down .navi_small {
          display: none;
          position: static;
          background: #f5f5f5;
          padding: 0 4.6875%;
          border-top: 1px solid #dfdfdf;
          font-size: 93%; }
          #header-navi_01 li .down .navi_small li {
            font-size: 100%;
            border-bottom: none; }
            #header-navi_01 li .down .navi_small li + li {
              border-top: 1px solid #dfdfdf; }
            #header-navi_01 li .down .navi_small li span {
              padding: 4.6875% 1.5625%;
              display: table;
              position: relative;
              width: 100%; }
            #header-navi_01 li .down .navi_small li a span {
              padding: 0 !important;
              display: inline-block !important; }
              #header-navi_01 li .down .navi_small li a span::before {
                display: none !important; }
        #header-navi_01 li .down > span,
        #header-navi_01 li .down > a {
          display: block;
          position: relative;
          padding: 4.6875% 1.5625%; }
          #header-navi_01 li .down > span:before, #header-navi_01 li .down > span:after,
          #header-navi_01 li .down > a:before,
          #header-navi_01 li .down > a:after {
            content: '';
            position: absolute;
            top: 50%;
            right: 1.5625%;
            content: '';
            display: inline-block !important;
            width: 13px;
            height: 13px;
            border-top: 2px solid #000;
            -webkit-transform: translateY(50%);
            -ms-transform: translateY(50%);
            transform: translateY(50%);
            background: none; }
          #header-navi_01 li .down > span:before,
          #header-navi_01 li .down > a:before {
            top: 50%;
            right: calc(1.5625% - 1px);
            -webkit-transform: rotate(90deg) translate(-50%, 50%);
            -ms-transform: rotate(90deg) translate(-50%, 50%);
            transform: rotate(90deg) translate(-50%, 50%); }
        #header-navi_01 li .down.on > span:before {
          display: none !important; }
  #header-navi_02 {
    width: 100%; }
    #header-navi_02 li {
      width: 100% !important;
      height: auto;
      display: inline-block;
      vertical-align: middle;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      padding: 4.6875% 0 0;
      white-space: normal; }
      #header-navi_02 li a {
        color: #FFF; }
      #header-navi_02 li span {
        display: block;
        border-radius: 30px;
        padding: 10px 4.6875%;
        text-align: center; }
      #header-navi_02 li.software {
        padding-left: 0;
        margin-right: 1.72414%; }
      #header-navi_02 li.login {
        width: 100% !important; }
      #header-navi_02 li.login, #header-navi_02 li.key {
        position: static;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none; }
      #header-navi_02 li.key {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-top: 4.6875%;
        border-radius: 20px; }
        #header-navi_02 li.key .key01 {
          width: 100%; }
          #header-navi_02 li.key .key01 a:after {
            width: 100%;
            height: 1px;
            top: auto;
            bottom: 0;
            -webkit-transform: none;
            -ms-transform: none;
            transform: none; }
        #header-navi_02 li.key .key02 {
          width: 50%; }
          #header-navi_02 li.key .key02 a:after {
            height: 100%; }
        #header-navi_02 li.key .key03 {
          width: 50%; }
  #header-serch {
    display: block;
    height: auto;
    position: absolute;
    top: 17px;
    right: 17.1875%;
    padding: 0; }
    @media (min-width: 415px) and (max-width: 767px) {
      #header-serch {
        right: 17.1875%; } }
    #header-serch a {
      position: static;
      vertical-align: middle;
      display: inline-block;
      width: 26px;
      height: 26px;
      margin-top: 0; }
  #header #modal-serch form #submit_txt input {
    font-size: 139%;
    line-height: 1.6; }
  #header #modal-serch form #submit_button {
    width: 43px;
    height: 43px; }
    #header #modal-serch form #submit_button input {
      width: 43px;
      height: 43px; }
  #header #modal-serch #serch_close {
    top: 0;
    right: 0;
    width: 30px;
    padding: 4.6875%; }
    #header #modal-serch #serch_close span {
      width: 30px;
      height: 30px; }

/*----------------------------------------------------
	footer
----------------------------------------------------*/
#footer {
  min-width: 100%;
  padding: 6.25% 4.6875%; }
  #footer #pagetop {
    right: 4.6875%; }
  #footer #snsare {
    padding-bottom: 6.25%; }
  #footer nav {
    padding: 9.375% 0;
    margin-bottom: 9.375%; }
    #footer nav > ul {
      width: 100%;
      display: block; }
      #footer nav > ul > li {
        display: none;
        width: 100%;
        padding-right: 0; }
        #footer nav > ul > li #footer-logo {
          display: block; }
          #footer nav > ul > li #footer-logo img {
            width: 33.59375%;
            margin: 0 0 3.125%; }
          #footer nav > ul > li #footer-logo span br {
            display: none; }
        #footer nav > ul > li .note {
          margin-bottom: 3.125%; }
          #footer nav > ul > li .note br {
            display: none; }
        #footer nav > ul > li a {
          margin-bottom: 0; }
        #footer nav > ul > li:first-child {
          display: block; }
  #footer-lang {
    width: 90.625%;
    float: none;
    border: 1px solid #3e3a39;
    border-radius: 30px;
    margin: 0 auto 9.375%;
    padding: 3.125%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #footer-lang .select-wrap {
      position: relative;
      width: 100%; }
      #footer-lang .select-wrap select {
        width: 97.65625%;
        padding-left: 2%; }
  #footer-otherlink {
    float: none;
    text-align: center; }
    #footer-otherlink li {
      margin: 0 0 9.375%;
      width: 50%; }
      #footer-otherlink li:last-child {
        width: 100%;
        margin-bottom: 0; }