﻿@charset "UTF-8";

/* ===================================================================

CSS information
 file name  :  cmn_layout.css
 style info :  リセット及びbody初期設定 (このスタイルシートは基本的に変更しない)

=================================================================== */


/* IE用印刷設定CSS
======================================================= */

@media print{

	body {
		_zoom: 67%; /*WinIE only */
	}

	#top_a {
		_zoom: 95%; /*WinIE only */
	}

	#menu a {
		margin-bottom: 30px;
		padding: 20px 0px;
		float: none;
		overflow: visible;
	}

}


/* 基本設定
======================================================= */

* {margin:0px 0 0 0;
padding: 0;
}

body {
	text-align: center;
	font: 13px "メイリオ", "Meiryo", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Helvetica", "Arial", "Verdana", "sans-serif";
	*font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "Helvetica", "Arial", "sans-serif";
	background: #fff url(css_img/bg_body.gif) repeat 0 0;
	color: #333;
	min-width: 980px;
}
* html body { font: x-small; }
:first-child+html body { font-size: small; }

table { font-size:inherit; font:100%; }

hr.hide { display: none; }
.clear { clear:both;width: 100%; }
.clear hr { display:none; }

a:link,
a:visited { color: #000; }
a:hover,
a:active { color: #000; text-decoration:none; }

address,caption,cite,code,dfn,em,th,var {
	font-style: normal;font-weight:normal;
}

p {
	margin: 0;
	padding: 0;
	font-size: 100%;
	line-height: 1.8;
}

ul {
	margin: 5px 0px 5px 10px;
	padding: 0px 0px 0px 10px;
	font-size: 100%;
	line-height: 1.8;
	list-style-type: none;	/* ph2.0 レイアウト修正の為、追加 2014-10-03 */
}

ol {
	margin: 5px 0px 5px 3px;
	padding: 0px 0px 0px 20px;
	font-size: 100%;
	line-height: 1.8;
}

img {
	vertical-align: top;
}

.tipped {
	color: #4d3617;
}


/* headerレイアウト設定
======================================================= */

#header {
	background: #fff;
}

#headerInner {
	width: 980px;
	margin: 0 auto;
	padding: 16px 0 13px;
	text-align: left;
}

#header ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#header #headerLogo {
	float: left;
	width: 195px;
	margin: 0;
}

#header #headerUtility {
	float: right;
	width: 762px;
}

#header #headerUtility ul.guide {
	float: left;
	width: 292px;
	padding: 17px 0 0;
}

#header #headerUtility ul.guide li {
	float: left;
	margin: 0 12px 0 0;
}

#header #headerUtility ul.guide li.end {
	margin: 0;
}

#header #headerUtility #headerLogin {
	float: right;
	width: 448px;
}

#header #headerLogin ul li {
	float: left;
	width: 150px;
	margin: 0 20px 0 0;
}

#header #headerLogin ul li .input {
	margin: 5px 0 0;
}

#header #headerLogin ul li.password {
	/* width: 165px; */
	width: 175px; /* ph2.0 レイアウト修正対応 2014-10-01 */
	margin: 0 0px 0 0;
}

#header #headerLogin ul li .arw {
	font-size: 85%;
	margin: 5px 0 0;
	padding: 0 0 0 8px;
	background: url(../img/header/h_arw.gif) no-repeat 0 4px;
}

#header #headerLogin ul li input {
	width: 146px;
	padding: 2px;
}

/* ph2.0 レイアウト修正対応の為、追加 2014-10-01 start*/
#header #headerLogin ul li input.loginBtn {
	height /**/: 38px;
	width: 103px;
    outline:none;
}
/* ph2.0 レイアウト修正対応の為、追加 2014-10-01 end*/

#header #headerLogin ul li.btn {
	width: 103px;
	margin: 8px 0 0;
}

#header #headerLogin ul li.btn a {
	float: left;
	padding-top: 38px;
	height: 0px !important;
	height /**/: 38px;
	overflow: hidden;
	outline: none;
	background: url(../img/header/h_btn_login.gif) no-repeat 0 0;
	width: 103px;
}

#header #headerLogin ul li.btn a:hover,
#header #headerLogin ul li.btn a:active {
	background-position: 0px -38px;
	width: 103px;
}

#header a:link,
#header a:visited {
	color: #000;
}

/* headerログイン後レイアウト設定
======================================================= */
#header #headerUtilityLogin {
	float: right;
	/*width: 632px;*/
	width: 762px; /*要望の為、変更 2014-09-09 okajima*/
}

#header #headerUtilityLogin ul.guide {
	float: left;
	/*width: 192px;*/
	width: 292px; /*要望の為、変更 2014-09-09 okajima*/
	padding: 17px 0 0; 
}

#header #headerUtilityLogin ul.guide li {
	float: left;
	margin: 0 12px 0 0;
}

