@charset "utf-8";

/********************************
*    共通ナビゲーション    *
********************************/

.circular {
  display: none;
}
@media screen and (max-width:767px){
  .step{
      display: none!important;
  }
  .circular {
      display: block;
      height: 50px;
      width: 50px;
      position: relative;
    }
    
    .circular .inner {
      position: absolute;
      z-index: 6;
      top: 50%;
      left: 50%;
      height: 40px;
      width: 40px;
      margin: -20px 0 0 -20px;
      background: white;
      border-radius: 100%;
    }
    
    .circular .number {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 10;
      font-size: 12px;
      font-weight: 500;
      color: #9f8320;
    }
    
    .circular .bar {
      position: absolute;
      height: 100%;
      width: 100%;
      background: #eee;
      -webkit-border-radius: 100%;
      clip: rect(0px, 50px, 50px, 25px);
    }
    
    .circle .bar .progress {
      position: absolute;
      height: 100%;
      width: 100%;
      -webkit-border-radius: 100%;
      clip: rect(0px, 25px, 50px, 0px);
      background: #9f8320;
    }
    
    .circle .left .progress {
      z-index: 1;
      animation: left 2s linear both;
    }
    
    .circle .right {
      transform: rotate(180deg);
      z-index: 3;
    }
    
    .circle .right .progress {
      animation: right 2s linear both;
      animation-delay: 2s;
    }

    .circle .text1 {
      display: inline-block;
      margin-left: 70px;
      font-size: 18px;
      white-space: nowrap;
      font-weight: bold;
    }
    .circle .text2 {
      display: inline-block;
      margin-left: 70px;
      font-size: 14px;
      white-space: nowrap;
    }
}

/****************
*    入力画面    *
****************/

/* ボタン下文言 */
.primary_info {
    text-align: center;
    font-size: 12px;
}

/****************
*    確認画面    *
****************/

/* 年月日文言 */
.sb_confirm_index .str_birth .ss_input:first-child:after {
    content: "年";
}
.sb_confirm_index .str_birth .ss_input:nth-child(2):after {
    content: "月";
}
.sb_confirm_index .str_birth .ss_input:nth-child(3):after {
    content: "日";
}

/****************
*    完了画面    *
****************/

.comp_text{
    text-align: center;
}

