@charset "UTF-8";

/*===================================
	定数宣言
=====================================*/
:root {

  /*	メニューバー	*/
  --menu-bar-color:				#ff0000;		/*ベースカラー*/
  --menu-bar-grd-color:			#ff6666;		/*グラデーションカラー*/
  --menu-bar-color-hover:		#aa0000;		/*マウスON時ベースカラー*/
  --menu-bar-grd-color-hover:	#ff6666;		/*マウスON時グラデーションカラー*/
  --menu-bar-height:			50px;			/*縦幅*/
  --menu-bar-padding-lr:		30px;			/*内余白左右*/
  --menu-bar-padding-td:		15px;			/*内余白上下*/
  --menu-bar-margin-bottom:		15px;			/*外余白下*/
  
  /*	見出しバー	*/
  --bar-color: #ff0000;					/*ベースカラー*/
  --bar-grd-color: #ff0000;				/*グラデーションカラー*/

  /*	お知らせバー	*/
  --bar-information-color: #000000;		/*ベースカラー*/
  --bar-information-grd-color: #aaaaaa;	/*グラデーションカラー*/
  
  /*	バー全体	*/
  --bar-rad-: 5px;		/*角のまるみ*/
  
  /*表示領域横幅*/
  --contents-width-: 950px;

}
.container {
  width: 100%;        /* 画面幅に合わせる */
  max-width: 1200px;  /* PCの最大幅を固定 */
  margin: 0 auto;     /* 中央寄せ */
}


html,body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

img, table {
  max-width: 100%;
  height: auto;
}

/*===================================
	ヘッダー
=====================================*/
header {
	padding-top:10px;
	display: flex;		/* 横並びにする */
}
.head_img{
	width: 24rem;
	height:6rem;
	display: flex;
}

.header_telfax{
	margin: 0 0;
	margin-left: auto;
	text-align:right;
	width: 20rem;
	height:6rem;
	background-color: white;
	padding: 0 15px;
	display: flex;                /* フレックスで配置 */
	align-items: center;          /* 縦中央 */
	justify-content: flex-end;    /* 右寄せ */
	color: black;
	font-size: 1.8rem;				/* 大きめ文字 */
	font-weight: bold;				/* 太字 */
	line-height: 1.1;				/* ← 行間調整（数字が小さいほど狭くなる） */
	-webkit-text-stroke: 1px black; /* 縁の太さと色 */
	white-space: nowrap;	/*改行なし*/
}
.header_telfax .red_font{
	color: red;
	-webkit-text-stroke: 1px red; /* 縁の太さと色 */
}
/*===================================
	メニューバー
=====================================*/
nav.menu_bar {
	width: 100%;
	max-width: 100%;
	height: var(--menu-bar-height);
	background: linear-gradient(var(--menu-bar-color),var(--menu-bar-grd-color));	/*グラデーション*/
	margin-bottom: var(--menu-bar-margin-bottom);

	box-sizing: content-box;
	display: flex;
	align-items: center;
	border: solid 1px #ee0000;
}

.menu_bar ul {
	margin:auto;
	display: flex;		/* 横並びにする */
	list-style:	none;	/*「・」非表示*/

	box-sizing: border-box;		/*padding border サイズ内に含める*/

}

.menu_bar li {
	border: solid 1px #ffaaaa;
	height: var(--menu-bar-height);
	box-sizing: border-box;		/*padding border サイズ内に含める*/
}

.menu_bar li a {
	display: block;
	text-decoration: none;
	color: white;
	background: linear-gradient(var(--menu-bar-color),var(--menu-bar-grd-color));	/*グラデーション*/
	white-space: nowrap;	/*改行なし*/
	padding:var(--menu-bar-padding-td);
	padding-left:var(--menu-bar-padding-lr);
	padding-right:var(--menu-bar-padding-lr);
	box-sizing: border-box;				/*padding border サイズ内に含める*/
	height: var(--menu-bar-height);
	margin-top: -1;		/*ネガティブマージンで位置をそろえる*/



}
/*	マウスON	*/
.menu_bar li a:hover {
	background: linear-gradient(var(--menu-bar-color-hover),var(--menu-bar-grd-color-hover));	/*グラデーション*/
}

