/* =============================================================
取り扱い生地 .cloth
============================================================= */
/* 共通
-------------------------------------------*/
.cloth{
	margin:3rem 0;
}

/* はじめ .first
-------------------------------------------*/
/* 生地比較横並び */
.cloth .first .wrapper{
	width:95%;
	display:flex;
	flex-direction:row;
	gap:3rem;
	margin:0 auto;
}

/* 各素材別インナー */
.cloth .first .inner{
flex:1;
	text-align:center;
	display:flex;
	flex-direction:column;
	gap:1.5rem;
}

/* 各素材別インナー画像 */
.cloth .first .inner img{
	max-width:80%;
	margin:0 auto;
}

/* 各素材別インナーテキスト */
.cloth .first .inner p{
	width:90%;
	margin:0 auto;
}

/* 各素材生地ページ内リンク */
.cloth .first h6{
	color:#fff;
	font-size:1.2rem;
	padding:1rem 3rem;
	width:100%;
	background-color: var(--color-natural);
	border-radius:10px;
}

/* 各素材生地ページ内リンク */
.cloth .first :nth-of-type(2) h6{
	background-color: var(--color-polyester);
}

/* ページ内リンクボタンのアイコン */
.cloth .first .inner span.icon{
	display:block;
	width:15px;
	height:15px;
	border:solid 1.5px #fff;
	border-top:transparent;
	border-right:transparent;
	transform:rotate(-45deg);
	margin:0 auto;
}

/* 各コンテンツ .content
-------------------------------------------*/
/* 共通 --------------------*/
/* 各コンテンツの最初の軽い記事の説明の幅 */
.cloth .content p.normal{
	width:95%;
	margin:1rem auto 2rem;
}

/* サブブロックの幅 */
.cloth .content .sub_block{
	width:95%;
	margin:10rem auto 0;
}

/* サブブロックの幅 */
.cloth .content .sub_block:first-of-type{
	margin:0 auto;
}

/* 各生地名の見出し */
.cloth .content .sub_block h3{
	width:100%;
	border-top:solid 3px var(--color-inner);
	border-bottom:solid 3px var(--color-inner);
	padding:0.8rem 0;
	text-align:center;
}

/* 各生地内のコンテンツ余白 */
.cloth .content .sub_block .ex{
	margin-top:3rem;
}

/* 各生地内のスライドと説明文を横並び */
.cloth .content .sub_block .wrapper01{
	margin-bottom:1.5rem;
	display:flex;
	flex-direction:row;
	justify-content: space-around;
}

/* 各生地の画像スライドの幅 */
.cloth .content .sub_block .wrapper01 .slider{
	width:40%;
	line-height:0;
}

/* 各生地の説明文内を縦並び */
.cloth .content .sub_block .wrapper01 .inner{
	width:50%;
	display:flex;
	flex-direction:column;
	justify-content: space-between;
}

/* 各生地の説明文内の生地の厚み枠 */
.cloth .content .sub_block .wrapper01 .inner .thickness{
	width:100%;
	display:flex;
	flex-direction:row;
	border:solid 2px var(--color-inner);
	border-radius:30px;
}

/* 各生地の説明文内の「生地の厚み」テキスト */
.cloth .content .sub_block .wrapper01 .inner .thickness p:first-of-type{
	color:#fff;
	font-size:1.2rem;
	background-color:var(--color-inner);
	width:50%;
	padding:0.6rem 2.25rem;
	border-radius:26px 0 0 26px;
	text-align:center;
}

/* 各生地の説明文内の「約〇mm」テキスト */
.cloth .content .sub_block .wrapper01 .inner .thickness p:last-of-type{
	font-size:1.2rem;
	width:50%;
	padding:0.6rem 2.25rem;
	text-align:center;
}

/*------------------------------
生地のカラーと動画*/

/* 各生地のカラーと動画 横並び */
.cloth .content .sub_block .wrapper02{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items: center;
	text-align:center;
	margin:2.5rem auto;
	gap:2rem;
}

/* 各生地のカラーののれん横並び */
.cloth .content .sub_block .wrapper02 .inner_flex{
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	margin-top:2rem;
}

/* 各生地のカラーの各幅 */
.cloth .content .sub_block .wrapper02 .inner:first-child{
	width:45%;
}

