@charset 'UTF-8';

/*変数宣言*/
:root {
	--wrap-width: 100%;
	/*最大幅*/
	--container-width: 100%;
	/*全ページ共通コンテナ幅*/
	--container-pad: 15px;
	/*全ページ共通左右の余白*/
	--grid-gap: 10px;
	/*gridのgap*/
	--grid-gap_wide: 16px;
	/*広めのgridのgap*/
	--container-gap: 45px;
	/*全ページ共通要素間の高さ*/
	--grid-1frof12:calc((var(--container-width) - var(--container-pad))/12);
	/*全ページ共通要素間の高さ*/


	--main-color: #FF9900;
	/*メインカラー*/
		--main-color-txt: #FF9900;/*メインカラーフォント用（fail）　*/
	/*--main-color-txt: #ff5900;/*メインカラーフォント用（AA18）　*/
	--main-color-aaa: #C65000;/*メインカラーフォント用（AAA）　*/
	--middle-gray: #827C78;
	--font-size: 1.5rem;
	/*基本のフォントサイズ　*/
	--font-color: #333;
	/*基本のフォントカラー　*/
	--mv-height: 80vh;
	/*mainvisualのスライドショーの高さ*/
	--mv-min-height: 670px;
	/*スライドショーの高さ最低値*/
}
.pc {
    display: none;
}

.sp {
	display: inherit; 
}

/* 見出し設定 */
.main h2 {


}

.main h3 {
	/*color: var(--main-colorAA);*/
	margin: 0 0;
	padding: 1rem 0;
	font-size: var(--font-size-L);
	font-weight: 600;
	text-align: left;
}

.cont_100vw_sp {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
}
/*12グリッドレイアウト */
.grid-col{
	display: grid;

    gap: var(--grid-gap);
	place-content: center;

}
/*12グリッドレイアウト カラム数*/
.col-1,.col-2,.col-3,.col-4,.col-5{
	grid-template-columns: repeat(1, 12fr);
}
.col-6,.col-8,.col-10,.col-12{
	grid-template-columns: repeat(2, 2fr);

}

.col-s-2{
	grid-template-columns: repeat(2, 1fr);
}
.col-s-3{
	grid-template-columns: repeat(3, 1fr);
}


/*幅に関するもの spでは100％*/

.col-width_12,.col-width_10,.col-width_8,.col-width_6{
	max-width:  100%;
	margin: 0 auto;
}
.col-center_8,.col-span_10,.col-span_12{
	grid-column: 1 / -1;
	&.offset{
		grid-column: 1 / -1;
	}
}


/*トップページ */
.mainvisual {
	position: relative;
	width: 100%;
	height: var(--mv-height);
	min-height: inherit;
	object-fit: cover;
	overflow: hidden;

	display: flex;
	flex-direction: column;
        justify-content: space-between;
  }
.cap_item01 p {
	width: 100%;

	font-size: clamp(20px, 5.9vw, 32px);
	line-height: clamp(30px, 8.72vw, 48px);
	font-weight: 600;
	padding: 10% 8%;
	text-shadow: 1px 1px 3px #808080;

  }

.cap_item02 {
	position: relative;
	width: 100%;
	max-width: var(--container-width);
	margin: 0 auto;

	left: inherit;
	bottom:0;
	left: inherit;
	transform: inherit;

}
.item02_inner{
	position: relative;

	max-width: 100%;
	min-width: 100%;
	background-color: rgba(219,219,219,1);

	& figure{
		position: absolute;
		width: 43%;

		top:auto;
		bottom: 0;
		left:0.5%;

	}
	& figcaption p{
		font-size: var(--font-size-L);
		padding: 10% 8% 10% 45%;

	}

}

.slideshow {
	width: 100%;
	height: auto;
	max-height: 70vh;

}

/* ITEM */
.top_products_item > ul {

	padding:2rem 1rem;
  }

/* ご利用方法 */

