.sp{
  display: none;
}

.top_view_botton{
  width: 350px;
  padding: 1% 5%;
  background-color: #0fd694;
  color: #fff;
  font-weight: 600;
  margin: auto;
  display: block;
  text-align: center;
  border-radius: 30px;
  margin-top: 50px;
  margin-bottom: 100px;
}
.top_view_botton:hover{
  background-color: #8fdbc2;
}

/*****************************/
.about_us{
  margin-top: 80px;
  margin-bottom: 112px;
}



.ab_top{
  text-align: center;
  margin-bottom: 80px;
}

.abouto_micoto_title{
  font-size: 36px;
  font-weight: bold;
  margin: 0px 0 62px 0;
  padding-top :40px;
  
}

.ab_top p{
  font-size: 24px;
  font-weight: bold;
  margin: 0 0 72px 0;
}

.ab_top img{
  width: 31%;
  height: auto;
}

.can_do h2{
  font-size: 24px;
  font-weight: bold;
  padding-left: 20px;
  border-left: 3px solid #C21630;
  margin: 0 0 24px 0;
}

.h_t_n_s,
.flex_n_s{
  display: flex;
}

.need{
  width: 50%;
  padding-right: 20px;
}

.supporter{
  width: 50%;
  padding-left: 20px;
}
.can_do h3{
  font-size: 24px;
  font-weight: bold;
  padding: 0 0 8px 0;
  margin: 0;
}


.soukanzu{
  text-align: center;
  margin: 72px 0 80px 0;
}

.ab02{
  text-align: center;
  margin: 72px 0 0 0;
}

.ab02 img,
.soukanzu img{
  width: 84%;
  
}

.red{
  width: 100%;
  border-bottom: 2px solid #C21630;
  margin-bottom: 18px;
}

.yellow{
  width: 100%;
  border-bottom: 2px solid #E8B406;
  margin-bottom: 18px;
}

.can_do p{
  font-size: 16px;
}

.can_do {
  margin-bottom: 80px;
}

.how_to{
  text-align: center;
  width: 84%;
  margin: 0px auto;
  padding-top: 80px;
}

.how_to h1{
  font-size: 38px;
  font-weight: bold;
  margin-bottom: 64px;
  
}

.how_to h1 img{
  height: 24px;
  vertical-align: middle; 
  margin-right: 12px;
}

.goriyou{
  vertical-align: middle; 
  font-size: 24px;
}

.guide_supo h3,
.how_to h3{
  font-size: 24px;
  font-weight: bold;
  padding-bottom: 8px;
  text-align: left;

  padding: 0 0 8px 0;
  margin: 0;
}

.dw_ar img{
  width:  52px;
}

.ht_need .red{
  margin-bottom: 40px;
}

.sono1{
  width: 100%;
  
  border-radius:8px;
  box-shadow: 0px 3px 6px rgba(0 0 0 / 16%);
  padding: 42px 24px;
  margin-bottom: 56px;

  text-align: center;
}

.sono2{
  width: 100%;
  
  border-radius:8px;
  box-shadow: 0px 3px 6px rgba(0 0 0 / 16%);
  padding: 36px 24px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;

  margin: 60px 0 42px 0;
}

.yajirushi__margin_box{
  margin-top: 60px;
}

/*吹き出し影*/

.yajirushi_box,
.yajirushi__margin_box {
  display: flex;
}


/* 吹き出し・全共通 */
.balloon {
  position: relative;
  width: 100%; /* 幅 */
  /*min-height: 60px; 最小の高さ */
  /*margin: 20px;  外側の余白 */
  padding: 36px 24px; /* 内側の余白 */

  font-size: 16px;
  font-weight: bold;
}
.balloon::before {
  content: '';
  position: absolute;
  z-index: 1;
  width: 38px; 
  height: 38px; /* 吹き出しサイズ */
}
.balloon::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 0; left: 0;
  width: 100%; height: 100%;
}
.balloon>* {
  position: relative;
  z-index: 3;
}
.balloon,
.balloon::after {
  border-radius: 8px; /* 角の丸め方 */
}
.balloon,
.balloon::before {
  box-shadow: 0px 3px 6px rgba(0 0 0 / 16%); /* ぼかし距離(第3引数)，拡散距離(第4引数)，色(第5引数) */
}
.balloon,
.balloon::before,
.balloon::after {
  background: #ffffff; /* 背景色 */
}

