@charset "UTF-8";
          
.ethical_rank li.rank_li{
    display: flex;

}
.ethical_rank li.rank01,
.ethical_rank li.rank02_2,
.ethical_rank li.rank03,
.ethical_rank li.rank04_2{
    margin-bottom:70px;
}

.ethical_rank li.rank02_2 h3,
.ethical_rank li.rank04_2 h3{
    padding-top:30px;

}

.ethical_rank .rank_s{
   background-color:#F4F1DC;
   width:105px;
   text-align: center;

} 
.ethical_rank .rank_s .count{
   color:#C66834;
   font-weight: bold;
   font-size:2.3rem;
   margin-top:10px;
   width:105px;
}
.ethical_rank .rank_mark_cont h3{
    font-weight: bold;
    font-size:2.5rem;
    border-bottom:solid 3px #F4F1DC;
    width:60%;
    margin-right:40%;
    margin-bottom:10px;
    padding-left:3%;
    padding-top:15px;
    padding-bottom:5px;
}

.ethical_rank ul.sdgs_mark{

    padding-bottom:7px;
    display: flex;
    justify-content :flex-end;

}
.ethical_rank ul.sdgs_mark li img{
    margin-right:7px;

}
.ethical_rank .mark_goods{
    display: flex;
    margin-left:25px;
}
.ethical_rank .sdgsmark_goods{
    max-width:590px;
}
.ethical_rank .mark_goods dl{
    display: flex;
    border: 2px solid #88C039;
    border-radius:15px;
    padding: 5px 20px 0px;
    margin-left:10px;
    max-width:590px;

}
.ethical_rank .mark_goods dt{  
    border-radius:15px;

}
 .ethical_rank .mark_goods dd{              
    border-radius:15px;
}
.ethical_rank .rank_mark_cont p.explane{
    background-color:#DDF0F2;
    padding:20px 3% 20px 3%;
    font-size:1.5rem;
     margin-left:25px;
    margin-bottom:0;
}
.ethical_rank_astarisk{
    text-align:right;
}
.ethical_mark_other ul{
    display: flex;
    flex-wrap: wrap;
}
 .ethical_mark_other li{

     width:30%;
     min-width:250px;
     margin:20px 2% 10px 1%;
     text-align: center;
}
 .ethical_mark_other h3{
    font-weight: bold;
    font-size:20px;
    border-bottom:solid 3px #F4F1DC;
    margin-bottom:10px;
    padding-top:15px;
    padding-bottom:5px;
    text-align: center;
}
.ethical_mark_other img{
    width:80%;
    margin:10px 5% 10px 5%;
}
 .ethical_mark_other li>p{
     background-color:#DDF0F2;
    padding:20px 5% 20px 5%;
    font-size:1.5rem;
     text-align: left;

}
.ethical_mark_other p.end_catch{
    font-size:2.0rem;

}
p.attention{
    line-height: 1.8rem;
    font-size:1.4rem;
}
.shopping_choice h3{
    font-weight: bold;
    font-size:20px;
    border-bottom:solid 3px #F4F1DC;
    width:30%;
}
.shopping_choice p.sdg_mark_explan{
    background-color: #F7F7F7;
    padding:20px 5% 20px 5%;
    font-size:1.5rem;
}
.shopping_choice .labelless_pet,
.shopping_choice .orangutan{
    display: flex;
}
.shopping_choice .explane_s{
         width:50%;
 }
.shopping_choice .coop_attempt{
    background-color: #AED79B;
    border-radius: 15px;
    display: flex;
    padding:20px 5%;
}

.shopping_choice .coop_attempt .ethical_catch{
     font-size:2.0rem;
    display:flex;
}
.shopping_choice .coop_attempt .ethical_mark_link img{
    min-width:128px;
    margin-right:20px;
}
.shopping_choice .coop_attempt .ethical_mark_link{
     display: flex;
    margin-left:20px;
}
.shopping_choice .coop_attempt .ethical_link{
    font-size:1.6rem;
    margin-top:30px;
}
.participant_voice ul{
    display: flex;
    flex-direction:column;
    flex-wrap: wrap;
    height:2290px;
    margin-bottom:30px;
}
.participant_voice li{
    width:32%;
    margin-top:5px;
    margin-bottom:0px;
    margin-right:1%;

}
.participant_voice ul li p{
    background-color: #E6EDDD;
    border-radius: 15px;
    color:#604229;
    padding:15px 8% 15px 8%;
    margin-bottom:5px;
    font-size: 1.4rem;
    line-height:2.0rem;
    letter-spacing:2px;
}
.participant_voice img{
    margin-top:10px;
    margin-bottom:10px;
}
.participant_voice .end_catch{
    display: flex;

}
.participant_voice .end_catch p{
    padding-top:40px;
    padding-left:5%;
    padding-right:5%;
    font-size: 2.0rem;
}

