@charset "utf-8";
/* 共通
------------------------------------------------------------*/
.top_h2 {
  font-size: 30px;
	font-family: 'Noto Serif JP', serif;
}
.top_h2_2 {
  font-size: 48px;
	font-family: 'Noto Serif JP', serif;
}

.top_h2sub {
	font-size: 16px;
	font-family: 'Lato', sans-serif;
	font-weight: bold;
	color: #002364;
}
@media (max-width: 768px)  {
.top_h2 {
  font-size: 24px;
	font-family: 'Noto Serif JP', serif;
}
.top_h2_2 {
  font-size: 24px;
	font-family: 'Noto Serif JP', serif;
}

.top_h2sub {
	font-size: 14px;	
}
}

/* ピックアップ
------------------------------------------------------------*/
.pickup_area {
  padding-top: 5%;
  padding-bottom: 5%;
}
.pickup_area::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #f2f5f5;
  transform: skewY(-8deg) translateY(110px);
  z-index: -1;
}
/* ピックアップスライド
------------------------------------------------------------*/
.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10rem;
}
.l-section .l-inner {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media (max-width: 786px)  {
.l-section .l-inner {
  padding-top: 4rem;
  padding-bottom: 1rem;
}
}
[class*=swiper]:focus {
  outline: none;
}
.card03 {
  overflow: hidden;
}
.card03 .swiper {
  overflow: visible;
}
.card03 .swiper-button-prev {
  position: absolute;
  top: -50px;
  right: 100px;
}
.card03 .swiper-button-next {
  position: absolute;
  top: -50px;
  right: 0px;
}
.card03 .swiper-button-prev, .card03 .swiper-button-next {
  display: flex;
}
.card03 .swiper-button-prev::after {
  border-color: #000;
  content: '';
  width: 70px;
  height: 15px;
  border-bottom: solid 1px;
  border-left: solid 1px;
  transform: skew(-45deg);
}
.card03 .swiper-button-next::after {
  border-color: #000;
  content: '';
  width: 70px;
  height: 15px;
  border-bottom: solid 1px;
  border-right: solid 1px;
  transform: skew(45deg);
}
@media only screen and (max-width: 786px) {
.card03 .swiper-button-prev {
  position: absolute;
  top: -30px;
  right: 0px;
}
.card03 .swiper-button-next {
  position: absolute;
  top: -30px;
  right: -40px;
}
	.card03 .swiper-button-prev::after {
  border-color: #000;
  content: '';
  width: 30px;
  height: 7px;
  border-bottom: solid 1px;
  border-left: solid 1px;
  transform: skew(-45deg);
}
.card03 .swiper-button-next::after {
  border-color: #000;
  content: '';
  width: 30px;
  height: 7px;
  border-bottom: solid 1px;
  border-right: solid 1px;
  transform: skew(45deg);
}
}
.card03 .slide {
  overflow: hidden;
  -webkit-transition: var(--transition), opacity 1s;
  transition: var(--transition), opacity 1s;
}
.card03 .slide_name {
  line-height: 1.6;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 3.2em;
  margin-top: 0.6rem;
  color: #14aa5a;
}
@media only screen and (max-width: 786px) {
 .card03 .slide_name {
	font-size: 15px;
	text-align: center;
}
}
@media only screen and (max-width: 1024px) {
  .l-inner {
    padding: 0 4rem;
  }
  .card03 .swiper {
    padding: 0 0.2rem;
  }
}
/* サービス
------------------------------------------------------------*/
.service_area {
    padding-top: 10%;
    padding-bottom: 5%;
    background-image: url(../img/home/servise/bg-top-servise.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
    background-color: #FFFFFF;
}
@media only screen and (max-width: 786px) {
.service_area {
	padding-top: 10%;
	padding-bottom: 5%;
	background-image: url(../img/home/servise/bg-top-servise_s.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;  
}
}
.service_link {
  margin-top: 5%;
}
.service_img {
  position: absolute;
}
@media (max-width: 992px)  {
.service_img {
    position: static;
}
}
.brand_area {
    margin-top: 12%;
    padding-top: 5%;
    background-size: 95% auto;
    background-repeat: no-repeat;
    padding-bottom: 5%;	 
	background-image: url(../img/home/servise/brand_bg.png);
}
@media (max-width: 992px)  {
.brand_area {
    margin-top: 5%;
    padding-top: 5%;
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-bottom: 5%;
    background-image: url(../img/home/servise/brand_bg_s.png);
    background-color: #cbe5cd;
}
}
.service_ttl {
	font-size: 30px;
	display: flex;
	align-items: center;
	color: rgba(255,255,255,1.00);
	margin-bottom: 3%;
	font-family: 'Noto Serif JP', serif;
}
@media (max-width: 786px)  {
.service_ttl {
	font-size: 20px;	
	margin-bottom: 10%;	
}
}
.service_ttl:before {
  position: relative;
  top: 0px;
  margin: 0 15px 0 0;
  content: url("../img/home/servise/house_ico.png");
}
.service_ttl:after {
  margin-left: 5px;
  border-top: 1px solid #fff;
  content: "";
  flex-grow: .1;
}
.service_box {
    background-color: rgba(255, 255, 255, 1.00);
    padding-bottom: 20px;
}
.brand_type {
	font-size: 13px;
	text-align: center;
	margin-top: 10px;
	font-family: 'Noto Serif JP', serif;
}
.brand_name_g {
	font-size: 30px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	margin-bottom: 10px;
	color: #199867;
	font-weight: bold;
}
.brand_name_y {
	font-size: 30px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	margin-bottom: 10px;
	color: #9b8509;
	font-weight: bold;
}
.brand_name_r {
	font-size: 30px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	margin-bottom: 10px;
	color: #b41c00;
	font-weight: bold;
}
.brand_name_b {
	font-size: 30px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	margin-bottom: 10px;
	color: #197698;
	font-weight: bold;
}
.brand_name_p {
	font-size: 30px;
	text-align: center;
	font-family: 'Lato', sans-serif;
	margin-bottom: 10px;
	color: #9a1c4c;
	font-weight: bold;
}
.brand_name_s {
    font-size: 30px;
    text-align: center;
    font-family: 'Lato', sans-serif;
    margin-bottom: 10px;
    color: #D16E00;
    font-weight: bold;
}


.brand_tx {
  font-size: 14px;
  padding-left: 10px;
  padding-right: 10px;
}
@media (max-width: 786px)  {

.brand_name_g {
	font-size: 25px;
}
.brand_name_y {
	font-size: 25px;
}
.brand_name_r {
	font-size: 25px;
}
.brand_name_b {
	font-size: 25px;
}
.brand_name_p {
	font-size: 25px;
}
.brand_tx {
  font-size: 13px;
  padding-left: 15px;
  padding-right: 15px;
}
}
/* 5分割
------------------------------------------------------------*/
.col-15, .col-sm-15, .col-md-15, .col-lg-15 {
  position: relative;
  min-height: 1px;
  padding-right: 5px;
  padding-left: 5px;
  width: 100%;
}
/*@media (min-width: 768px) {
  .col-sm-15 {
    width: 20%;
    flex: 0 0 20%;
  }
}
@media (min-width: 992px) {
  .col-md-15 {
    width: 20%;
    flex: 0 0 20%;
  }
}
@media (min-width: 1200px) {
  .col-lg-15 {
    width: 50%;
    flex: 0 0 50%;
  }
}*/
.col-15 {
  width: 20%;
  flex: 0 0 20%;
}
@media (max-width: 1200px) {
  .col-15 {
  width: 33.3%;
  flex: 0 0 33.3%;
}
}
@media (max-width: 992px) {
  .col-15 {
  width: 50%;
  flex: 0 0 50%;
}
}
@media (max-width: 768px) {
  .col-15 {
    width: 80%;
    flex: 0 0 80%;
    margin-bottom: 5%;
}
}

/* 会社概要
------------------------------------------------------------*/
.business_area {
	padding-top: 5%;
	padding-bottom: 5%;	
	background-color: #FFFFFF;
}
.business_contents {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;
	background-image: url(../img/home/business/business_bg.jpg);
	margin-top: 2%;
	padding-top: 8%;
}
.business_box {	
	padding-bottom: 5%;
}
.business_img {
	margin-left: 5%;
	
}
.business_link {
	margin-top: -15%;
	
}
@media (max-width: 786px)  {
.business_contents {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;
	background-image: url(../img/home/business/business_bg_s.jpg);
	margin-top: 2%;
	padding-top: 8%;
}
.business_box {
    padding-bottom: 5%;
    margin-top: 5%;
    margin-right: 5%;
    margin-bottom: 5%;
    margin-left: 5%;
}

.business_img {
	margin-left: 2%;
	

}
.business_link {
	margin-top: -15%;
	
}
}
@media (max-width: 786px)  {
.staff_photo {    
    margin-bottom: 5%;
}
}
/* ニュース
------------------------------------------------------------*/
.news_area {
    padding-top: 5%;
    padding-bottom: 5%;
    margin-bottom: 15%;
    position: relative;
}
.news_area::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #f2f5f5;
  transform: skewY(-7deg) translateY(240px);
  z-index: -1;
}
.news_box {	
	padding-top: 5%;
}
.news_box2 {
	border-bottom: 1px solid #a6b5bd;
	padding-bottom: 15px;
	padding-top: 15px;
}
.news_day {
	font-size: 17px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
	font-weight: normal;
	margin-right: 15px;
}
.news_type {
	font-size: 17px;
	padding-left: 10px;
	padding-right: 10px;
	color: #14aa5a;
	border: 1px solid #14aa5a;
	margin-right: 15px;
	display: inline-block;
}
.news_type2 {
	font-size: 17px;
	padding-left: 10px;
	padding-right: 10px;
	color: #e6a76c;
	border: 1px solid #e6a76c;
	margin-right: 15px;
	display: inline-block;
}
.news_tx {
	font-size: 17px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
}
.news_link {
  margin-top: 3%;
}
@media (max-width: 786px)  {
.news_area {
	padding-top: 5%;
	padding-bottom: 5%;
	position: relative;
}
.news_area::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #f2f5f5;
  transform: skewY(-15deg) translateY(100px);
  z-index: -1;
}
.news_box {	
	padding-top: 5%;
}

.news_day {
	font-size: 16px;	
}
.news_type {
	font-size: 15px;
	
}
.news_type2 {
	font-size: 15px;
	
}
.news_tx {
	font-size: 16px;
	
}
.news_link {
  margin-top: 3%;
}
}

