@import url('sub.css'); 



/**** S:: �����Ļ� ****/
.benefit__list { width: 100%; max-width: 1590px; margin: 0 auto; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.benefit__item {min-height: 170px; padding: var(--space-2xl) 60px var(--space-2xl) 75px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 35px;}
.benefit__item img { width: 80px; height: 80px; flex-shrink: 0; object-fit: contain; }
.benefit__item span { display: block; color: var(--black); font-weight: 400;}


.btn-more{width: 250px;}
.btn-more__circle{left: 192px;}
	
.btn-more:hover, .btn-more:focus-visible {padding-left: 50px;}
.btn-more:hover .btn-more__text, .btn-more:focus-visible .btn-more__text {color: var(--main);}
.btn-more:hover .btn-more__circle, .btn-more:focus-visible .btn-more__circle {left: 182px; transform: translateY(-50%) scale(15);}
.btn-more:hover::after, .btn-more:focus-visible::after {right: 40px;}
	
	
/**** E:: �����Ļ� ****/






/*******************************************************************************
    @media 1740px
*******************************************************************************/
@media all and (max-width:1740px){

/**** S:: �����Ļ� ****/
  .benefit__item { padding: var(--space-xl) var(--space-lg); gap: var(--space-md); }
/**** E:: �����Ļ� ****/

}
/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){



}
/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){

/**** S:: �����Ļ� ****/
  .benefit__item {min-height: 160px;}
  .benefit__item img { width: 70px; height: 70px; }
/**** E:: �����Ļ� ****/


}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

/**** S:: �����Ļ� ****/
  .benefit__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefit__item { min-height: 148px; padding: var(--space-md); gap: var(--space-sm); }
  .benefit__item img { width: 64px; height: 64px; }
/**** E:: �����Ļ� ****/


}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/**** S:: �����Ļ� ****/
  .benefit__list { grid-template-columns: 1fr; }
  .benefit__item { min-height: 80px; padding: var(--space-sm); gap: var(--space-xs); }
  .benefit__item img { width: 50px; height: 50px; }
  
  
.btn-more{width: 180px;}
.btn-more__circle{left: 136px;}
	
.btn-more:hover, .btn-more:focus-visible {padding-left: 30px;}
.btn-more:hover .btn-more__circle, .btn-more:focus-visible .btn-more__circle {left: 126px;}
.btn-more:hover::after, .btn-more:focus-visible::after {right: 30px;}
	
	
/**** E:: �����Ļ� ****/

}