@charset "utf-8";

/**
 *
 *  ページ用CSS
 *　overview
 * 
 */

/*--------------------------------------------------------------------------
   Overwright
---------------------------------------------------------------------------*/
.cont-nav{
  padding-bottom: 150px;
}



/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/

/* overview
-----------------------------------------------------------------*/
.overview{
  padding: 180px 0 140px;  
}
.overview h2{
  margin-bottom: 50px;  
}
.overview-info-list{
	margin-bottom: 120px;
  border-top: 1px solid var(--gray);  
}
.overview-info-list > div{
  display: flex;
  padding: 50px 30px;
  border-bottom: 1px solid var(--gray);   
}
.overview-info-list dt{
  flex-shrink: 0;
  max-width: 240px;
  width: 20%;
  padding-right: 15px;
	font-weight: bold; 
}
.overview .pamphlet{
	padding: 50px 7%;
}
.overview .pamphlet .layout-box{
	flex-direction: row-reverse;
	align-items: center;
}
.overview .pamphlet .pic{
	width: 32%
}
.overview .pamphlet .txt-area{
	width: 63%;
}
.overview .pamphlet h3{
	margin-bottom: 20px;
	font-size: 1.8rem;
}
.overview .pamphlet .txt{
	margin-bottom: 30px;
}
.overview .pamphlet .txt a{
	padding-bottom: 2px;
	border-bottom: 1px solid var(--dark);
	transition: .3s;
}
.overview .pamphlet .txt a:hover{
	border-bottom-color: transparent;
}
.overview .pamphlet .btn-area{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;  
}
.overview .company-pamphlet{
  width: 100%;
  margin-bottom: 25px;
}
.overview .company-pamphlet .btn-txt{
  width: fit-content;
  margin-left:auto;
}
.overview .pamphlet .btn-txt + .btn-txt{
  margin-left: 30px;  
}















/*--------------------------------------------------------------------------
   mobile
---------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {

.cont-nav{
  padding-bottom: 60px;
}


/* overview
-----------------------------------------------------------------*/
	.overview{
		padding: 60px 0;  
	}
	.overview h2{
		margin-bottom: 20px;  
	}
	.overview-info-list{
		margin-bottom: 50px;
	}
	.overview-info-list > div{
		padding: 20px 0;
		border-bottom: 1px solid var(--gray);   
	}
	.overview-info-list dt{
		max-width: none;
		width: 28%;
	}
	.overview .pamphlet{
		padding: 25px 20px 30px;
	}
	.overview .pamphlet .layout-box{
		display: block;
	}
	.overview .pamphlet .pic{
		max-width: 320px;
		width: 85%;
		margin: 0 auto;
	}
	.overview .pamphlet .txt-area{
		width: 100%;
		margin-bottom: 35px;
	}
	.overview .pamphlet h3{
		margin-bottom: 10px;
		font-size: 1.6rem;
	}
	.overview .pamphlet .txt{
		margin-bottom: 20px;
	}
	.overview .pamphlet .txt a:hover{
		border-bottom-color: var(--dark);
	}
.overview .pamphlet .btn-area{
  display: block;
}
  .overview .company-pamphlet{
    margin-bottom: 15px;
  }
  .overview .btn-txt{
    width: fit-content;
    margin-left:auto;
  }
  .overview .pamphlet .btn-txt + .btn-txt{
    margin: 22px 0 0 auto;  
  }



}