/* 各生地の動画の各幅 */
.cloth .content .sub_block .wrapper02 .inner:last-child{
	max-width:55%;
}

/* 各生地のカラーの見出し */
.cloth .content .sub_block .wrapper02 .inner p:first-child{
	padding-bottom:0.5rem;
	border-bottom:solid 1.5px #2f2f2f;
	font-size:1.1rem;
}

/*------------------------------
プリント方法 .ex_print*/

/* プリント方法フレーム */
.cloth .content .sub_block .ex_print{
	margin:2rem auto;
}

/* プリント方法見出し */
.cloth .content .sub_block .ex_print h4{
	text-align:center;
	padding-bottom:0.6rem;
	border-bottom:1.5px solid #000;
	margin-bottom:2rem;
}

/* プリント方法横並び */
.cloth .content .sub_block .ex_print .print_type{
	margin:2rem auto 0;
	display:flex;
	flex-direction:row;
	gap:2rem;
	justify-content:space-around;
	width:98%;
}

/* 各プリント方法の枠デザイン */
.cloth .content .sub_block .ex_print .print_type .inner{
	border:solid 2px var(--color-inner);
	background-color:#fffbf3;
	border-radius:20px;
	padding:0.5rem;
	flex:1;;
	text-align:center;
}

/* プリント方法のアイコンとテキストを横並び */
.cloth .content .sub_block .ex_print .print_type .inner_child{
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items: center;
	padding:0 1rem 0.5rem;
	border-bottom:dotted 2px var(--color-inner);
	gap:1.5rem;
}

/* プリントのアイコン */
.cloth .content .sub_block .ex_print .print_type .inner_child img{
	max-width:50px;
	height:auto;
}
/* プリントの名称 */
.cloth .content .sub_block .ex_print .print_type .inner_child div{
	font-size:1.5rem;
}
/* プリント名称の色説明 */
.cloth .content .sub_block .ex_print .print_type .inner_child span{
	font-size:0.8rem;
}

/* プリントサイズテキスト */
.cloth .content .sub_block .ex_print .print_type .inner p{
	font-size:1.2rem;
	margin:0.5rem 0;
}
/* プリントサイズテキスト(数字) */
.cloth .content .sub_block .ex_print .print_type .inner p span{
	font-size:2rem;
	padding:0 0.5rem;
}
/* プリント方法「詳しくはこちら」 */
.cloth .content .sub_block .ex_print .print_type .inner a{
	font-size:1.1rem;
}



/* 麻生地 .natural
-------------------------------------------*/
/* コンテンツの上下余白 */
.cloth .natural {
	margin:5rem 0 0;
}

/* 見出し */
.cloth .natural h2{
	background-color: var(--color-natural);
	color:#fff;
	padding:1rem 0;
	width:100%;
	border-bottom:none;
}

/* 色付き生地フレーム */
.cloth .natural .sub_block .ex02{
	background-color:#fefaf5;
	padding:2.5rem 3rem;
}

/* 色付き生地見出し */
.cloth .natural .sub_block .ex02 h4{
	text-align:center;
}

/* 色付き生地画像とテキストを横並び */
.cloth .natural .sub_block .ex02 .inner{
	margin:2rem auto;
	display:flex;
	flex-direction:row;
	gap:2rem;
	justify-content:space-around;
}

/* 画像とテキストの幅 */
.cloth .natural .sub_block .ex02 .inner img, .cloth .natural .sub_block .ex02 .inner p{
	width:45%;
}

/* 色の種類画像 */
.cloth .natural .sub_block .ex02 .inner_color{
	display:flex;
	flex-direction:row;
	flex-wrap: wrap;
	gap:1.5rem;
	justify-content:center;
	align-items:flex-start;
}

/* 色の画像幅 */
.cloth .natural .sub_block .ex02 .inner_color img{
	max-width:90px;
	height:auto;
}


/* ポリエステル生地 .polyester
-------------------------------------------*/
/* コンテンツの上下余白 */
.cloth .polyester h2{
	margin:15rem 0 0;
}

/* 見出し */
.cloth .polyester h2{
	background-color: var(--color-polyester);
	color:#fff;
	padding:1rem 0;
	width:100%;
	border-bottom:none;
}