@charset "UTF-8";
/* =============================================
page about
============================================= */
/* aboutページTOP */
.l-main#howToUse .introduction {
  margin-bottom: 25px;
  line-height: 1.57143; }
.l-main#howToUse .contentNavi {
  margin-bottom: 40px; }
  .l-main#howToUse .contentNavi__box.is-fixed {
    position: fixed;
    top: 0px;
    z-index: 1000; }
.l-main#howToUse .anchors {
  width: 737px; }
.l-main#howToUse .section .lead {
  margin-bottom: 5px;
  font-size: 114.28571%;
  font-weight: bold; }
.l-main#howToUse .section .point {
  margin-bottom: 20px;
  padding: 15px 20px;
  line-height: 1.57143;
  background-color: #f1f9ff; }
  .l-main#howToUse .section .point > h4 {
    margin-bottom: 5px; }
.l-main#howToUse .section .respond {
  margin-bottom: 15px;
  padding-bottom: 40px;
  background: url("/open-course/img/how_to_use/top/parts_block-allow.png") center bottom no-repeat; }
  .l-main#howToUse .section .respond__head {
    padding: 5px 15px;
    margin-bottom: 15px;
    font-size: 114.28571%;
    font-weight: bold;
    color: #fff;
    background-color: #0068b7;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px; }
  .l-main#howToUse .section .respond__list {
    margin-bottom: 20px; }
    .l-main#howToUse .section .respond__list > li {
      padding: 0 0 0 30px;
      margin: 0 0 10px;
      font-size: 107.14286%;
      font-weight: bold;
      background: url("/open-course/img/common/icon_checked-c.png") left top no-repeat; }
.l-main#howToUse .section .links {
  overflow: hidden;
  margin-bottom: 45px; }
  .l-main#howToUse .section .links > li {
    float: left;
    width: 362px;
    line-height: 1.57143; }
    .l-main#howToUse .section .links > li + li {
      margin-left: 13px; }
    .l-main#howToUse .section .links > li p {
      padding: 10px 10px 0;
      text-align: justify; }
  .l-main#howToUse .section .links--tri > li {
    width: 236px; }
    .l-main#howToUse .section .links--tri > li + li {
      margin-left: 14px; }
.l-main#howToUse #needs2 .respond__list {
  overflow: hidden;
  margin-bottom: 5px; }
.l-main#howToUse #needs2 .respond__list li {
  float: left;
  width: 362px;
  margin-right: 30px; }
  .l-main#howToUse #needs2 .respond__list li p {
    font-weight: normal;
    padding-top: 10px; }
.l-main#howToUse #needs2 .respond__list li + li {
  float: left;
  width: 310px; }

/* aboutページ flow */
.l-main#flow .contentNavi {
  margin-bottom: 30px; }
  .l-main#flow .contentNavi__box {
    margin-bottom: 10px; }
    .l-main#flow .contentNavi__box li span {
      padding: 1px 10px;
      margin-left: 10px;
      font-size: 10px;
      color: #FFF;
      letter-spacing: .03em;
      -webkit-border-radius: 5px;
      border-radius: 5px; }
      .l-main#flow .contentNavi__box li span.admin {
        background: #019ae3; }
      .l-main#flow .contentNavi__box li span.student {
        background: #89CB43; }
