/* =============================================================
トップページ .top
============================================================= */
/* 共通
--------------------------------------------------------------*/

/* はじめに .first
----------------------------------------------------------------*/
/* 一番初めの文言 .beginning
-------------------------------------------*/
/* ブロックの上余白 */
.top .beginning{
	margin-top:3rem;
}

/* のれんの用途とイメージ .use_image
-------------------------------------------*/
/* 画像の並び */
.top .use_image ul {
	display: flex;
	flex-flow: nowrap;
	justify-content: space-around;
	gap:2rem;
}

/* テキストの並び */
.top .use_image li {
	text-align:center;
}

/* テキストの上余白 */
.top .use_image p {
	margin-top:0.5rem;
}

/* のれんを作るときのチェックポイント .point
-------------------------------------------*/
/* 見出し */
.top .point h1.hdr{
	border-bottom:solid #000 2px;
	padding-bottom:0.8rem;
}

/* 画像とテキストを横並びに */
.top .point .wrapper .inner{
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	margin-bottom:3rem;
	align-items: center;
}

/* 「スタッフ」画像 */
.top .point .wrapper .inner figure{
	flex:0.7;
}

/* 右側のテキストを縦並び */
.top .point ul{
	display:flex;
	flex-direction:column;
	gap:1rem;
	flex:1;
}

/* テキストを横並び */
.top .point li{
	position:relative;/* テキスト番号の親 */
	display:flex;
	justify-content: flex-start;
	border:solid 2px #99784d;
	border-radius:10px;
	padding:1rem;
	padding-left:2.5rem;
	background-color:#f5f1ed;
}

/* 番号背景色(■)の配置 */
.top .point li::before{
	position:absolute;/* liの子供 */
	content:"";
	width:45px;
	height:45px;
	background-color:#99784d;
	top:50%;
	left:-22.5px;
	transform:translateY(-50%);
}

/* 【1】番号の配置 */
.top .point li.point_01::after{
	position:absolute;/* liの子供 */
	content:"1";
	width:45px;
	height:45px;
	color:#fff;
	font-size:1.8rem;
	font-weight:550;
	top:50%;
	left:-8px;
	transform:translateY(-5%);
}

/* 【2】番号の配置 */
.top .point li.point_02::after{
	position:absolute;/* liの子供 */
	content:"2";
	width:45px;
	height:45px;
	color:#fff;
	font-size:1.8rem;
	font-weight:550;
	top:50%;
	left:-8px;
	transform:translateY(-5%);
}

/* 【3】番号の配置 */
.top .point li.point_03::after{
	position:absolute;/* liの子供 */
	content:"3";
	width:45px;
	height:45px;
	color:#fff;
	font-size:1.8rem;
	font-weight:550;
	top:50%;
	left:-8px;
	transform:translateY(-5%);
}

/*  チェックポイントボタン .btn 
---------------------------------*/
/* ボタンの枠組み */
.top .point .btn{
	border:solid #d5b06b 2.5px;
	background-color:#d5b06b;
	width:100%;
}

/* ボタン 画像とテキストを縦並び */
.top .point .btn .inner{
	display:flex;
	flex-direction:column;
	justify-content:center;
	text-align:center;
	gap:0rem;
	align-items:center;/* かぶってしまったCSSの打ち消し */
	margin-bottom:0;/* かぶってしまったCSSの打ち消し */
}

/* ボタン「はじめてのれんを作る方へ」 */
.top .point .btn img{
	margin:1rem auto;
	width:60%;
}

/* ボタンの下テキスト */
.top .point .btn p{
	background-color:#fff;
	width:100%;
}


/* 当店で取り扱う麻のれんの生地と仕様について .main
----------------------------------------------------------------*/
/*  共通 .full_wide
-------------------------------------------*/
.top .main{
	background-color:#fbf7f0b3;
	margin: 0 calc(50% - 50vw) 2rem;/* 幅いっぱい */
	width:100vw;
	padding:3rem 0;
}

/* 幅全体 */
.top .main .full_wide{
	width:100vw;
	/*background-color:#faf6ec;*/
	margin: 0 calc(50% - 50vw);/* 幅いっぱい */
	margin-top:4rem;
}

/* flex用のコンテンツ */
.main .full_wide .wrapper{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content: center;
	gap:5rem;
}

/* flex用のコンテンツ(仕様用) */
.main .full_wide:nth-of-type(2) .wrapper{
	display:flex;
	flex-direction:row-reverse;
	align-items:center;
	justify-content: center;
	gap:5rem;
}

/* 商品画像 */
.top .main .full_wide img{
	width:50%;
	text-align:center;
}

/* 説明テキスト */
.top .main .full_wide .explanation{
	width:45%;
	margin-right:3rem;
	display:flex;
	flex-direction:column;
	align-items:center;
}

/* 説明テキスト(仕様用) */
.top .main .full_wide:nth-of-type(2) .explanation{
	width:45%;
	margin-left:3rem;
}

/* テキスト内の見出し */
.top .explanation h4{
	position:relative;
	margin-bottom:2rem;
}

