@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

body {
	padding: 0 !important;
}

.br_sp {
	display: none;
}

@media(max-width:960px) {
	.br_sp {
		display: block;
	}
}
/* ---------- ヘッダー ---------- */
.w-header__inner .has-text-align-center {
	height: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
}
 
/* ---------- ファーストビュー ---------- */
.top_item01 {
	display: flex !important;
	margin-bottom: 40px !important;
}

.top_item02 {
	display: flex !important;
}

.top_fv_icon02 {
	margin-top: -40px !important;
}

.top_h1 {
	width: 560px;
	margin: 0 auto;
	margin-top: -40px !important;
}

@media(max-width:960px) {
.top_item01 {
	margin-bottom: 0 !important;
	flex-direction: column;
	align-items: center;
}

.top_item02 {
	flex-wrap: wrap;
	justify-content: center;
}
	
	.top_fv_icon {
		width: 160px;
	}
	
	.top_fv_icon02 {
	margin-top: 0 !important;
}


.top_h1 {
	width: 100%;
	max-width: 560px;
	margin-top: 0 !important;
}
	
}

/* ---------- 「農林水産省補助金」とは？ ---------- */
.top_intro_item_pc {
	display: flex !important;
	justify-content: center;
}
.top_intro_item_sp {
	display: none;
}

@media(max-width:700px) {
	.top_intro_item_pc {
		display: none !important;
	} 
	
	.top_intro_item_sp {
		display: block;
		text-align: center;
	}
	
	.top_intro_item_sp .wp-block-group  {
		display: flex;
		justify-content: center;
	}

}

/* ---------- 農林水産省の補助金の特徴 ---------- */
.top_feature_wrapper .swell-block-fullWide__inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 !important;
}

.top_feature_leads {
	margin-bottom: 80px;
}

.top_feature_lead {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-align: center;
	line-height: 1.8em;
	margin-bottom: 28px;
}

.top_feature_lead .span01 {
	font-size: 22px;
	color: #2C5282;
}

.top_feature_lead .span02 {
	font-size: 28px;
	color: #2C5282;
	position: relative;
}

.top_feature_lead .span02::before {
	content: "";
    position: absolute;
    width: 100%;
    height: 11px;
    left: 50%;
    bottom: -2px;
    transform: translateX(-50%);
    background: #FFBB00;
    z-index: -1;
}

.top_feature_inner {
	position: relative;
}

.top_feature_title {
	position: absolute;
	left: 50%;
	transform: translatex(-50%);
	top: -27px;
}

.top_feature_list {
	 padding: 80px 64px 56px !important;
	box-shadow: 4px 3px 14px rgba(0, 0, 0, 0.16);
	display: flex !important;
	justify-content: space-between;
}

.top_feature_item {
	width: 28%;
	border-radius: 10px;
	padding: 36px 28px 28px;
	position: relative;
}
.top_feature_item .wp-block-group {
	display: flex !important;
	flex-direction: column;
	gap: 24px;
}

.top_feature_num {
	position: absolute;
	top: -22px;
	left: -40px;
}

.top_feature_img {
	position: absolute;
	right: 40px;
	top: -132px;
}

@media(max-width: 1200px) {
.top_feature_wrapper .swell-block-fullWide__inner{
	width: 92%;
}

.top_feature_title {
	width: 92%;
	max-width: 346px;
	position: absolute;
}
}

	@media(max-width:960px) {
.top_feature_list {
	 padding: 72px 32px 40px !important;
	flex-direction: column;
	align-items: center;
	row-gap: 28px;
}

.top_feature_item {
	width: 100%;
	max-width: 600px;
}

.top_feature_img {
	position: static;
}
}

/* ---------- 例えば、一例を挙げると以下のような補助金があります。 ---------- */ 
.top_example_list .swell-block-columns__inner {
	justify-content: center;
}


/* ---------- 補助金の特徴比較 ---------- */ 
.top_comparison_wrapper .swell-block-fullWide__inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 !important;
}

.sec_title {
	margin-top: 0 !important;
}

.sec_title span {
	font-size: clamp(2rem, 3.071vw, 2.6875rem);
	display: inline-block;
	position: relative;
}

.sec_title span::before {
	content: "";
    position: absolute;
    width: 100%;
    height: 11px;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    background: #FFFF02;
    z-index: -1;
}

@media(max-width:1200px) {
.top_comparison_wrapper .swell-block-fullWide__inner {
	width: 92%;
}
}

/* ---------- 採択・導入実例 ---------- */ 
.top_introduction_bg {
  --grid: 20px;             /* マスの大きさ */
  --line: 1px;              /* 線の太さ */
  --color: rgba(197, 219, 233, 0.7); /* 線色 */

  background-image:
    linear-gradient(to right, var(--color) var(--line), transparent 0),
    linear-gradient(to bottom, var(--color) var(--line), transparent 0);
  background-size: var(--grid) var(--grid);
}

.top_introduction_bg .swell-block-fullWide__inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 !important;
}

.top_introduction_list {
	display: flex !important;
	justify-content: space-between;
}

.top_introduction_item .wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.top_introduction_item .has-background {
	padding: 8px !important;
}

