@charset "utf-8";


/* -------------------------------------------------- */
/* トップページ */
/* -------------------------------------------------- */

/*===== 共通 =====*/
 .design-container {max-width: 1170px;margin: 0 auto;padding: 100px 15px 0 15px;}

 .design-top-h2 {font-weight: bold;font-size: 4rem;color: #333;margin-bottom: 40px;line-height: 1.6;font-family: "Quicksand",'Noto Sans JP',sans-serif;}
 .design-top-h2 span {font-size: 2.4rem;color: #005740;font-family: "Quicksand", sans-serif;display: block;letter-spacing: 0.1em;}

 [lang="en"] .design-top-h2{color: #005740; letter-spacing: 2.4px;}

 .design-btn01 {display: block; background: linear-gradient(90deg, #005740 0%, #07AD41 100%);border-radius: 9999px;color: #fff;font-weight: bold;text-align: center;padding: .8em;position: relative;border: 1px solid transparent;}
 .design-btn01:after {content: '';width: 20px;height: 20px;display: block;background:url(../..//resources/sw_img_kpp2/html//design-arrow-right.svg) center / cover no-repeat;position: absolute;right: 20px;top: 0;bottom: 0;margin: auto;}
 .design-btn01:hover {background: #fff;color: #005740;border-color: #005740;}
 .design-btn01:hover:after {background-image: url(../..//resources/sw_img_kpp2/html/design-arrow-right2.svg);}

 .design-btn02 {display: block; background: #fff;border-radius: 9999px;color: #005740;border: 1px solid #005740; font-weight: bold;text-align: center;padding: .8em;position: relative;font-size: 1.6rem;}
 .design-btn02:after {content: '';width: 20px;height: 20px;display: block;background:url(../..//resources/sw_img_kpp2/html/design-arrow-right2.svg) center / cover no-repeat;position: absolute;right: 20px;top: 0;bottom: 0;margin: auto;}
 .design-btn02[target="_blank"]:after {content: '';width: 14px;height: 14px;display: block;background:url(../..//resources/sw_img_kpp2/html/design-blank.svg) center / cover no-repeat;position: absolute;right: 20px;top: 0;bottom: 0;margin: auto;}
 .design-btn02:hover {opacity: .7;}


/*===== 取扱商品・ソリューション =====*/
#design-prosol .design-product {background: url(../../resources/sw_img_kpp2/html/product_bg2.jpg) center top / 100% 100% no-repeat;padding-bottom: 230px;}
#design-prosol h3{font-weight: bold;font-size: 3.2rem;color: #005740;}
#design-prosol h3 span{font-size: 1.6rem;letter-spacing: 0.1em;color: #31A24C;display: block;font-family: "Quicksand", sans-serif;}

#design-prosol .design-product-box{position: relative;display: flex;margin-bottom: 60px;}
#design-prosol .design-product-box:nth-child(odd){justify-content: flex-end;}
#design-prosol .design-product-box:nth-child(even){justify-content: flex-start;}
#design-prosol .design-product-box-img{position: absolute;top: 0;height: 100%; width: 100%;max-width: 720px;overflow: hidden;}
#design-prosol .design-product-box:nth-child(odd) .design-product-box-img {left: 0;}
#design-prosol .design-product-box:nth-child(even) .design-product-box-img {right: 0;}
#design-prosol .design-product-box-img img {height: 100%;width: auto;max-width: none;}
#design-prosol .design-product-box-text{ background: #fff;margin: 22px 0; padding: 60px 80px;width: 100%;max-width: 560px;position: relative;}
#design-prosol .design-product-box-text p{margin:10px 0 25px; }

#design-prosol .design-solution {margin-top: -280px;}
#design-prosol .design-solution .design-container {padding-top: 40px;}
#design-prosol .design-solution h3 {text-align: center;margin-bottom: 40px;}
#design-prosol .design-solution ul {display: flex;gap:30px;}
#design-prosol .design-solution ul h4 {font-weight: bold;font-size: 2.4rem;color: #005740;line-height: 1.4;margin: 24px 0 20px;position: relative;padding-right: 30px;}
#design-prosol .design-solution ul h4:after {content: '';width: 24px;height: 24px;display: block;background: url(../..//resources/sw_img_kpp2/html/design-arrow-circle.svg) center / cover no-repeat;position: absolute;right: 0;top: 0;bottom: 0;margin: auto;}
#design-prosol .design-solution ul p {line-height: 1.4;color: #333333;}
#design-prosol .design-solution ul a:hover h4,
#design-prosol .design-solution ul a:hover p {opacity: .7;}


@media screen and (max-width: 767px) {

	/*===== 共通 =====*/
	 .design-container {padding: 50px 20px;}
	 .design-top-h2 {font-size: 2.6rem;margin-bottom: 20px;}
	 .design-top-h2 span {font-size: 1.6rem;}
	 .design-btn02 {font-size: 1.4rem;}
	
	/*===== 取扱商品・ソリューション =====*/
	#design-prosol h3{font-size: 2.2rem;}
	#design-prosol h3 span {font-size: 1.2rem;}
	#design-prosol .design-product-box {display: block;margin-bottom: 30px;}
	#design-prosol .design-product-box-img {position: relative;max-width: none;}
	#design-prosol .design-product-box-img img {height: auto;width: 100%;}
	#design-prosol .design-product-box-text {max-width: none;margin: 0;padding: 30px;}
	#design-prosol .design-solution {margin-top: -200px;}
	#design-prosol .design-solution h3 {margin-bottom: 20px;}
	#design-prosol .design-solution ul {flex-direction: column;}
	#design-prosol .design-solution ul h4 {font-size: 1.8rem;margin: 16px 0 12px;}
}


/* -------------------------------------------------- */
/* 下層ページ */
/* -------------------------------------------------- */
/*===== 共通 =====*/
.design-cmn-h2 {font-weight: bold;font-size: 3.2rem;letter-spacing: 0.08em;color: #333333;margin-bottom: 40px;padding:0 0 17px 30px;border-bottom: 2px solid #005740;line-height: 1.3;position: relative;}
.design-cmn-h2:before {content: '';width: 12px;height: calc(100% - 24px); display: inline-block; background: linear-gradient(180deg, #005740 0%, #07AD41 100%);position: absolute;left: 0;top: 0.5rem;}

/*===== 企業情報 =====*/
#design-company-global .design-global-box{position: relative;margin-bottom: 30px;}
#design-company-global .design-global-text {position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;align-items: center;z-index: 1;}
#design-company-global .design-global-text ul{display: flex;justify-content: space-between;gap:50px;margin: 0 auto;}
#design-company-global .design-global-text ul li {font-size: 2.4rem;font-weight: bold;}
#design-company-global .design-global-text ul li span {font-size: 6.4rem;font-family: "Onest", sans-serif;color: #005740;display: inline-block;margin: 0 8px;}
#design-company-global .design-global-video {position: relative;}
#design-company-global .design-global-video:before {content: '';width: 100%;height: 100%;display: block;position: absolute;left: 0;top: 0;background: rgba(255, 255, 255, 0.5);}
#design-company-global .design-global-video video {
    width: 100%;
    filter: drop-shadow(0px 0px #000);
}
#design-company-global .design-btn-box {max-width: 400px; margin: 0 auto;}


@media screen and (max-width: 767px) {
	/*===== 共通 =====*/
	.design-cmn-h2 {font-size: 2.4rem;margin-bottom: 20px;padding: 0 0 10px 15px;}
	.design-cmn-h2:before {width: 8px;height: calc(100% - 16px);}
	
	/*===== 企業情報 =====*/
	#design-company-global .design-global-box {margin-bottom: 15px; border: 1px solid #fff;}
	#design-company-global .design-global-text ul {gap:30px;}
	#design-company-global .design-global-text ul li {font-size: 1.2rem;text-align: center;line-height: 1.4;}
	#design-company-global .design-global-text ul li span {font-size: 4rem;display: block; white-space: nowrap;}
}

#design-prosol .design-solution ul li a img{
    /* min-height: 213.27px; */
}


#design-prosol .design-solution ul li{
  flex: 1;
}

@media screen and (max-width: 767px) {
  #design-prosol .design-solution ul li a img{
    min-height: 100%;
}
}