/* 見出しのアイコン */
.top .explanation span.hdr_icon{
	content:url(https://asanotakumi.sizeorder-noren.com/wp/wp-content/uploads/top_hdr_icon.png);
	width:30px;
	height:34px;
	position:absolute;
	top:50%;
	left:-2.5rem;
	transform:translateY(-17px);
}

/* テキスト内の詳細説明 */
.top .explanation p{
	margin-bottom:1.5rem;
}

/* 詳しく見るボタン */
.top .explanation .btn_icon {
	display: inline-flex;
	align-items: center;
	padding: 0.8rem 1.5rem;
	background-color: #faf6ec;
	color: #2b2b2b;
	font-size: 1.05rem;
	font-weight:500;
	text-decoration: none;
	border:solid 2px #a5946f;
	border-radius: 25px;
	transition: all 0.3s ease;
}

/* ボタン内の矢印 + 装飾 */
.top .explanation .btn_icon span {
	margin-left: 8px;
	transition: transform 0.3s ease;
}
.top .explanation .btn_icon:hover span{
	transform: translateX(4px);/* ホバーしたときに矢印を右に4px */
}
.top .explanation .btn_icon:hover{
	background-color: #a5946f;/* ホバーしたときにボタンの背景色と文字色を変える */
	color:#fff;
}

/*-----------------------------------------------
「麻のれんについて」コンテンツ .about */
/* コンテンツの幅 */
.top .about{
	background-color:#fbf7f0b3;
	padding:2rem 0;
	margin: 0 calc(50% - 50vw) 2rem;/* 幅いっぱい */
}

/* 説明テキスト */
.top .about .explanation{
	display:flex;
	flex-direction:column;
	align-items:center;
}





/* ==========================================================================================================================
お見積りフォーム
========================================================================================================================== */
/* foorm_start form_end
-------------------------------------------*/
.top .form .form_start{
	text-align:center;
	background:rgba(255,255,255,0.8);
}

.top .form .form_start h1{
	font-weight:600;
	font-size:2rem;
	font-family:	Hiragino Maru Gothic ProN W6,serif;
	padding:1rem 0;
}

.form{
	background:#d1ccc3;
	margin: 7rem calc(50% - 50vw);/* 幅いっぱい */
	padding:2.5rem 0 5rem;
	position:relative;
}

/*.form::before{
content:"";
background-image:url(https://asanotakumi.sizeorder-noren.com/wp/wp-content/uploads/circle000.png);
background-repeat:no-repeat;
background-size:contain;
position:absolute;
top:-423px;
left:50%;
transform:translateX(-50%);
width:1920px;
height:423px;
}*/

.estimate{
	background:#fff;
	max-width:1180px;
	margin:0 auto;
	padding:3rem;
}

/* 共通
-------------------------------------------*/
/* 親cssのリセット
----------------------------*/
/* マージンの調整 */
input[type=date], input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url], select, textarea {
	margin: 0;
	box-sizing: border-box;
}

/* 各ブロックのh3 */
.estimate h3{
	color:#fff;
	font-size:1.5rem;
	padding:1rem;
	padding-left:0.6rem;
	background:#5c5036;
	border-radius:50px 0px 0px 50px;
}

/* 各ブロックのh3の数字 */
.estimate h3 span{
	color:#333;
	font-size:1.7rem;
	font-family:serif;
	background:#fff;
	border-radius:50%;
	padding:0.4rem 0.6rem;
	margin-right:1rem;
}

/* ラジオボタン */
.wpcf7-radio {
	display:none;
}

/* ラジオボタン */
.estimate input[type=radio]{
	display:none;
}

/* 各小見出し */
.estimate .block03 .print h5{
	border-left:solid 8px #5c5036;
	padding-left:0.8rem;
}

/* リンク */
.estimate a{
	text-decoration:underline;
	text-align:center;
}