.shop li a span{
	display:block;
	font-size: 12px;
	margin-top:-23px;
	margin-left:10px;
	color:black;
}


/*■■■■■■■■■■	共通部分	■■■■■■■■■■*/
p {
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
}
a {
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
}
h1 {
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
}
h2 {
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
}
h3 {
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
}

/*■■■■■■■■■■	ホーム	■■■■■■■■■■*/
/*===================================
	メイン画像
=====================================*/
section.main_img {
	margin-left: 10px;
	margin-right: 10px;
	text-align:center;	/*水平方向 中央*/

}

/*===================================
	コンテンツ
=====================================*/
/*コンテンツ全体*/
.contents_all{
    display: flex;
    justify-content: center; /* 横方向中央寄せ */
    align-items: flex-start; /* 上詰めに配置 */
    width: var(--contents-width);
    margin: 0 auto;          /* 親要素の中央寄せ */
}
/*左*/
div.contents_left {
	margin-top: 10px;
	margin-left: -20px;
	width:700px;
}
/*右*/
div.contents_right {
	margin-top: 10px;
	margin-left: 30px;
	width: 200px;
}

section.heading1 {
	height: 400px;
}
section.topic {
	height: 400px;
}

/*===================================
	見出し（左）
=====================================*/
.heading1 {
	background:linear-gradient(to right,#ffeeee,#ffffff);	/*グラデーション*/
	border-radius: var(--bar-rad-) var(--bar-rad-) 2px 2px;

}
/*バー*/
.heading1 h1 {
	color:white;
	background: linear-gradient(var(--bar-color),var(--bar-grd-color));	/*グラデーション*/
	border-radius: var(--bar-rad-) var(--bar-rad-) 2px 2px;
}
/*内容*/
.heading2 {
	background-color: #ffeeee;
	border-radius: var(--bar-rad-) var(--bar-rad-) 2px 2px;
}
/*大見出し*/
.major_heading h1{
	color:black;
	font-size: 28px;
	background: linear-gradient(rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 5%, rgba(255,255,255,0.0) 100%);	/*グラデーション*/
	height: 50px;
	display: flex;
	align-items:center;
	justify-content:center;
}
/*===================================
	TOPIC（左）
=====================================*/
/*TOPIC見出し*/
.topic_head {
	
	background: linear-gradient(
		to right,
		rgba(255,0,0,1) 0%,
		rgba(255,0,0,1) 1%,
		rgba(255,0,0,0.5) 2%,
		rgba(255,220,220,0.75) 3%,
		rgba(255,255,255,1) 4%,
		rgba(255,255,255,1) 100%);	/*グラデーション*/	
	padding: 0 -10px;
	padding-left: 30px;
	margin-top: 10px;
	border: solid 1px rgba(255,0,0,0.5);
	box-shadow: 4px 4px 0 0 rgba(128,0,0,0.5);
	display:flex;
	justify-content: space-between; /* ←これで左右に分ける */
	align-items: center; /* 縦位置を揃える */
}

.topic_head:hover{
	background: linear-gradient(
		to right,
		rgba(255,0,0,1) 0%,
		rgba(255,0,0,1) 1%,
		rgba(255,0,0,0.5) 2%,
		rgba(255,20,20,0.75) 3%,
		rgba(255,20,20,0.75) 100%);	/*グラデーション*/
}
.topic_head p{
	display:flex;
	padding: 5px;
	margin: 0;
}
.topic_date{
	display:flex;
	justify-content: flex-end;
}

.heading1 a{
	text-decoration: none; /* アンダーラインを消す */
}
.heading1 p{
	font-size:20px;
	text-shadow: 1px 1px 0 white;
	color:black;

}

/*===================================
	お知らせ（右上）
=====================================*/
h2 {
	color:white;
	background: linear-gradient(var(--bar-information-color),var(--bar-information-grd-color));	/*グラデーション*/
	border-radius: var(--bar-rad-) var(--bar-rad-) var(--bar-rad-) var(--bar-rad-);
}
.notice li {
	margin-bottom: 20px;
}
/*===================================
	カレンダー（右下）
=====================================*/
.calender_mini {
	width:300px;
	height:calc(370px*0.78);
	margin-bottom: 50px;
	transform:scale(0.78);
	transform-origin:0 0;"

}
.calender_mini iframe{
	vertical-align: top;
	max-width: 100%;
	max-heigh: 100%;
	box-shadow: 5px 5px 0 0 rgba(128,0,0,0.5);
}
.calender_mini h3{
	color:white;
	background: linear-gradient(var(--bar-information-color),var(--bar-information-grd-color));	/*グラデーション*/
	border-radius: var(--bar-rad-) var(--bar-rad-) var(--bar-rad-) var(--bar-rad-);
	margin-bottom:0px;
}
.calender_mini h3:hover{
	color:rgba(128,0,0,1);
}
.calender_mini a{
	text-decoration: none;	
}


/*===================================
	フッター
=====================================*/
footer {
	width: 100%;
	height: 100%;
	max-height:200px;
	margin-top:10px;
	color:white;
	background-color:black;
}

slick {
	height: 500px;
}



/*■■■■■■■■■■	会社概要	■■■■■■■■■■*/
.profile_contents{
	display:flex;
	width:var(--contents-width-);
	margin: 0 auto;      /* 中央寄せ */
	align-items: flex-start;
}

.profile_tabele {
	margin-left:100px;
	margin-bottom:100px;
	white-space: nowrap;	/*改行なし*/
}

.profile_img{
	width:400px;	/*300*/
	height:450px;	/*500*/
	box-shadow: 32px 32px 0px rgba(0,0,0,0.7);
	border: solid 1px rgba(255,255,255,1);
	margin-left:-80px;
}


.profile_tabele table {
	display: inline-block;
	margin-left:80px;
}

.profile_tabele th {
	height:64px;
	padding-left:40px;
	padding-right:40px;
    border-bottom: solid 3px gray;
}

.profile_contents2{
	display:flex;
	width:var(--contents-width-);
	margin: 0 auto;      /* 中央寄せ */
	align-items: flex-start;
}
.shacho_img {
	width:310px;	/*300*/
	height:500px;	/*500*/
	box-shadow: 32px 32px 0px rgba(0,0,0,0.7);
	border: solid 1px rgba(255,255,255,1);
	margin-bottom:100px;
}
.shacho_message {
	width:650px;	/*300*/
	font-size: 18px;
	box-shadow: 20px 20px 0 0 rgba(255,0,0,0.5);
	border: solid 1px rgba(255,0,0,0.5);
	margin:50px 0;
	padding-left: 15px;
	padding-right: 15px;
	margin-right:50px;
}
.access_map {
	display: flex;
	width:1000px;
	height:600px;
	margin: -20px auto;      /* 中央寄せ */
	margin-bottom: 100px;
	box-shadow: 20px 20px 0 0 rgba(255,0,0,0.5);
	border: solid 1px rgba(255,0,0,0.5);
}

/*■■■■■■■■■■	商品について	■■■■■■■■■■*/
.product_container{
	display: flex;
	align-items: center;        /* 高さを中央揃え */
	gap: 50px;                  /* 画像と文章の間隔 */
	margin: 0 auto;             /* 中央寄せ */
}

.product_main_img{
	width:50%;
}

/*メイン紹介文*/
.product_description{
	width:50%;
	display: inline-block;
	font-size: 18px;
	font-weight: bold;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.1);
	margin-left:50px;

}

