@charset "utf-8";
/*////////////////////////////////////////////////////////////
/*supremo.css*/


/*------------------------------------------------------------
	1. メインセクション、白背景角丸エリア
	2. タイトルエリア
	3. メインセクション内スタイル
	4. サイド製品メニュー
	5. リスト（与え方,分析値）
	6. 製品情報ナビゲーション
	7. 製品情報ナビゲーション
---------------------------------------------------------------*/


/*------------------------------------------------------------
	1. メイン、白背景角丸エリア、セクション
-------------------------------------------------------------*/
#content {
	width: 970px;
	background:none;
	margin: 0 auto;
}

#main {
	width: 970px;
	margin: 0 auto;
	background: url(../img/share/supremo_roundtop.png) no-repeat;
	padding-top: 10px;
}

#main .inner{
	background: url(../img/share/supremo_roundbg.png) no-repeat left bottom;
	padding: 0 10px 20px;
}

/* 白背景ラウンドコーナー */
#whiteRound {
	width: 920px;
	margin: 0 auto;
	padding-top: 20px;
	padding-bottom: 8px;
	background: url(../img/share/whiteRound_roundtop.gif) no-repeat;
}

#whiteRound .inner{
	background: url(../img/share/whiteRound_roundbg.gif) no-repeat bottom;
	padding: 0;
}

#whiteRound .inner #mainSection {
	width: 860px;
	margin: 0 auto;
}

/* メインセクション */
#mainSection .leftSection{
	width: 550px;
	float: left;
	padding: 30px 30px 0 10px;
	font-size: 100%;
}

#mainSection .rightSection{
	width: 260px;
	float: left;
	position: relative;
	top: -75px;
}

#mainSection .rightSection p{
	font-size: 85%;
	padding-bottom: 1.5em;
}

.leftSection .data02 .attention {
	font-size: 85%;
}

.rightSection img.products {
	padding-bottom: 5px;
}

/*分析値 セクション*/
#analysisSection {
}

#analysisSection .left {
	width: 260px;
	float: left;
}
#analysisSection .right {
	width: 260px;
	float: right;
}

#analysisSection .attention{
	width: 550px;
	clear: both;
}

/* 栄養食・AAFCOセクション */
#nutritionSection {
	margin-top: 30px;
}

#nutritionSection .left {
	width: 260px;
	float: left;
}

#nutritionSection .right {
	width: 260px;
	float: right;
}


/*------------------------------------------------------------
	2. タイトルエリア　セクション
-------------------------------------------------------------*/
#sectionTit {
	clear: both;
}

#sectionTit img.logo {
	float: left;
	padding: 18px 0 20px 35px;
}

#sectionTit img.copy {
	float: left;
	padding: 66px 0 0 10px;
}


/*------------------------------------------------------------
	3. メインセクション
-------------------------------------------------------------*/
h4.copy {
	padding: 0 0 30px 0;
}

/* arrow style 小見出し */
#mainSection  p.subtit {
	font-weight: bold;
	color: #3c0d00;
	padding: 0 0 0 15px;
	margin-bottom: 5px;
	font-size: 100%;
}

#mainSection  p.subtit.puppy {
	background: url(../img/share/arrow_puppy.gif)  no-repeat left center;
}

#mainSection  p.subtit.smalladult {
	background: url(../img/share/arrow_smalladult.gif)  no-repeat left center;
}

#mainSection p.subtit.adult {
	background: url(../img/share/arrow_adult.gif)  no-repeat left center;
}

#mainSection p.subtit.light {
	background: url(../img/share/arrow_light.gif)  no-repeat left center;
}

#mainSection p.subtit.senior {
	background: url(../img/share/arrow_senior.gif)  no-repeat left center;
}

/* 原料テキスト */
#mainSection p.material {
	margin-bottom: 30px;
}

#mainSection p.material .small {
	font-size: 75%;
}

/* 自然素材 文字サイズ */
#mainSection .att {
	font-size:74%;
	text-align:right;
}

/* 一日に与える量の目安 */
#mainSection  p.subtit.meyasu {
	padding: 0 0 0 200px;
}

/* AAFCO 文字サイズ */
#mainSection .attsmall {
	font-size:80%;
}

/*------------------------------------------------------------
	3. テーブルベース
-------------------------------------------------------------*/
#mainSection .leftSection table#data {
	width: 550px;
	border-collapse: collapse;
	border-spacing: 0;
	margin-top: 5px;
	margin-bottom: 25px;
}

table#data th {
	padding: 5px 0 5px 0;
	border-width: 0 0 1px 1px;
	line-height: 120%;
	text-align: center;
}

table#data td {
	padding: 3px;
	border-width: 1px;
	text-align: center;
}


/*------------------------------------------------------------
	4. サイド製品メニュー
-------------------------------------------------------------*/
#mainSection .rightSection ul#menuProducts {
}

.rightSection ul#menuProducts li p {
	font-size: 13px;
	padding: 13px 0 0 0 ;
	color: #007e3a;
}