/* リンクアイコン */
span.another_icon{
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-left: 0.5rem;
	background-image:url(https://asanotakumi.sizeorder-noren.com/wp/wp-content/uploads/link.png);
	background-repeat:no-repeat;
	background-size:contain;
}

/* 各ボタンのh6 */
.estimate h6{
	text-align:center;
	background:rgba(250,250,250,0.5);
	border-radius:5px;
	width:95%;
	margin:0 auto;
	padding:0.2rem 0;
}

/* 各プリントのラベル */
.estimate ul li label{
	padding:0.8rem;
	background:var(--color-btn);
	box-shadow:2px 2px 5px 3px #e7e7e7;
}
/* checked */
.estimate ul li input[type=radio]:checked + label{
	background:var(--color-btn-hover);
}
/* hover */
.estimate ul li label:hover{
	background:var(--color-btn-hover);
}

/* ボタン内の赤枠 */
.estimate p.red_area{
	font-weight:530;
	font-size:0.9rem;
	color:#fff;
	padding:0.05rem 0;
	background:#962f1e;
	width:98%;
	text-align:center;
	border-radius:20px;
	margin-top:0.4rem;
}

/* ボタン内の茶枠 */
.estimate p.brown_area{
	background:#857c68;
	width:98%;
	text-align:center;
	border-radius:20px;
	font-weight:530;
	font-size:0.9rem;
	color:#fff;
	padding:0.05rem 0;
	margin-top:0.4rem;
}

.top .form{

}


/* ==========================================================================================================================
01 生地を選ぶ
========================================================================================================================== */
/* 5つの生地の括り */
.estimate .block01 ul{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	column-gap:2.5rem;
}

/* 生地画像と生地の説明テキスト */
.estimate .block01 ul li label{
	margin-bottom:1rem;
	padding:0;
	min-height:360px;
}

/* 生地の説明テキスト */
.estimate .block01 ul li .txt_area{
	padding:1rem;
	min-height:14rem;
}

/* 生地の説明テキスト */
.estimate .block01 ul li .txt_area h6{
	padding-bottom:0.1rem;
	margin-bottom:0.5rem;
	text-align:center;
	background:rgba(250,250,250,0.5);
	border-radius:5px;
}

/* 生地の説明見出し(麻風スラブ※販売停止中) */
.estimate .block01 ul li .txt_area h6 span{
	color:red;
	font-size:0.7rem;
	display:inline-block;
	text-decoration:none;
}

/* 各生地のリンク */
.estimate .block01 ul li p.link{
	text-align:center;
}


/* ==========================================================================================================================
02 色を選ぶ
========================================================================================================================== */
/* 括り大 */
.estimate .block02 .color_inner{
	margin:2rem auto;
}

/* リード文 */
.estimate .block02 .color_inner p:first-child{
	text-align:center;
	font-weight:500;
	font-size:1.1rem;
}

/* 生地色括り */
.estimate .block02 .color_inner ul{
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:2.5rem;
	margin:2rem auto;
}

/* 各生地色のlabel */
.estimate .block02 .color_inner ul li label{
	margin:0;
}

/* 各生地色のテキスト */
.estimate .block02 .color_inner ul li label p{
	font-weight:500;
}

/* ==========================================================================================================================
03 プリント方法を選ぶ
========================================================================================================================== */
/*  共通
----------------------------*/
/* 各小見出しコンテンツ */
.estimate .block03 .print .inner{
	margin:3.5rem auto;
}

/*  -プリントをご希望の方へ-
----------------------------*/
/* 注意事項 */
.estimate .block03 .attention{
	background:#f4eae8;
	padding:0.5rem;
	width:100%;
	text-align:center;
	margin:3.5rem 0;
}

/* 注意事項の赤文字 */
.estimate .block03 .attention .red{
	font-weight:500;
}

/* =============================================================
天然生地を選んだ場合のプリントコンテンツ print_natural
============================================================= */
/*  -1.ワンポイントプリントをお選びください-
----------------------------*/
/* プリント選択括り */
.estimate .block03 .print_natural ul{
	display:flex;
	flex-direction:row;
	gap:2.5rem;
	justify-content:center;
	align-items:flex-start;
	flex-wrap:nowrap;
	margin:0rem auto 1rem;
}

/* 各プリントボタン */
.estimate .block03 .print_natural ul li{
	display:flex;
	flex-direction:column;
	gap:1rem;;
	align-items:center;
}

/* ボタン内のテキスト括り */
.estimate .block03 .print_natural ul li .txt_inner{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

/*  シルク印刷を選んだ場合
-----------------------------------------------------------------*/
/* プリント位置について注意事項 */
.silk_attention{
	margin:5rem auto 3.5rem;
	padding:0.8rem 0;
	width:100%;
	background:#eee;
	text-align:center;
	position:relative;
}

/* 暖簾の画像 */
.silk_attention figure{
	display:none;/* PCでは消去 */
}

/* プリント位置について */
.silk_attention h6{
	background:transparent;
	border-radius:0px;
}

/* プリント位置について注意事項 */
.silk_attention h6, .silk_attention p{
	width:75%;
	margin:0 auto;
}

/* プリント位置について注意事項 */
.silk_attention::before{
	position:absolute;
	content:"";
	background-image:url(https://asanotakumi.sizeorder-noren.com/wp/wp-content/uploads/print_position_attention.png);
	background-repeat:no-repeat;
	background-size:contain;
	left:5%;
	bottom:0;
	width:130px;
	height:170px;
	margin-top:2rem;
}

/*  -2.プリントのサイズをお選びください-
----------------------------*/
/* 各ボタン */
.estimate .block03 .print_natural .print_silk_02 ul li{
	width:25%;
	align-items:stretch;
}

/* 各ボタンの見出し */
.estimate .block03 .print_natural .print_silk_02 ul li h6{
	margin-top:0.8rem;
}

/*  -3.プリントの色をお選びください-
----------------------------*/
/* 各ボタン */
.estimate .block03 .print_natural .print_silk_03 ul li{
	width:30%;
	align-items:stretch;
}

/* 各ボタンの見出し */
.estimate .block03 .print_natural .print_silk_03 ul li h6{
	margin-top:0.8rem;
}

/*  -4.プリントの内容をお選びください-
----------------------------*/
/* 各ボタン */
.estimate .block03 .print_natural .print_silk_04 ul li {
	width:30%;
	align-items:stretch;
}

/*  シルク印刷＞書体見本から選ぶを選んだ場合
-----------------------------------------------------------------*/
/*  -5.ご希望の書体をお選びください-
----------------------------*/
/* 各書体のボタン */
.estimate .block03 .print_natural .print_silk_font_05 ul {
	display: grid;
	grid-template-columns:repeat(7,1fr);
	column-gap: 1.2rem;
	row-gap:1rem;
	margin: 2rem auto;
}

/* 各書体の画像 */
.estimate .block03 .print_natural .print_silk_font_05 ul label  {
	margin-top:0;
}

/* 各書体の画像 */
.estimate .block03 .print_natural .print_silk_font_05 ul label img {
	background:#fff;/* 背景白 */
}

/* 各書体の画像 */
.estimate .block03 .print_natural .print_silk_font_05 ul label h6 {
	margin-top:0.8rem;
	width:100%;
}

/*  -6.文字の方向をお選びください-
----------------------------*/
/* 各ボタン */
.estimate .block03 .print_natural .print_silk_font_06 ul li{
	width:30%;
	align-items:stretch;
}

/*  -7.名入れする文言 ＆ 8.文字の大きさや改行…-
----------------------------*/
/* テキスト枠 */
.estimate .block03 .print_natural .print_silk_font_07 input[type=text], .estimate .block03 .print_natural .print_silk_font_08 input[type=text] {
	margin-top:1rem;
}


/*  シルク印刷＞データ入稿をするを選んだ場合
-----------------------------------------------------------------*/
/*  -5.データを入稿する-
----------------------------*/
/* ファイル */
.estimate .block03 .print_natural .print_silk_data_05 .inner {
	padding:1.5rem 1rem;
	width:98%;
	border:solid 0.5px #aaa;
	margin:2rem auto;
}

/* ファイル選択エリア */
.estimate .block03 .print_natural .print_silk_data_05 label {
	text-align:center;
	padding:2rem 0;
	width:100%;
	background:var(--color-btn);
	border:dashed 1.5px var(--color-btn-hover);
	margin-bottom:1rem;
}

/* ファイル選択注意テキスト */
.estimate .block03 .print_natural .print_silk_data_05 .inner_attention p{
	margin:0.5rem 0;
}

/* ファイル選択注意テキスト */
.estimate .block03 .print_natural .print_silk_data_05 .inner_attention .area{
	background:#f4eae8;
	padding:0.8rem;
	text-align:center;
	margin:1rem 0;
}


/*  DTF印刷を選んだ場合
-----------------------------------------------------------------*/
/*  -プリント位置について-
----------------------------*/
/* プリント位置について注意事項 */
.dtf_attention{
	margin:5rem auto 3.5rem;
	padding:0.8rem 0;
	width:100%;
	background:#eee;
	text-align:center;
	position:relative;
}

/* 暖簾の画像 */
.dtf_attention figure{
	display:none;/* PCでは消去 */
}

/* プリント位置について */
.dtf_attention h6{
	background:transparent;
	border-radius:0px;
}

/* プリント位置について注意事項 */
.dtf_attention h6, .dtf_attention p{
	width:75%;
	margin:0 auto;
}

/* プリント位置について注意事項 */
.dtf_attention::before{
	position:absolute;
	content:"";
	background-image:url(https://asanotakumi.sizeorder-noren.com/wp/wp-content/uploads/print_position_attention.png);
	background-repeat:no-repeat;
	background-size:contain;
	left:5%;
	bottom:0;
	width:130px;
	height:170px;
	margin-top:2rem;
}

/*  -2.プリントサイズをお選びください-
----------------------------*/
/* 各ボタン */
.estimate .block03 .print_natural .print_dtf_02 ul li{
	width:30%;
	align-items:stretch;
}

/*  -3.データを入稿する-
----------------------------*/
/* ファイル */
.estimate .block03 .print_natural .print_dtf_03 .inner {
	padding:1.5rem 1rem;
	width:98%;
	border:solid 0.5px #aaa;
	margin:2rem auto;
}

/* ファイル選択エリア */
.estimate .block03 .print_natural .print_dtf_03 label {
	text-align:center;
	padding:2rem 0;
	width:100%;
	background:var(--color-btn);
	border:dashed 1.5px var(--color-btn-hover);
	margin-bottom:1rem;
}

/* ファイル選択注意テキスト */
.estimate .block03 .print_natural .print_dtf_03 .inner_attention p{
	margin:0.5rem 0;
}

/* ファイル選択注意テキスト */
.estimate .block03 .print_natural .print_dtf_03 .inner_attention .area{
	background:#f4eae8;
	padding:0.8rem;
	text-align:center;
	margin:1rem 0;
}

/* =============================================================
ポリエステル生地を選んだ場合のプリントコンテンツ print_polyester
============================================================= */
/*  -昇華転写とは-
----------------------------*/
/* 括り色付き部分 */
.estimate .block03 .print_polyester .inner_area{
	background:#eee;
	padding:1rem 1.5rem;
}

/* 見出し */
.estimate .block03 .print_polyester .inner_area h4{
	text-align:center;
}

/* 画像とテキストの括り */
.estimate .block03 .print_polyester .inner_area ul{
	display:flex;
	flex-direction:row;
	gap:2rem;
	justify-content:center;
	margin-top:2rem;
}

/* 画像とテキスト */
.estimate .block03 .print_polyester .inner_area ul li{
	width:30%;
}

/* 右画像 */
.estimate .block03 .print_polyester .inner_area ul li:nth-child(2) figure{
	width:50%;
}

/* プリントする/しないボタン */
.estimate .block03 .print_polyester .inner ul.tensya_btn{
	display:flex;
	flex-direction:row;
	gap:2rem;
	justify-content:center;
}

/* 各ボタン */
.estimate .block03 .print_polyester .inner ul.tensya_btn li{
	width:40%;
}

/*  -1.印刷する面を選択してください-
----------------------------*/
/* ボタンの括り */
.estimate .block03 .print_polyester .print_tensya_01 ul{
	display:flex;
	gap:2rem;
	justify-content:center;
	flex-wrap:nowrap;
}

/* ボタンの括り */
.estimate .block03 .print_polyester .print_tensya_01 ul li{
	display:flex;
	flex-direction:column;
}

/* ボタンの括り */
.estimate .block03 .print_polyester .print_tensya_01 ul li label{
	flex:1;
	display:flex;/* brown_areaの位置をそろえるため */
	flex-direction:column;
}

/* ボタンの括り */
.estimate .block03 .print_polyester .print_tensya_01 ul figure{
	background:#fff;
	padding:1rem;
}

/* ボタンの括り */
.estimate .block03 .print_polyester .print_tensya_01 ul li label p.brown_area{
	margin-top:auto;
}

/*  -2.データを入稿する-
----------------------------*/
/* ファイルの括り */
.estimate .block03 .print_polyester .print_tensya_02 .inner{
	padding:1.5rem 1rem;
	width:98%;
	border:solid 0.5px #aaa;
	margin:2rem auto;
}

/* ファイル選択エリア */
.estimate .block03 .print_polyester .print_tensya_02 .inner label{
	text-align:center;
	padding:2rem 0;
	width:100%;
	background:var(--color-btn);
	border:dashed 1.5px var(--color-btn-hover);
	margin-bottom:1rem;
}


/* ==========================================================================================================================
04 サイズを選ぶ
========================================================================================================================== */
/* 背景色とマージン */
.estimate .block04 .size_input {
	background-color: #eae4d5;
	padding: 0.5rem 0;
	text-align: center;
	filter: drop-shadow(0.1rem 0.1rem 0.2rem #999);
}
/* 位置センターに */
.estimate .block04 .size_input .inner {
	margin: 0 auto;
	width: 95%;
	display:flex;
	flex-direction:column;
}
/* サイズ */
.estimate .block04 .size_input .number {
	display:flex;
	flex-direction:row;
	justify-content: center;
	align-items: center;
	margin:1rem 0;
}

/* サイズラベル */
.estimate .block04 .size_input .number label {
	margin:0;
}

/* 入力欄の文字数 */
.estimate .block04 input {
	width: 7rem;
	margin: 0 0.5rem;
	text-align: right;
}
/*  */
.estimate .block04 .annotation.unit {
	font-size: 0.9rem;
	text-align: center;
	background-color: #FCE5E3;
	margin-bottom: 0.8rem;
	padding: 0.2rem;
}
/* 小数点　エラーメッセージ */
.estimate .block04 .number_error {
	display: none;	
}
input:invalid + .estimate .block04 .number_error {
	display: inline-block;
}
/* 未入力　エラーメッセージ */
.estimate .block04 .wpcf7-not-valid-tip {
	display: inline-block;
}
/* 価格表
---------*/
/* タブ切り替え */
.estimate .block04 .tab-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.estimate .block04 .tab-wrap:after {
	content: '';
	width: 100%;
	height: 8px;
	background: #96845f;
	display: block;
	order: -1;
}
.estimate .block04 .tab-label {
	color: #fff;
	background: #ccc;
	font-size: 1.2rem;
	font-weight: bold;
	white-space: nowrap;
	text-align: center;
	padding: 10px .5em;
	order: -1;
	position: relative;
	z-index: 1;
	cursor: pointer;
	flex: 1;
}
/* 麻風スラブ※販売停止中 */
.estimate .block04 .tab-label .cancel{
	color:red;
	font-size:0.8rem;
}
.estimate .block04 .tab-label:not(:last-of-type) {
	margin-right: 5px;
}
.estimate .block04 .tab-content {
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}
.estimate .block04 .tab-content p.annotation.first {
	text-align: center;
	font-weight: 600;
	background-color: #FCE5E3;
	padding: 0.5rem;
	margin-top: 1rem;
}
.estimate .block04 .tab-switch:checked+.tab-label {
	background: #96845f;
}
.estimate .block04 .tab-switch:checked+.tab-label+.tab-content {
	height: auto;
	overflow: auto;
	padding: 0;
	opacity: 1;
	transition: .5s opacity;
}
.estimate .block04 .tab-switch {
	display: none;
}
/* マージン */
.estimate .price_list table {
	margin: 1rem 0 0;
}
/* th・td */
.estimate .price_list table tr:nth-child(2n+1){
	background-color: #f8f7f3;
}
/* th・td */
.estimate .price_list table th,
.estimate .price_list table td {
	border: 1px solid #999;
	text-align: center;
	padding: 0.9rem;
}
/* タイトル部分 */
.estimate .price_list table th {
	background-color: #eae4d5;
}
/* 幅 */
.estimate .price_list table th {
	width: calc((100% - 10%) / 6);
}
.estimate .price_list table th:first-child {
	width: 10%;
}
/* 価格 */
.estimate .form .price_list table td p {
	margin-top: 0;
}
/* 税込価格 */
.estimate .price_list table td span {
	font-size: 0.7rem;
}


/* ==========================================================================================================================
05 割れの数を選ぶ
========================================================================================================================== */
/* 割れボタン括り */
.estimate .block05 ul{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	column-gap:2rem;
	margin-bottom:2rem;
}

/* 割れボタン画像 */
.estimate .block05 ul li img{
	background:#fff;/* 背景白 */
}

/* 割れボタン見出し */
.estimate .block05 ul li h6{
	margin-top:0.8rem;
}


/* ==========================================================================================================================
06 加工を選ぶ
========================================================================================================================== */
/* ボタンの括り */
.estimate .block06 ul{
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap;
	justify-content:center;
	gap:2rem;
	margin:2rem 0;
}

/* 各ボタン */
.estimate .block06 ul li{
	flex:1;
	display:flex;
	flex-direction:column;
}

/* 各ボタン label */
.estimate .block06 ul li label{
	padding:0;
	display:flex;
	flex-direction:row;
	align-items: center;
	justify-content: space-between;
	min-height:175px;
	flex:1;
}

/* 各ボタンの画像 */
.estimate .block06 ul li figure{
	margin:0;
	flex:0.4;
}

/* 各ボタンのテキスト */
.estimate .block06 ul li label div{
	padding:0.8rem;
	flex:0.6;
	text-align:center;
	display:flex;
	flex-direction:column;
}

/* 各ボタンのテキスト */
.estimate .block06 ul li label div p:last-of-type{
	margin-top:auto;
}

/* =============================================================
棒袋を選んだ場合
============================================================= */
/* 括り大 */
.estimate .block06 .specification_bobukuro{
	margin:3rem auto 2.5rem;
	border:solid 2px var(--color-btn-hover);
	padding:1rem;
	width:90%;
	margin:2rem auto 1rem;
}

/* 「棒袋のサイズを選ぶ」 */
.estimate .block06 .specification_bobukuro h5{
	border-left: solid 8px #5c5036;
	padding-left: 0.8rem;
}

/* ボタンの括り */
.estimate .block06 .specification_bobukuro ul{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:2rem;
	margin:2rem auto;
	width:100%;
}

/* 各ボタン */
.estimate .block06 .specification_bobukuro ul li{
	width:100%;
}

/* 各ボタンlabel */
.estimate .block06 .specification_bobukuro ul li label{
	padding:0.8rem ;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap:1rem;
}

/* 各ボタンの画像 */
.estimate .block06 .specification_bobukuro ul li figure{
	background:#fff;
	padding:1rem;
}

/* 棒袋サイズ選びのコツ */
.estimate .block06 .specification_bobukuro p.ex{
	background:var(--color-btn);
	padding:1rem;
	text-align:center;
	width:100%;
}

/* 棒袋サイズ選びのコツの見出し */
.estimate .block06 .specification_bobukuro p.ex span{
	display:block;
	font-weight:530;
	text-decoration:underline;
}


/* =============================================================
共チチを選んだ場合
============================================================= */
/* 括り大 */
.estimate .block06 .specification_chichi{
	margin:3rem auto 2.5rem;
}

/* 「共チチの仕様を選ぶ」 */
.estimate .block06 .specification_chichi h5{
	border-left: solid 8px #5c5036;
	padding-left: 0.8rem;
}

/* 括り大 */
.estimate .block06 .specification_chichi ul{
	display:flex;
	flex-direction:row;
	gap:2rem;
	justify-content:center;
	align-items:center;
	margin:1rem auto;
}

/* ボタン */
.estimate .block06 .specification_chichi ul label{
	padding: 0.8rem; 
	display: flex;
	flex-direction: row;
	gap:2rem;
	align-items: center;
	justify-content: space-between;
	margin-top:0;
}

/* ボタン */
.estimate .block06 .specification_chichi ul label h6{
	flex:1;
}
/* ボタン　画像 */
.estimate .block06 .specification_chichi ul label figure{
	flex:0.5;
	background:#fff;
}

/* 共チチの仕様を選ぶ */
.estimate .block06 .specification_chichi .ex_inner{
	border:solid 2px var(--color-btn-hover);
	padding:1rem;
	width:90%;
	margin:2rem auto 1rem;
}

/* 「割れの数によって共チチの個数も変化します」 */
.estimate .block06 .specification_chichi .ex_inner .attention_chichi{
	background: linear-gradient(to left, #fff 2%, #f9f6ef 20%, #f7ebcd 50%, #f9f6ef 80%, #fff 98%);
	padding: 0.5rem 0 1rem;
	text-align:center;
	margin:2rem 0 1rem;
}

/* シングル/ダブルの見出し */
.estimate .block06 .specification_chichi .ex_inner h6.ex{
	border-bottom:1.5px solid #aaa;
	padding-bottom:3px;
	margin:2rem auto 1rem;
	background:transparent;
	border-radius:0;
}

/* 各例の括り */
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(2), 
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(3){
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap;
	gap:2rem;
	justify-content:space-around;
	align-items:stretch;
	width:90%;
	margin:1rem auto;
}

/* 各例の各画像とテキスト */
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(2) li:first-child,
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(3) li:first-child{
	width:19.3%;
	text-align:center;
	flex:none;
}

/* 各例の各画像とテキスト */
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(2) li:nth-child(2),
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(3) li:nth-child(2){
	width:23.4%;
	text-align:center;
	flex:none;
}

/* 各例の各画像とテキスト */
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(2) li:last-child,
.estimate .block06 .specification_chichi .ex_inner ul:nth-of-type(3) li:last-child{
	width:30.6%;
	text-align:center;
	flex:none;
}

/* 共チチの基本サイズ案内 */
.estimate .block06 .specification_chichi .inner{
	background:#fcfaf6;
	border:dashed 2px var(--color-btn-hover);
	padding:1rem;
	width:80%;
	margin:2rem auto;
}

/* 共チチの基本サイズ案内画像とテキスト括り */
.estimate .block06 .specification_chichi .inner ul{
	display: flex;
	flex-direction: row;
	gap: 2rem;
	justify-content:center;
	margin: 0;
}

/* 画像とテキスト */
.estimate .block06 .specification_chichi .inner ul li{
	flex:1;
}

/* 共チチの基本サイズの見出し */
.estimate .block06 .specification_chichi .inner ul span{
	display:block;
	text-decoration:underline;
	text-align:center;
	margin-bottom:1rem;
	font-weight:530;
}


/* ==========================================================================================================================
07 枚数を入力する
========================================================================================================================== */
/* 枚数記入の枠 */
.estimate .block07 .input_number{
	background-color: var(--color-btn);
	padding: 0.5rem 0;
	text-align: center;
	filter: drop-shadow(0.1rem 0.1rem 0.2rem #999);
	margin:1rem auto;
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items:center;
	gap:2rem;
}

/* テキストフィールドと「枚」 */
.estimate .block07 .input_number .number label input{
	width: 8rem;
	margin: 0 0.5rem;
	text-align: right;
}


/* ==========================================================================================================================
08 のれん棒つっぱり棒を選ぶ
========================================================================================================================== */
/* ボタン括り */
.estimate .block08 ul{
	flex-direction:row;
	gap:2rem;
	justify-content:center;
	margin:2rem auto;
}

/* 各ボタン */
.estimate .block08 ul li{
	width: 30%;
	align-items: stretch;
}

/* 各ボタンlabel */
.estimate .block08 ul li label{
	margin-top:0;
}

/* =============================================================
商品を選ぶを選んだ場合
============================================================= */
/* 各ボタン */
.estimate .block08 ul.itemselect {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:2rem;
	align-items: stretch;
}

/* 各ボタン */
.estimate .block08 ul.itemselect li{
	width:100%;
	display:flex;
	flex-direction:column;
}


/* 画像部分 */
.estimate .block08 ul.itemselect .detail{
	padding:0.5rem;
	border:solid 1px #aaa;
	margin-bottom:0.5rem;
	text-align:center;
	flex:1;
}

/* 画像部分 */
.estimate .block08 ul.itemselect label .number {
	margin:0 auto;
	width:95%;
	text-align:center;
}


/* 画像部分 */
.estimate .block08 ul.itemselect label input{
	width:80%;
	text-align:right;
	margin-right:0.5rem;
}

/* 画像部分 */
.estimate .block08 ul.itemselect label {
	padding:0.4rem;
}


/* ==========================================================================================================================
09 お客様情報
========================================================================================================================== */
/*  テーブル
----------------------------*/
/* ボーダーとフォント */
.block09 table {
	margin-top: -1px;
	margin-bottom: 0;
}
/* padding追加 */
.block09 table th,
.block09 table td {
	padding: 1rem 2rem;
}
/* thの幅とデザイン */
.block09 table th {
	position: relative;
	width: 25%;
	background-color: #efefef;
	text-align: left;
	font-size: var(--vk-size-text);
	font-weight: 400;
}
/* tdの幅 */
.block09 table td {
	width: 75%;
}

/* テーブル in テーブル
----------------------------*/
/* ボーダー */
.block09 table table,
.block09 table table th,
.block09 table table td {
	border: none;
}
/* 上下マージン削除 */
.block09 table table {
	margin-top: -1px;
	margin-bottom: 0;
}
/* thの背景なし、幅など調整 */
.block09 table table th {
	background-color: transparent;
	width:29%;
	padding: 0.5rem 0;
}
/* 文字を上にあげる */
.block09 table th.vtop {
	vertical-align: top;
	padding-top: 2.5rem;
}
.block09 table table th.vtop {
	vertical-align: top;
	padding-top: 1.5rem;
}
/* 幅とパディング調整 */
.block09 table table td {
	width:71%;
	padding-left: 0;
	padding-right: 0;
}
/* 注釈のみの行追加のためにマージン等調整 */
.block09 table tr.size th,
.block09 able tr.size td {
	padding-bottom: 0;
}
.block09 table tr.size_note th,
.block09 table tr.size_note td {
	padding-top: 0;
	padding-bottom: 0;
}
.block09 table tr.size_note td p {
	line-height: 1.3;
	text-indent: -1em;
	padding-left: 1em;
	margin-top: 0.3rem;
}

/* 必須・任意アイコン
----------------------------*/
/* アイコン共通（任意） */
.input_icon {
	display: inline-block;
	right: 2rem;
	top: 40%;
	font-size: 0.8rem;
	color: #fff;
	border-radius: 3px;
	background-color: gray;
	padding: 0 0.7rem 0.1rem 0.7rem;
}
/* 必須アイコン */
.input_icon.required {
	background-color: #dd0a0a;
}
.vtop .input_icon {
	top: 12%;
}


/* 郵便番号
----------------------------*/
/* 国名非表示 */
.p-country-name {
	display: none;
}
/* 横幅 */
.zip input {
	display: block;
	width: 8rem;
}
/* 数字の幅 */
.p-number input {
	width: 6rem;
	margin-right: 0.5rem;
	text-align: right;
}
/* 日付の幅 */
.p-date input {
	width: 10rem;
	margin-right: 1rem;
}

/* 調整
----------------------------*/
/* リード文 */
.block09 p.txt{
	text-align:center;
	margin:1rem 0;
}

/* 郵便番号上余白 */
.block09 .h-adr label:first-child{
	margin-top:2rem;
}

/* 支払い方法余白 */
.block09 .s-payment {
	margin:2rem 0;
}

/* 支払い方法余白 */
.block09 .s-payment ul {
	flex-direction:row;
	gap:2rem;
	justify-content:center;
}

/* 支払い方法余白 */
.block09 .s-payment ul  li{
	flex:1;
	display:flex;
	flex-direction:column;
}

/* 支払い方法余白 */
.block09 .s-payment ul  li label{
	margin-top:1rem;
	flex:1;
	display:flex;
	flex-direction:column;
	justify-content:center;
	box-shadow: none;
}

/* 支払い方法余白 */
.block09 .s-payment ul  li label h6{
	background:transparent;
	border-radius:0;
}

/* プレースホルダー
----------------------------*/
/* 文字色 */
input::placeholder,
textarea::placeholder {
	color: #aaa;
	line-height: 1.5;
}

/* ボタン
----------------------------*/
/* 送信ボタン */
.submit_btn_wrapper {
	text-align: center;
}
input[type=submit].submit_btn {
	width: 15rem;
	margin-top: 1.5rem;
	text-align: center;
	padding: 1rem 0;
}
.submit_btn.contents_btn {
	display: inline-block;
}


/* 送信メッセージ・エラーメッセージ
----------------------------*/
/* 項目ごとの未入力メッセージ */
.wpcf7-not-valid-tip {
	font-size: 0.8em;
}
/* 入力エラーメッセージ（送信ボタン下　） */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	text-align: center;
	border-color: #e9adad;
	background-color: #e9adad;
	padding: 1rem;
}
/* 送信成功メッセージ（送信ボタン下） */
.wpcf7 form.sent .wpcf7-response-output {
	color: #fff;
	text-align: center;
	border-color: #46b450;
	background-color: #46b450;
	padding: 1rem;
}
/* 未入力項目の色を変える */
.wpcf7-not-valid {
	color: #630015;
	border-color: #c20c33;
	background-color: #ffd9e1;
}

/* ajaxローダー
----------------------------*/
/* 送信ボタン下のセンターに移動 */
.wpcf7-spinner {
	display: block;
	margin: 0.5rem auto;
}

/* labelのマージン
----------------------------*/
/* マージン */
.estimate label {
	display: block;
	margin-top: 2rem;
}

/* ドメイン追加の注釈
----------------------------*/
.mail_domain {
	text-align: center;
	border: 1px solid #ccc;
	background-color: #f5f6f2;
	margin-top: 1rem;
	padding: 1rem;
}
.mail_domain p:first-child {
	font-weight: 600;
}
.mail_domain p + p {
	margin-top: 0.5rem;
}



/*-----------------------------------------------
生地サンプル .cloth_sample */
.top .cloth_sample{
	margin-top:5rem;
}