@charset "UTF-8";
/* ==========================================================================
  FLOW PANNEL
========================================================================== */
@media all and (min-width: 769px) {
  .flow-pannel__outer {
    max-width: 50rem;
    margin-top: 5.9375rem;
  }
  .c-section--block .c-section__body.flow-pannel {
    padding-bottom: 0;
  }
  .flow-pannel .c-heading-lv2 {
    text-align: left;
  }
  .flow-pannel__item > a {
    margin-top: 1.875rem;
    border-radius: .625rem;
    box-shadow:0px 0px 4px 2px rgba(0, 0, 0, 0.12);
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .flow-pannel__item:first-child {
    margin-top: 0;
  }
  .flow-pannel__txt {
    margin-top: 1.0625rem;
  }

  .flow-pannel__synbol {
    width: 16%;
    background-color: #F7F6EC;
    display: flex;
    align-items: center;
  }
  .flow-pannel__ico::before {
    display: block;
    padding-top: calc(58 / 113 * 100%);
    content: '';
  }
  .flow-pannel__ico {
    width: 7.336875rem;
    position: relative;
    display: block;
  }
  .flow-pannel__ico--not-spread > img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .flow-pannel__disc {
    width: 78.7%;
    padding: 2rem 1.875rem 2.1rem;
  }
  .flow-pannel__mark-box {
    width: 7.25%;
    display: flex;
    align-items: center;
  }
  .flow-pannel__ttl {
    font-size: 1.4375rem;
    line-height: 1.565217391;
  }
  .flow-pannel__ico > svg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    fill: #b1081f;
  }
  .flow-pannel__disc-txt {
    font-size: 1rem;
    line-height: 1.75;
    margin-top: 1.25rem;
  }
  .flow-pannel_flow-pannel__mark-box {
    display: flex;
    align-items: center;
    width: 7.5%
  }
  .flow-pannel__mark {
    background-color: #b1081f;
    width: 2.34375rem;
    height: 2.34375rem;
    padding: .625rem .6rem .625rem .650rem;
    border-radius: 999px;
  }
}
@media all and (max-width: 768px) {
  .flow-pannel__outer {
    max-width: 50rem;
    margin-top: 3.571428571rem;
  }
  .c-section--block .c-section__body.flow-pannel {
    padding-bottom: 0;
  }
  .flow-pannel .c-heading-lv2 {
    text-align: left;
  }
  .flow-pannel__item > a {
    margin-top: 1.428571429rem;
    border-radius: .625rem;
    box-shadow:0px 0px 4px 2px rgba(0, 0, 0, 0.12);
    display:-ms-flexbox;
    display:flex;
  }
  .flow-pannel__item:first-child {
    margin-top: 0;
  }
  .flow-pannel__txt {
    margin-top: 0.428571429rem;
    line-height: 1.642857143;
  }

  .flow-pannel__synbol {
    width: 7.142857143rem;
    background-color: #F7F6EC;
    display: flex;
    align-items: center;
    flex: none;
  }
  .flow-pannel__ico::before {
    display: block;
    padding-top: calc(58 / 113 * 100%);
    content: '';
  }
  .flow-pannel__ico {
    width: 7.336875rem;
    position: relative;
    display: block;
  }
  .flow-pannel__ico--not-spread {
    text-align: center;
  }
  .flow-pannel__ico--not-spread::before {
    display: none;
  }
  .flow-pannel__disc {
    width: 78.7%;
    padding:  1rem 0.875rem 1.1rem;
  }
  .flow-pannel__mark-box {
    width: 7.25%;
    display: flex;
    align-items: center;
  }
  .flow-pannel__ttl {
    font-size: 1.142857143rem;
    line-height: 1.565217391;
  }
  .flow-pannel__ico > svg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    fill: #b1081f;
  }
  .flow-pannel__disc-txt {
    font-size: 1rem;
    line-height: 1.75;
    margin-top: 1.25rem;
  }
  .flow-pannel_flow-pannel__mark-box {
    display: none;
  }
  .flow-pannel__mark {
    background-color: #b1081f;
    width: 2.34375rem;
    height: 2.34375rem;
    padding: .625rem .6rem .625rem .650rem;
    border-radius: 999px;
  }
}
/* ==========================================================================
  FLOW CARD
========================================================================== */
@media all and (min-width: 769px) {
  .flow-card__outer {
    max-width: 50rem;
    margin-top: 5.9375rem;
  }
  .flow-card__outer_about {
    max-width: 61.6rem;
    margin-top: 5.9375rem;
  }
  .flow-card {
    padding-bottom: 6.25rem;
  }
  .flow-card .c-heading-lv2 {
    text-align: left;
  }
  .flow-card__list {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .flow-card__outer_about .flow-card__item {
      width:  100%;
      margin: 0 0.8rem;
  }
  .flow-card__item{
    width:  100%;
    margin: 0 3.6875rem;
  }
  .flow-card__txt {
    margin-top: 1.0625rem;
    line-height: 1.75;
  }
  .flow-card__synbol {

    margin: 0 auto;
    display: flex;
    align-items: center;
  }
  .flow-card__ico::before {
    display: block;
    padding-top: 100%;
    content: '';
  }
  .flow-card__ico {
    width: 60%;
    border:2px solid #b1081f;
    position: relative;
    display: block;
    margin: 0 auto;
    border-radius: 999px;
  }
  .flow-card__disc {
    text-align: center;
  }
  .flow-card__mark-box {
    width: 7.25%;
    display: flex;
    align-items: center;
  }
  .flow-card__ttl {
    text-align: center;
    font-size: 1.125rem;
    line-height: 1.565217391;
    margin-top: 1.5625rem;
  }
  .flow-card__ico > svg {
    width: 55%;
    height: 55%;
    position: absolute;
    fill: #b1081f;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }
  .flow-card__item--teacher .flow-card__ico > svg {
    transform: translate(-45%,-50%);
  }
  .flow-card__disc-txt {
    font-size: 1rem;
    line-height: 1.75;
    margin-top: 1.25rem;
  }
  .flow-card__mark {
    background-color: #b1081f;
    width: 2.34375rem;
    height: 2.34375rem;
    padding: .625rem .6rem .625rem .650rem;
    border-radius: 999px;
  }
}
@media all and (max-width: 768px) {
  .flow-card__outer {
    max-width: 50rem;
    margin-top: 2.857142857rem;
  }
  .flow-card__outer_about {
    max-width: 50rem;
    margin-top: 2.857142857rem;
  }
  .flow-card {
    padding: 0 .714285714rem 3.571428571rem;
    max-width: 400px;
    margin: 0 auto;
  }
  .flow-card .c-heading-lv2 {
    text-align: left;
  }
  .flow-card__list {
    display: flex;
    flex-direction: column;
  }
  .flow-card__item{
    margin-top: 2.142857143rem;
  }
  .flow-card__item:first-child{
    margin-top: 0;
  }
  .flow-card__item > a{
    display: flex;
    align-items: center;
  }
  .flow-card__txt {
    margin-top: 0.428571429rem;
    line-height: 1.75;
  }
  .flow-card__synbol {
    width: 6.428571429rem;
    display: flex;
    align-items: center;
    flex:none
  }
  .flow-card__ico::before {
    display: block;
    padding-top: 100%;
    content: '';
  }
  .flow-card__ico {
    width: 6.336875rem;
    border:2px solid #b1081f;
    position: relative;
    display: block;
    /* margin: 0 auto; */
    border-radius: 999px;
  }
  .flow-card__disc {
    margin-left: 0.8rem;
  }
  .flow-card__mark-box {
    width: 7.25%;
    display: flex;
    align-items: center;
  }
  .flow-card__ttl {
    font-size: 1rem;
    line-height: 1.565217391;
  }
  .flow-card__ico > svg {
    width: 55%;
    height: 55%;
    position: absolute;
    fill: #b1081f;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }
  .flow-card__item--teacher .flow-card__ico > svg {
    transform: translate(-45%,-50%);
  }
  .flow-card__disc-txt {
    font-size: 1rem;
    line-height: 1.75;
    margin-top: 1.25rem;
  }
  .flow-card__mark {
    background-color: #b1081f;
    width: 2.34375rem;
    height: 2.34375rem;
    padding: .625rem .6rem .625rem .650rem;
    border-radius: 999px;
  }
}
