@import url("/css/base_new.css"); /*header-footer*/

.navi_text{
	margin: -20px 0px 0px;
	padding: 0px;
	text-align: right;
}

/* ------------------------------------------- */
/* all CSS */
/* ------------------------------------------- */
.hero,
.catch,
.lead_band,
.frame,
.contact_btn{
	font-family: "Meiryo", sans-serif;
	color: #333333;
	text-align: left;
}

/* ------------------------------------------- */
/* hero (top.png 986×390 ／上部の水色帯は画像に含む) */
/* ------------------------------------------- */
.hero{
	width: 986px;
	height: 390px;
	margin: 0 auto;
	padding: 0;
}
.hero img{
	display: block;
	width: 986px;
	height: 390px;
	border: 0;
}

/* ------------------------------------------- */
/* catch (メイリオB 20pt ／行間40pt ／#0099cc) */
/* ------------------------------------------- */
.catch{
	font-size: 20px;
	line-height: 40px;
	font-weight: bold;
	color: #0099cc;
	text-align: center;
	margin: 28px 0 38px;
	padding: 0;
}

/* ------------------------------------------- */
/* lead (背景 #faf9e6 ＝ブラウザ幅いっぱい／白ボックス840px) */
/* ------------------------------------------- */
.lead_band{
	background-color: #faf9e6;
	margin: 0;
	padding: 25px 0;
}
.lead_box{
	width: 840px;
	margin: 0 auto;
	padding: 6px 20px 20px;
	background-color: #ffffff;
	box-sizing: border-box;
}
.lead_box p{
	font-family: "Meiryo", sans-serif;
	font-size: 15px;
	line-height: 30px;
	color: #000000;
	margin: 0 0 14px;
	padding: 0;
}
.lead_box p.last{
	margin-bottom: 0;
}

/* ------------------------------------------- */
/* frame (水色枠 1px #009cda ／幅988px) */
/* ------------------------------------------- */
.frame{
	width: 988px;
	margin: 0 auto;
	padding: 18px 0 73px;
	border: 1px solid #009cda;
	box-sizing: border-box;
}

/* 見出し帯 w840px ／#009cda ／メイリオ 28pt ／行間32pt ／#ffffff */
.band{
	width: 840px;
	margin: 0 auto 15px;
	padding: 14px 0 13px;
	background-color: #009cda;
	font-family: "Meiryo", sans-serif;
	font-size: 28px;
	line-height: 32px;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	box-sizing: border-box;
}

/* ------------------------------------------- */
/* card 共通（カード全体が画像。テキストのみ重ねる） */
/* ------------------------------------------- */
/* ホバー時の装飾はなし（base_new.css の a:hover による下線も打ち消す） */
.card,
.card:hover{
	display: block;
	position: relative;
	text-decoration: none;
	color: #333333;
}
.card img{
	display: block;
	border: 0;
}
.card .txt{
	display: block;
	position: absolute;
}
.card .c-name,
.card .c-com,
.card .c-desc{
	display: block;
}

/* 大カード 840×272（photo01／photo02） */
.card-lg{
	width: 840px;
	height: 272px;
	margin: 0 auto 22px;
}
.card-lg img{
	width: 840px;
	height: 272px;
}
.card-lg .txt{
	top: 19px;
	left: 479px;
	width: 341px;
}
.card-lg .c-name{
	font-size: 18px;
	line-height: 28px;
	font-weight: bold;
	color: #0099cc;
}
.card-lg .c-com{
	font-size: 18px;
	line-height: 28px;
	font-weight: bold;
	color: #000000;
}
.card-lg .c-desc{
	font-size: 16px;
	line-height: 24px;
	font-weight: normal;
	color: #333333;
}

/* 小カード 420×202（photo03〜photo06）2枚並び */
.row2{
	width: 840px;
	margin: 0 auto;
	display: flex;
}
.row2-first{
	margin-top: 51px;
}
.row2 + .row2{
	margin-top: 24px;
}
.card-sm{
	width: 420px;
	height: 202px;
}
.card-sm img{
	width: 420px;
	height: 202px;
}
.card-sm .txt{
	top: 13px;
	left: 215px;
	width: 194px;
}
.card-sm .c-name{
	font-size: 16px;
	line-height: 22px;
	font-weight: bold;
	color: #0099cc;
}
.card-sm .c-com{
	font-size: 16px;
	line-height: 22px;
	font-weight: bold;
	color: #000000;
}
.card-sm .c-desc{
	font-size: 16px;
	line-height: 22px;
	font-weight: normal;
	color: #333333;
}

/* ------------------------------------------- */
/* テキストリンク一覧（罫線1px ／2列×4行） */
/* ------------------------------------------- */
.list{
	width: 840px;
	margin: 42px auto 0;
	border-collapse: collapse;
	table-layout: fixed;
}
.list td{
	width: 50%;
	height: 104px;
	padding: 15px 22px;
	border: 1px solid #cccccc;
	vertical-align: top;
	box-sizing: border-box;
}
.list a{
	display: block;
	text-decoration: none;
	color: #333333;
}
.list a:hover .l-name{
	text-decoration: underline;
}
.l-name,
.l-com,
.l-fn{
	display: block;
	font-family: "Meiryo", sans-serif;
	font-size: 16px;
	line-height: 24px;
	text-align: left;
}
.l-name{
	font-weight: bold;
	color: #0099cc;
}
.l-com{
	font-weight: bold;
	color: #000000;
}
.l-fn{
	font-weight: normal;
	color: #333333;
}
/* 品名と社名を同一行に流す（サケ鼻軟骨由来〜） */
.l-inline{
	display: inline;
}
.l-name sup{
	font-size: 10px;
	vertical-align: super;
	line-height: 1;
}

/* ------------------------------------------- */
/* お問い合わせボタン（button.png 845×96 ／hover差し替え） */
/* ------------------------------------------- */
.contact_btn{
	display: block;
	width: 845px;
	height: 96px;
	margin: 48px auto 30px;
	background: url(img/button.png) no-repeat 0 0;
	text-decoration: none;
}
/* ラベルは画像に含まれるためテキストは画面外へ。
   併せて hover 画像を画面外に敷いて先読みさせ、初回ホバー時のちらつきを防ぐ */
.contact_btn span{
	display: block;
	height: 96px;
	text-indent: -9999px;
	overflow: hidden;
	background: url(img/button_hover.png) no-repeat -9999px 0;
}
.contact_btn:hover{
	background-image: url(img/button_hover.png);
}