.l-main#flow #flowContent {
  position: relative; }
  .l-main#flow #flowContent:before {
    content: '';
    position: absolute;
    top: 0;
    left: 84px;
    height: 100%;
    width: 0;
    border-left: 1px dotted #d4d4d4; }
  .l-main#flow #flowContent .switch {
    position: relative;
    z-index: 3;
    width: 168px;
    margin-bottom: 10px; }
    .l-main#flow #flowContent .switch > li {
      float: left;
      width: 50%;
      padding: 3px 0;
      font-size: 12px;
      color: #FFF;
      text-align: center;
      font-weight: bold; }
      .l-main#flow #flowContent .switch > li.admin {
        background: #019ae3; }
      .l-main#flow #flowContent .switch > li.student {
        background: #89CB43; }
  .l-main#flow #flowContent .flow {
    display: table;
    width: 100%;
    padding-bottom: 60px; }
    .l-main#flow #flowContent .flow__head {
      position: relative;
      display: table-cell;
      width: 168px;
      padding: 17px 10px;
      vertical-align: top;
      font-size: 16px;
      font-weight: bold;
      color: #FFF; }
      .l-main#flow #flowContent .flow__head:before, .l-main#flow #flowContent .flow__head:after {
        content: "";
        display: block;
        position: absolute; }
      .l-main#flow #flowContent .flow__head:before {
        top: -60px;
        width: 22px;
        height: 60px;
        background: #003399; }
      .l-main#flow #flowContent .flow__head:after {
        bottom: -30px;
        left: 0;
        z-index: 2;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 30px 84px 0 84px; }
      .l-main#flow #flowContent .flow__head--admin {
        background: #019ae3; }
        .l-main#flow #flowContent .flow__head--admin:before {
          left: 25%;
          margin-left: -11px; }
        .l-main#flow #flowContent .flow__head--admin:after {
          border-color: #019be3 transparent transparent transparent; }
      .l-main#flow #flowContent .flow__head--student {
        background: #89CB43; }
        .l-main#flow #flowContent .flow__head--student:before {
          left: 75%;
          margin-left: -11px; }
        .l-main#flow #flowContent .flow__head--student:after {
          border-color: #89CB43 transparent transparent transparent; }
      .l-main#flow #flowContent .flow__head--first:before {
        top: -25px;
        height: 25px; }
    .l-main#flow #flowContent .flow__txt {
      display: table-cell;
      padding-left: 20px;
      vertical-align: top; }
      .l-main#flow #flowContent .flow__txtHead {
        font-size: 16px;
        line-height: 26px;
        font-weight: bold; }
        .l-main#flow #flowContent .flow__txtHead span {
          display: block;
          font-size: 14px;
          font-weight: normal; }
      .l-main#flow #flowContent .flow__txtCautions {
        margin-top: 20px;
        padding-left: 1em;
        text-indent: -1em; }
      .l-main#flow #flowContent .flow__txtLinks {
        margin-top: 20px; }
      .l-main#flow #flowContent .flow__txt .m-anchorbox__item a {
        padding-bottom: 0;
        background-image: url("/open-course/img/side/common/icon_img2.gif"); }
.l-main#flow #flowContent #flowSection6 {
  padding-bottom: 30px;
  margin-bottom: 45px; }