.rightSection ul#menuProducts li.puppy p{
	color: #d49600;
}
.rightSection ul#menuProducts li.smalladult p{
	color: #de6874;
}
.rightSection ul#menuProducts li.adult p{
	color: #7b3e8d;
}
.rightSection ul#menuProducts li.light p{
	color: #26a2a3;
}
.rightSection ul#menuProducts li.senior p{
	color: #457b47;
}


.rightSection ul#menuProducts li.puppy {
	height: 65px;
	min-height: 65px;
	background: url(../img/share/menu_01.gif) no-repeat;
	padding: 0px 0 0 70px;
	border-top: 1px dotted #cec69e;
	border-bottom: 1px dotted #cec69e;
}

.rightSection ul#menuProducts li.smalladult {
	height: 65px;
	min-height: 65px;
	background: url(../img/share/menu_02.gif) no-repeat;
	padding: 0px 0 0 70px;
	border-bottom: 1px dotted #cec69e;
}

.rightSection ul#menuProducts li.adult {
	height: 65px;
	min-height: 65px;
	background: url(../img/share/menu_03.gif) no-repeat;
	padding: 0px 0 0 70px;
	border-bottom: 1px dotted #cec69e;
}

.rightSection ul#menuProducts li.light {
	height: 65px;
	min-height: 65px;
	background: url(../img/share/menu_04.gif) no-repeat;
	padding: 0px 0 0 70px;
	border-bottom: 1px dotted #cec69e;
}

.rightSection ul#menuProducts li.senior {
	height: 65px;
	min-height: 65px;
	background: url(../img/share/menu_05.gif) no-repeat;
	padding: 0px 0 0 70px;
	border-bottom: 1px dotted #cec69e;
}

.rightSection img.bnr {
	margin-top: 30px;
	margin-bottom: 15px;
}

/*------------------------------------------------------------
	5.リスト（与え方,分析値）
-------------------------------------------------------------*/
/*与え方*/
ul.List02 {
	padding: 15px 0 30px 0;
}

ul.List02 li .title {
	float:left;
	margin:0;
	width:105px;
	text-align: center;
	font-weight: bold;
}

ul.List02 li .data {
	float:right;
	width:430px;
	padding: 0 5px 0 0;
}

ul.List02 li {
	padding: 7px 0;
	overflow: hidden;
	vertical-align: bottom;
}

ul.List02 li.top {
}

ul.List02 li.white {
	background-color: #fff;
}

ul.List02 li.whitelast {
	padding: 7px 0;
	background-color: #fff;
}

ul.List02 li.colorlast {
	padding: 7px 0;
}

/* 分析値 */
ul.List03 {
	padding: 10px 0 15px 0;
}

ul.List03 li {
	padding: 5px 0;
	vertical-align: bottom;
}

ul.List03 li .title {
	float:left;
	margin:0;
	width:110px;
	padding: 0 0 0 10px;
}

ul.List03 li .data {
	float: right;
	width: 120px;
	padding: 0 10px 0 0;
	text-align: right;
}

ul.List03 li .title2 {
	float:left;
	margin:0;
	width:90px;
	padding: 0 0 0 10px;
}

ul.List03 li .data2 {
	float: right;
	width: 140px;
	padding: 0 10px 0 0;
	text-align: right;
}


ul.List03 li.top {
}

ul.List03 li.white {
	background-color: #fff;
}

ul.List03 li.whitelast {
	padding: 5px 0;
	background-color: #fff;
}

ul.List03 li.colorlast {
	padding: 10px 0;
}


/*------------------------------------------------------------
	6. 製品情報ナビゲーション
-------------------------------------------------------------*/
ul#naviSupremo {
	width: 279px;
	height: 29px;
	min-height: 29px;
	float: right;
	position: relative;
	top: 70px;
	right: 30px;
}

ul#naviSupremo li {
	float: left;
	display: block;
}

ul#naviSupremo li a {
	width: 139px;
	height: 29px;
	min-height: 29px;
	text-indent: -9999px;
	display: block;
}

/* a */
ul#naviSupremo li.feature a{	background: url(../img/share/supremoMenu.jpg) no-repeat 0px 0px;}
ul#naviSupremo li.list a{	background: url(../img/share/supremoMenu.jpg) no-repeat -139px 0px;}
/* hover */
ul#naviSupremo li.feature a:hover{ background: url(../img/share/supremoMenu.jpg) no-repeat 0px -28px;overflow: hidden;}
ul#naviSupremo li.list a:hover{	background: url(../img/share/supremoMenu.jpg) no-repeat -139px -28px;overflow: hidden;}
/* fix */
ul#naviSupremo li.feature_fix a{ background: url(../img/share/supremoMenu.jpg) no-repeat 0px -28px;}
ul#naviSupremo li.list_fix a{ background: url(../img/share/supremoMenu.jpg) no-repeat -139px -28px;}


/*------------------------------------------------------------
	7. ページトップ　
-------------------------------------------------------------*/
.pagetop {
	text-align: right;
	padding: 0 0 10px 0;
}