/*おすすめ商品画像*/
.recommend_product{
	display: flex;
	align-items: center;        /* 高さを中央揃え */
	margin: 0 auto;             /* 中央寄せ */
}
/*おすすめ商品画像1つ1つ*/
.product_osusume_img{
	width: 20%;
	margin: 0 auto;             /* 中央寄せ */
}

/*■■■■■■■■■■	よくあるご質問	■■■■■■■■■■*/
.faq_qanda{
	display: flex;
	flex-direction: column;   /* 縦に並べる */
	align-items: center;     /* 横方向中央寄せ */
	margin-bottom: 100px;

}
/*Q　質問文*/
.faq_qanda details summary{
	width:80%;
	flex-direction: column;   /* 縦に並べる */
	align-items: center;     /* 横方向中央寄せ */
	font-size: 24px;

}

/*A　回答分(全体)*/
.faq_qanda details{
	font-size: 22px;
	width:70%;
	display: flex;
	flex-direction: column;   /* 縦に並べる */
	align-items: left;     /* 横方向左揃え */
	border-bottom: 2px solid #faa; /* details全体の下に線 */
	margin: 15px 0;
}

/*■■■■■■■■■■	リンク	■■■■■■■■■■*/
.link_table{
	margin: 0 auto;      /* 中央寄せ */
	margin-bottom: 100px;
	width: 700px;
}
.link_table a{
	text-decoration: none; /* アンダーラインを消す */
}
.link_row{
	display: flex;
}
/*つちはし事務所バナー*/
.link_left1{
	border:3px ridge #fcc;
	padding: 10px;
	width: 200px;
	background-size: contain;               /* 画像を列の幅に合わせる */
	background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.8)), url("../img/link_img/link_img1.jpg") right center no-repeat;
}
/*つちはし不動産バナー*/
.link_left2{
	border:3px ridge #fcc;
	padding: 10px;
	width: 200px;
	background: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)), url("../img/link_img/link_img2.png") right center no-repeat;
	background-size: auto 100%;               /* 画像を列の幅に合わせる */
}
/*会社説明文*/
.link_right{
	border:3px double #fcc;
	padding: 10px;
	width: 500px;
}
/*■■■■■■■■■■	営業日カレンダー	■■■■■■■■■■*/
.calendar_big {
	text-align: center;
}

