@charset "UTF-8";


/*******************************
 丸堀製茶の４つの強み
 *******************************/

.strengths.-row {
   padding-top: 50px;

}

.strengths__head {
   text-align: center;
   font-size: 2rem;
}

.strengths.-row .strengths__card-list {
   padding: 50px 0;
   border-bottom: 1px solid #b5b5b5;
}


.strengths__card-list {
   width: 90%;
   margin: 0 auto;
   max-width: 1110px;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}

.strengths__card {
   margin-bottom: 20px;
   width: 48%;
   overflow: hidden;
   display: block;
}



.strengths__card-image {
   margin-bottom: 10px;
   border-radius: 10px;
   overflow: hidden;

}

.strengths__card-image img {}

.strengths__card-image img {
   width: 100%;
   transition: transform 0.4s ease;
}

.strengths__card:hover .strengths__card-image img {
   transform: scale(1.1);
}


.strengths__card-body {}

.strengths__card-title {
   display: flex;
   align-items: center;
   margin-bottom: 10px;

}

.strengths__card-title-text {
   display: block;
   margin-right: 5px;
   line-height: 1.3;

}

.strengths__card-title::after {
   display: block;
   width: 20px;
   height: 20px;
   background: url(../images/top/arrow@2x.png) no-repeat;
   background-size: 20px 20px;
   content: "";
   transition: transform .2s ease;
   transform-origin: center;
}

.strengths__card-subtitle {
   font-size: 1rem;
   line-height: 1.3;
}

.strengths__card:hover .strengths__card-title::after {
   transform: scale(1.3);
}

/* アニメ無効設定の環境配慮 */
@media (prefers-reduced-motion: reduce) {
   .strengths__card-title::after {
      transition: none;
   }
}

/* 600px以上：タブレット
------------------------------ */
@media screen and (min-width: 600px) {

   .strengths.-row {
      padding-top: 70px;

   }

   .strengths__head {
      font-size: 2.5rem;
      letter-spacing: .1em;
   }

   .strengths.-row .strengths__card-list {
      padding-bottom: 70px;
      border-bottom: 1px solid #b5b5b5;
   }



   .strengths__card {
      margin-bottom: 0;
      width: 24%;

   }
}

/* 960px以上：小型PC
------------------------------ */
@media screen and (min-width: 960px) {


   .strengths__card-image {
      margin-bottom: 20px;

   }

   .strengths__card-title {

      font-size: 1.9rem;

   }


}