/* 吹き出し・下辺中央 */
.balloon--bottom_center::before {
  bottom: 2px; 
  left: 47%; /* 位置 */
  transform: translateX(-50%) rotate(98deg) skew(42deg,297deg); /* 傾斜角(skew) */
}
/*吹き出し影ここまで*/

.how_content{
  text-align: left;
  display: inline-block;
}

.how_sup h2,
.how_need h2{
  font-size: 38px;
  font-weight: bold;
  margin:0 0 40px 0;
}

.how_sup p,
.how_need p{
  font-size: 18px;
  font-weight: bold;
  margin:0;
}

.sign_up{
  max-width: 372px;
  width: 100%;
  height: 64px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  background-color: #C21630;
  border-radius:10px;
  line-height: 64px;
  margin: 36px auto 0 auto;

}

.sign_up a{
  color: #fff;
  display: block;
}

.dw_ar{
  margin: 50px auto 30px auto;
}

.pg_img {
  width: 62%;
  margin: 24px auto 0 auto;
  
}

.pg_img img{
  width: 100%;
}



.ht_spo{
  margin-top:80px;
}

.ht_spo .yellow{
  margin-bottom: 16px !important;
}

.kome{
  font-size: 16px;
  font-weight: 100 !important;
  text-align: left;
  padding: 0 0 40px 0;
}

.thin{
  font-size: 16px;
  font-weight: 100 !important;
}

.ouen{
  width:376px;
  margin: 112px auto 90px auto;
}

.ouen img{
  width: 100%;
}