/*■■■■■■■■■■	商品一覧	■■■■■■■■■■*/
.meat_list {
	display:flex;
	margin: 0 auto;      /* 中央寄せ */
	width: 950px;

}
.meat_list .beaf_list h4{
	box-shadow: 1px 2px 0 0 rgba(255,0,0,0.5);
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
	background-size: auto 100%;               /* 画像を列の幅に合わせる */
}
.usi {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/ushi.png") left center no-repeat;}
.buta {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/buta.png") left center no-repeat;}
.tori {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/tori.png") left center no-repeat;}
.minchi {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/minchi.png") left center no-repeat;}
.gara {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/gara.png") left center no-repeat;}
.kakohin {background: linear-gradient(to left,rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%), url("../img/kakohin.png") left center no-repeat;}


.meat_list .beaf_list{
	display:inline-block;
	width:200px;
    margin: 0 5px;
}

.meat_list ul{
	list-style: none;
	margin-top:-20px;
	padding:10px 0;
	padding-left:0;
	font-weight: bold;
	font-family: "Times New Roman", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", "Yu Mincho", "MS 明朝", serif;
	background: linear-gradient(to left, rgba(255,255,255,0.25) 90% , rgba(255,0,0,0.125) 100%);
	border: solid 1px rgba(255,0,0,0.5);
	box-shadow: 2px 4px 0 0 rgba(128,0,0,0.5);
	border-bottom: 2px solid red;  /* 下線の太さ・色を自由に設定 */
}
.meat_list li{
	border-bottom: 1px solid rgba( 255,0,0,0.1 );  /* 下線の太さ・色を自由に設定 */
	position: relative;
}

.beaf_list span{
	font-size:12px;
	margin-left: 0;
    font-family: "MS PGothic", "ヒラギノ角ゴ ProN W3", "Meiryo", sans-serif;
	font-weight: bold;
	display: inline-block;
    position: absolute;
    right: 1px;          /* 右端に寄せる */
    top: 50%;                /* 親の高さの中央に */
    transform: translateY(-50%);  /* 自分の高さの半分だけ上に移動 */
}

/*■■■■■■■■■■	TOPIC	■■■■■■■■■■*/
/*TOPIC文章*/
.topic_sentence{
	margin: 0 auto;      /* 中央寄せ */
	width:700px;

	font-size: 20px;
	box-shadow: 20px 20px 0 0 rgba(255,0,0,0.5);
	border: solid 1px rgba(255,0,0,0.5);
	padding: 10px;
	padding-bottom: 20px;
	margin-bottom: 200px;
}
.topic_sentence_date{
	display:flex;
	justify-content: flex-end;
}

/*■■■■■■■■■■	問い合わせ	■■■■■■■■■■*/
.contact_form{
	margin: 0 auto;      /* 中央寄せ */
	width:700px;
	box-shadow: 20px 20px 0 0 rgba(255,0,0,0.5);
	border: solid 1px rgba(255,0,0,0.5);
}