#header #headerUtilityLogin ul.guide li.end {
	margin: 0;
}

#header #headerUtilityLogin #headerRegistration {
	float: right;
	width: 400px;
	padding: 10px 14px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	/*background: #faf5eb;*/	/*要望の為、変更 2014-09-09 okajima*/
}

#header #headerRegistration ul li {
	float: left;
}

#header #headerRegistration ul li.name {
	width: 198px;
	margin: 0 12px 0 0;
	padding: 8px 0 0;
	text-align: right;
	font-size: 92%;
	word-wrap: break-word;
	font-weight: bold;
}

#header #headerRegistration ul li.logout {
	float: right;
	width: 93px;
}

#header #headerRegistration ul li.btn a {
	float: left;
	padding-top: 38px;
	height: 0px !important;
	height /**/: 38px;
	overflow: hidden;
	outline: none;
	width: 93px;
}

#header #headerRegistration ul li.registration a {
	background: url(../img/header/h_btn_registration.gif) no-repeat 0 0;
}

#header #headerRegistration ul li.logout a {
	background: url(../img/header/h_btn_logout.gif) no-repeat 0 0;
}

#header #headerRegistration ul li.btn a:hover,
#header #headerRegistration ul li.btn a:active {
	background-position: 0px -38px;
	width: 93px;
}

#header a:link,
#header a:visited {
	color: #000;
}


/* navレイアウト設定
======================================================= */

#gNav {
	background: url(../img/bg/bg_nav1.gif) repeat-x 0 0;
}

.nav_sh {
	padding: 0 0 3px;
}

#menu {
	width: 980px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

#menu li {
	float: left;
	margin: 0;
	padding: 0;
	list-style-type: none;
	line-height: 1.5;
}

#menu a {
	float: left;
	padding-top: 61px;
	height: 0px !important;
	height /**/: 61px;
	overflow: hidden;
	outline: none;
	background: url(../img/bg/bg_menu.gif) no-repeat 0 0;
}

#menu .nav01 a {
	background-position: 0px 0px;
	width: 82px;
}
#menu .nav01 a:hover,
#menu .nav01 a:active,
body#top #menu .nav01 a,
body#top #menu .nav01 a:hover {
	background-position: 0px -61px;
	width: 82px;
}

#menu .nav02 a {
	background-position: -82px 0px;
	width: 213px;
}
#menu .nav02 a:hover,
#menu .nav02 a:active,
body#abouthappylth .nav02 a,
body#abouthappylth .nav02 a:hover {
	background-position: -82px -61px;
	width: 213px;
}

#menu .nav03 a {
	background-position: -295px 0px;
	width: 129px;
}
#menu .nav03 a:hover,
#menu .nav03 a:active,
body#aboutmykarte #menu .nav03 a,
body#aboutmykarte #menu .nav03 a:hover {
	background-position: -295px -61px;
	width: 129px;
}

#menu .nav04 a {
	background-position: -424px 0px;
	width: 234px;
}
#menu .nav04 a:hover,
#menu .nav04 a:active,
body#dietsimulation #menu .nav04 a,
body#dietsimulation #menu .nav04 a:hover {
	background-position: -424px -61px;
	width: 234px;
}

#menu .nav05 a {
	background-position: -658px 0px;
	width: 147px;
}
#menu .nav05 a:hover,
#menu .nav05 a:active,
#menu .nav05 a.selected,
#menu .nav05 a.selected:hover {
	background-position: -658px -61px;
	width: 147px;
}

#menu .nav06 a {
	background-position: -805px 0px;
	width: 175px;
}
#menu .nav06 a:hover,
#menu .nav06 a:active,
body#information #menu .nav06 a,
body#information #menu .nav06 a:hover {
	background-position: -805px -61px;
	width: 175px;
}

#menu .nav033 a {
  background-position: -315px -182px;
  width: 145px;
}

#menu .nav033 a:hover,
#menu .nav033 a:active,
body#aboutmykarte #menu .nav033 a,
body#aboutmykarte #menu .nav033 a:hover {
  background-position: -315px -182px;
  width: 145px;
}


/* navレイアウト設定
======================================================= */

#menuLogin {
	width: 980px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

#menuLogin li {
	float: left;
	margin: 0;
	padding: 0;
	list-style-type: none;
	line-height: 1.5;
}

#menuLogin a {
	float: left;
	padding-top: 61px;
	height: 0px !important;
	height /**/: 61px;
	overflow: hidden;
	outline: none;
	background: url(../img/bg/bg_nav_mypage1.gif) no-repeat 0 0;
}

#menuLogin .nav01 a {
	background-position: 0px 0px;
	width: 154px;
}
#menuLogin .nav01 a:hover,
#menuLogin .nav01 a:active,
body#mypage #menuLogin .nav01 a {
	background-position: 0px -61px;
	width: 154px;
}