/* effective */
.l-main#effective {
  margin-bottom: 65px;
  /* contents */
  /*----------------------------*/
  /* 概要 */
  /* 詳細  */ }
  .l-main#effective .eyecatch {
    margin-bottom: 20px; }
  .l-main#effective .lead {
    margin-bottom: 45px;
    line-height: 1.7;
    font-size: 109%; }
    .l-main#effective .lead p {
      margin-bottom: 25px; }
      .l-main#effective .lead p strong {
        font-weight: bold;
        color: #0069bb; }
  .l-main#effective .summary {
    padding: 20px;
    margin-bottom: 42px;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZWJmNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==");
    background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e2ebf6), color-stop(100%, #ffffff));
    background: -webkit-linear-gradient(#e2ebf6, #ffffff);
    background: -moz-linear-gradient(#e2ebf6, #ffffff);
    background: -o-linear-gradient(#e2ebf6, #ffffff);
    background: linear-gradient(#e2ebf6, #ffffff); }
    .l-main#effective .summary__image, .l-main#effective .summary__catch {
      margin-bottom: 20px;
      text-align: center; }
    .l-main#effective .summary__points {
      width: 643px;
      margin: 0 auto; }
      .l-main#effective .summary__points ul {
        *zoom: 1;
        margin-right: -23px; }
        .l-main#effective .summary__points ul:after {
          content: "";
          display: block;
          clear: both; }
      .l-main#effective .summary__points li {
        float: left;
        margin-right: 23px; }
  .l-main#effective .note {
    line-height: 1.7; }
    .l-main#effective .note a {
      font-weight: bold;
      color: #10872D; }
  .l-main#effective .detail {
    *zoom: 1;
    padding: 20px;
    margin-bottom: 12px;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YzZjdmOCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==");
    background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #f3f7f8));
    background: -webkit-linear-gradient(#ffffff, #f3f7f8);
    background: -moz-linear-gradient(#ffffff, #f3f7f8);
    background: -o-linear-gradient(#ffffff, #f3f7f8);
    background: linear-gradient(#ffffff, #f3f7f8); }
    .l-main#effective .detail__icon {
      float: left;
      padding-right: 20px; }
    .l-main#effective .detail__wrap {
      float: left;
      width: 565px; }
    .l-main#effective .detail__head {
      padding-bottom: 11px;
      margin-bottom: 9px;
      border-bottom: 1px dashed #B0AFAF; }
    .l-main#effective .detail__title {
      float: left;
      padding-top: 3px;
      font-size: 128.57143%;
      color: #20589D;
      font-weight: bold; }
    .l-main#effective .detail__category {
      float: right; }
      .l-main#effective .detail__category p {
        display: inline-block; }
  .l-main#effective .comments__text {
    margin-bottom: 30px;
    line-height: 1.7;
    font-size: 92.85714%; }
  .l-main#effective .comments__attr {
    margin-bottom: 25px;
    line-height: 1.7;
    font-size: 92.85714%; }
  .l-main#effective .comments__item--left {
    float: left; }
    .l-main#effective .comments__item--left .comments__itemTxt {
      background-color: #E4E4E4; }
  .l-main#effective .comments__item--right {
    float: right; }
    .l-main#effective .comments__item--right .comments__itemTxt {
      background-color: #D7E3F2; }
  .l-main#effective .comments__itemImg {
    float: left;
    padding-right: 10px; }
  .l-main#effective .comments__itemTxt {
    float: left;
    width: 164px;
    border-radius: 14px;
    padding: 12px 16px;
    font-size: 92.85714%;
    line-height: 1.5; }
    .l-main#effective .comments__itemTxt ul li {
      padding-left: 1em;
      text-indent: -1em; }
    .l-main#effective .comments__itemTxt span {
      font-weight: bold; }
  .l-main#effective .arrow {
    margin-bottom: 16px;
    text-align: center; }
  .l-main#effective #point1 .comments__itemTxt {
    min-height: 145px; }
  .l-main#effective #point2 .detail__title {
    color: #3A8228; }
  .l-main#effective #point2 .comments__item--left p {
    line-height: 1.5; }
  .l-main#effective #point2 .comments__itemTxt {
    min-height: 185px; }
  .l-main#effective #point3 .detail__title {
    color: #FF6702; }
  .l-main#effective #point3 .comments__itemTxt {
    min-height: 209px; }
  .linkGroup{
    padding: 10px 25px; }
  .linkGroup__item{
    line-height: 1.78571; }
  .linkGroup__link{
    padding: 3px 0 3px 18px;
    background-image: url(/open-course/img/common/icon_arc-allow_r.png);
    background-position: left center;
    background-repeat: no-repeat; }
  .howToUseLinks, .howToUseLinks--addBottomMargin{
    margin-top: 40px; }
  .howToUseLinks--addBottomMargin{
    margin-bottom: 40px; }
  .header-level3{
    padding: 0.25em 0.5em;
    color: #494949;
    background: transparent;
    border-left: solid 7px #7db4e6;
    border-bottom: solid 2px #7db4e6;
    font-size:20px;
    font-weight: bold; }




/*# sourceMappingURL=how_to_use.css.map */