.brown_f{
   color:#604229;
   font-weight: bold;

}
.orange_f{
    font-weight: bold;
    color:#F15A24;
}
.green_f{
       color:#08AF4B;
    font-weight: bold;
}






@media (max-width: 870px){

   .ethical_rank .rank_mark_cont h3{    
        width:100%;
   }
   .ethical_mark_other li{

     width:45%;

    }
   .shopping_choice h3 {
       width:90%;
   }
   
    .shopping_choice .explane_s{
         width:70%;
    }
   .participant_voice ul{

    height:2400px;

    }
}
@media (max-width: 768px){

     .ethical_rank .mark_goods {
      flex-direction:column; 
      text-align: center;
      padding-bottom:20px;
   }
   .ethical_rank .mark_s{
       width:100%;
   }

    .ethical_rank li.rank05 .mark_s{
        padding-bottom:20px;

     }
   .ethical_rank .sdgsmark_goods {
       width:100%;  
       max-width: 100%;

   }
   .shopping_choice .other_mark_img{
       width:50%;  
   }
   /*.shopping_choice .ethical_catch img::after{

        content: "\A" ;
        white-space: pre ;
   }*/
 .shopping_choice .earth_img img{
     position:absolute;
 }
     .shopping_choice .coop_attempt .ethical_catch{
         margin-left:140px;
         flex-direction:column;
         margin-top:40px;

     }
     .shopping_choice .coop_attempt .ethical_catch p{

         padding-left:20px;
     }
      .shopping_choice .coop_attempt .ethical_mark_link{
        /* display: block;*/

         width:100%;
          margin-top:30px;
          margin-left:0px;
     }



      .shopping_choice .coop_attempt .ethical_mark_link img{
         max-width: 128px;
          margin:20px;
     }
     .shopping_choice .coop_attempt .ethical_link{
       margin-top:25px;
         margin-left:20px;
     }

    .participant_voice ul{           
       height:3360px;


    }
    .participant_voice li{
        width:48%;                   
   }

}
 @media (max-width:648px){
     .participant_voice ul{           
          height:3280px;

    }
     .participant_voice ul li{
         text-align: center;
     }
     .participant_voice ul p{
         text-align: left;
     }
      .participant_voice ul li img{
          width:48%;  
     }

}
@media (max-width: 543px){
    .ethical_rank .rank_s{
        width:60px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .ethical_rank .rank_s .count{
         width:50px;
        font-size:1.6rem;
    }
    .ethical_rank .rank_mark_cont h3{
        font-size: 2.0rem;
    }
    .ethical_rank .mark_goods{
        margin-left:1%;
    }
    .ethical_rank .mark_goods .mark_s{
        margin-bottom:20px;
    }
    .ethical_rank .rank_mark_cont p.explane{
        margin-left:1%;
    }
    .ethical_mark_other li{

       width:100%;  
   }
    .ethical_mark_other img{
        max-width: 234px;
    }
    .shopping_choice .earth_img img {
        position: relative;
    }
    .shopping_choice .other_mark_img{
        width:100%;
        text-align: center;
        margin-bottom:30px;
        margin-left:20px;
    }
    .shopping_choice .explane_s{
        width: 100%;
    }
    .shopping_choice .labelless_pet, .shopping_choice .orangutan{
        flex-direction:column;
    }
    .shopping_choice .coop_attempt{
        flex-direction:column;
    }
    .shopping_choice .earth_img{
        text-align: center;
    }
    .shopping_choice .coop_attempt .ethical_catch{
        margin-left: 0px;
        margin-top: 10px;
    }
    .shopping_choice .coop_attempt .ehical_img_s{
        margin-left:0px;
        text-align: center;
    }
    .shopping_choice .coop_attempt .ethical_catch p{
        text-align: center;

    }

    .shopping_choice .coop_attempt .ethical_mark_link{
        flex-direction:column;
        margin-top:0;
    }

    .shopping_choice .coop_attempt .coop_ethical_mark{
        text-align: center;
    }
    .shopping_choice .coop_attempt .ethical_link{
        text-align: center;
        margin-top:0;
    }
     .participant_voice ul{           
          height:auto;


    }
    .participant_voice li{
        width:100%;  
        text-align: center;
   }
    .participant_voice li p{

        text-align: left;
   }
    .participant_voice .end_catch{
        flex-direction:column;
    }
    .participant_voice .end_catch p{
        font-size: 1.6rem;
    }
    .participant_voice .end_catch .end_image_s{
        text-align: center;
    }
}