#menuLogin .nav02 a {
	background-position: -154px 0px;
	width: 161px;
}
#menuLogin .nav02 a:hover,
#menuLogin .nav02 a:active,
body#calorie #menuLogin .nav02 a {
	background-position: -154px -61px;
	width: 161px;
}

#menuLogin .nav03 a {
	background-position: -315px 0px;
	width: 145px;
}
#menuLogin .nav03 a:hover,
#menuLogin .nav03 a:active,
body#mykarte #menuLogin .nav03 a {
	background-position: -315px -61px;
	width: 145px;
}

#menuLogin .nav04 a {
	background-position: -460px 0px;
	width: 198px;
}
#menuLogin .nav04 a:hover,
#menuLogin .nav04 a:active,
body#staff #menuLogin .nav04 a {
	background-position: -460px -61px;
	width: 198px;
}

#menuLogin .nav05 a {
	background-position: -658px 0px;
	/*width: 165px;*/
	width: 166px;/*ph2.0 レイアウト修正対応 20140924*/
}
#menuLogin .nav05 a:hover,
#menuLogin .nav05 a:active,
body#information #menuLogin .nav05 a {
	background-position: -658px -61px;
	/*width: 165px;*/
	width: 166px;/*ph2.0 レイアウト修正対応 20140924*/
}

#menuLogin .nav06 a {
	background-position: -823px 0px;
	width: 157px;
}
#menuLogin .nav06 a:hover,
#menuLogin .nav06 a:active,
body#partner #menuLogin .nav06 a,
body#partner #menuLogin .nav06 a:hover {
	background-position: -823px -61px;
	width: 157px;
}

#menuLogin .nav033 a {
  background-position: -315px -122px;
  width: 145px;
}
#menuLogin .nav033 a:hover,
#menuLogin .nav033 a:active,
body#mykarte #menuLogin .nav033 a {
  background-position: -315px -122px;
  width: 145px;
}


/* wrapper
======================================================= */

#wrapper {
	width: 980px;
	margin: 0 auto;
	text-align: left;
}

#wrapper_1col {
	width: 928px;
	padding: 0 0 40px;
	text-align: left;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    height: 918px;
}

#wrapper_2col {
	width: 980px;
	margin: 0 auto;
	padding: 0 0 40px;
	text-align: left;
}

#wrapper #main,
#wrapper_2col #main {
	float: left;
	width: 645px;
}

#wrapper #side,
#wrapper_2col #side {
	float: right;
	width: 310px;
}

h1 {
	width: 980px;
	margin: 0 auto 23px;
}

#wrapper_1col #main {
	padding: 25px 40px;
	-webkit-box-shadow: 0px 2px 5px #bfbab3;
	-moz-box-shadow: 0px 2px 5px #bfbab3;
	box-shadow: 0px 2px 5px #bfbab3;
	background: #fff;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 40px;
}
html>/**/body #wrapper_1col #main {
	behavior/***/: url(/PIE.htc);
    width: 850px;
}

#wrapper_2col #main #content {
	margin: 0 0 30px;
	padding: 15px 0;
	text-align: left;
	-webkit-box-shadow: 0px 5px 5px #ccc;
	-moz-box-shadow: 0px 5px 5px #ccc;
	box-shadow: 0px 5px 5px #ccc;
	background: #fff;
}
html>/**/body #wrapper_2col #main #content {
	behavior/***/: url(/PIE.htc);
}


/* パンくず
======================================================= */

#crumbs {
	width: 924px;
	margin: 0 auto 0 208px;
	padding: 0 0 28px;
	font-size: 85%;
	text-align: left;
    height: 15px;
}

#back {
	text-align: center;
}

#back a:link,
#back a:visited {
	color: #ff8c1a;
}


/* side topic
======================================================= */

#side .topic_tit {
	padding: 0 0 10px;
	background: url(../img/bg/bd_side.gif) no-repeat 0 bottom;
}

#side .topic_tit .t_left {
	float: left;
	width: 100px;
}

#side .topic_tit .t_right {
	float: right;
	width: 48px;
	padding: 2px 0 0;
}

#side ul.topic {
	margin: 0;
	padding: 15px 0 0;
	list-style-type: none;
}

#side ul.topic li {
	margin: 11px 0 0;
	padding: 15px 0 0;
	border-top: 1px dotted #4d3617;
}

#side ul.topic li.new {
	margin: 0;
	padding: 0;
	border: none;
}

#side ul.topic li a {
	font-size: 118%;
	color: #ff8c1a;
}

#side ul.topic li.new a {
	padding: 0 35px 0 0;
	background: url(../img/ico/ico_topic_new.gif) no-repeat right 7px;
}


/* footer
======================================================= */

#footer {
	text-align: left;
	background: #fff;
}