@media(max-width:1200px) {
.top_introduction_bg .swell-block-fullWide__inner {
	width: 92%;
}

.top_introduction_list {
	gap: 32px;
	flex-wrap: wrap;
	justify-content: center;
}
}

/* ---------- 採択・導入実例　スライダー ---------- */ 
.slider-wrap {
  position: relative;
  width: 100%;
  max-width: 1200px; 
  margin: 0 auto;
  overflow: visible;
}

.case-slider {
  position: relative;
  overflow: hidden;  
  width: 100%;
}

.slides {
  display: flex;
  justify-content: space-between; 
  width: 1100px;                  
  margin: 0 auto;                 
  gap: 30px;                      
  transition: transform 0.6s ease;
}

.slide {
   flex: 0 0 calc((1100px - 60px) / 3); /* gap考慮して3枚収まるように */    
  width: 340px;        
  box-sizing: border-box;
  background: #F2EECE;
  border-radius: 10px;
  overflow: hidden;
}

.slide_inner_top {
	position: relative;
	margin-bottom: 32px;
}

.slide h3 {
	background-color: #2C5282;
	text-align: center;
	border-radius: 10px 10px 0 0;
	color: #FFF;
	padding: 24px 0;
	margin-bottom: 0;
}

.slide_arrow {
	position: absolute;
	left: 50%;
	transform: translate(-50%);
	bottom: -16px;
	width: 72px;
	height: 16px;
}

.slide_top {
	text-align: center;
    font-weight: 600;
	line-height: 1.4em;
	border-bottom: solid 2px #2C5282; 
	padding-bottom: 20px;
	margin-bottom: 16px;
}

.slide_inner_top span {
	font-size: 14px;
}

.slide_inner_bottom {
	padding: 0 24px 28px;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 16px;
	line-height: 1.4em;
}

/* 矢印 */
.arrow {
  width: 28px;               
  height: 76px !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent;
  border: none;
  cursor: pointer;
	padding: 0;
  z-index: 10;              
}

/* 左右の矢印画像を指定 */
.arrow.prev {
	position: absolute; 
  left: -40px;
	top: 50%;
  transform: translateY(-50%);
}

.arrow.next {
	position: absolute; 
  right: -40px;
	top: 50%;
  transform: translateY(-50%);
}

/* ドット */
.dots {
  text-align: center;
  margin-top: 16px;
}
.dots span {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 4px;
  background: #ccc;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s;
}
.dots span.active {
  background: #ED952B;
}

@media (max-width: 1200px) {
  .slides {
    gap: 20px;
  }
  .slide {
    flex: 0 0 calc((100% - 20px) / 2);
  }
}

@media (max-width: 960px) {
  .slides {
    gap: 0;
	width: 100%;
  }
  .slide {
    flex: 0 0 100%;
  }
	
.slider-wrap {
  width: 92%; 
}

.case-slider {
  width: 100%;
}


/* 矢印 */
.arrow {
  width: 23px;               
  height: 71px !important;           
}

/* 左右の矢印画像を指定 */
.arrow.prev {
  left: -30px;
}

.arrow.next {
  right: -30px;
}
}

/* ---------- まずは無料で簡易診断してみませんか？ ---------- */ 
.top_diagnosis_wrapper {
	padding-bottom: 80px !important;
}

.top_diagnosis_title {
	width: 100%;
	max-width: 818px;
	margin: 0 auto;
}

.top_diagnosis_lead {
	margin: 48px 0 !important;
}

.top_diagnosis_inner {
	position: relative;
}

.top_diagnosis_img {
	position: absolute;
	bottom: -20px;
    right: -110px;
}

.top_bg_wrapper {
	position: relative;
}

.top_bg_img {
	width:50%;
	max-width: 705px;
    position: absolute;
	top: 15%;
	right: -20%;
	transform: translatey(-50%);
	z-index: 0;
}
	
@media(max-width:1200px) {
.top_diagnosis_img {
	position: static;
}
}

/* ---------- アカネサスについて ---------- */ 
.top_company_wrapper h2 {
	margin-top: 0 !important;
}

.top_company_red {
	border-radius: 10px;
	width: 100%;
	max-width: 820px;
	padding: 16px 28px 28px !important;
	margin: 0 auto;
}

.company_red_inner {
	display: flex;
	gap: 48px;
	justify-content: center;
    align-items: center;
}

.top_company_list {
	display: flex;
	padding: 48px 56px !important;
	justify-content: space-between;
}

.company_list_left {
	width: 40%;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.company_list_right {
	width: 56%;
}

.company_left01 {
	display: flex;
	justify-content: flex-start;
    align-items: center;
	gap: 32px;
}

.top_company_arrow {
	display: flex;
	gap: 100px;
	justify-content: center;
}

@media(max-width:960px) {
.company_red_inner {
	gap: 20px;
}

.top_company_list {
	flex-direction: column;
	gap: 32px;
	padding: 40px !important;
	justify-content: space-between;
}

.company_list_left {
	width: 100%;
}

.company_list_right {
	width: 100%;
}

.company_left01 {
	flex-direction: column;
	justify-content: center;
}

.top_company_arrow {
	gap: 28px;
}
}