.utilize_item{
	padding: 0 0;
}
.utilize_item > .item_container{
	display: grid;
	grid-template-columns: 1fr 3fr;
	gap: var(--grid-gap);
	
	& .col_text{
		& p{
			font-size: var(--font-size-M);
			line-height:1.7;
			text-align: left;
		}
	}
}
  .utilize_item h3 {
	width: fit-content;
	font-size: var(--font-size-L);
	font-weight: 600;
	text-align: center;
	margin: 1em 0 2em 0;
	padding: 1rem 0;
	border-bottom: solid 1px #DCDBDB;
  }



  /* aboutservice */
.aboutservice > .container{
	margin: 0 auto;
	padding: 0 0;



}
.aboutservice_item {
	display: grid;
	grid-template-columns: 1fr;
	
	gap: var(--grid-gap);
	width: 100%;

	background: #F7F7F7;
	padding: 1rem 0;


}
.aboutservice_item li{
	display: flex;

	font-size: var(--font-size-L);
	padding: var(--container-pad) ;
	
	width: 100%;
	background: none;
	border-radius: 1rem;
	border-bottom:solid 1px  #fff;
	
}
.aboutservice_item li:first-child{
	border-top: solid 1px #fff;
}

/* A-02 */
.section.a02_01{
	padding: 0 0 ;
}
.p_products{
	display: grid;
  grid-template-columns: 1fr;
  gap: var(--grid-gap);
  place-content: center;
}
.p_products_cont01{

	
	align-items: center;
}
.p_products_cont02{
	margin: 0 var(--container-pad);
	padding: 1rem 0 ;
}

.products_img_thumb {
	display: none;
}

@media screen and (max-width: 480px) {
	.Form-Item {
	  padding-left: 14px;
	  padding-right: 14px;
	  padding-top: 16px;
	  padding-bottom: 16px;
	  flex-wrap: wrap;
	}
  }

  /*/// A-03 ///*/
.ec-cart_contents {
	grid-template-columns: 100%;
	gap: var(--grid-gap);

}
.ec-cart_contents__cont02{
	max-width: 100%;
}
/*/// カート ///*/

.ec-cart_initems {
	margin: var(--spacing-S) 0;

}

.ec-cart_contents__cont01{
	border: none;
	padding: 0;

}

/*//// お問い合わせ ////*/
.sub_content {
	padding: 2rem 1.6rem;
	margin-bottom: 1.4rem;
}
.contact_content {
	padding: 2.5rem 1.6rem;
	margin-bottom: 3rem;
}

/*/// form ///*/
	.Form {
		/*margin-top: 40px;*/
	}
	div.Form-Item {
		flex-flow: row wrap;
	}

	.Form-Item {
		padding: var(--spacing-SS) var(--spacing-SS);

	}
	

	.Form-Item-Label {
		flex-grow: 1;
		display: flex;
		align-items: flex-start;
		font-size: 15px;
		min-width: 6rem;
	}
	.Form-Item-Label-Required::after {
		position: relative;
		vertical-align: top;

	}

	.Form-Item-Label.isMsg {
		margin-top: 0;
	}

	.Form-Item-Input {
		margin-left: 0;
		/*margin-top: 18px;*/
		min-height: 40px; 
		flex: inherit;
		font-size: 15px;
		width: 100%;

	}
	.Form-Item .row-item{
		flex: inherit;
		gap: 1rem;
	}
	.Form-Item-Textarea {
		margin-top: 18px;
		margin-left: 0;
		height: 200px;
		flex: inherit;
		font-size: 15px;
	}

	.Form-Btn {
		margin-top: 24px;
		padding-top: 8px;
		padding-bottom: 8px;
		width: 160px;
		font-size: 16px;
	}

/*//// モーダル ////*/
	.modal-content {
		margin: 15% auto; /* 中央に配置 */
		padding: 20px;
		width: 96%; /* 幅 */
		min-width: inherit;
	
	}
	.modal-content__inner .ec-cart_consent_inner {
		padding: 0 ;
	}