#footer #footerInner {
	background: #bfa78f;
}

#footer .foot_in {
	width: 980px;
	margin: 0 auto;
	padding: 20px 0px 20px;
	position: relative;
}

#footerInner .left {
	float: left;
	width: 485px;
}

#footerInner .left p {
	color: #fff;
	font-size: 92%;
}

#footerInner .left p.img {
	margin: 0 0 16px;
}

#footerInner .right {
	float: right;
	width: 350px;
	padding: 14px 20px;
	background: #faf5eb;
}

#footerInner .right > p {
	text-align: center;
	padding: 0 0 8px;
	margin: 0 0 8px;
	border-bottom: 1px solid #bfa78f;
}

#footerInner .right .left {
	float: left;
	width: 105px;
	padding: 8px 0 0;
}

#footerInner .right .right {
	float: right;
	width: 233px;
	padding: 0px;
}

#footerInner .right .right a {
	float: left;
	padding-top: 45px;
	height: 0px !important;
	height /**/: 45px;
	overflow: hidden;
	outline: none;
	background: url(../img/footer/f_btn_contact.gif) no-repeat 0 0;
	width: 273px;
}

#footerInner .right .right a:hover,
#footerInner .right .right a:active {
	background-position: 0px -45px;
	width: 273px;
}

#footer .foot_in p.pagetop {
	position: absolute;
	bottom: 0;
	right: 0;
}

#footer #footerMenu {
	background: #4d3617;
}

#footerMenu ul {
	width: 980px;
	margin: 0 auto;
	padding: 8px 0;
	list-style-type: none;
}

#footerMenu ul li {
	float: left;
	margin: 0 42px 0 0;
	padding: 0 0 0 8px;
	font-size: 92%;
	background: url(../img/footer/f_arw.gif) no-repeat 0 7px;
}

#copyright {
	padding: 8px 0 6px;
	text-align: center;
}

#footer a:link,
#footer a:visited {
	color: #fff;
	text-decoration: none;
}

#footer a:hover {
	color: #fff;
	text-decoration: underline;
}

/* pagetop
======================================================= */

div.gotop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 10;
}

div.gotop a {
	width: 40px;
	height: 40px;
	display: block;
}


/* SNSボタン
======================================================= */

.sns {
	display: inline;
	text-align: right;
}

.twitter {
	float: right;
	width: 100px;
}

.facebook {
	float: right;
	width: 115px;
	overflow: hidden;
}


/* clearfix
======================================================= */
.clearfix { zoom:1; }

.clearfix:after {
	content: "";
	display: block;
	clear: both;
	height:0px;
}


*:after {
	display: block;
	clear: both;
} /* この記述は固定です */





/* 2014.09.25 Ono ログイン失敗画面CSS* Start/
/* PasswordFailed */
.userlogin_failed_center {
    margin-right:auto;
    margin-left:150px;
}
.password_error_alert {
    margin-top: 20px;
}
.password_error_alert span {
    font-weight: bold;
    color: #ff9900;
    font-size: 20px;
    margin-left:100px;
}
.failed_password_advice {
	width:590px;
	border:solid 2px;
	border-color: #d5d4d4;
}

.failed_password_advice ul {
    list-style-type: none;
    text-align: left;
    padding: 20px;
}

         
.userlogin ul {
    list-style-type: none;
    
}
.userlogin ul li {
    margin-top:20px;
    text-align:left;
    margin-left:50px;
}
.userlogin ul span {
	margin-left: 120px;
}
.userlogin ul li input {
    margin-left:50px;
}
.userlogin .btn {
    margin-top:20px;
}
.userlogin p {
	margin: 0;
	padding: 0;
	font-size: 100%;
	line-height: 1.8;
	margin-left: 160px;
}


/* 2014.09.25 Ono ログイン失敗画面CSS* End/

/* ph2.0 レイアウト修正のため、追加 2014-09-29 start */
/*
#userlogin_contentInner{
    width:990px;
    margin:auto;
}

.userlogin_box_style05{
	padding: 0 5px;
	margin:auto auto 15px auto;
	width:980px;
	background: url(../img/bg/bg_box_full_base.png) no-repeat top center;
	position:relative;
    text-align:left;
}
*/
.userLoginTitle{
	font-size:20px;
	color:#ffffff;
	font-weight:bold;
	/*background:url(../img/ico_forget.jpg) no-repeat 10px ;*/
	padding:15px 5px 15px 60px;
	background-color: #765c37;
	width: 916px;
	margin:0px;
}

.ie6_error, .noScript {
	background:#F66;
	padding: 30px;
	text-align:center;
	font-size:150%;
	color:#333;
}

/*
.userlogin_box_style05{
	padding-bottom:20px;
	overflow:hidden;
}

*/
/* ph2.0 レイアウト修正のため、追加 2014-09-29 end */