.top_bg_img {
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.top_bg_img img{
  width: 100%;
}


.about_box_wrap {
  margin: 0;
  background-color: #fff;
}

.ab_top .el-icon-question{
  color: #e8b429;
}

.abouto_micoto_title span{
  vertical-align: middle;
}

.ab_top div{
  display:inline-block;
  text-align:left;

  font-size: 24px;
  font-weight: bold;
}

.h_t_n_s h2 {
  text-align: left;
}

.h_t_n_s .can_do{
  margin-bottom: 24px;
}


.so_left{
  text-align: left;
  display: inline-block;

  font-size: 16px;
  font-weight: bold;
}

.use_guide {
  background-color: #6f6f6f;
  border: 0px;
  border-radius: 8px;
  width: 198px;
  height: 48px;

  outline: none;
}

.use_guide a{
  color: #ffffff;
  font-size: 16px;
  font-weight: bold;
  display: block;
  height: 48px;
  line-height: 48px;
}

.u_gu_btn{
  text-align: right;
}

.supporter .can_do {
  margin-bottom: 18px;
}

.att_mark{
  font-size: 12px;
  margin-bottom: 18px;
  text-align: left;
}

.att_mark_center{
  font-size: 12px;
  font-weight: 100;
  margin-top: 18px;
  text-align: left;
  display: inline-block;
}

.guide_supo .red,
.how_sup .red{
  margin-bottom: 6px;
}

.how_chara{
  margin: 188px auto 112px auto;
}


/*****利用ガイド*/
.abouto_micoto_title img{
  height: 40px;
  width: 40px;

}


.guide_contents{
  width: 724px;
  margin: 0 auto;

}

.sono3{
  width: 100%;
  
  border-radius:8px;
  box-shadow: 0px 3px 6px rgba(0 0 0 / 16%);
  padding: 24px;
  margin-bottom: 64px;

  text-align: left;
}

.supo_center .sono3{
  font-size: 16px;
  font-weight: bold;
  margin-top: 24px;
}

.sign_up a{
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

.kika_ku{
  margin-bottom: 24px !important;
}

.nagare{
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.nagare .el-icon-file-new{
  color: #333333;
  padding-right: 12px;
}

.guide_supo  .balloon,
.guide_contents .balloon {
  position: relative;
  width: 100%;
  padding: 24px;
  font-size: 16px;
  font-weight: bold;
}

.guide_title{
  text-align: center;
  margin-bottom: 24px;
}

.maru {
    height: 28px;
    min-width: 28px;
    border-radius: 50%;
    line-height: 28px;
    text-align: center;
    background-color: #6f6f6f;
    font-size: 20px;
    color: #ffffff;
    padding-left: 1px;

    margin-right: 18px;
}


.gu_ti{
  display: flex;
  align-items: center;

  margin-top: 18px;
}

.gu_ti_supo {
  display: flex;
  margin-top: 18px;
}

.gu_ti .el-icon-file-new,
.gu_ti a{
  color: #6f6f6f;
}


.regular_font{
  padding: 8px 0 0 46px;
  font-weight: 100;
  
}

.regular_font img {
  width: 282px;
  margin-top: 8px;
}

.small_regular_font{
  font-size: 14px;
  font-weight: 100;
  color: #6F6F6F;

  padding-left: 46px;
  margin-top: 8px;
}

.sm_regular_font{
  font-size: 14px;
  font-weight: 100;
  color: #6F6F6F;
  margin-top: 8px;
}

.font-red{
  color: #c21630;
}

.gu_text span{
  vertical-align: middle;
}

.mini_icon img{
  width: 140px;
  margin-top: 8px;
}

.koukai_img img{
  width: 377px;
  margin-top: 8px;
}

.small_kome{
  font-size: 12px;
  font-weight: 100;
}

.supo_ma_b{
  margin-bottom: 24px;
}


.supo_center{
  text-align: center;
}

.gu_text_supo{
  padding-top: 4px;
}

.toukou_chui{
  font-weight: 100;
  margin-top: 32px;
}

.guide_title div{
  display: inline-block;
    text-align: left;
}

.guide_supo{
  margin-bottom: 112px;
}

.abouto_micoto_title img {
  vertical-align: middle;
}

.kasu_hou{
  font-size: 16px;
  font-weight: bold;
  margin-top: 24px;
}

.about_right {
  text-align: end;
}

.st_market{
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);

  margin-bottom: 80px;
}

.st_market img{
  width: 100%;
  height: auto;
}


.sono3 {
  width: 100%;
  border-radius: 8px;
  box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
  padding: 36px 24px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  margin: 60px 0 42px 0;
}

/**PC画面のみ**/


/** スマホ画面 **/
@media (max-width: 780px) {

  .sp{
    display: block;
  }

  .pc{
    display: none;
  }

  .about_us {
    margin-top: 56px;
  } 

  .abouto_micoto_title {
    font-size: 24px;
    font-weight: bold;
    margin: 0px 0 24px 0;
    padding-top: 26px;
}

  .abouto_micoto_title span{
    font-size: 24px;
  }

  .el-icon-question {
    font-size: 24px;
  }

  .ab_top p {
    font-size: 18px;
    font-weight: bold;
    margin: 0 0 40px 0;
}

  .ab_top img {
    width: 100%;
    
  }

  .ab_top {
    text-align: center;
    margin-bottom: 24px;
  }

  .need {
    width: 100%;
    padding-right: 0;
    margin-bottom: 24px;
}

  .can_do h2 {
    font-size: 18px !important;
    font-weight: bold;
    padding-left: 12px;
    border-left: 3px solid #C21630;
    margin: 0 0 24px 0;
}

  .can_do h3 {
    font-size: 18px;
    font-weight: bold;
    padding: 0 0 8px 0;
    margin: 0;
  }

  .red {
    width: 100%;
    border-bottom: 2px solid #C21630;
    margin-bottom: 14px;
  }

  .can_do p {
    font-size: 14px;
}


  .supporter {
    width: 100%;
    padding-left: 0px;
  }

  .soukanzu {
    text-align: center;
    margin: 40px 0 64px 0;
}


  .ab02 {
    text-align: center;
    margin: 40px 0 0 0;
  }

  .can_do {
    margin-bottom: 40px;
  }

  .how_to h1 span{
    font-size: 20px !important;
    font-weight: bold;
    
}

.how_to h1 {
  margin: 0 0 24px 0;
}

  .how_to h1 img {
    width: 24px;
    vertical-align: middle;
    margin-right: 12px;
  }

  .how_to {
    text-align: center;
    width: 100%;
    
    padding-top: 16px;
}

  .how_to h3 {
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 8px;
    text-align: left;
  }

  .ht_need .red {
    margin-bottom: 24px;
  }

  .sono1 {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.3);
    padding: 8px;

    margin-bottom: 24px;
}

  

  .sono1 p{
    text-align: left;
  }

  .how_sup h2, .how_need h2 {
    font-size: 26px;
    font-weight: bold;
    margin: 0 0 24px 0;
}

  .how_sup p, .how_need p {
    font-size: 16px;
    font-weight: bold;
    margin: 0;
  }


  .sign_up {
    width: 100%;
    height: 46px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #C21630;
    border-radius: 10px;
    line-height: 46px;
    margin: 16px auto 0 auto;
  } 

  .sign_up a{
    font-size: 14px
  }


  .dw_ar {
    margin: 26px auto 33px auto;
  }

  .dw_ar img {
    width: 40px;
}


  .pg_img {
    width: 100%;
    margin: 16px auto 0 auto;
  }



  .ht_spo {
    margin-top: 32px;
  }

  .kome{
    display:none;
  }

  .ht_spo .yellow {
    margin-bottom: 24px !important;
}
  .ouen{
    width: 100%;
    margin: 64px auto 80px auto;
  }

  .ouen img{
    width: 100%;
  }

  .ab_top div {
    display: inline-block;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

  .h_t_n_s {
    display: block;
  }

  img.how_chara {
    width: 100%;
    margin: 84px 0;
  }

  .balloon--bottom_center::before {
    bottom: -2px;
    left: 47%;
    transform: translateX(-50%) rotate(97deg) skew(42deg,297deg);
  }

  .balloon::before {
    content: '';
    position: absolute;
    z-index: 1;
    width: 20px;
    height: 20px;
  } 
  
  .guide_supo .balloon,
  .guide_contents .balloon,
  .balloon {
    padding: 18px 8px; /* 内側の余白 */
  
  }

  .sono2 {
    padding: 18px 8px;  
    margin-bottom: 24px;
  }

  .u_gu_btn {
    text-align: center;
    margin-bottom: 36px;
  }
  .use_guide {
    height: 36px;
  }

  .use_guide a {
    font-size: 14px;
    height: 36px;
    line-height: 36px;
  }


  .guide_contents {
    width: 100%;
    margin: 0 auto;
  }

  .sp_guide img{
    width: 17px;
    height: 24px;;
  }

  .sono3 {
    padding: 8px;
    margin-bottom: 24px;
    text-align: left;
}

  .kika_ku h2{
    margin: 0 0 12px 0;
  }

  .kika_ku {
    margin-bottom: 12px !important;
  }

  .nagare {
    font-size: 16px;
  }
  .guide_title {
    margin-bottom: 12px;
  }

  .sousa_tejun{
    font-size: 12px;
  }

  .gu_ti {
    margin-top: 12px;
    align-items:flex-start;
  }

  .maru {
    height: 18px;
    min-width: 18px;
    border-radius: 50%;
    line-height: 18px;
    text-align: center;
    background-color: #6f6f6f;
    font-size: 14px;
    color: #ffffff;
    padding-left: 1px;
    margin-right: 8px;
}

  .gu_text{
    font-size:14px;
    margin-top: -1px;
  }

  .regular_font {
    padding: 8px 0 0 26px;
    font-weight: 100;
    font-size: 12px;
  }


  .regular_font img {
    width: 100%;
    margin-top: 8px;
  }

  .small_regular_font {
    font-size: 12px;
    font-weight: 100;
    color: #6F6F6F;
    padding-left: 26px;
    margin-top: 4px;
  }

  .shinsei_img{
    width: 70%;
  }

  .sm_regular_font {
    font-size: 12px;
    font-weight: 100;
}
  .kasu_hou{
    padding: 18px 8px;
    margin-top: 24px;
    font-weight: bold;
  }

  .mini_icon img{
    width: 50%;
  }

  .koukai_img img{
    width: 60%;
  }

  .gu_text_supo {
    padding-top: 0px;
    margin-top: -1px;
}

  .toukou_chui {
    font-weight: 100;
    margin-top: 12px;
    font-size: 12px;
  }

  .sp_su_only{
    padding: 8px 0 0 0px;
  }


  .st_market{
  
    margin-bottom: 42px;
  }

  .soukanzu img {
    width: 100%;
  }

  .yajirushi__margin_box{
    margin-top: 24px;
  }

  .sono2 {
    margin: 24px 0 42px 0;
}
  

}

